Merge pull request #2285 from kiva/blue-header-footer-themes

Blue header theme for corporate campaign pages.
kiva · Oct 21, 2020 · 4e4a614 · 4e4a614
2 parents 4bb836f + 2643d11
commit 4e4a614
Show file tree

Hide file tree

Showing 5 changed files with 67 additions and 4 deletions.
diff --git a/.storybook/stories/TheFooter.stories.js b/.storybook/stories/TheFooter.stories.js
@@ -1,4 +1,10 @@
-import { lightFooter, iwdFooterTheme, wrdFooterTheme } from '@/util/siteThemes';
+import {
+	lightFooter,
+	iwdFooterTheme,
+	wrdFooterTheme,
+	fifteenYearFooterTheme,
+	blueFooter
+} from '@/util/siteThemes';
 import StoryRouter from 'storybook-vue-router';
 
 import TheFooter from '@/components/WwwFrame/TheFooter';
@@ -19,6 +25,8 @@ export default {
 					'lightFooter':lightFooter,
 					'iwdFooterTheme': iwdFooterTheme,
 					'wrdFooterTheme': wrdFooterTheme,
+					'fifteenYearFooterTheme': fifteenYearFooterTheme,
+					'blueFooter': blueFooter,
 				},
 			}
 		},

diff --git a/.storybook/stories/TheHeader.stories.js b/.storybook/stories/TheHeader.stories.js
@@ -2,7 +2,13 @@ import Vue from 'vue'
 import StoryRouter from 'storybook-vue-router';
 import apolloStoryMixin from '../mixins/apollo-story-mixin';
 import kvAuth0StoryMixin from '../mixins/kv-auth0-story-mixin';
-import { lightHeader, iwdHeaderTheme, wrdHeaderTheme } from '@/util/siteThemes';
+import {
+	lightHeader,
+	iwdHeaderTheme,
+	wrdHeaderTheme,
+	fifteenYearHeaderTheme,
+	blueHeader
+} from '@/util/siteThemes';
 
 import TheHeader from '@/components/WwwFrame/TheHeader';
 
@@ -50,6 +56,8 @@ export default {
 					'lightHeader':lightHeader,
 					'iwdHeaderTheme': iwdHeaderTheme,
 					'wrdHeaderTheme': wrdHeaderTheme,
+					'fifteenYearHeaderTheme': fifteenYearHeaderTheme,
+					'blueHeader': blueHeader,
 				},
 			}
 		},

diff --git a/.storybook/stories/WwwPage.stories.js b/.storybook/stories/WwwPage.stories.js
@@ -2,7 +2,18 @@ import StoryRouter from 'storybook-vue-router';
 import apolloStoryMixin from '../mixins/apollo-story-mixin';
 import kvAuth0StoryMixin from '../mixins/kv-auth0-story-mixin';
 
-import { lightHeader, lightFooter, iwdHeaderTheme, iwdFooterTheme, wrdHeaderTheme, wrdFooterTheme } from '@/util/siteThemes';
+import {
+	lightHeader,
+	lightFooter,
+	iwdHeaderTheme,
+	iwdFooterTheme,
+	wrdHeaderTheme,
+	wrdFooterTheme,
+	fifteenYearHeaderTheme,
+	fifteenYearFooterTheme,
+	blueHeader,
+	blueFooter
+} from '@/util/siteThemes';
 
 import WwwPage from '@/components/WwwFrame/WwwPage';
 
@@ -25,6 +36,8 @@ export default {
 					'lightHeader':lightHeader,
 					'iwdHeaderTheme': iwdHeaderTheme,
 					'wrdHeaderTheme': wrdHeaderTheme,
+					'fifteenYearHeaderTheme': fifteenYearHeaderTheme,
+					'blueHeader': blueHeader,
 				},
 			}
 		},
@@ -36,6 +49,8 @@ export default {
 					'lightFooter':lightFooter,
 					'iwdFooterTheme': iwdFooterTheme,
 					'wrdFooterTheme': wrdFooterTheme,
+					'fifteenYearFooterTheme': fifteenYearFooterTheme,
+					'blueFooter': blueFooter,
 				},
 				selected: 'none'
 			}

diff --git a/.storybook/stories/WwwPageMinimal.stories.js b/.storybook/stories/WwwPageMinimal.stories.js
@@ -2,7 +2,18 @@ import StoryRouter from 'storybook-vue-router';
 import apolloStoryMixin from '../mixins/apollo-story-mixin';
 import kvAuth0StoryMixin from '../mixins/kv-auth0-story-mixin';
 
-import { lightHeader, lightFooter, iwdHeaderTheme, iwdFooterTheme, wrdHeaderTheme, wrdFooterTheme } from '@/util/siteThemes';
+import {
+	lightHeader,
+	lightFooter,
+	iwdHeaderTheme,
+	iwdFooterTheme,
+	wrdHeaderTheme,
+	wrdFooterTheme,
+	fifteenYearHeaderTheme,
+	fifteenYearFooterTheme,
+	blueHeader,
+	blueFooter
+} from '@/util/siteThemes';
 
 import WwwPageMinimal from '@/components/WwwFrame/WwwPageMinimal';
 
@@ -23,6 +34,8 @@ export default {
 					'lightHeader':lightHeader,
 					'iwdHeaderTheme': iwdHeaderTheme,
 					'wrdHeaderTheme': wrdHeaderTheme,
+					'fifteenYearHeaderTheme': fifteenYearHeaderTheme,
+					'blueHeader': blueHeader,
 				},
 			}
 		},
@@ -34,6 +47,8 @@ export default {
 					'lightFooter':lightFooter,
 					'iwdFooterTheme': iwdFooterTheme,
 					'wrdFooterTheme': wrdFooterTheme,
+					'fifteenYearFooterTheme': fifteenYearFooterTheme,
+					'blueFooter': blueFooter,
 				},
 			}
 		},

diff --git a/src/util/siteThemes.js b/src/util/siteThemes.js
@@ -16,6 +16,23 @@ export const lightFooter = {
 	separatorColor: '#8ccb8c'
 };
 
+export const blueHeader = {
+	themeKey: 'blueHeader',
+	backgroundColor: '#005CC4',
+	logoColor: '#fff',
+	linkColor: '#fff',
+	linkHoverColor: '#0b70e2',
+	separatorColor: '#0b70e2',
+};
+
+export const blueFooter = {
+	themeKey: 'blueFooter',
+	backgroundColor: '#005CC4',
+	textColor: '#fff',
+	linkColor: '#ededed',
+	separatorColor: '#0b70e2'
+};
+
 export const iwdHeaderTheme = {
 	themeKey: 'IWD',
 	backgroundColor: '#fff',