We hebben een mock-up van hoe we willen dat onze BuySellAds-zones eruit zien, dus laten we het echt gaan bouwen. De BuySellAds-website biedt de code die we nodig hebben om op onze site te plaatsen om de advertenties te laten verschijnen. We kopiëren en plakken dat over.
We proberen de CSS die BSA op de site injecteert uit te schakelen om ze te stylen (omdat we dat zelf afhandelen), maar helaas, als we nu afsluiten, heeft dit ook invloed op de live site, dus we moeten gewoon vechten tegen de geïnjecteerde CSS voor nu.
We besteden de rest van de tijd aan het positioneren en stylen van de advertenties zodat ze precies worden weergegeven zoals we willen. Het is vrij gemakkelijk in de omgang, omdat we al zoveel op hun plaats hebben, zoals mixins voor lettertypestapels en kleuren en zo.
We komen iets tegen dat we in deze serie een aantal keren tegenkomen, waarbij het leuk zou zijn om @extendeen klas te hebben die alleen in een ander bestand bestaat, wat je helaas niet kunt. In dit voorbeeld proberen we een door BSA geïnjecteerde div te laten stylen zoals hij .moduleis, wat een klassiek geval is voor uitbreiden, maar helaas moeten we sommige stijlen kopiëren en plakken.
We denken erover na om flexbox ons hier te helpen, maar besluiten dat het daar gewoon te vroeg voor is. Het zou de lay-out gemakkelijker maken en ons gelijke hoogtes geven. Nou ja, we zullen het op de toekomstige verlanglijst zetten.