pleroma-fe

commit: adc3b17fe0ba149386d83ee85f908578609bd676
parent 835eaf33b194b25c41ed24815e6e5cd5eb4570cd
Author: Henry Jameson <spam@hjkos.com>
Date:   Wed, 13 Jan 2021 21:29:12 +0200

add success global notice style/level

Diffstat:
M
src/App.scss
9
+++++++++
M
src/components/global_notice_list/global_notice_list.vue
8
++++++++
M
src/services/theme_data/pleromafe.js
28
++++++++++++++++++++++++++++

3 files changed, 45 insertions(+), 0 deletions(-)
diff --git a/src/App.scss b/src/App.scss
@@ -698,6 +698,15 @@ nav {
       color: var(--alertWarningPanelText, $fallback--text);
     }
   }
+
+  &.success {
+    background-color: var(--alertSuccess, $fallback--alertWarning);
+    color: var(--alertSuccessText, $fallback--text);
+
+    .panel-heading & {
+      color: var(--alertSuccessPanelText, $fallback--text);
+    }
+  }
 }
 
 .faint {
diff --git a/src/components/global_notice_list/global_notice_list.vue b/src/components/global_notice_list/global_notice_list.vue
@@ -71,6 +71,14 @@
     }
   }
 
+  .global-success {
+    background-color: var(--alertPopupSuccess, $fallback--cGreen);
+    color: var(--alertPopupSuccessText, $fallback--text);
+    .svg-inline--fa {
+      color: var(--alertPopupSuccessText, $fallback--text);
+    }
+  }
+
   .global-info {
     background-color: var(--alertPopupNeutral, $fallback--fg);
     color: var(--alertPopupNeutralText, $fallback--text);
diff --git a/src/services/theme_data/pleromafe.js b/src/services/theme_data/pleromafe.js
@@ -616,6 +616,23 @@ export const SLOT_INHERITANCE = {
     textColor: true
   },
 
+  alertSuccess: {
+    depends: ['cGreen'],
+    opacity: 'alert'
+  },
+  alertSuccessText: {
+    depends: ['text'],
+    layer: 'alert',
+    variant: 'alertSuccess',
+    textColor: true
+  },
+  alertSuccessPanelText: {
+    depends: ['panelText'],
+    layer: 'alertPanel',
+    variant: 'alertSuccess',
+    textColor: true
+  },
+
   alertNeutral: {
     depends: ['text'],
     opacity: 'alert'
@@ -656,6 +673,17 @@ export const SLOT_INHERITANCE = {
     textColor: true
   },
 
+  alertPopupSuccess: {
+    depends: ['alertSuccess'],
+    opacity: 'alertPopup'
+  },
+  alertPopupSuccessText: {
+    depends: ['alertSuccessText'],
+    layer: 'popover',
+    variant: 'alertPopupSuccess',
+    textColor: true
+  },
+
   alertPopupNeutral: {
     depends: ['alertNeutral'],
     opacity: 'alertPopup'