112 lines
2.8 KiB
SCSS
112 lines
2.8 KiB
SCSS
// Import Bootstrap functions, variables, and mixins
|
|
@import "../bootstrap-5.2.3/scss/functions";
|
|
@import "../bootstrap-5.2.3/scss/variables";
|
|
@import "../bootstrap-5.2.3/scss/mixins";
|
|
|
|
// Definir colores personalizados
|
|
$custom-colors: (
|
|
"rosa-lavanda": #ede3ec,
|
|
"lila-rosa": #d8c4d6,
|
|
"verde-ceniza": #84a79c,
|
|
"verde-oscuro": #105742,
|
|
"verde-pino": #4c8071,
|
|
"verde-pasto": #84a816,
|
|
"verde-claro": #d6e3da,
|
|
"verde-gris": #cadcd4,
|
|
"verde-claro-2": #b3cdb9,
|
|
"verde-claro-3": #d3e0d7,
|
|
"lila-claro": #905c8b,
|
|
"morado-claro": #915c8c,
|
|
"gris": #959595,
|
|
);
|
|
|
|
// Colores base principales
|
|
$primary: #72256b;
|
|
$secondary: #8db497;
|
|
|
|
// Variaciones del primario - Escala de azules
|
|
$primary-light: lighten($primary, 15%);
|
|
$primary-lighter: lighten($primary, 30%);
|
|
$primary-dark: darken($primary, 15%);
|
|
$primary-darker: darken($primary, 25%);
|
|
|
|
// Variaciones del secundario - Coral
|
|
$secondary-light: lighten($secondary, 10%);
|
|
$secondary-lighter: lighten($secondary, 20%);
|
|
$secondary-dark: darken($secondary, 10%);
|
|
$secondary-darker: darken($secondary, 20%);
|
|
|
|
// Colores adicionales - Armonía azul/gris
|
|
$success: #6cc04a; // Teal (mantenido para consistencia)
|
|
$danger: #d4451d; // Rojo vibrante pero sofisticado
|
|
$warning: #ff671b; // Ámbar en lugar de dorado
|
|
$info: #3498db; // Azul brillante
|
|
$light: #5b6770; // Gris muy claro
|
|
$dark: #2c3e50; // Azul noche
|
|
$muted: #7f8c8d; // Gris neutro
|
|
$white: #ffffff; // Blanco puro
|
|
|
|
// Combinar colores en $theme-colors
|
|
$theme-colors: map-merge(
|
|
(
|
|
"primary": $primary,
|
|
"primary-light": $primary-light,
|
|
"primary-lighter": $primary-lighter,
|
|
"primary-dark": $primary-dark,
|
|
"primary-darker": $primary-darker,
|
|
"secondary": $secondary,
|
|
"secondary-light": $secondary-light,
|
|
"secondary-lighter": $secondary-lighter,
|
|
"secondary-dark": $secondary-dark,
|
|
"secondary-darker": $secondary-darker,
|
|
"success": $success,
|
|
"danger": $danger,
|
|
"warning": $warning,
|
|
"info": $info,
|
|
"light": $light,
|
|
"dark": $dark,
|
|
"muted": $muted,
|
|
"white": $white,
|
|
),
|
|
$custom-colors
|
|
);
|
|
|
|
// Configuración de fondo y texto
|
|
$body-bg: $white;
|
|
$body-color: #515151; // Azul/gris oscuro para texto
|
|
|
|
// Configuración de Swiper - Actualizada a azules
|
|
:root {
|
|
--swiper-theme-color: $primary;
|
|
--swiper-navigation-color: $primary;
|
|
--swiper-pagination-color: $primary;
|
|
--swiper-pagination-bullet-inactive-color: map-get($custom-colors, "silver");
|
|
}
|
|
|
|
.swiper {
|
|
&-button-prev,
|
|
&-button-next {
|
|
&:hover {
|
|
color: $primary-dark;
|
|
background: rgba($light, 0.9);
|
|
}
|
|
}
|
|
|
|
&-pagination-bullet-active {
|
|
background: $primary;
|
|
}
|
|
|
|
&-scrollbar-drag {
|
|
background: $primary;
|
|
}
|
|
}
|
|
$container-max-widths: (
|
|
sm: 100%,
|
|
md: 100%,
|
|
lg: 100%,
|
|
xl: 100%,
|
|
xxl: 100%,
|
|
);
|
|
// Import Bootstrap components
|
|
@import "../bootstrap-5.2.3/scss/bootstrap";
|