feat(pv-stylemark): add theme classes from the old stylemark to the n…

…ew one this allows any existing theming to mostly also work in the new one
pro-vision · Apr 10, 2024 · 29dd34e · 29dd34e
1 parent 2085297
commit 29dd34e
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 13 deletions.
diff --git a/packages/pv-stylemark/tasks/templates/lsg-component.hbs b/packages/pv-stylemark/tasks/templates/lsg-component.hbs
@@ -1,6 +1,6 @@
-<section class="dds-component" id="{{componentName}}">
-  <h2 class="dds-component__name">{{options.name}}</h2>
-  <div class="dds-component__description">
+<section class="dds-component theme-content-element" id="{{componentName}}">
+  <h2 class="dds-component__name theme-content-element-title">{{options.name}}</h2>
+  <div class="dds-component__description theme-content-element-description">
 {{{description}}}
   </div>
 </section>
diff --git a/packages/pv-stylemark/tasks/templates/lsg-nav.hbs b/packages/pv-stylemark/tasks/templates/lsg-nav.hbs
@@ -1,25 +1,25 @@
-<dds-nav class="dds-nav">
-  <header class="dds-nav__header">
+<dds-nav class="dds-nav theme-sidebar">
+  <header class="dds-nav__header theme-sidebar-header">
     {{#if lsgConfig.theme.logo}}
-      <img class="dds-nav__logo" src="{{lsgConfig.theme.logo}}" alt="{{lsgConfig.name}}">
+      <img class="dds-nav__logo theme-sidebar-header-logo" src="{{lsgConfig.theme.logo}}" alt="{{lsgConfig.name}}">
     {{else}}
       <h1 class="dds-nav__title">{{lsgConfig.name}}</h1>
     {{/if}}
     <button class="dds-nav__nav-toggle">
       <span class="dds-nav__nav-toggle-icon"></span>
     </button>
   </header>
-  <div class="dds-nav__search-input-box">
+  <div class="dds-nav__search-input-box theme-sidebar-search">
     <input type="text" class="dds-nav__search-input" placeholder="Search">
   </div>
-  <div class="dds-nav__categories">
+  <div class="dds-nav__categories theme-sidebar-categories">
   {{#each lsgData}}
-    <div class="dds-nav__category">
-      <h3 class="dds-nav__category-name">{{categoryName}}</h3>
+    <div class="dds-nav__category theme-sidebar-category">
+      <h3 class="dds-nav__category-name theme-sidebar-category-title">{{categoryName}}</h3>
       <ul class="dds-nav__category-list">
         {{#each categoryItems}}
         <li class="dds-nav__category-item">
-          <a class="dds-nav__category-link" href="#{{componentName}}">{{options.name}}</a>
+          <a class="dds-nav__category-link theme-sidebar-element" href="#{{componentName}}">{{options.name}}</a>
         </li>
         {{/each}}
       </ul>

diff --git a/packages/pv-stylemark/tasks/templates/lsg.hbs b/packages/pv-stylemark/tasks/templates/lsg.hbs
@@ -20,13 +20,15 @@
       </style>
     {{/if}}
   </head>
-  <body class="dds-page">
+  <body class="dds-page theme-page">
     {{> lsg-nav}}
-    <main class="dds-page__main">
+    <main class="dds-page__main theme-content">
       {{#each lsgData}}
+      <div class="theme-content-category">
         {{#each categoryItems}}
 {{> lsg-component }}
         {{/each}}
+      </div>
       {{/each}}
     </main>