From 1f5283d5488050022dd626b4490def30cb57b2c2 Mon Sep 17 00:00:00 2001 From: Dominik Pschenitschni Date: Mon, 18 Oct 2021 14:17:34 +0200 Subject: [PATCH] feat: rework style imports --- src/App.vue | 4 +++ src/main.ts | 2 -- src/styles/{utilities => }/animations.scss | 0 src/styles/components/_all.scss | 25 ------------------ src/styles/components/_index.scss | 26 +++++++++++++++++++ .../base/{_all.scss => _index.scss} | 3 +-- src/styles/components/{base => }/tooltip.scss | 0 src/styles/{theme => }/fonts.scss | 0 src/styles/global.scss | 18 +++++++++++++ src/styles/theme/_all.scss | 11 -------- src/styles/theme/_index.scss | 11 ++++++++ src/styles/theme/theme.scss | 15 ----------- src/styles/theme/variables-derived.scss | 2 -- src/styles/{utilities => }/transitions.scss | 0 src/styles/utilities/_all.scss | 2 -- src/styles/variables/_index.scss | 8 +++++- src/styles/variables/variables.scss | 2 -- src/styles/vikunja.scss | 3 --- 18 files changed, 67 insertions(+), 65 deletions(-) rename src/styles/{utilities => }/animations.scss (100%) delete mode 100644 src/styles/components/_all.scss create mode 100644 src/styles/components/_index.scss rename src/styles/components/base/{_all.scss => _index.scss} (60%) rename src/styles/components/{base => }/tooltip.scss (100%) rename src/styles/{theme => }/fonts.scss (100%) create mode 100644 src/styles/global.scss delete mode 100644 src/styles/theme/_all.scss create mode 100644 src/styles/theme/_index.scss delete mode 100644 src/styles/theme/variables-derived.scss rename src/styles/{utilities => }/transitions.scss (100%) delete mode 100644 src/styles/utilities/_all.scss delete mode 100644 src/styles/vikunja.scss diff --git a/src/App.vue b/src/App.vue index d2690c26..6c0f399f 100644 --- a/src/App.vue +++ b/src/App.vue @@ -117,3 +117,7 @@ export default defineComponent({ }, }) + + \ No newline at end of file diff --git a/src/main.ts b/src/main.ts index dba5ebb8..3e68dd1c 100644 --- a/src/main.ts +++ b/src/main.ts @@ -23,8 +23,6 @@ import {formatDate, formatDateShort, formatDateLong, formatDateSince} from '@/he // @ts-ignore import {VERSION} from './version.json' -// Add CSS -import './styles/vikunja.scss' // Notifications import Notifications from '@kyvg/vue3-notification' diff --git a/src/styles/utilities/animations.scss b/src/styles/animations.scss similarity index 100% rename from src/styles/utilities/animations.scss rename to src/styles/animations.scss diff --git a/src/styles/components/_all.scss b/src/styles/components/_all.scss deleted file mode 100644 index 2b4c19f4..00000000 --- a/src/styles/components/_all.scss +++ /dev/null @@ -1,25 +0,0 @@ -@import 'base/all'; - -@import 'attachments'; -@import 'gantt'; -@import 'labels'; -@import 'list'; -@import 'reminders'; -@import 'switch-view'; -@import 'task'; -@import 'taskRelations'; -@import 'tasks'; -@import 'teams'; -@import 'migrator'; -@import 'comments'; -@import 'table-view'; -@import 'kanban'; -@import 'list-backgrounds'; -@import 'color-picker'; -@import 'namespaces'; -@import 'legal'; -@import 'keyboard-shortcuts'; -@import 'api-config'; -@import 'datepicker'; -@import 'notifications'; -@import 'quick-actions'; diff --git a/src/styles/components/_index.scss b/src/styles/components/_index.scss new file mode 100644 index 00000000..b8aa1e71 --- /dev/null +++ b/src/styles/components/_index.scss @@ -0,0 +1,26 @@ +@import "base"; + +@import "attachments"; +@import "gantt"; +@import "tooltip"; +@import "labels"; +@import "list"; +@import "reminders"; +@import "switch-view"; +@import "task"; +@import "taskRelations"; +@import "tasks"; +@import "teams"; +@import "migrator"; +@import "comments"; +@import "table-view"; +@import "kanban"; +@import "list-backgrounds"; +@import "color-picker"; +@import "namespaces"; +@import "legal"; +@import "keyboard-shortcuts"; +@import "api-config"; +@import "datepicker"; +@import "notifications"; +@import "quick-actions"; \ No newline at end of file diff --git a/src/styles/components/base/_all.scss b/src/styles/components/base/_index.scss similarity index 60% rename from src/styles/components/base/_all.scss rename to src/styles/components/base/_index.scss index 6f087b6e..477b27eb 100644 --- a/src/styles/components/base/_all.scss +++ b/src/styles/components/base/_index.scss @@ -1,5 +1,4 @@ @import 'card'; @import 'fancycheckbox'; @import 'multiselect'; -@import 'scrollbars'; -@import 'tooltip'; +@import 'scrollbars'; \ No newline at end of file diff --git a/src/styles/components/base/tooltip.scss b/src/styles/components/tooltip.scss similarity index 100% rename from src/styles/components/base/tooltip.scss rename to src/styles/components/tooltip.scss diff --git a/src/styles/theme/fonts.scss b/src/styles/fonts.scss similarity index 100% rename from src/styles/theme/fonts.scss rename to src/styles/fonts.scss diff --git a/src/styles/global.scss b/src/styles/global.scss new file mode 100644 index 00000000..166c1fd6 --- /dev/null +++ b/src/styles/global.scss @@ -0,0 +1,18 @@ +@import "fonts"; + +@import "transitions"; +@import "animations"; + +// This imports are the same as in "bulma/bulma.sass" +// with the expeption of the bulma utilities. +// They are imported globally in variables.scss +@import "bulma/sass/base/_all"; +@import "bulma/sass/elements/_all"; +@import "bulma/sass/form/_all"; +@import "bulma/sass/components/_all"; +@import "bulma/sass/grid/_all"; +@import "bulma/sass/helpers/_all"; +@import "bulma/sass/layout/_all"; + +@import "theme"; +@import "components"; diff --git a/src/styles/theme/_all.scss b/src/styles/theme/_all.scss deleted file mode 100644 index 1afff997..00000000 --- a/src/styles/theme/_all.scss +++ /dev/null @@ -1,11 +0,0 @@ -@import 'theme'; - -@import 'content'; -@import 'form'; -@import 'link-share'; -@import 'loading'; -@import 'navigation'; -@import 'notification'; -@import 'offline'; -@import 'update-notification'; -@import 'background'; diff --git a/src/styles/theme/_index.scss b/src/styles/theme/_index.scss new file mode 100644 index 00000000..9f8d234e --- /dev/null +++ b/src/styles/theme/_index.scss @@ -0,0 +1,11 @@ +@import "theme"; + +@import "content"; +@import "form"; +@import "link-share"; +@import "loading"; +@import "navigation"; +@import "notification"; +@import "offline"; +@import "update-notification"; +@import "background"; \ No newline at end of file diff --git a/src/styles/theme/theme.scss b/src/styles/theme/theme.scss index 2004f44f..b92f1214 100644 --- a/src/styles/theme/theme.scss +++ b/src/styles/theme/theme.scss @@ -1,18 +1,3 @@ -// bulma utilities are imported in variables.scss -@import "bulma/sass/utilities/_all"; -@import "bulma/sass/base/_all"; -@import "bulma/sass/elements/_all"; -@import "bulma/sass/form/_all"; -@import "bulma/sass/components/_all"; -@import "bulma/sass/grid/_all"; -@import "bulma/sass/helpers/_all"; -@import "bulma/sass/layout/_all"; - - -@import "fonts"; - -@import "variables-derived"; - *, *:hover, *:active, diff --git a/src/styles/theme/variables-derived.scss b/src/styles/theme/variables-derived.scss deleted file mode 100644 index ee5c640f..00000000 --- a/src/styles/theme/variables-derived.scss +++ /dev/null @@ -1,2 +0,0 @@ -// Variables that are derived from bulma variables need to be included after them -$mobile: math.div($tablet, 2); diff --git a/src/styles/utilities/transitions.scss b/src/styles/transitions.scss similarity index 100% rename from src/styles/utilities/transitions.scss rename to src/styles/transitions.scss diff --git a/src/styles/utilities/_all.scss b/src/styles/utilities/_all.scss deleted file mode 100644 index 2d0c76de..00000000 --- a/src/styles/utilities/_all.scss +++ /dev/null @@ -1,2 +0,0 @@ -@import 'animations'; -@import 'transitions'; diff --git a/src/styles/variables/_index.scss b/src/styles/variables/_index.scss index ba1a8247..bef2ad0c 100644 --- a/src/styles/variables/_index.scss +++ b/src/styles/variables/_index.scss @@ -3,4 +3,10 @@ @import "variables"; // the default values get overwritten by the definitions above -@import "bulma/sass/utilities/_all"; \ No newline at end of file +@import "bulma/sass/utilities/_all"; + +// this is needed so that the shared form variables are globally defined aswell +@import "bulma/sass/form/shared"; + +// since $tablet is defined by bulma we can just define it after importing the utilities +$mobile: math.div($tablet, 2); \ No newline at end of file diff --git a/src/styles/variables/variables.scss b/src/styles/variables/variables.scss index 33f34407..678a2fa6 100644 --- a/src/styles/variables/variables.scss +++ b/src/styles/variables/variables.scss @@ -1,5 +1,3 @@ -@import 'colors'; - $white: #fff; $black: hsl(0, 0%, 4%) !default; $orange: #ff851b; diff --git a/src/styles/vikunja.scss b/src/styles/vikunja.scss deleted file mode 100644 index 44898538..00000000 --- a/src/styles/vikunja.scss +++ /dev/null @@ -1,3 +0,0 @@ -@import 'theme/all'; -@import 'utilities/all'; -@import 'components/all';