KAW-7710-section center class

Netcentric · Aug 2, 2024 · 178a7ee · 178a7ee
1 parent 057032d
commit 178a7ee
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 3 deletions.
diff --git a/blocks/text/text.css b/blocks/text/text.css
@@ -2,6 +2,6 @@
   max-width: 750px;
 }
 
-.text.center > div {
+.text--center > div {
   margin: auto;
 }
diff --git a/blocks/text/text.js b/blocks/text/text.js
@@ -1 +1,8 @@
-/* JS */
+import { variantsClassesToBEM } from '../../scripts/scripts.js';
+
+const variantClasses = ['center'];
+const blockName = 'text';
+
+export default async function decorate(block) {
+  variantsClassesToBEM(block.classList, variantClasses, blockName);
+}
diff --git a/scripts/scripts.js b/scripts/scripts.js
@@ -162,3 +162,12 @@ export function getTextLabel(key) {
 
 placeholders = await fetchPlaceholders();
 loadPage();
+
+export const variantsClassesToBEM = (blockClasses, expectedVariantsNames, blockName) => {
+  expectedVariantsNames.forEach((variant) => {
+    if (blockClasses.contains(variant)) {
+      blockClasses.remove(variant);
+      blockClasses.add(`${blockName}--${variant}`);
+    }
+  });
+};
diff --git a/styles/styles.css b/styles/styles.css
@@ -139,7 +139,6 @@ a:any-link {
 }
 
 a:hover {
-  text-decoration: underline;
   color: var(--link-hover-color);
 }
 
@@ -290,3 +289,31 @@ main .section.highlight {
   margin-right: calc(5px + 0.2em);
   border-left: calc(5px + 0.1em) solid #f00;
 }
+
+.section .width-medium {
+  max-width: 300px;
+  margin: auto;
+}
+
+.section.text-center {
+  text-align: center;
+}
+
+main .border-top {
+  border-top: 1px solid #e5e5e5;
+  margin-top: 40px;
+  padding-top: 40px;
+}
+
+.button.secondary:any-link {
+  background-color: transparent;
+  border: none;
+  color: var(--link-color);
+  font-weight: 400;
+  font-size: 16px;
+  text-transform: capitalize;
+}
+
+.button.secondary:any-link:hover {
+  color: var(--text-color);
+}