mirror of
https://git.meshkee.com/cssd/cssd-back.git
synced 2026-10-13 17:11:05 +03:30
init project
This commit is contained in:
saeid
@@ -0,0 +1,48 @@
|
||||
.v-alert {
|
||||
.v-alert__dismissible .v-icon {
|
||||
color: rgba($white, .5);
|
||||
font-size: $font-size-default + 2;
|
||||
}
|
||||
|
||||
.v-alert__icon.v-icon {
|
||||
font-size: $font-size-alert-icon;
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.v-snack {
|
||||
.v-icon:not(:first-child) {
|
||||
color: rgba($white, .5);
|
||||
margin-left: $margin-general + 1;
|
||||
}
|
||||
|
||||
.v-icon:first-child {
|
||||
font-size: $font-size-alert-icon;
|
||||
}
|
||||
|
||||
.v-snack__content {
|
||||
padding: $padding-general $padding-general + 5;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.v-snack__wrapper {
|
||||
border-radius: $border-radius-base + 1;
|
||||
}
|
||||
}
|
||||
|
||||
.v-snack .v-snack__wrapper,
|
||||
.v-alert {
|
||||
@include alert-shadow('info', lighten($brand-info, 5%));
|
||||
@include alert-shadow('success', $brand-success);
|
||||
@include alert-shadow('error', $brand-danger);
|
||||
@include alert-shadow('warning', $brand-warning);
|
||||
@include alert-shadow('purple', $brand-primary);
|
||||
}
|
||||
|
||||
.v-snack {
|
||||
@include notifications-color('info', lighten($brand-info, 5%));
|
||||
@include notifications-color('success', $brand-success);
|
||||
@include notifications-color('error', $brand-danger);
|
||||
@include notifications-color('warning', $brand-warning);
|
||||
@include notifications-color('purple', $brand-primary);
|
||||
}
|
||||
@@ -0,0 +1,101 @@
|
||||
.v-btn {
|
||||
margin: $margin-small 1px;
|
||||
padding: $padding-small + 2 $padding-general + 15;
|
||||
font-size: $font-size-small;
|
||||
font-weight: $font-weight-base !important;
|
||||
height: auto;
|
||||
line-height: $line-height-base;
|
||||
color: $white !important;
|
||||
cursor: pointer;
|
||||
border-radius: $border-radius-base;
|
||||
|
||||
&.v-btn--round,
|
||||
&.v-btn--round:after {
|
||||
border-radius: $btn-round-padding;
|
||||
}
|
||||
|
||||
&.v-btn-facebook {
|
||||
@include social-buttons-color($social-facebook);
|
||||
}
|
||||
&.v-btn-twitter {
|
||||
@include social-buttons-color($social-twitter);
|
||||
}
|
||||
|
||||
.v-icon--left {
|
||||
margin-right: $btn-margin-icon;
|
||||
}
|
||||
.v-icon--right {
|
||||
margin-left: $btn-margin-icon;
|
||||
}
|
||||
|
||||
&.v-btn--large {
|
||||
font-size: $font-size-general;
|
||||
padding: $btn-y-large-padding $btn-x-large-padding !important;
|
||||
line-height: $btn-large-line-height;
|
||||
}
|
||||
|
||||
&.v-btn--small {
|
||||
padding: $btn-y-small-padding $btn-x-small-padding !important;
|
||||
font-size: $font-size-small - 1;
|
||||
}
|
||||
|
||||
&.v-btn--icon {
|
||||
width: $btn-icon-dim;
|
||||
height: $btn-icon-dim;
|
||||
line-height: $btn-icon-dim;
|
||||
padding: 0;
|
||||
|
||||
&.v-btn--round {
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
&.success {
|
||||
@include button-color($brand-success);
|
||||
}
|
||||
|
||||
&.default {
|
||||
@include button-color($gray-light);
|
||||
}
|
||||
|
||||
&.primary {
|
||||
@include button-color($brand-primary);
|
||||
}
|
||||
|
||||
&.warning {
|
||||
@include button-color($brand-warning);
|
||||
}
|
||||
|
||||
&.info {
|
||||
@include button-color($brand-info);
|
||||
}
|
||||
|
||||
&.danger {
|
||||
@include button-color($brand-danger);
|
||||
}
|
||||
|
||||
.v-icon {
|
||||
font-size: $btn-font-size-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.v-btn--fixed {
|
||||
border-radius: $border-radius-base + 3;
|
||||
border-bottom-right-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
background-color: rgba($black, .3) !important;
|
||||
right: 0;
|
||||
padding: 0;
|
||||
width: $btn-fixed-width;
|
||||
|
||||
.v-icon {
|
||||
font-size: $btn-fixed-icon-size;
|
||||
padding: $padding-small;
|
||||
}
|
||||
}
|
||||
|
||||
.v-btn--active:before,
|
||||
.v-btn:focus:before,
|
||||
.v-btn:hover:before {
|
||||
background-color: transparent;
|
||||
}
|
||||
@@ -0,0 +1,167 @@
|
||||
.v-card {
|
||||
box-shadow: $card-shadow;
|
||||
border-radius: $border-radius-base;
|
||||
|
||||
.category {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-top: 0;
|
||||
line-height: $line-height-base !important;
|
||||
letter-spacing: 0 !important;
|
||||
font-size: $font-size-h4 !important;
|
||||
margin-bottom: $card-title-margin !important;
|
||||
}
|
||||
|
||||
.v-divider {
|
||||
border-top: $divider-border;
|
||||
margin-left: $card-content-x-padding !important;
|
||||
margin-right: $card-content-x-padding !important;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
.v-offset {
|
||||
top: $card-offset !important;
|
||||
margin-bottom: $card-offset !important;
|
||||
|
||||
.category {
|
||||
color: rgba($white, .62);
|
||||
}
|
||||
|
||||
.v-card--material__header.v-card{
|
||||
padding: $padding-general;
|
||||
}
|
||||
}
|
||||
|
||||
.v-card__actions {
|
||||
margin: 0 $card-actions-y-margin 0;
|
||||
padding: $padding-small 0 $padding-small;
|
||||
line-height: $line-height-higher;
|
||||
}
|
||||
}
|
||||
|
||||
.v-card--material-chart.v-card {
|
||||
&:not(.v-card--material__header) {
|
||||
margin: $card-margin 0 !important;
|
||||
}
|
||||
|
||||
.v-card--material__header{
|
||||
border-radius: $border-radius-base + 3;
|
||||
min-height: $card-chart-min-height;
|
||||
padding: 0 !important;
|
||||
|
||||
.ct-label {
|
||||
font-size: $font-size-chart-label;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.category {
|
||||
margin: 0 !important;
|
||||
line-height: $line-height-higher;
|
||||
color: $gray-light;
|
||||
}
|
||||
|
||||
.v-card__text {
|
||||
padding: $padding-general $card-content-x-padding;
|
||||
line-height: $line-height-higher;
|
||||
}
|
||||
}
|
||||
|
||||
.v-card--material-stats.v-card:not(.v-card--material__header),
|
||||
.v-card--material-chart.v-card:not(.v-card--material__header) {
|
||||
margin: $card-margin 0 !important;
|
||||
}
|
||||
|
||||
@include card-header-color('info', $brand-info, $cyan-400, $cyan-600);
|
||||
@include card-header-color('red', $brand-danger, $red-400, $red-600);
|
||||
@include card-header-color('green', $brand-success, $green-400, $green-600);
|
||||
@include card-header-color('orange', $brand-warning, $orange-400, $orange-600);
|
||||
@include card-header-color('purple', $brand-primary, $purple-400, $purple-600);
|
||||
|
||||
.v-card--material-stats.v-card {
|
||||
.v-offset {
|
||||
position: absolute;
|
||||
|
||||
.v-card {
|
||||
max-width: $card-stats-offset;
|
||||
max-height: $card-stats-offset;
|
||||
line-height: $card-stats-offset;
|
||||
padding: $padding-general !important;
|
||||
|
||||
i {
|
||||
font-size: $font-size-big !important;
|
||||
line-height: $line-height-high;
|
||||
width: $card-stats-icons-dim;
|
||||
height: $card-stats-icons-dim;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.v-card__text {
|
||||
text-align: right;
|
||||
padding-top: $padding-small;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin: 0 !important;
|
||||
line-height: $line-height-base !important;
|
||||
letter-spacing: 0 !important;
|
||||
font-size: $font-size-h3 !important;
|
||||
|
||||
small {
|
||||
color: $gray-light;
|
||||
font-size: $font-size-small-tag;
|
||||
line-height: 1;
|
||||
font-weight: $font-weight-base;
|
||||
}
|
||||
}
|
||||
|
||||
.v-card__actions {
|
||||
i {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
font-size: $font-size-default + 2 !important;
|
||||
}
|
||||
|
||||
.caption {
|
||||
color: $gray-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.v-card-profile {
|
||||
display: inline-block;
|
||||
|
||||
.v-offset {
|
||||
top: unset !important;
|
||||
margin-bottom: unset !important;
|
||||
margin-top: $card-profile-avatar-pos;
|
||||
}
|
||||
|
||||
.v-card__text .v-card__text {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.v-card__text {
|
||||
padding: $padding-general;
|
||||
}
|
||||
|
||||
img {
|
||||
@include shadow-big();
|
||||
}
|
||||
}
|
||||
|
||||
.v-card--flat {
|
||||
background-color: transparent !important;
|
||||
box-shadow: none;
|
||||
|
||||
.v-table {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
.mdi-checkbox-blank-outline:before {
|
||||
-webkit-text-stroke: 1px $white;
|
||||
}
|
||||
@@ -0,0 +1,327 @@
|
||||
$red-50: #ffebee !default;
|
||||
$red-100: #ffcdd2 !default;
|
||||
$red-200: #ef9a9a !default;
|
||||
$red-300: #e57373 !default;
|
||||
$red-400: #ef5350 !default;
|
||||
$red-500: #f44336 !default;
|
||||
$red-600: #e53935 !default;
|
||||
$red-700: #d32f2f !default;
|
||||
$red-800: #c62828 !default;
|
||||
$red-900: #b71c1c !default;
|
||||
$red-A100: #ff8a80 !default;
|
||||
$red-A200: #ff5252 !default;
|
||||
$red-A400: #ff1744 !default;
|
||||
$red-A700: #d50000 !default;
|
||||
$red: $red-500 !default;
|
||||
|
||||
|
||||
$pink-50: #fce4ec !default;
|
||||
$pink-100: #f8bbd0 !default;
|
||||
$pink-200: #f48fb1 !default;
|
||||
$pink-300: #f06292 !default;
|
||||
$pink-400: #ec407a !default;
|
||||
$pink-500: #e91e63 !default;
|
||||
$pink-600: #d81b60 !default;
|
||||
$pink-700: #c2185b !default;
|
||||
$pink-800: #ad1457 !default;
|
||||
$pink-900: #880e4f !default;
|
||||
$pink-A100: #ff80ab !default;
|
||||
$pink-A200: #ff4081 !default;
|
||||
$pink-A400: #f50057 !default;
|
||||
$pink-A700: #c51162 !default;
|
||||
$pink: $pink-500 !default;
|
||||
|
||||
|
||||
$purple-50: #f3e5f5 !default;
|
||||
$purple-100: #e1bee7 !default;
|
||||
$purple-200: #ce93d8 !default;
|
||||
$purple-300: #ba68c8 !default;
|
||||
$purple-400: #ab47bc !default;
|
||||
$purple-500: #9c27b0 !default;
|
||||
$purple-600: #8e24aa !default;
|
||||
$purple-700: #7b1fa2 !default;
|
||||
$purple-800: #6a1b9a !default;
|
||||
$purple-900: #4a148c !default;
|
||||
$purple-A100: #ea80fc !default;
|
||||
$purple-A200: #e040fb !default;
|
||||
$purple-A400: #d500f9 !default;
|
||||
$purple-A700: #aa00ff !default;
|
||||
$purple: $purple-500 !default;
|
||||
|
||||
|
||||
$deep-purple-50: #ede7f6 !default;
|
||||
$deep-purple-100: #d1c4e9 !default;
|
||||
$deep-purple-200: #b39ddb !default;
|
||||
$deep-purple-300: #9575cd !default;
|
||||
$deep-purple-400: #7e57c2 !default;
|
||||
$deep-purple-500: #673ab7 !default;
|
||||
$deep-purple-600: #5e35b1 !default;
|
||||
$deep-purple-700: #512da8 !default;
|
||||
$deep-purple-800: #4527a0 !default;
|
||||
$deep-purple-900: #311b92 !default;
|
||||
$deep-purple-A100: #b388ff !default;
|
||||
$deep-purple-A200: #7c4dff !default;
|
||||
$deep-purple-A400: #651fff !default;
|
||||
$deep-purple-A700: #6200ea !default;
|
||||
$deep-purple: $deep-purple-500 !default;
|
||||
|
||||
|
||||
$indigo-50: #e8eaf6 !default;
|
||||
$indigo-100: #c5cae9 !default;
|
||||
$indigo-200: #9fa8da !default;
|
||||
$indigo-300: #7986cb !default;
|
||||
$indigo-400: #5c6bc0 !default;
|
||||
$indigo-500: #3f51b5 !default;
|
||||
$indigo-600: #3949ab !default;
|
||||
$indigo-700: #303f9f !default;
|
||||
$indigo-800: #283593 !default;
|
||||
$indigo-900: #1a237e !default;
|
||||
$indigo-A100: #8c9eff !default;
|
||||
$indigo-A200: #536dfe !default;
|
||||
$indigo-A400: #3d5afe !default;
|
||||
$indigo-A700: #304ffe !default;
|
||||
$indigo: $indigo-500 !default;
|
||||
|
||||
|
||||
$blue-50: #e3f2fd !default;
|
||||
$blue-100: #bbdefb !default;
|
||||
$blue-200: #90caf9 !default;
|
||||
$blue-300: #64b5f6 !default;
|
||||
$blue-400: #42a5f5 !default;
|
||||
$blue-500: #2196f3 !default;
|
||||
$blue-600: #1e88e5 !default;
|
||||
$blue-700: #1976d2 !default;
|
||||
$blue-800: #1565c0 !default;
|
||||
$blue-900: #0d47a1 !default;
|
||||
$blue-A100: #82b1ff !default;
|
||||
$blue-A200: #448aff !default;
|
||||
$blue-A400: #2979ff !default;
|
||||
$blue-A700: #2962ff !default;
|
||||
$blue: $blue-500 !default;
|
||||
|
||||
|
||||
$light-blue-50: #e1f5fe !default;
|
||||
$light-blue-100: #b3e5fc !default;
|
||||
$light-blue-200: #81d4fa !default;
|
||||
$light-blue-300: #4fc3f7 !default;
|
||||
$light-blue-400: #29b6f6 !default;
|
||||
$light-blue-500: #03a9f4 !default;
|
||||
$light-blue-600: #039be5 !default;
|
||||
$light-blue-700: #0288d1 !default;
|
||||
$light-blue-800: #0277bd !default;
|
||||
$light-blue-900: #01579b !default;
|
||||
$light-blue-A100: #80d8ff !default;
|
||||
$light-blue-A200: #40c4ff !default;
|
||||
$light-blue-A400: #00b0ff !default;
|
||||
$light-blue-A700: #0091ea !default;
|
||||
$light-blue: $light-blue-500 !default;
|
||||
|
||||
|
||||
$cyan-50: #e0f7fa !default;
|
||||
$cyan-100: #b2ebf2 !default;
|
||||
$cyan-200: #80deea !default;
|
||||
$cyan-300: #4dd0e1 !default;
|
||||
$cyan-400: #26c6da !default;
|
||||
$cyan-500: #00bcd4 !default;
|
||||
$cyan-600: #00acc1 !default;
|
||||
$cyan-700: #0097a7 !default;
|
||||
$cyan-800: #00838f !default;
|
||||
$cyan-900: #006064 !default;
|
||||
$cyan-A100: #84ffff !default;
|
||||
$cyan-A200: #18ffff !default;
|
||||
$cyan-A400: #00e5ff !default;
|
||||
$cyan-A700: #00b8d4 !default;
|
||||
$cyan: $cyan-500 !default;
|
||||
|
||||
|
||||
$teal-50: #e0f2f1 !default;
|
||||
$teal-100: #b2dfdb !default;
|
||||
$teal-200: #80cbc4 !default;
|
||||
$teal-300: #4db6ac !default;
|
||||
$teal-400: #26a69a !default;
|
||||
$teal-500: #009688 !default;
|
||||
$teal-600: #00897b !default;
|
||||
$teal-700: #00796b !default;
|
||||
$teal-800: #00695c !default;
|
||||
$teal-900: #004d40 !default;
|
||||
$teal-A100: #a7ffeb !default;
|
||||
$teal-A200: #64ffda !default;
|
||||
$teal-A400: #1de9b6 !default;
|
||||
$teal-A700: #00bfa5 !default;
|
||||
$teal: $teal-500 !default;
|
||||
|
||||
|
||||
$green-50: #e8f5e9 !default;
|
||||
$green-100: #c8e6c9 !default;
|
||||
$green-200: #a5d6a7 !default;
|
||||
$green-300: #81c784 !default;
|
||||
$green-400: #66bb6a !default;
|
||||
$green-500: #4caf50 !default;
|
||||
$green-600: #43a047 !default;
|
||||
$green-700: #388e3c !default;
|
||||
$green-800: #2e7d32 !default;
|
||||
$green-900: #1b5e20 !default;
|
||||
$green-A100: #b9f6ca !default;
|
||||
$green-A200: #69f0ae !default;
|
||||
$green-A400: #00e676 !default;
|
||||
$green-A700: #00c853 !default;
|
||||
$green: $green-500 !default;
|
||||
|
||||
|
||||
$light-green-50: #f1f8e9 !default;
|
||||
$light-green-100: #dcedc8 !default;
|
||||
$light-green-200: #c5e1a5 !default;
|
||||
$light-green-300: #aed581 !default;
|
||||
$light-green-400: #9ccc65 !default;
|
||||
$light-green-500: #8bc34a !default;
|
||||
$light-green-600: #7cb342 !default;
|
||||
$light-green-700: #689f38 !default;
|
||||
$light-green-800: #558b2f !default;
|
||||
$light-green-900: #33691e !default;
|
||||
$light-green-A100: #ccff90 !default;
|
||||
$light-green-A200: #b2ff59 !default;
|
||||
$light-green-A400: #76ff03 !default;
|
||||
$light-green-A700: #64dd17 !default;
|
||||
$light-green: $light-green-500 !default;
|
||||
|
||||
|
||||
$lime-50: #f9fbe7 !default;
|
||||
$lime-100: #f0f4c3 !default;
|
||||
$lime-200: #e6ee9c !default;
|
||||
$lime-300: #dce775 !default;
|
||||
$lime-400: #d4e157 !default;
|
||||
$lime-500: #cddc39 !default;
|
||||
$lime-600: #c0ca33 !default;
|
||||
$lime-700: #afb42b !default;
|
||||
$lime-800: #9e9d24 !default;
|
||||
$lime-900: #827717 !default;
|
||||
$lime-A100: #f4ff81 !default;
|
||||
$lime-A200: #eeff41 !default;
|
||||
$lime-A400: #c6ff00 !default;
|
||||
$lime-A700: #aeea00 !default;
|
||||
$lime: $lime-500 !default;
|
||||
|
||||
|
||||
$yellow-50: #fffde7 !default;
|
||||
$yellow-100: #fff9c4 !default;
|
||||
$yellow-200: #fff59d !default;
|
||||
$yellow-300: #fff176 !default;
|
||||
$yellow-400: #ffee58 !default;
|
||||
$yellow-500: #fec60a !default;
|
||||
$yellow-600: #fdd835 !default;
|
||||
$yellow-700: #fbc02d !default;
|
||||
$yellow-800: #f9a825 !default;
|
||||
$yellow-900: #f57f17 !default;
|
||||
$yellow-A100: #ffff8d !default;
|
||||
$yellow-A200: #ffff00 !default;
|
||||
$yellow-A400: #ffea00 !default;
|
||||
$yellow-A700: #ffd600 !default;
|
||||
$yellow: $yellow-700 !default;
|
||||
|
||||
|
||||
$amber-50: #fff8e1 !default;
|
||||
$amber-100: #ffecb3 !default;
|
||||
$amber-200: #ffe082 !default;
|
||||
$amber-300: #ffd54f !default;
|
||||
$amber-400: #ffca28 !default;
|
||||
$amber-500: #ffc107 !default;
|
||||
$amber-600: #ffb300 !default;
|
||||
$amber-700: #ffa000 !default;
|
||||
$amber-800: #ff8f00 !default;
|
||||
$amber-900: #ff6f00 !default;
|
||||
$amber-A100: #ffe57f !default;
|
||||
$amber-A200: #ffd740 !default;
|
||||
$amber-A400: #ffc400 !default;
|
||||
$amber-A700: #ffab00 !default;
|
||||
$amber: $amber-500 !default;
|
||||
|
||||
|
||||
$orange-50: #fff3e0 !default;
|
||||
$orange-100: #ffe0b2 !default;
|
||||
$orange-200: #ffcc80 !default;
|
||||
$orange-300: #ffb74d !default;
|
||||
$orange-400: #ffa726 !default;
|
||||
$orange-500: #ff9800 !default;
|
||||
$orange-600: #fb8c00 !default;
|
||||
$orange-700: #f57c00 !default;
|
||||
$orange-800: #ef6c00 !default;
|
||||
$orange-900: #e65100 !default;
|
||||
$orange-A100: #ffd180 !default;
|
||||
$orange-A200: #ffab40 !default;
|
||||
$orange-A400: #ff9100 !default;
|
||||
$orange-A700: #ff6d00 !default;
|
||||
$orange: $orange-500 !default;
|
||||
|
||||
|
||||
$deep-orange-50: #fbe9e7 !default;
|
||||
$deep-orange-100: #ffccbc !default;
|
||||
$deep-orange-200: #ffab91 !default;
|
||||
$deep-orange-300: #ff8a65 !default;
|
||||
$deep-orange-400: #ff7043 !default;
|
||||
$deep-orange-500: #ff5722 !default;
|
||||
$deep-orange-600: #f4511e !default;
|
||||
$deep-orange-700: #e64a19 !default;
|
||||
$deep-orange-800: #d84315 !default;
|
||||
$deep-orange-900: #bf360c !default;
|
||||
$deep-orange-A100: #ff9e80 !default;
|
||||
$deep-orange-A200: #ff6e40 !default;
|
||||
$deep-orange-A400: #ff3d00 !default;
|
||||
$deep-orange-A700: #dd2c00 !default;
|
||||
$deep-orange: $deep-orange-500 !default;
|
||||
|
||||
|
||||
$brown-50: #efebe9 !default;
|
||||
$brown-100: #d7ccc8 !default;
|
||||
$brown-200: #bcaaa4 !default;
|
||||
$brown-300: #a1887f !default;
|
||||
$brown-400: #8d6e63 !default;
|
||||
$brown-500: #795548 !default;
|
||||
$brown-600: #6d4c41 !default;
|
||||
$brown-700: #5d4037 !default;
|
||||
$brown-800: #4e342e !default;
|
||||
$brown-900: #3e2723 !default;
|
||||
$brown-A100: #d7ccc8 !default;
|
||||
$brown-A200: #bcaaa4 !default;
|
||||
$brown-A400: #8d6e63 !default;
|
||||
$brown-A700: #5d4037 !default;
|
||||
$brown: $brown-500 !default;
|
||||
|
||||
|
||||
$grey-50: #fafafa !default;
|
||||
$grey-100: #f5f5f5 !default;
|
||||
$grey-200: #eeeeee !default;
|
||||
$grey-300: #e0e0e0 !default;
|
||||
$grey-400: #bdbdbd !default;
|
||||
$grey-500: #9e9e9e; $rgb-grey-500: "158, 158, 158" !default;
|
||||
$grey-600: #757575 !default;
|
||||
$grey-700: #616161 !default;
|
||||
$grey-800: #424242 !default;
|
||||
$grey-900: #212121 !default;
|
||||
$grey-A100: #f5f5f5 !default;
|
||||
$grey-A200: #eeeeee !default;
|
||||
$grey-A400: #bdbdbd !default;
|
||||
$grey-A700: #616161 !default;
|
||||
$grey: $grey-500 !default;
|
||||
|
||||
|
||||
$blue-grey-50: #eceff1 !default;
|
||||
$blue-grey-100: #cfd8dc !default;
|
||||
$blue-grey-200: #b0bec5 !default;
|
||||
$blue-grey-300: #90a4ae !default;
|
||||
$blue-grey-400: #78909c !default;
|
||||
$blue-grey-500: #607d8b !default;
|
||||
$blue-grey-600: #546e7a !default;
|
||||
$blue-grey-700: #455a64 !default;
|
||||
$blue-grey-800: #37474f !default;
|
||||
$blue-grey-900: #263238 !default;
|
||||
$blue-grey-A100: #cfd8dc !default;
|
||||
$blue-grey-A200: #b0bec5 !default;
|
||||
$blue-grey-A400: #78909c !default;
|
||||
$blue-grey-A700: #455a64 !default;
|
||||
$blue-grey: $blue-grey-500 !default;
|
||||
|
||||
|
||||
$black: #000000; $rgb-black: "0,0,0" !default;
|
||||
$white: #ffffff; $rgb-white: "255,255,255" !default;
|
||||
|
||||
$Gradient-BlueCyan : linear-gradient(90deg, rgba(29,200,230,1) 20.5625%,rgba(29,200,229,1) 20.5625%,rgba(29,230,184,1) 80.5625%) !default;
|
||||
@@ -0,0 +1,31 @@
|
||||
.dropdown-menu {
|
||||
border-radius: $border-radius-base;
|
||||
|
||||
.v-list__tile {
|
||||
border-radius: $border-radius-base - 1;
|
||||
color: #333 !important;
|
||||
display: flex;
|
||||
font-size: $font-size-dropdown;
|
||||
font-weight: $font-weight-base;
|
||||
margin: 0 $margin-small - 5;
|
||||
padding: $padding-small 1.5rem;
|
||||
text-transform: none;
|
||||
@include transition-except-props(.15s linear, color, background-color, box-shadow 0ms);
|
||||
white-space: nowrap;
|
||||
|
||||
.v-list__tile__title {
|
||||
transition: none;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
@include dropdown-menu-color($brand-primary);
|
||||
|
||||
&,
|
||||
.v-list__tile__title {
|
||||
color: $white !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,46 @@
|
||||
.v-menu__content {
|
||||
border-radius: $border-radius-dropdown;
|
||||
box-shadow: $box-shadow-general;
|
||||
|
||||
.sidebar-filter {
|
||||
height: 30px;
|
||||
line-height: 25px;
|
||||
font-size: $font-size-small !important;
|
||||
font-weight: $font-weight-bolder + 100;
|
||||
color: $black-color;
|
||||
}
|
||||
|
||||
.v-responsive {
|
||||
max-height: 100px;
|
||||
border-radius: $border-radius-dropdown;
|
||||
max-width: 50px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.container.grid-list-xl .layout .flex {
|
||||
padding: $padding-small - 5;
|
||||
}
|
||||
|
||||
.v-avatar,
|
||||
.v-responsive {
|
||||
border: 3px solid $white;
|
||||
transition: all .34s;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
&.image-active,
|
||||
&.color-active {
|
||||
border-color: $brand-info;
|
||||
}
|
||||
}
|
||||
|
||||
.v-avatar {
|
||||
@include fixed-plugin-colors('primary', $brand-primary);
|
||||
@include fixed-plugin-colors('info', $brand-info);
|
||||
@include fixed-plugin-colors('danger', $brand-danger);
|
||||
@include fixed-plugin-colors('warning', $brand-warning);
|
||||
@include fixed-plugin-colors('success', $brand-success);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,63 @@
|
||||
.theme--light.v-footer {
|
||||
border-top: $footer-border-top;
|
||||
background: transparent;
|
||||
padding: $padding-general $padding-x-footer;
|
||||
}
|
||||
|
||||
.v-footer {
|
||||
.footer-links {
|
||||
font-weight: $font-weight-bolder;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
font-size: $font-size-small;
|
||||
padding: $padding-general;
|
||||
line-height: $line-height-footer-items;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: $brand-primary !important;
|
||||
}
|
||||
}
|
||||
|
||||
.copyright {
|
||||
color: $black-color;
|
||||
|
||||
a {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: $brand-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 991px) {
|
||||
.v-footer {
|
||||
height: auto !important;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.footer-items,
|
||||
.copyright {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 550px) {
|
||||
.footer-items,
|
||||
.copyright {
|
||||
width: unset;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
margin-top: $margin-small;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
.theme--light.v-text-field .v-input__slot:before {
|
||||
border-color: $input-color !important;
|
||||
}
|
||||
|
||||
.input--is-focused .v-input__control .v-input__slot:after{
|
||||
border-color: red !important;
|
||||
}
|
||||
|
||||
.v-text-field__slot {
|
||||
input {
|
||||
@include material-placeholder{
|
||||
color: $input-color;
|
||||
};
|
||||
}
|
||||
.v-label {
|
||||
color: $label-color !important;
|
||||
font-size: $font-size-default;
|
||||
font-weight: $font-weight-base;
|
||||
}
|
||||
}
|
||||
|
||||
.theme--light.v-input:not(.v-input--is-disabled) input,
|
||||
.theme--light.v-input:not(.v-input--is-disabled) textarea {
|
||||
color: $black-color;
|
||||
font-size: $font-size-default;
|
||||
}
|
||||
|
||||
@include inputs-color($brand-primary, 'purple');
|
||||
@include inputs-color($brand-warning, 'orange');
|
||||
@include inputs-color($brand-info, 'info');
|
||||
@include inputs-color($brand-danger, 'danger');
|
||||
@include inputs-color($brand-success, 'success');
|
||||
@include inputs-color($brand-success, 'primary');
|
||||
@@ -0,0 +1,54 @@
|
||||
.theme--light.application {
|
||||
background: $body-color;
|
||||
}
|
||||
|
||||
a {
|
||||
text-transform: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: $font-size-general + 2!important;
|
||||
}
|
||||
|
||||
.category {
|
||||
font-size: $font-size-general;
|
||||
}
|
||||
|
||||
.theme--light.v-icon {
|
||||
color: $gray-light;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
display: block;
|
||||
margin-block-start: 1em;
|
||||
margin-block-end: 1em;
|
||||
margin-inline-start: 40px;
|
||||
margin-inline-end: 40px;
|
||||
|
||||
p {
|
||||
font-style: italic;
|
||||
color: $blockquote-color;
|
||||
font-weight: $font-weight-bolder;
|
||||
}
|
||||
|
||||
small {
|
||||
font-size: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-size: $font-size-small;
|
||||
font-weight: $font-weight-bolder;
|
||||
}
|
||||
|
||||
.v-list--three-line .v-list__tile {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
@include drawer-active-colors('primary', $brand-primary);
|
||||
@include drawer-active-colors('success', $brand-success);
|
||||
@include drawer-active-colors('danger', $brand-danger);
|
||||
@include drawer-active-colors('info', $brand-info);
|
||||
@include drawer-active-colors('warning', $brand-warning);
|
||||
@@ -0,0 +1,162 @@
|
||||
@mixin shadow-big(){
|
||||
box-shadow: 0 10px 30px -12px rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity * 3),
|
||||
0 4px 25px 0px rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity),
|
||||
0 8px 10px -5px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity);
|
||||
}
|
||||
|
||||
@mixin shadow-2dp-color($color){
|
||||
box-shadow: 0 2px 2px 0 rgba($color, $mdb-shadow-key-penumbra-opacity),
|
||||
0 3px 1px -2px rgba($color, $mdb-shadow-key-umbra-opacity),
|
||||
0 1px 5px 0 rgba($color, $mdb-shadow-ambient-shadow-opacity) !important;
|
||||
}
|
||||
|
||||
@mixin button-shadow-color($color){
|
||||
box-shadow: 0 14px 26px -12px rgba($color, $mdb-shadow-key-penumbra-opacity * 3),
|
||||
0 4px 23px 0px rgba(0,0,0, $mdb-shadow-ambient-shadow-opacity),
|
||||
0 8px 10px -5px rgba($color, $mdb-shadow-key-umbra-opacity) !important;
|
||||
}
|
||||
|
||||
@mixin shadow-8dp(){
|
||||
box-shadow: 0 8px 10px 1px rgba(0, 0, 0, $mdb-shadow-key-penumbra-opacity),
|
||||
0 3px 14px 2px rgba(0, 0, 0, $mdb-shadow-ambient-shadow-opacity),
|
||||
0 5px 5px -3px rgba(0, 0, 0, $mdb-shadow-key-umbra-opacity);
|
||||
}
|
||||
|
||||
@mixin shadow-big-color($color){
|
||||
box-shadow: 0 12px 20px -10px rgba($color, $mdb-shadow-key-penumbra-opacity * 2),
|
||||
0 4px 20px 0px rgba(0,0,0, $mdb-shadow-ambient-shadow-opacity),
|
||||
0 7px 8px -5px rgba($color, $mdb-shadow-key-umbra-opacity) !important;
|
||||
}
|
||||
|
||||
@mixin material-placeholder() {
|
||||
&::-moz-placeholder {@content; } // Firefox
|
||||
&:-ms-input-placeholder {@content; } // Internet Explorer 10+
|
||||
&::-webkit-input-placeholder {@content; } // Safari and Chrome
|
||||
}
|
||||
|
||||
@mixin inputs-color($color, $color-name) {
|
||||
.v-text-field.#{$color-name}-input > .v-input__control > .v-input__slot:after {
|
||||
border-color: $color;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin drawer-active-colors($color-name, $color) {
|
||||
.v-navigation-drawer .v-list .v-list-item .v-list__tile.v-list__tile--active.#{$color-name} {
|
||||
background-color: $color !important;
|
||||
@include shadow-big-color($color);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin toolbar-colors($color-name, $color) {
|
||||
&.#{$color-name} {
|
||||
background-color: $color !important;
|
||||
@include shadow-big-color($color);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fixed-plugin-colors($color-name, $color) {
|
||||
&.color-#{$color-name}{
|
||||
background-color: $color;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin notifications-color($color-name, $color) {
|
||||
.v-snack__wrapper.#{$color-name} {
|
||||
background-color: $color !important;
|
||||
border-color: $color !important
|
||||
}
|
||||
}
|
||||
|
||||
@mixin card-header-color($color, $shadow-color, $color-400, $color-600) {
|
||||
.v-card.#{$color} {
|
||||
background: linear-gradient(60deg, $color-400, $color-600) !important;
|
||||
@include shadow-big-color($shadow-color);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin alert-shadow($color-name, $shadow-color) {
|
||||
&.#{$color-name} {
|
||||
@include shadow-big-color($shadow-color);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin transition-except-props($property...){
|
||||
transition: all $property;
|
||||
}
|
||||
|
||||
@mixin dropdown-menu-color($color) {
|
||||
background-color: $color !important;
|
||||
@include button-shadow-color($color);
|
||||
}
|
||||
|
||||
@mixin button-color($color) {
|
||||
background-color: $color !important;
|
||||
@include shadow-2dp-color($color);
|
||||
|
||||
&:focus,
|
||||
&:active,
|
||||
&:hover{
|
||||
// remove this line if you want black shadows
|
||||
@include button-shadow-color($color);
|
||||
background-color: darken($color, 3%) !important;
|
||||
}
|
||||
|
||||
&.v-btn--simple{
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&:active:focus,
|
||||
&:active:hover,
|
||||
&.active:focus,
|
||||
&.active:hover{
|
||||
background-color: transparent !important;
|
||||
color: $color !important;
|
||||
box-shadow: none !important;
|
||||
|
||||
i{
|
||||
color: $color !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin social-buttons-color ($color){
|
||||
background-color: $color !important;
|
||||
color: $white;
|
||||
@include shadow-2dp-color($color);
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&:active:focus,
|
||||
&:active:hover,
|
||||
&.active:focus,
|
||||
&.active:hover{
|
||||
background-color: $color !important;
|
||||
color: $white;
|
||||
@include button-shadow-color($color);
|
||||
}
|
||||
|
||||
&.v-btn--simple{
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
&:active:focus,
|
||||
&:active:hover,
|
||||
&.active:focus,
|
||||
&.active:hover{
|
||||
color: $color !important;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
|
||||
i{
|
||||
color: $color !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,86 @@
|
||||
.v-navigation-drawer {
|
||||
@include shadow-big();
|
||||
|
||||
.v-list {
|
||||
background: $sidebar-bg;
|
||||
padding: 0;
|
||||
|
||||
.v-list-item {
|
||||
&:not(:nth-child(3)){
|
||||
margin: $margin-small $margin-general 0;
|
||||
}
|
||||
|
||||
&:nth-child(3) {
|
||||
margin: 0 $margin-general;
|
||||
}
|
||||
|
||||
& > .v-list__tile {
|
||||
padding: $padding-small $padding-general;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background-color: $list-item-hover;
|
||||
}
|
||||
|
||||
.v-list__tile__title {
|
||||
font-size: $font-size-general !important;
|
||||
font-weight: $font-weight-lighter;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.v-list__tile__action {
|
||||
margin-right: $margin-general;
|
||||
min-width: unset;
|
||||
|
||||
i {
|
||||
width: $icon-width;
|
||||
}
|
||||
}
|
||||
|
||||
.v-list__tile:not(.v-list__tile--active) .v-list__tile__action i {
|
||||
opacity: $list-item-icon-opacity;
|
||||
}
|
||||
|
||||
.v-list__tile.v-list__tile--active {
|
||||
// @include shadow-big-color($brand-success);
|
||||
}
|
||||
}
|
||||
|
||||
.v-list__tile--avatar {
|
||||
height: unset;
|
||||
padding: $padding-logo 0;
|
||||
}
|
||||
|
||||
.v-list__tile__avatar {
|
||||
margin-left: $margin-list-left;
|
||||
margin-right: $margin-list-right;
|
||||
min-width: unset;
|
||||
}
|
||||
|
||||
.v-list__tile__title {
|
||||
line-height: $line-height;
|
||||
padding: $padding-avatar-title 0;
|
||||
height: unset;
|
||||
font-size: $font-size-avatar-title !important;
|
||||
font-weight: $font-weight-base;
|
||||
letter-spacing: unset !important;
|
||||
}
|
||||
|
||||
.v-divider {
|
||||
border-color: $black-opacity-3;
|
||||
margin: $divider-margins auto $divider-margins + 25;
|
||||
width: $divider-width;
|
||||
|
||||
}
|
||||
|
||||
.v-image__image--contain {
|
||||
top: $top-dim;
|
||||
}
|
||||
|
||||
.v-avatar {
|
||||
@include shadow-big;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
.theme--light.v-table tbody tr:not(:last-child),
|
||||
.theme--light.v-table thead tr:first-child {
|
||||
border-bottom: 1px solid $table-border-color!important;
|
||||
}
|
||||
|
||||
table.v-table thead tr {
|
||||
height: $table-head-height;
|
||||
background: $Gradient-BlueCyan !important;
|
||||
}
|
||||
|
||||
.theme--light.v-table tbody tr:hover:not(.v-datatable__expand-row) {
|
||||
background: $table-hover-color !important;
|
||||
}
|
||||
|
||||
table.v-table tbody td {
|
||||
font-size: $font-size-general;
|
||||
font-weight: $font-weight-lighter;
|
||||
}
|
||||
|
||||
table.v-table tbody td:first-child, table.v-table tbody td:not(:first-child),
|
||||
table.v-table tbody th:first-child, table.v-table tbody th:not(:first-child),
|
||||
table.v-table thead td:first-child, table.v-table thead td:not(:first-child),
|
||||
table.v-table thead th:first-child, table.v-table thead th:not(:first-child) {
|
||||
padding: $padding-small + 2 $tabs-text-box-padding;
|
||||
}
|
||||
|
||||
.v-datatable__progress {
|
||||
display: none;
|
||||
}
|
||||
|
||||
table thead tr th span{
|
||||
font-size: 1.0625rem !important;
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
.card-tabs {
|
||||
.v-divider {
|
||||
margin-left: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.flex {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.v-tabs__item {
|
||||
border-radius: $border-radius-base;
|
||||
}
|
||||
|
||||
.v-tabs__slider-wrapper .white{
|
||||
background-color: $tabs-active-line !important;
|
||||
border-color: $tabs-active-line !important
|
||||
}
|
||||
|
||||
.v-tabs__slider {
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
.v-list__tile__title {
|
||||
font-size: $font-size-default;
|
||||
font-weight: $font-weight-lighter;
|
||||
padding: 0 $tabs-text-box-padding;
|
||||
overflow: visible;
|
||||
white-space: inherit;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.v-list .v-input, .v-list .v-input__slot {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,76 @@
|
||||
.v-toolbar {
|
||||
min-height: $toolbar-min-height;
|
||||
border-radius: $border-radius-base;
|
||||
margin-bottom: $margin-general;
|
||||
|
||||
&:not(.v-toolbar--fixed) .v-toolbar__content {
|
||||
margin-left: $toolbar-margin-left;
|
||||
}
|
||||
|
||||
@include toolbar-colors('bg-danger', $brand-danger);
|
||||
@include toolbar-colors('bg-warning', $brand-warning);
|
||||
@include toolbar-colors('bg-primary', $brand-primary);
|
||||
@include toolbar-colors('bg-info', $brand-info);
|
||||
@include toolbar-colors('bg-success', $brand-success);
|
||||
@include toolbar-colors('bg-default', $gray-light);
|
||||
|
||||
&[class*="bg-"] {
|
||||
.v-toolbar__title,
|
||||
.v-btn__content,
|
||||
.v-ripple__container {
|
||||
color: $white !important;
|
||||
}
|
||||
}
|
||||
|
||||
.v-toolbar__content {
|
||||
min-height: $toolbar-min-height;
|
||||
padding-bottom: $padding-small;
|
||||
padding-top: $padding-small;
|
||||
|
||||
.v-toolbar__title {
|
||||
font-size: $font-size-toolbar-title;
|
||||
letter-spacing: unset;
|
||||
color: $black-color;
|
||||
}
|
||||
|
||||
.v-toolbar__items {
|
||||
& > div {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.toolbar-items{
|
||||
align-items: center;
|
||||
border-radius: $border-radius-base;
|
||||
display: flex;
|
||||
min-height: $list-item-height;
|
||||
padding: $padding-small $padding-general;
|
||||
|
||||
.v-badge__badge {
|
||||
border: $badge-border !important;
|
||||
font-size: $font-size-mini;
|
||||
height: $badge-dimension;
|
||||
line-height: normal;
|
||||
right: -7px;
|
||||
top: -12px;
|
||||
width: $badge-dimension;
|
||||
font-weight: $font-weight-base;
|
||||
}
|
||||
|
||||
.v-icon {
|
||||
font-size: $font-size-toolbar-items;
|
||||
}
|
||||
}
|
||||
|
||||
.v-input {
|
||||
margin: 0 !important;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 990px) {
|
||||
.v-toolbar:not(.v-toolbar--fixed) .v-toolbar__content {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,55 @@
|
||||
.v-tooltip__content {
|
||||
background: $white;
|
||||
padding: $padding-small $padding-general;
|
||||
min-width: $tooltip-min-width;
|
||||
max-width: $tooltip-max-width;
|
||||
color: $gray !important;
|
||||
font-size: $font-size-small;
|
||||
font-weight: $font-weight-base;
|
||||
@include shadow-8dp();
|
||||
text-align: center;
|
||||
|
||||
&:after{
|
||||
position: absolute;
|
||||
bottom: -$tooltip-border;
|
||||
height: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: $tooltip-border;
|
||||
vertical-align: $tooltip-arrow-align;
|
||||
content: "";
|
||||
}
|
||||
|
||||
&.top:after {
|
||||
border-top: $tooltip-border solid $white;
|
||||
border-right: $tooltip-border solid transparent;
|
||||
border-bottom: 0;
|
||||
border-left: $tooltip-border solid transparent;
|
||||
}
|
||||
|
||||
&.bottom:after{
|
||||
top: -$tooltip-border;
|
||||
border-top: 0;
|
||||
border-right: $tooltip-border solid transparent;
|
||||
border-bottom: $tooltip-border solid $white;
|
||||
border-left: $tooltip-border solid transparent;
|
||||
}
|
||||
&.left:after{
|
||||
margin-right: 0;
|
||||
right: -$tooltip-border;
|
||||
top: $tooltip-top-border-pos;
|
||||
border-top: $tooltip-border solid transparent;
|
||||
border-bottom: $tooltip-border solid transparent;
|
||||
border-left: $tooltip-border solid $white;
|
||||
}
|
||||
&.right:after{
|
||||
margin-left: 0;
|
||||
left: -$tooltip-border;
|
||||
top: $tooltip-top-border-pos;
|
||||
border-top: $tooltip-border solid transparent;
|
||||
border-bottom: $tooltip-border solid transparent;
|
||||
border-right: $tooltip-border solid $white;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,82 @@
|
||||
body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 {
|
||||
font-family: $font-family-sans-serif !important;
|
||||
font-weight: $font-weight-lighter !important;
|
||||
line-height: $line-height-base !important;
|
||||
}
|
||||
|
||||
h1,h2,h3,.h1,.h2,.h3{
|
||||
margin-top: $margin-general + 5;
|
||||
margin-bottom: $margin-small;
|
||||
}
|
||||
|
||||
h4,h5,h6,.h4,.h5,.h6{
|
||||
margin-top: $margin-small;
|
||||
margin-bottom: $margin-small;
|
||||
}
|
||||
|
||||
h1, .h1 {
|
||||
font-size: $font-size-h1 !important;
|
||||
line-height: 1.15em !important;
|
||||
}
|
||||
h2, .h2{
|
||||
font-size: $font-size-h2 !important;
|
||||
line-height: $line-height-base !important;
|
||||
}
|
||||
h3, .h3{
|
||||
font-size: $font-size-h3 !important;
|
||||
line-height: 1.4em !important;
|
||||
}
|
||||
h4, .h4{
|
||||
font-size: $font-size-h4 !important;
|
||||
line-height: $line-height-base !important;
|
||||
}
|
||||
h5, .h5 {
|
||||
font-size: $font-size-h5 !important;
|
||||
line-height: 1.55em !important;
|
||||
margin-bottom: $margin-general;
|
||||
}
|
||||
h6, .h6{
|
||||
font-size: $font-size-h6 !important;
|
||||
text-transform: uppercase;
|
||||
font-weight: $font-weight-bolder;
|
||||
}
|
||||
|
||||
p{
|
||||
font-size: $font-paragraph !important;
|
||||
margin: 0 0 $margin-small;
|
||||
}
|
||||
|
||||
h2.title{
|
||||
margin-bottom: $margin-general * 2;
|
||||
}
|
||||
|
||||
.description,
|
||||
.card-description,
|
||||
.footer-big p{
|
||||
color: $gray-light;
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
color: $brand-warning !important;
|
||||
}
|
||||
.text-primary {
|
||||
color: $brand-primary !important;
|
||||
}
|
||||
.text-danger {
|
||||
color: $brand-danger !important;
|
||||
}
|
||||
.text-success {
|
||||
color: $brand-success !important;
|
||||
}
|
||||
.text-info {
|
||||
color: $brand-info !important;
|
||||
}
|
||||
.text-gray{
|
||||
color: $gray-light !important;
|
||||
}
|
||||
.text-pink {
|
||||
color: $pink-500 !important;
|
||||
}
|
||||
.text-white {
|
||||
color: $white !important;
|
||||
}
|
||||
@@ -0,0 +1,170 @@
|
||||
// Importing All Material Design Colors
|
||||
@import "./colors";
|
||||
|
||||
// Brand Colors
|
||||
$brand-primary: $purple !default;
|
||||
$brand-success: $green !default;
|
||||
$brand-danger: $red !default;
|
||||
$brand-warning: $orange !default;
|
||||
$brand-info: $cyan !default;
|
||||
|
||||
// Paddings
|
||||
$padding-logo: 15px !default;
|
||||
$padding-avatar-title: 5px !default;
|
||||
$padding-x-footer: 24px !default;
|
||||
|
||||
// Line Height
|
||||
$line-height: 30px !default;
|
||||
$line-height-base: 1.5em !default;
|
||||
$line-height-footer-items: 1.8 !default;
|
||||
$line-height-higher: 22px !default;
|
||||
$line-height-high: 56px !default;
|
||||
|
||||
// Sidebar List Items Icons
|
||||
$icon-width: $line-height;
|
||||
|
||||
// Sidebar List Items
|
||||
$padding-small: 10px !default;
|
||||
$padding-general: 15px !default;
|
||||
$margin-general: $padding-general;
|
||||
$margin-small: $padding-small;
|
||||
$font-size-general: 14px !default;
|
||||
$list-item-hover: rgba(200, 200, 200, .2) !default;
|
||||
$list-item-icon-opacity: .8 !default;
|
||||
$list-item-height: 48px !default;
|
||||
$badge-border: 1px solid $white !default;
|
||||
$badge-dimension: 20px !default;
|
||||
|
||||
// Border Radius
|
||||
$border-radius-base: 3px !default;
|
||||
|
||||
// Sidebar Avatar Margins
|
||||
$margin-list-right: 11px !default;
|
||||
$margin-list-left: 25px !default;
|
||||
|
||||
// Sidebar Divider
|
||||
$divider-width: calc(100% - 30px) !default;
|
||||
$divider-margins: -1px !default;
|
||||
$divider-border: 1px solid #eee;
|
||||
|
||||
// Sidebar Background
|
||||
$sidebar-bg: rgba(27, 27, 27, .74) !default;
|
||||
|
||||
// Font size
|
||||
$font-size-mini: 9px !default;
|
||||
$font-size-small: 12px !default;
|
||||
$font-size-default: 14px !default;
|
||||
$font-size-avatar-title: 18px !default;
|
||||
$font-size-alert-icon: 30px !default;
|
||||
$font-size-big: 36px !default;
|
||||
$font-size-small-tag: 65% !default;
|
||||
$font-size-toolbar-title: $font-size-avatar-title;
|
||||
$font-size-toolbar-items: 20px !default;
|
||||
$font-size-h1: 3.3125rem;
|
||||
$font-size-h2: 2.25rem !default;
|
||||
$font-size-h3: 1.5625rem;
|
||||
$font-size-h4: 1.125rem !default;
|
||||
$font-size-h5: 1.0625rem !default;
|
||||
$font-size-h6: 0.75rem !default;
|
||||
$font-paragraph: $font-size-default !default;
|
||||
$font-size-chart-label: .730rem !default;
|
||||
|
||||
// Font Weight
|
||||
$font-weight-lighter: 300 !default;
|
||||
$font-weight-base: 400 !default;
|
||||
$font-weight-bolder: 500 !default;
|
||||
|
||||
// Opacity Colors
|
||||
$black-opacity-3: rgba(180, 180, 180, .3) !default;
|
||||
|
||||
// Image from Avatar
|
||||
$top-dim: 1px !default;
|
||||
|
||||
// Shadows
|
||||
$mdb-shadow-key-umbra-opacity: .2 !default;
|
||||
$mdb-shadow-key-penumbra-opacity: .14 !default;
|
||||
$mdb-shadow-ambient-shadow-opacity: .12 !default;
|
||||
|
||||
// Toolbar Height
|
||||
$toolbar-min-height: 70px !default;
|
||||
|
||||
// Toolbar Margin
|
||||
$toolbar-margin-left: 260px !default;
|
||||
|
||||
// Body Background Color
|
||||
$body-color: #eee !default;
|
||||
|
||||
// Black Color
|
||||
$black-color: #495057 !default;
|
||||
$blockquote-color: rgba(0, 0, 0, .87) !default;
|
||||
|
||||
// Gray Color
|
||||
$gray-light: #999 !default;
|
||||
$gray: lighten(#000, 33.5%) !default;
|
||||
|
||||
// Inputs Color
|
||||
$input-color: #d2d2d2 !default;
|
||||
$label-color: #aaa !default;
|
||||
|
||||
// Footer Border
|
||||
$footer-border-color: #e7e7e7 !default;
|
||||
$footer-border-top: 1px solid $footer-border-color !default;
|
||||
|
||||
// Cards
|
||||
$card-shadow: 0 1px 4px 0 rgba(0,0,0,0.14) !default;
|
||||
$card-margin: 25px !default;
|
||||
$card-content-x-padding: 20px !default;
|
||||
$card-actions-y-margin: $card-content-x-padding;
|
||||
$card-title-margin: 5px !default;
|
||||
$card-offset: -20px !default;
|
||||
$card-chart-min-height: 160px !default;
|
||||
$card-stats-offset: 85px !default;
|
||||
$card-stats-icons-dim: 56px !default;
|
||||
$card-profile-avatar-pos: -50px !default;
|
||||
|
||||
// Typography
|
||||
$font-family-sans-serif: 'Roboto', 'Helvetica', 'Arial', sans-serif !default;
|
||||
$font-family-serif: 'Roboto Slab', 'Times New Roman', serif !default;
|
||||
|
||||
// Tooltips
|
||||
$tooltip-min-width: 130px !default;
|
||||
$tooltip-max-width: 200px !default;
|
||||
$tooltip-border: 5px !default;
|
||||
$tooltip-top-border-pos: 16px !default;
|
||||
$tooltip-arrow-align: .255em !default;
|
||||
|
||||
// Buttons
|
||||
$btn-icon-dim: 41px !default;
|
||||
$btn-y-large-padding: 1.125rem !default;
|
||||
$btn-x-large-padding: 2.25rem !default;
|
||||
$btn-large-line-height: 1.333333 !default;
|
||||
$btn-y-small-padding: .40625rem !default;
|
||||
$btn-x-small-padding: 1.25rem !default;
|
||||
$btn-round-padding: 30px !default;
|
||||
$btn-font-size-icon: 1.25rem !default;
|
||||
$btn-margin-icon: 7px !default;
|
||||
$btn-fixed-icon-size: 1.8rem !default;
|
||||
$btn-fixed-width: 64px !default;
|
||||
|
||||
// Tabs
|
||||
$tabs-active-line: rgba(255, 255, 255, .3) !default;
|
||||
$tabs-text-box-padding: 8px !default;
|
||||
|
||||
// Table
|
||||
$table-hover-color: #f5f5f5 !default;
|
||||
$table-border-color: rgba(0,0,0,.06) !default;
|
||||
$table-head-height: 32px !default;
|
||||
|
||||
// Social Buttons
|
||||
$social-facebook: #3b5998 !default;
|
||||
$social-twitter: #55acee !default;
|
||||
|
||||
// Dropdown
|
||||
$font-size-dropdown: .8125rem !default;
|
||||
$border-radius-dropdown: 10px !default;
|
||||
|
||||
// Box-shadow
|
||||
$box-shadow-general: 0 2px 5px 0 rgba($black, .26);
|
||||
|
||||
// letter-spacing
|
||||
$WM-LetterSpacing-5: 5px;
|
||||
Reference in New Issue
Block a user