fix: update buttons, breadcrumb and global scss
- updated some styles in global scss - updated buttons scss - updated breadcrumb style to be consistent with new design
This commit is contained in:
parent
ec89c75265
commit
baff67baa4
3 changed files with 31 additions and 23 deletions
|
|
@ -6,9 +6,11 @@
|
|||
|
||||
.btn {
|
||||
border: none;
|
||||
padding: 4px 8px;
|
||||
background-color: var(--white);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: var(--btn-shadow);
|
||||
font-size: var(--text-md);
|
||||
box-shadow: none;
|
||||
font-size: var(--text-base);
|
||||
&.icon-btn {
|
||||
height: var(--btn-height);
|
||||
padding: 0px;
|
||||
|
|
@ -40,12 +42,13 @@
|
|||
|
||||
.btn-primary-light {
|
||||
@include button-variant(
|
||||
$background: $primary-light,
|
||||
$border: $primary-light,
|
||||
$hover-background: lighten($primary-light, 1%),
|
||||
$hover-border: $primary-light,
|
||||
$active-background: lighten($primary-light, 1%),
|
||||
$active-border: darken($primary-light, 12.5%)
|
||||
// not happy with this
|
||||
$background: $gray-300,
|
||||
$border: $gray-800,
|
||||
$hover-background: $gray-200,
|
||||
$hover-border: $gray-300,
|
||||
$active-background: $gray-300,
|
||||
$active-border: $gray-200
|
||||
);
|
||||
|
||||
color: var(--primary);
|
||||
|
|
@ -54,7 +57,7 @@
|
|||
}
|
||||
|
||||
&:focus {
|
||||
box-shadow: 0 0 0 0.2rem var(--primary-light);
|
||||
box-shadow: var(--focus-default);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -62,16 +65,16 @@
|
|||
background-color: var(--control-bg);
|
||||
color: var(--text-color);
|
||||
&:hover, &:active {
|
||||
background-color: var(--gray-400);
|
||||
background-color: var(--gray-300);
|
||||
color: var(--text-color);
|
||||
}
|
||||
}
|
||||
|
||||
.btn.btn-default {
|
||||
background-color: var(--fg-color);
|
||||
background-color: var(--control-bg);
|
||||
color: var(--text-color);
|
||||
&:hover, &:active {
|
||||
background: var(--fg-hover-color);
|
||||
background: var(--gray-300);
|
||||
color: var(--text-color);
|
||||
}
|
||||
}
|
||||
|
|
@ -85,7 +88,7 @@
|
|||
}
|
||||
|
||||
.btn.btn-danger {
|
||||
background-color: var(--red-400);
|
||||
background-color: var(--danger);
|
||||
color: $white;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -7,9 +7,9 @@
|
|||
/*! This comment will be included even in compressed mode. */
|
||||
#navbar-breadcrumbs {
|
||||
margin-left: var(--margin-md);
|
||||
font-size: var(--text-sm);
|
||||
font-size: var(--text-base);
|
||||
font-weight: var(--weight-regular);
|
||||
a {
|
||||
font-size: var(--text-md);
|
||||
margin-right: 10px;
|
||||
&:before {
|
||||
content: #{"/*!rtl:var(--left-arrow-svg);*/"}var(--right-arrow-svg);
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
|
||||
li.disabled {
|
||||
a {
|
||||
color: var(--text-muted);
|
||||
color: var(--gray-600);
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,8 @@ html {
|
|||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
color: var(--text-light);
|
||||
color: var(--text-muted);
|
||||
font-weight: var(--weight-regular);
|
||||
background-color: var(--bg-color);
|
||||
|
||||
&.full-width {
|
||||
|
|
@ -231,7 +232,7 @@ h2 {
|
|||
|
||||
.btn-group-sm > .btn, .btn-sm {
|
||||
padding: var(--padding-xs) var(--padding-sm);
|
||||
font-size: var(--text-md);
|
||||
font-size: var(--text-base);
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
|
|
@ -284,7 +285,7 @@ h2 {
|
|||
|
||||
.input-xs {
|
||||
height: 26px;
|
||||
font-size: var(--text-md);
|
||||
font-size: var(--text-base);
|
||||
}
|
||||
|
||||
select.input-xs {
|
||||
|
|
@ -308,12 +309,13 @@ select.input-xs {
|
|||
/* dropdowns */
|
||||
|
||||
.dropdown-item {
|
||||
border-radius: 4px;
|
||||
border-radius: 8px;
|
||||
padding : var(--dropdown-padding) !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
padding: 4px;
|
||||
font-size: var(--text-md);
|
||||
font-size: var(--text-base);
|
||||
max-height: 500px;
|
||||
overflow: auto;
|
||||
|
||||
|
|
@ -351,7 +353,7 @@ select.input-xs {
|
|||
}
|
||||
|
||||
.custom-control.custom-switch {
|
||||
font-size: var(--text-md);
|
||||
font-size: var(--text-base);
|
||||
line-height: 1.6;
|
||||
|
||||
.custom-control-input ~ .custom-control-label {
|
||||
|
|
@ -534,6 +536,9 @@ body.no-sidebar {
|
|||
|
||||
.app-logo {
|
||||
width: 24px;
|
||||
h4 {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.alt-pressed .alt-underline {
|
||||
|
|
@ -578,7 +583,7 @@ details > summary:focus {
|
|||
}
|
||||
|
||||
.text-medium {
|
||||
font-size: var(--text-md);
|
||||
font-size: var(--text-base);
|
||||
}
|
||||
|
||||
.text-small {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue