sergei/maitsevkimp.ee
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v1

Browse Source
This commit is contained in:
s-lnk
2026-04-30 21:58:39 +03:00
commit aabe5fe2b7
2923 changed files with 366740 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/scss/core/mixins/_alert.scss
+42
View File
@@ -0,0 +1,42 @@
@mixin alert-variant($background, $border, $color) {
color: color-yiq($background);
@include gradient-bg($background);
border-color: $border;
hr {
border-top-color: darken($border, 5%);
}
.alert-link {
color: color-yiq($background);
font-weight: $font-weight-bold;
border-bottom: 1px dashed color-yiq($background);
}
.close > span:not(.sr-only) {
color: color-yiq($background);
}
}
//
// Alert outline variant
//
@mixin alert-outline-variant($border, $color) {
background: transparent;
color: $color;
border-color: $border;
hr {
border-top-color: lighten($border, 5%);
}
.alert-link {
color: $color;
}
.alert-group-prepend {
border-right: 1px solid $border;
}
}
resources/scss/core/mixins/_background-variant.scss
+58
View File
@@ -0,0 +1,58 @@
@mixin bg-variant($parent, $color, $ignore-warning: false) {
#{$parent} {
background-color: $color !important;
}
a#{$parent},
button#{$parent} {
@include hover-focus() {
background-color: darken($color, 10%) !important;
}
}
// @include deprecate("The `bg-variant` mixin", "v4.4.0", "v5", $ignore-warning);
}
// Gradient background variations
@mixin bg-gradient-variant($parent, $color) {
#{$parent} {
background: linear-gradient(50deg, $color 0, adjust-hue($color, 18%) 100%) !important;
}
}
// Translucent background variations
@mixin bg-translucent-variant($parent, $color) {
#{$parent} {
background-color: darken(rgba($color, $translucent-color-opacity), 7%) !important;
}
a#{$parent},
button#{$parent} {
@include hover-focus {
background-color: darken(rgba($color, $translucent-color-opacity), 12%) !important;
}
}
}
@mixin bg-soft-variant($parent, $color) {
#{$parent} {
@include gradient-bg($color);
}
}
// SVG color classes
@mixin fill-soft-variant($parent, $color) {
#{$parent} {
@include gradient-fill($color);
}
}
// Section background variations
@mixin bg-section-variant($parent, $color) {
#{$parent} {
background-color: $color !important;
}
}
resources/scss/core/mixins/_badge.scss
+17
View File
@@ -0,0 +1,17 @@
//
// Badge Mixins
// This is a custom mixin for badge-soft-#{color} variant of Bootstrap's .badge class
//
@mixin badge-soft-variant($bg, $color) {
color: $color;
background-color: $bg;
&[href] {
@include hover-focus {
color: $color;
text-decoration: none;
background-color: darken($bg, 5%);
}
}
}
resources/scss/core/mixins/_buttons.scss
+162
View File
@@ -0,0 +1,162 @@
// Button variants
//
// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons
@mixin button-variant($background, $border, $hover-background: darken($background, 7.5%), $hover-border: darken($border, 10%), $active-background: darken($background, 10%), $active-border: darken($border, 12.5%)) {
color: color-yiq($background);
@include gradient-bg($background);
border-color: $border;
@include box-shadow($btn-box-shadow);
@include hover {
color: color-yiq($hover-background);
@include gradient-bg($hover-background);
border-color: $hover-border;
}
&:focus,
&.focus {
// Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows {
box-shadow: $btn-box-shadow, 0 0 $btn-focus-width rgba($background, .35);
} @else {
box-shadow: 0 0 $btn-focus-width rgba($background, .35);
}
}
// Disabled comes first so active can properly restyle
&.disabled,
&:disabled {
color: color-yiq($background);
background-color: $background;
border-color: $border;
// Remove CSS gradients if they're enabled
@if $enable-gradients {
background-image: none;
}
}
&:not(:disabled):not(.disabled):active,
&:not(:disabled):not(.disabled).active,
.show > &.dropdown-toggle {
color: color-yiq($active-background);
background-color: $active-background;
@if $enable-gradients {
background-image: none; // Remove the gradient for the pressed/active state
}
border-color: $active-border;
&:focus {
// Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows and $btn-active-box-shadow != none {
box-shadow: $btn-active-box-shadow, 0 0 $btn-focus-width rgba($background, .35);
} @else {
box-shadow: 0 0 $btn-focus-width rgba($background, .35);
}
}
}
}
// Button outline variants
//
@mixin button-outline-variant($color, $color-hover: color-yiq($color), $active-background: $color, $active-border: $color) {
color: $color;
border-color: $color;
@include hover {
color: $color-hover;
background-color: $active-background;
border-color: $active-border;
}
&:focus,
&.focus {
box-shadow: $btn-box-shadow, 0 0 $btn-focus-width rgba($color, .35);
}
&.disabled,
&:disabled {
color: $color;
background-color: transparent;
}
&:not(:disabled):not(.disabled):active,
&:not(:disabled):not(.disabled).active,
.show > &.dropdown-toggle {
color: color-yiq($active-background);
background-color: $active-background;
border-color: $active-border;
&:focus {
// Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows and $btn-active-box-shadow != none {
box-shadow: $btn-active-box-shadow, 0 0 $btn-focus-width rgba($color, .35);
} @else {
box-shadow: 0 0 $btn-focus-width rgba($color, .35);
}
}
}
}
// Button soft variants
//
// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons
@mixin button-soft-variant($background, $color, $hover-background: $color, $hover-color: color-yiq($color), $active-background: $color, $active-color: color-yiq($color)) {
color: $color;
@include gradient-bg($background);
border-color: $background;
@include box-shadow($btn-box-shadow);
@include hover {
color: $hover-color;
@include gradient-bg($hover-background);
border-color: $hover-background;
@include box-shadow(0 4px 11px rgba($background, .35));
}
&:focus,
&.focus {
// Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows {
box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $color, 15%), .5);
} @else {
box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $color, 15%), .5);
}
}
// Disabled comes first so active can properly restyle
&.disabled,
&:disabled {
color: $color;
background-color: $background;
border-color: $background;
// Remove CSS gradients if they're enabled
@if $enable-gradients {
background-image: none;
}
}
&:not(:disabled):not(.disabled):active,
&:not(:disabled):not(.disabled).active,
.show > &.dropdown-toggle {
color: $active-color;
background-color: $active-background;
@if $enable-gradients {
background-image: none; // Remove the gradient for the pressed/active state
}
border-color: $active-background;
&:focus {
// Avoid using mixin so we can pass custom focus shadow properly
@if $enable-shadows {
box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $color, 15%), .5);
} @else {
box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $color, 15%), .5);
}
}
}
}
resources/scss/core/mixins/_caret.scss
+57
View File
@@ -0,0 +1,57 @@
@mixin caret-down {
content: "\f107";
}
@mixin caret-up {
content: "\f106";
}
@mixin caret-right {
content: "\f105";
}
@mixin caret-left {
content: "\f104";
}
@mixin caret($direction: down) {
@if $enable-caret {
&::after {
display: inline-block;
margin-left: .5rem;
font-style: normal;
font-variant: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
font-family: $icon-font-family;
font-weight: 700;
font-size: $caret-font-size;
@if $direction == down {
@include caret-down;
} @else if $direction == up {
@include caret-up;
} @else if $direction == right {
@include caret-right;
}
}
@if $direction == left {
&::after {
display: none;
}
&::before {
font-family: $icon-font-family;
font-weight: 700;
display: inline-block;
margin-right: .5rem;
@include caret-left;
}
}
&:empty::after {
margin-left: 0;
}
}
}
resources/scss/core/mixins/_gradients.scss
+7
View File
@@ -0,0 +1,7 @@
@mixin gradient-fill($color) {
@if $enable-gradients {
fill: $color linear-gradient(180deg, mix($body-bg, $color, 15%), $color) repeat-x;
} @else {
fill: $color;
}
}
resources/scss/core/mixins/_icon.scss
+15
View File
@@ -0,0 +1,15 @@
@mixin icon-variant($bg, $color) {
color: $color;
background-color: $bg;
}
@mixin icon-outline-variant($border-width, $color) {
color: saturate(darken($color, 14%), 5);
border: $border-width solid transparentize(lighten($color, 10%), .5);
}
@mixin icon-font($content, $font-size) {
content: $content;
font-family: $icon-font-family;
font-size: $font-size;
}
resources/scss/core/mixins/_link.scss
+11
View File
@@ -0,0 +1,11 @@
@mixin link-underline-variant($color) {
color: $color;
&:after {
background-color: $color;
}
&:hover {
color: darken($color, 10%);
}
}
resources/scss/core/mixins/_modals.scss
+23
View File
@@ -0,0 +1,23 @@
@mixin modal-variant($background) {
.modal-title {
color: color-yiq($background);
}
.modal-header,
.modal-footer {
border-color: rgba(color-yiq($background), .075);
}
.modal-content {
background-color: $background;
color: color-yiq($background);
.heading {
color: color-yiq($background);
}
}
.close {
&>span:not(.sr-only) {
color: $white;
}
}
}
resources/scss/core/mixins/_popover.scss
+36
View File
@@ -0,0 +1,36 @@
@mixin popover-variant($background) {
background-color: $background;
.popover-header {
background-color: $background;
color: color-yiq($background);
}
.popover-body {
color: color-yiq($background);
}
.popover-header{
border-color: rgba(color-yiq($background), .2);
}
&.bs-popover-top {
.arrow::after {
border-top-color: $background;
}
}
&.bs-popover-right {
.arrow::after {
border-right-color: $background;
}
}
&.bs-popover-bottom {
.arrow::after {
border-bottom-color: $background;
}
}
&.bs-popover-left {
.arrow::after {
border-left-color: $background;
}
}
}