commit 408657262515e015a2964aafb8a1c76fb5259699
author Derick Montague <derick.montague@ibm.com> Mon Apr 13 17:01:19 2020 -0500
committer Derick Montague <derick.montague@ibm.com> Tue May 05 05:21:52 2020 +0000
tree e498979c96b0d4627f550aa915a08b637f7031a7
parent 7e8f3a5278198760f6ddb480689b5abd16fafc1f

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

src/components/AppHeader/AppHeader.vue

diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue
index d937293..2ad208f 100644
--- a/src/components/AppHeader/AppHeader.vue
+++ b/src/components/AppHeader/AppHeader.vue
@@ -141,6 +141,8 @@
 </script>
 
 <style lang="scss" scoped>
+@import 'src/assets/styles/helpers';
+
 .link-skip-nav {
   position: absolute;
   top: -60px;

src/components/AppNavigation/AppNavigation.vue

diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue
index 2f56c28..7a8389f 100644
--- a/src/components/AppNavigation/AppNavigation.vue
+++ b/src/components/AppNavigation/AppNavigation.vue
@@ -142,6 +142,8 @@
 </script>
 
 <style scoped lang="scss">
+@import 'src/assets/styles/helpers';
+
 svg {
   fill: currentColor;
   height: 1.2rem;

src/components/Global/PageContainer.vue

diff --git a/src/components/Global/PageContainer.vue b/src/components/Global/PageContainer.vue
index 8396bd5..91bf346 100644
--- a/src/components/Global/PageContainer.vue
+++ b/src/components/Global/PageContainer.vue
@@ -11,6 +11,8 @@
 </script>
 
 <style lang="scss" scoped>
+@import 'src/assets/styles/helpers';
+
 main {
   width: 100%;
   height: 100%;

src/components/Global/PageSection.vue

diff --git a/src/components/Global/PageSection.vue b/src/components/Global/PageSection.vue
index dcd85e6..5811998 100644
--- a/src/components/Global/PageSection.vue
+++ b/src/components/Global/PageSection.vue
@@ -18,6 +18,8 @@
 </script>
 
 <style lang="scss" scoped>
+@import 'src/assets/styles/helpers';
+
 .page-section {
   margin-bottom: $spacer * 2;
 }

src/components/Global/PageTitle.vue

diff --git a/src/components/Global/PageTitle.vue b/src/components/Global/PageTitle.vue
index 17c0884..c4a9775 100644
--- a/src/components/Global/PageTitle.vue
+++ b/src/components/Global/PageTitle.vue
@@ -23,6 +23,8 @@
 </script>
 
 <style lang="scss" scoped>
+@import 'src/assets/styles/helpers';
+
 .page-title {
   margin-bottom: $spacer * 2;
 }

src/components/Global/StatusIcon.vue

diff --git a/src/components/Global/StatusIcon.vue b/src/components/Global/StatusIcon.vue
index 1114321..655d57b 100644
--- a/src/components/Global/StatusIcon.vue
+++ b/src/components/Global/StatusIcon.vue
@@ -30,6 +30,8 @@
 </script>
 
 <style lang="scss" scoped>
+@import 'src/assets/styles/helpers';
+
 .status-icon {
   vertical-align: text-bottom;
   &.success {

src/components/Global/TableFilter.vue

diff --git a/src/components/Global/TableFilter.vue b/src/components/Global/TableFilter.vue
index d466d4e..8d264fb 100644
--- a/src/components/Global/TableFilter.vue
+++ b/src/components/Global/TableFilter.vue
@@ -84,6 +84,8 @@
 </script>
 
 <style lang="scss" scoped>
+@import 'src/assets/styles/helpers';
+
 p {
   font-size: 1.2rem;
 }

src/components/Global/TableToolbar.vue

diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue
index 331f007..b49b315 100644
--- a/src/components/Global/TableToolbar.vue
+++ b/src/components/Global/TableToolbar.vue
@@ -67,6 +67,8 @@
 </script>
 
 <style lang="scss" scoped>
+@import 'src/assets/styles/helpers';
+
 $toolbar-height: 46px;
 
 .toolbar-container {