itcn/backend_parkir
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Penambahan FrontEnd All-New-Manufacture

Browse Source
This commit is contained in:
pand03
2026-01-31 14:23:04 +07:00
parent 1b2e320b2b
commit 4feb21dcbc
2891 changed files with 426849 additions and 135 deletions
Download Patch File Download Diff File Expand all files Collapse all files

358
public/scss/components/ui/_ui-alert.scss Normal file
View File

@@ -0,0 +1,358 @@
.alert{
border-radius: $radius;
padding: .75rem 0;
padding-#{$dlab-pos-left}: 1.2rem;
padding-#{$dlab-pos-right}: 2.5rem;
p{
line-height:1.5;
}
}
.alert-square{
border-radius:0!important;
}
.alert-rounded{
border-radius: 1.875rem;
}
// Basic Alert
.alert-primary{
background: var(--rgba-primary-1);
border-color: var(--rgba-primary-1);
color: var(--primary);
}
.alert-secondary{
background: $secondary-opacity;
border-color: $secondary-opacity;
color: $secondary;
@at-root [data-theme-version="dark"] & {
color:$white;
}
}
.alert-success{
background: $success-opacity;
border-color: $success-opacity;
color: darken($success,25%);
@at-root [data-theme-version="dark"] & {
color: $success;
}
}
.alert-warning{
background: $warning-opacity;
border-color: $warning-opacity;
color: darken($warning,25%);
}
.alert-danger{
background: $danger-opacity;
border-color: $danger-opacity;
color: $danger;
}
.alert-info{
background: $info-opacity;
border-color: $info-opacity;
color: $info;
}
.alert-dark{
background: $dark-opacity;
border-color: $dark-opacity;
color: $dark;
@at-root [data-theme-version="dark"] & {
color:$white;
}
}
.alert-light{
background: $light;
border-color: $light;
color: $dark;
@at-root [data-theme-version="dark"] & {
background: rgba($light, 0.3);
border-color: rgba($light, 0.3);
color: $white;
}
}
// Alert alt
.alert-alt.alert-primary{
border-#{$dlab-pos-left}: 0.25rem solid var(--primary);
}
.alert-alt.alert-secondary{
border-#{$dlab-pos-left}: 0.25rem solid $secondary;
}
.alert-alt.alert-success{
border-#{$dlab-pos-left}: 0.25rem solid $success
}
.alert-alt.alert-warning{
border-#{$dlab-pos-left}: 0.25rem solid $warning;
}
.alert-alt.alert-danger{
border-#{$dlab-pos-left}: 0.25rem solid $danger;
}
.alert-alt.alert-info{
border-#{$dlab-pos-left}: 0.25rem solid $info;
}
.alert-alt.alert-dark{
border-#{$dlab-pos-left}: 0.25rem solid $dark;
}
.alert-alt.alert-light{
border-#{$dlab-pos-left}: 0.25rem solid darken($light,15%);
}
// Alert alt with solid color
.alert-alt.alert-primary.solid{
border-#{$dlab-pos-left}: 0.25rem solid var(--primary-dark)!important;
}
.alert-alt.alert-secondary.solid{
border-#{$dlab-pos-left}: 0.25rem solid darken($secondary,25%)!important;
}
.alert-alt.alert-success.solid{
border-#{$dlab-pos-left}: 0.25rem solid darken($success, 25%)!important;
}
.alert-alt.alert-warning.solid{
border-#{$dlab-pos-left}: 0.25rem solid darken($warning,25%)!important;
}
.alert-alt.alert-danger.solid{
border-#{$dlab-pos-left}: 0.25rem solid darken($danger,25%)!important;
}
.alert-alt.alert-info.solid{
border-#{$dlab-pos-left}: 0.25rem solid darken($info,25%)!important;
}
.alert-alt.alert-dark.solid{
border-#{$dlab-pos-left}: 0.25rem solid darken($dark,25%)!important;
}
.alert-alt.alert-light.solid{
border-#{$dlab-pos-left}: 0.25rem solid darken($light,25%)!important;
}
//Alert dismissable with solid color
.alert-dismissible.solid:not(.alert-light),
.alert-social{
.btn-close{
color: $white;
opacity: 1;
// &:hover{
// color: $white;
// }
}
}
.alert-dismissible .btn-close{
padding: .85rem 1rem;
}
.alert-icon{
height: 1.25rem;
width: 1.25rem;
margin-#{$dlab-pos-right}: .25rem;
}
// Alert Solid
.alert.alert-primary.solid{
background: var(--primary);
color: $white;
border-color: var(--primary);
}
.alert.alert-secondary.solid{
background: $secondary;
color: $white;
border-color: $secondary;
}
.alert.alert-success.solid{
background: $success;
color: $white;
border-color: $success;
}
.alert.alert-warning.solid{
background: $warning;
color: $white;
border-color: $warning;
}
.alert.alert-danger.solid{
background: $danger;
color: $white;
border-color: $danger;
}
.alert.alert-info.solid{
background: $info;
color: $white;
border-color: $info;
}
.alert.alert-dark.solid{
background: $dark;
color: $white;
border-color: $dark;
}
.alert.alert-light.solid{
background: $light;
color: $dark;
border-color: $light;
}
// Alert right icon
.alert-right-icon{
&>span i{
font-size: 1.125rem;
margin-#{$dlab-pos-right}: 0.3125rem;
}
.close{
i{
font-size: 1rem;
}
}
}
// Alert Outline
.alert.alert-outline-primary{
background: transparent;
color: var(--primary);
border-color: var(--primary);
}
.alert.alert-outline-secondary{
background: transparent;
color: $body-color;
border-color: $secondary;
}
.alert.alert-outline-success{
background: transparent;
color: $success;
border-color: $success;
}
.alert.alert-outline-info{
background: transparent;
color: $info;
border-color: $info;
}
.alert.alert-outline-warning{
background: transparent;
color: $warning;
border-color: $warning;
}
.alert.alert-outline-danger{
background: transparent;
color: $danger;
border-color: $danger;
}
.alert.alert-outline-dark{
background: transparent;
color: $body-color;
border-color: $dark;
}
.alert.alert-outline-light{
background: transparent;
color: $dark;
border-color: $light;
}
// Alert Social
.alert-social{
color: $white;
.alert-social-icon{
align-self: center;
margin-#{$dlab-pos-right}: 0.9375rem;
i{
font-size: 2.625rem;
}
}
&.facebook{
background-color: $facebook;
}
&.twitter{
background-color: $twitter;
}
&.linkedin{
background-color: $linkedin;
}
&.google-plus{
background-color: $google-plus;
}
.close{
&:hover{
opacity: 1!important;
color: $white!important;
}
}
}
// Alert left icon
.left-icon-big{
.alert-left-icon-big{
align-self: center;
margin-#{$dlab-pos-right}: 0.9375rem;
i{
font-size: 2.1875rem;
line-height: 1;
}
}
}
div:where(.swal2-container) div:where(.swal2-popup){
background: var(--card)!important;
color: var(--text-dark)!important;
}
.alert-dismissible .btn-close{
top: 0;
#{$dlab-pos-right}: 0;
#{$dlab-pos-left}: auto;
}