diff options
author | Derick Montague <derick.montague@ibm.com> | 2020-04-14 01:01:19 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-05-05 08:21:52 +0300 |
commit | 408657262515e015a2964aafb8a1c76fb5259699 (patch) | |
tree | e498979c96b0d4627f550aa915a08b637f7031a7 /src/components | |
parent | 7e8f3a5278198760f6ddb480689b5abd16fafc1f (diff) | |
download | webui-vue-408657262515e015a2964aafb8a1c76fb5259699.tar.xz |
Update Sass architecture to require helper imports
- Restructuring file strucure to support single file components use of
Sass variables when imported into vuepress.
- Creating a scalable file structure using Sass best practices
Tested by building and testing both the vue web ui and the
the documentation application.
Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Iddcefbf305c8dac978ee24e903df33b609e395e3
Diffstat (limited to 'src/components')
-rw-r--r-- | src/components/AppHeader/AppHeader.vue | 2 | ||||
-rw-r--r-- | src/components/AppNavigation/AppNavigation.vue | 2 | ||||
-rw-r--r-- | src/components/Global/PageContainer.vue | 2 | ||||
-rw-r--r-- | src/components/Global/PageSection.vue | 2 | ||||
-rw-r--r-- | src/components/Global/PageTitle.vue | 2 | ||||
-rw-r--r-- | src/components/Global/StatusIcon.vue | 2 | ||||
-rw-r--r-- | src/components/Global/TableFilter.vue | 2 | ||||
-rw-r--r-- | src/components/Global/TableToolbar.vue | 2 |
8 files changed, 16 insertions, 0 deletions
diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue index d937293d..2ad208fc 100644 --- a/src/components/AppHeader/AppHeader.vue +++ b/src/components/AppHeader/AppHeader.vue @@ -141,6 +141,8 @@ export default { </script> <style lang="scss" scoped> +@import 'src/assets/styles/helpers'; + .link-skip-nav { position: absolute; top: -60px; diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue index 2f56c28f..7a8389fb 100644 --- a/src/components/AppNavigation/AppNavigation.vue +++ b/src/components/AppNavigation/AppNavigation.vue @@ -142,6 +142,8 @@ export default { </script> <style scoped lang="scss"> +@import 'src/assets/styles/helpers'; + svg { fill: currentColor; height: 1.2rem; diff --git a/src/components/Global/PageContainer.vue b/src/components/Global/PageContainer.vue index 8396bd5b..91bf346f 100644 --- a/src/components/Global/PageContainer.vue +++ b/src/components/Global/PageContainer.vue @@ -11,6 +11,8 @@ export default { </script> <style lang="scss" scoped> +@import 'src/assets/styles/helpers'; + main { width: 100%; height: 100%; diff --git a/src/components/Global/PageSection.vue b/src/components/Global/PageSection.vue index dcd85e61..58119986 100644 --- a/src/components/Global/PageSection.vue +++ b/src/components/Global/PageSection.vue @@ -18,6 +18,8 @@ export default { </script> <style lang="scss" scoped> +@import 'src/assets/styles/helpers'; + .page-section { margin-bottom: $spacer * 2; } diff --git a/src/components/Global/PageTitle.vue b/src/components/Global/PageTitle.vue index 17c08849..c4a97754 100644 --- a/src/components/Global/PageTitle.vue +++ b/src/components/Global/PageTitle.vue @@ -23,6 +23,8 @@ export default { </script> <style lang="scss" scoped> +@import 'src/assets/styles/helpers'; + .page-title { margin-bottom: $spacer * 2; } diff --git a/src/components/Global/StatusIcon.vue b/src/components/Global/StatusIcon.vue index 11143212..655d57b0 100644 --- a/src/components/Global/StatusIcon.vue +++ b/src/components/Global/StatusIcon.vue @@ -30,6 +30,8 @@ export default { </script> <style lang="scss" scoped> +@import 'src/assets/styles/helpers'; + .status-icon { vertical-align: text-bottom; &.success { diff --git a/src/components/Global/TableFilter.vue b/src/components/Global/TableFilter.vue index d466d4e0..8d264fb4 100644 --- a/src/components/Global/TableFilter.vue +++ b/src/components/Global/TableFilter.vue @@ -84,6 +84,8 @@ export default { </script> <style lang="scss" scoped> +@import 'src/assets/styles/helpers'; + p { font-size: 1.2rem; } diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue index 331f0076..b49b3154 100644 --- a/src/components/Global/TableToolbar.vue +++ b/src/components/Global/TableToolbar.vue @@ -67,6 +67,8 @@ export default { </script> <style lang="scss" scoped> +@import 'src/assets/styles/helpers'; + $toolbar-height: 46px; .toolbar-container { |