1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-17 08:43:33 +00:00

implement callout component w/ generator policy (#395)

This commit is contained in:
Kyle Spearrin
2020-02-28 16:58:51 -05:00
committed by GitHub
parent e90405a453
commit ee167571a6
6 changed files with 96 additions and 1 deletions

View File

@@ -290,3 +290,84 @@ app-root > #loading {
.draggable {
cursor: move;
}
.callout {
padding: 10px;
margin-bottom: 10px;
border: 1px solid #000000;
border-left-width: 5px;
border-radius: 3px;
@include themify($themes) {
border-color: themed('calloutBorderColor');
background-color: themed('calloutBackgroundColor');
}
.callout-heading {
margin-top: 0;
}
h3.callout-heading {
font-weight: bold;
text-transform: uppercase;
}
&.callout-primary {
@include themify($themes) {
border-left-color: themed('primaryColor');
}
.callout-heading {
@include themify($themes) {
color: themed('primaryColor');
}
}
}
&.callout-info {
@include themify($themes) {
border-left-color: themed('infoColor');
}
.callout-heading {
@include themify($themes) {
color: themed('infoColor');
}
}
}
&.callout-danger {
@include themify($themes) {
border-left-color: themed('dangerColor');
}
.callout-heading {
@include themify($themes) {
color: themed('dangerColor');
}
}
}
&.callout-success {
@include themify($themes) {
border-left-color: themed('successColor');
}
.callout-heading {
@include themify($themes) {
color: themed('successColor');
}
}
}
&.callout-warning {
@include themify($themes) {
border-left-color: themed('warningColor');
}
.callout-heading {
@include themify($themes) {
color: themed('warningColor');
}
}
}
}

View File

@@ -86,6 +86,8 @@ $themes: (
logoSuffix: 'dark',
passwordNumberColor: #007fde,
passwordSpecialColor: #c40800,
calloutBorderColor: $border-color-dark,
calloutBackgroundColor: $background-color,
),
dark: (
textColor: #ffffff,
@@ -134,6 +136,8 @@ $themes: (
logoSuffix: 'white',
passwordNumberColor: #52bdfb,
passwordSpecialColor: #ff7c70,
calloutBorderColor: #2f2f2f,
calloutBackgroundColor: #363636,
),
nord: (
textColor: $nord5,
@@ -182,6 +186,8 @@ $themes: (
logoSuffix: 'white',
passwordNumberColor: $nord8,
passwordSpecialColor: $nord12,
calloutBorderColor: $nord1,
calloutBackgroundColor: $nord2,
),
);