#064: BuySellAds-Zonen implementieren

Wir haben ein Mockup, wie unsere BuySellAds-Zonen aussehen sollen, also machen wir uns an die tatsächliche Umsetzung. Die BuySellAds-Website stellt den Code zur Verfügung, den wir auf unserer Website einfügen müssen, damit die Anzeigen angezeigt werden. Wir kopieren und fügen ihn ein.

Wir versuchen, das CSS, das BSA auf die Website injiziert, um sie zu stylen, abzuschalten (da wir das selbst übernehmen), aber leider beeinträchtigt das Abschalten jetzt auch die Live-Website, also müssen wir uns vorerst gegen das injizierte CSS wehren.

Den Rest der Zeit verbringen wir damit, die Anzeigen so zu positionieren und zu stylen, dass sie genau so angezeigt werden, wie wir es möchten. Das geht ziemlich einfach, da wir schon so viel vorhanden haben, wie Mixins für Schriftarten-Stacks und Farben und so weiter.

Wir stoßen auf eine Sache, auf die wir in dieser Serie mehrmals stoßen: Es wäre schön, eine Klasse, die nur in einer anderen Datei existiert, mit @extend zu erweitern, was leider nicht möglich ist. In diesem Beispiel versuchen wir, ein von BSA injiziertes Div genauso zu stylen wie .module, was ein klassischer Fall für extend ist, aber leider müssen wir einige Stile kopieren und einfügen.

Wir überlegen, ob Flexbox uns hier helfen könnte, entscheiden uns aber, dass es dafür noch zu früh ist. Es würde das Layout erleichtern und uns auch gleiche Höhen geben. Na ja, wir setzen es auf die Wunschliste für die Zukunft.