wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

refs 6486 commit

This commit is contained in:
Pablo Natek 2024-02-26 15:00:14 +01:00
parent af4927167f
commit b092c5af6d
5 changed files with 167 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/ui/CardDescriptor.vue
View File

@ -171,6 +171,7 @@ const emit = defineEmits(['onFetch']);
<style lang="scss">
.body {
background-color: var(--vn-gray);
.text-h5 {
padding-top: 5px;
padding-bottom: 5px;
@ -207,6 +208,8 @@ const emit = defineEmits(['onFetch']);
</style>
<style lang="scss" scoped>
.body {
}
.title {
overflow: hidden;
text-overflow: ellipsis;
@ -221,8 +224,6 @@ const emit = defineEmits(['onFetch']);
margin-bottom: 15px;
}
.list-box {
background-color: var(--vn-gray);
.q-item__label {
color: var(--vn-label);
}

21
src/css/app.scss
View File

@ -1,5 +1,6 @@
// app global css in SCSS form
@import './icons.scss';
@import './quasar.variables.scss';
a {
text-decoration: none;
@ -24,26 +25,6 @@ select:-webkit-autofill {
background-clip: text !important;
}
body.body--light {
.q-header .q-toolbar {
background-color: $white;
color: #555;
}
--vn-text: #000000;
--vn-gray: #f5f5f5;
--vn-label: #5f5f5f;
--vn-dark: white;
--vn-light-gray: #e7e3e3;
}
body.body--dark {
--vn-text: #ffffff;
--vn-gray: #313131;
--vn-label: #a8a8a8;
--vn-dark: #292929;
--vn-light-gray: #424242;
}
.bg-vn-dark {
background-color: var(--vn-dark);
}

28
src/css/quasar.variables.scss
View File

@ -13,15 +13,16 @@
// Tip: Use the "Theme Builder" on Quasar's documentation website.
$primary: #ec8916;
$secondary: #26a69a;
$accent: #9c27b0;
$secondary: $primary;
$white: #fff;
$positive: #21ba45;
$negative: #c10015;
$info: #31ccec;
$warning: #f2c037;
$vnColor: #8ebb27;
$dark: #3c3b3b;
// Pendiente de cuadrar con la base de datos
$success: $positive;
@ -40,11 +41,30 @@ $alert: $negative;
background-color: $negative;
}
body.body--light {
background-color: white;
.q-header .q-toolbar {
color: black;
}
--vn-text: black;
--vn-gray: #eeeeee;
--vn-label: #5f5f5f;
--vn-dark: #eeeeee;
--vn-light-gray: #e7e3e3;
}
body.body--dark {
background-color: #222;
--vn-text: white;
--vn-gray: #3c3b3b;
--vn-label: #a8a8a8;
--vn-dark: #3c3b3b;
--vn-light-gray: #424242;
}
$color-spacer-light: rgba(255, 255, 255, 0.12);
$color-spacer: rgba(255, 255, 255, 0.3);
$border-thin-light: 1px solid $color-spacer-light;
$dark-shadow-color: #000;
$dark: #292929;
$dark-shadow-color: black;
$layout-shadow-dark: 0 0 10px 2px rgba(0, 0, 0, 0.2), 0 0px 10px rgba(0, 0, 0, 0.24);
$spacing-md: 16px;

136
src/css/test.scss Normal file
View File

@ -0,0 +1,136 @@
$font-size: 11pt;
$menu-width: 256px;
$topbar-height: 56px;
$mobile-width: 800px;
$float-spacing: 20px;
// Width
$width-xs: 400px;
$width-sm: 544px;
$width-md: 800px;
$width-lg: 1280px;
$width-xl: 1600px;
// Spacing
$spacing-xs: 4px;
$spacing-sm: 8px;
$spacing-md: 16px;
$spacing-lg: 32px;
$spacing-xl: 70px;
// Light theme
/* $color-primary: #f7931e;
$color-secondary: $color-primary;
$color-font: #222;
$color-font-light: #555;
$color-font-secondary: #9b9b9b;
$color-font-dark: white;
$color-font-link: #005a9a;
$color-font-bg: rgba(0, 0, 0, .7);
$color-font-bg-marginal: rgba(0, 0, 0, .4);
$color-font-bg-dark: rgba(255, 255, 255, .7);
$color-font-bg-dark-marginal: rgba(255, 255, 255, .4);
$color-header: #3d3d3d;
$color-menu-header: #3d3d3d;
$color-bg: #e5e5e5;
$color-bg-dark: #3d3d3d;
$color-active: #3d3d3d;
$color-active-font: $color-font-dark;
$color-bg-panel: white;
$color-main: $color-primary;
$color-marginal: #ccc;
$color-success: #a3d131;
$color-notice: #32b1ce;
$color-alert: #f42121;
$color-button: $color-secondary;
$color-spacer: rgba(0, 0, 0, .3);
$color-spacer-light: rgba(0, 0, 0, .12);
$color-input-underline: rgba(0, 0, 0, .12);
$color-input-underline-hover: rgba(0, 0, 0, .6);
$color-shadow: rgba(0, 0, 0, .2);
$color-hightlight: rgba(0, 0, 0, .05);
$color-hover-cd: rgba(0, 0, 0, .1);
$color-hover-dc: .7;
$color-disabled: .6;
$color-primary-medium: lighten($color-primary, 20%);
$color-primary-light: lighten($color-primary, 35%);
$color-font-link-medium: lighten($color-font-link, 20%);
$color-font-link-light: lighten($color-font-link, 35%);
$color-main-medium: lighten($color-main, 20%);
$color-main-light: lighten($color-main, 35%);
$color-success-medium: lighten($color-success, 20%);
$color-success-light: lighten($color-success, 35%);
$color-notice-medium: lighten($color-notice, 20%);
$color-notice-light: lighten($color-notice, 35%);
$color-alert-medium: lighten($color-alert, 20%);
$color-alert-light: lighten($color-alert, 35%); */
/**/
// Dark theme
$color-primary: #ec8916;
$color-secondary: $color-primary;
$color-font: #eee;
$color-font-light: #aaa;
$color-font-secondary: #777;
$color-font-dark: white;
$color-font-link: #66bfff;
$color-font-bg: rgba(0, 0, 0, 0.8);
$color-font-bg-marginal: rgba(255, 255, 255, 0.4);
$color-font-bg-dark: rgba(255, 255, 255, 0.7);
$color-font-bg-dark-marginal: rgba(255, 255, 255, 0.4);
$color-header: #3d3d3d;
$color-menu-header: #3d3d3d;
$color-bg: #222;
$color-bg-dark: #222;
$color-active: #666;
$color-active-font: white;
$color-bg-panel: #3c3b3b;
$color-main: $color-primary;
$color-marginal: #222;
$color-success: #a3d131;
$color-notice: #32b1ce;
$color-alert: #fa3939;
$color-pink: #ff99cc;
$color-yellow: #ffff00;
$color-button: $color-secondary;
$color-spacer: rgba(255, 255, 255, 0.3);
$color-spacer-light: rgba(255, 255, 255, 0.12);
$color-input-underline: rgba(255, 255, 255, 0.12);
$color-input-underline-hover: rgba(255, 255, 255, 0.6);
$color-shadow: rgba(0, 0, 0, 0.2);
$color-border: rgba(0, 0, 0, 0.3);
$color-hightlight: rgba(255, 255, 255, 0.15);
$color-hover-cd: rgba(255, 255, 255, 0.1);
$color-hover-dc: 0.7;
$color-disabled: 0.6;
$color-primary-medium: lighten($color-primary, 20%);
$color-primary-light: lighten($color-primary, 35%);
$color-font-link-medium: lighten($color-font-link, 20%);
$color-font-link-light: lighten($color-font-link, 35%);
$color-main-medium: lighten($color-main, 20%);
$color-main-light: lighten($color-main, 35%);
$color-success-medium: lighten($color-success, 20%);
$color-success-light: lighten($color-success, 35%);
$color-notice-medium: lighten($color-notice, 20%);
$color-notice-light: lighten($color-notice, 35%);
$color-alert-medium: lighten($color-alert, 20%);
$color-alert-light: lighten($color-alert, 35%);
/**/
// Border
$border-thin: 1px solid $color-border;
$border-thin-light: 1px solid $color-spacer-light;
$border: 2px solid $color-border;
$shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3);

3
src/pages/Claim/Card/ClaimDescriptor.vue
View File

@ -189,6 +189,9 @@ onMounted(async () => {
</CardDescriptor>
</template>
<style scoped>
body {
background-color: var(--vn-gray);
}
.q-item__label {
margin-top: 0;
}