🧼 (project) : use new component, delete some inconsistency

Stephane-Pires · Jul 18, 2023 · db48edb · db48edb
1 parent 94186cb
commit db48edb
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 42 deletions.
diff --git a/global-bottom.vue b/global-bottom.vue
@@ -6,60 +6,32 @@ const now  = useNow()
 const options = { weekday: 'short', year: 'numeric', month: 'long', day: 'numeric' };
 const date = computed(() => now?.value.toLocaleDateString($slidev.configs.dateFormat, options))
 
-  const LayoutWithoutDate = [
-      'image-right',
-      'iframe-right',
-      'image-left',
-      'iframe-left',
-  ]
-  
-const LayoutWithoutFooter = [
-    'iframe',
-    ...LayoutWithoutDate
-]
-
-
-const LayoutWithoutName = [
-    'image-left',
-    'iframe-left',
-]
-
-const LayoutWithoutPageNumber = [
-    'image-right',
-    'iframe-right',
-]
-
 </script>
 
-
-
 <template>
   <footer
-    v-if="!LayoutWithoutFooter.includes($slidev.nav.currentLayout)"
-    class="absolute bottom-0 p-2 text-sm w-full h-6"
+    class="absolute z-40 bottom-0 p-2 text-sm w-full h-6"
   >
       <div 
-    class="absolute bottom-0"
-      v-if="!LayoutWithoutName.includes($slidev.nav.currentLayout)">
-
+    class="absolute bottom-0">
 
         {{ $slidev.configs.presenterName }}
 
       </div>
       <div 
-      v-if="!LayoutWithoutDate.includes($slidev.nav.currentLayout)" class="absolute bottom-0 left-100"> {{date}}</div>
+       class="absolute bottom-0 left-100"> {{date}}</div>
       <div
-      v-if="!LayoutWithoutPageNumber.includes($slidev.nav.currentLayout)"
         class="text-xs absolute bottom-0 right-2"
       >
-        {{ $slidev.nav.currentPage }} / {{ $slidev.nav.total }}
+        <SlideCurrentNo /> / <SlidesTotal />
       </div>
   </footer>
 </template>
 
 <style scoped>
-footer {
-  @apply font-mono  text-brand-darker dark:text-brand-light bg-brand-light dark:bg-light-text;
-}
+
+  footer {
+  @apply font-mono  text-brand-darker dark:text-brand-light bg-brand-light dark:bg-light-text-base;
+  }
 
 </style>
diff --git a/global-top.vue b/global-top.vue
@@ -47,7 +47,7 @@ function wasRead () {
 
 <!-- <style scoped>
 header {
-  @apply font-mono  text-brand-darker dark:text-brand-light bg-brand-light dark:bg-light-text;
+  @apply font-mono  text-brand-darker dark:text-brand-light bg-brand-light dark:bg-light-text-base;
 }
 
 </style> -->
diff --git a/layouts/punch.vue b/layouts/punch.vue
@@ -9,7 +9,7 @@
     @apply bg-brand-light dark:bg-brand-logo;
 
     h1 {
-    @apply text-brand-darker dark:text-dark-text;
+    @apply text-brand-darker dark:text-dark-text-contrast;
   }
  } 
     

diff --git a/setup/windicss.ts b/setup/windicss.ts
@@ -25,7 +25,10 @@ export default defineWindiSetup(() => ({
           right: '#23272F',
         },
         title: '#76c893',
-        text: colors.white,
+        text: {
+          base: colors.white,
+          contrast: colors.black
+        } ,
         warning: '#ff7b00',
         accent: '#86EFAC',
         highlight: '#C0B2F8',
@@ -37,7 +40,10 @@ export default defineWindiSetup(() => ({
           right: '#d0ffb7'
         },
         title: '#0e2331',
-        text: colors.black,
+        text: {
+          base:colors.black,
+          contrast: colors.white,
+        },
         warning: '#d11149',
         accent: '#092e1c', 
         highlight: '#6610f2',

diff --git a/styles/layout.css b/styles/layout.css
@@ -2,7 +2,7 @@
 
 html:not(.dark) {
   /* light mode css here */
-  @apply text-light-text;
+  @apply text-light-text-base;
 
   h1 {
     @apply text-brand-dark;
@@ -12,7 +12,7 @@ html:not(.dark) {
 
 html.dark {
   /* dark mode css here */
-  @apply text-dark-text;
+  @apply text-dark-text-base;
 
   h1 {
     @apply text-brand-logo;