style: add dark mode styling

ICIJ · Jul 26, 2024 · 36682af · 36682af
1 parent 339db41
commit 36682af
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 5 deletions.
diff --git a/src/components/LinkedDocument/LinkedDocumentCard.vue b/src/components/LinkedDocument/LinkedDocumentCard.vue
@@ -1,7 +1,7 @@
 <template>
   <div
-    class="linked-document-card d-flex bg-tertiary rounded align-items-start"
-    :class="{ 'linked-document-card--skrink': !modelValue }"
+    class="linked-document-card d-flex rounded align-items-start bg-tertiary-subtle text-body"
+    :class="{ 'linked-document-card--collapse': !modelValue }"
   >
     <div class="d-flex flex-column flex-sm-row col-10 col-sm-11 justify-content-between">
       <linked-document-section
@@ -58,7 +58,7 @@ function toggle() {
 </script>
 <style lang="scss" scoped>
 .linked-document-card {
-  &--skrink {
+  &--collapse {
     height: 70px;
     overflow: hidden;
   }

diff --git a/src/components/LinkedDocument/LinkedDocumentSection.vue b/src/components/LinkedDocument/LinkedDocumentSection.vue
@@ -1,6 +1,6 @@
 <template>
   <section class="linked-document-section">
-    <p class="linked-document-section__title d-inline-flex gap-1">
+    <p class="linked-document-section__title d-inline-flex gap-1 text-body-emphasis">
       <phosphor-icon :name="icon" />
       <slot name="title"> {{ documents.length }} {{ title }} </slot>
     </p>

diff --git a/src/utils/settings.scss b/src/utils/settings.scss
@@ -11,7 +11,6 @@ $success: #00BB84;
 $info: #45C4FF;
 $white: #fff;
 
-$tertiary: #F3F3F3;
 $light: #F3F3F3;
 $black: #000;
 $dark: #212529;