bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-22 11:13:46 +00:00
Code Issues Releases Wiki Activity

dark theme styles

Browse Source
This commit is contained in:
Kyle Spearrin
2018-05-30 15:21:41 -04:00
parent a0b59ab9bd
commit 829d0f22cc
11 changed files with 358 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/scss/modal.scss
View File

@@ -20,7 +20,7 @@ $modal-dialog-margin-y-sm-up: 1.75rem !default;
$modal-title-line-height: $line-height-base !default;
$modal-content-bg: $background-color-alt !default;
//$modal-content-bg: $background-color-alt !default;
$modal-content-border-color: rgba($black, .2) !default;
$modal-content-border-width: 1px !default;
$modal-content-box-shadow-xs: none;
@@ -157,7 +157,7 @@ $close-text-shadow: 0 1px 0 $white !default;
width: 100%; // Ensure `.modal-content` extends the full width of the parent `.modal-dialog`
// counteract the pointer-events: none; in the .modal-dialog
pointer-events: auto;
background-color: $modal-content-bg;
//background-color: $modal-content-bg;
background-clip: padding-box;
border: $modal-content-border-width solid $modal-content-border-color;
//@include border-radius($border-radius-lg);
@@ -166,6 +166,10 @@ $close-text-shadow: 0 1px 0 $white !default;
box-shadow: $modal-content-box-shadow-xs;
// Remove focus outline from opened modal
outline: 0;
@include themify($themes) {
background-color: themed('backgroundColorAlt');
}
}
// Modal background
@@ -198,6 +202,10 @@ $close-text-shadow: 0 1px 0 $white !default;
border-bottom: $modal-header-border-width solid $modal-header-border-color;
//@include border-top-radius($border-radius-lg);
@include themify($themes) {
border-bottom-color: themed('borderColorDark');
}
.close {
padding: $modal-header-padding $modal-inner-padding;
// auto on the left force icon to the right even when there is no .modal-title
@@ -239,6 +247,11 @@ $close-text-shadow: 0 1px 0 $white !default;
//justify-content: flex-end; // Right align buttons with flex property because text-align doesn't work on flex items
padding: $modal-inner-padding;
border-top: $modal-footer-border-width solid $modal-footer-border-color;
@include themify($themes) {
border-top-color: themed('borderColorDark');
}
// Easily place margin between footer elements
button {
margin-right: 10px;