fix style selectors

adobecom · Aug 22, 2024 · 5c14a6d · 5c14a6d
1 parent 9e43633
commit 5c14a6d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/express/blocks/cards/cards.css b/express/blocks/cards/cards.css
@@ -1,12 +1,18 @@
-main .section.cards-container {
+main .section:has(.card) {
   background-color: #F1F3F4;
   padding-top: 80px;
 }
 
-main .section.cards-container>div>h2:first-of-type {
+main .section:has(.card)>div>h2:first-of-type {
   margin-top: 0;
 }
 
+main .section:has(.content) > div {
+  max-width: 375px;
+  margin: auto;
+  padding: 0;
+}
+
 main .section .cards-container>div,
 main .section .cards-dark-container>div {
   max-width: 870px;

diff --git a/express/blocks/cards/cards.js b/express/blocks/cards/cards.js
@@ -1,11 +1,13 @@
 // eslint-disable-next-line import/no-unresolved
 import { getLibs } from '../../scripts/utils.js';
+import { decorateButtonsDeprecated } from '../../scripts/utils/decorate.js';
 
 const { createTag } = await import(`${getLibs()}/utils/utils.js`);
 /**
  * @param {HTMLDivElement} $block
  */
 export default function decorate($block) {
+  decorateButtonsDeprecated($block);
   $block.querySelectorAll(':scope>div').forEach(($card) => {
     $card.classList.add('card');
     const $cardDivs = [...$card.children];