70 lines
1.7 KiB
SCSS
70 lines
1.7 KiB
SCSS
@use "@configured-variables" as variables;
|
|
@use "vuetify/lib/styles/tools/_elevation" as mixins_elevation;
|
|
|
|
// 👉 VExpansionPanel
|
|
.v-expansion-panel-title,
|
|
.v-expansion-panel-title--active,
|
|
.v-expansion-panel-title:hover,
|
|
.v-expansion-panel-title:focus,
|
|
.v-expansion-panel-title:focus-visible,
|
|
.v-expansion-panel-title--active:focus,
|
|
.v-expansion-panel-title--active:hover {
|
|
.v-expansion-panel-title__overlay {
|
|
opacity: 0 !important;
|
|
}
|
|
}
|
|
|
|
// 👉 Set Elevation
|
|
.v-expansion-panels {
|
|
.v-expansion-panel {
|
|
.v-expansion-panel__shadow {
|
|
@include mixins_elevation.elevation(3);
|
|
}
|
|
}
|
|
|
|
.v-expansion-panel-text__wrapper {
|
|
color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)) !important;
|
|
font-size: 1rem;
|
|
}
|
|
}
|
|
|
|
// 👉 Timeline outlined variant
|
|
.v-timeline-item {
|
|
.v-timeline-divider__dot {
|
|
.v-timeline-divider__inner-dot {
|
|
box-shadow: 0 0 0 0.1875rem rgb(var(--v-theme-on-surface-variant));
|
|
|
|
@each $color-name in variables.$theme-colors-name {
|
|
|
|
&.bg-#{$color-name} {
|
|
box-shadow: 0 0 0 0.1875rem rgba(var(--v-theme-#{$color-name}), 0.12);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 👉 Timeline Outlined style
|
|
.v-timeline-variant-outlined.v-timeline {
|
|
.v-timeline-divider__dot {
|
|
.v-timeline-divider__inner-dot {
|
|
box-shadow: inset 0 0 0 0.125rem rgb(var(--v-theme-on-surface-variant));
|
|
|
|
@each $color-name in variables.$theme-colors-name {
|
|
background-color: rgb(var(--v-theme-surface)) !important;
|
|
|
|
&.bg-#{$color-name} {
|
|
box-shadow: inset 0 0 0 0.125rem rgb(var(--v-theme-#{$color-name}));
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 👉 v-tab with pill support
|
|
.v-tabs.v-tabs-pill {
|
|
.v-tab.v-btn {
|
|
border-radius: 0.375rem !important;
|
|
}
|
|
}
|