diff --git a/src/components/mdBottomBar/mdBottomBar.scss b/src/components/mdBottomBar/mdBottomBar.scss index 9fecd2f..eff4030 100644 --- a/src/components/mdBottomBar/mdBottomBar.scss +++ b/src/components/mdBottomBar/mdBottomBar.scss @@ -21,6 +21,7 @@ justify-content: space-between; flex: 1; position: relative; + cursor: pointer; border: none; background: transparent; transition: $swift-ease-out; diff --git a/src/components/mdButton/mdButton.theme b/src/components/mdButton/mdButton.theme index ff2b2b3..7462e08 100644 --- a/src/components/mdButton/mdButton.theme +++ b/src/components/mdButton/mdButton.theme @@ -7,7 +7,7 @@ background-color: BACKGROUND-COLOR-50; &:hover, - &:focus { + { background-color: BACKGROUND-COLOR-200; } } @@ -21,8 +21,7 @@ color: ACCENT-CONTRAST; background-color: ACCENT-COLOR; - &:hover, - &:focus { + &:hover { background-color: ACCENT-COLOR-A700; } @@ -30,8 +29,7 @@ color: BACKGROUND-COLOR-900; background-color: BACKGROUND-COLOR-50; - &:hover, - &:focus { + &:hover { background-color: BACKGROUND-COLOR-200; } } @@ -47,8 +45,7 @@ background-color: PRIMARY-COLOR; color: PRIMARY-CONTRAST; - &:hover, - &:focus { + &:hover { background-color: PRIMARY-COLOR-600; } } @@ -67,8 +64,7 @@ background-color: ACCENT-COLOR; color: ACCENT-CONTRAST; - &:hover, - &:focus { + &:hover { background-color: ACCENT-COLOR-A700; } } @@ -88,8 +84,7 @@ background-color: WARN-COLOR; color: WARN-CONTRAST; - &:hover, - &:focus { + &:hover { background-color: WARN-COLOR-600; } } diff --git a/src/components/mdTheme/index.js b/src/components/mdTheme/index.js index a2158ab..ea59065 100644 --- a/src/components/mdTheme/index.js +++ b/src/components/mdTheme/index.js @@ -29,9 +29,20 @@ const createNewStyleElement = (style, name) => { const parseStyle = (style, theme) => { VALID_THEME_TYPE.forEach((type) => { style = style.replace(RegExp('(' + type.toUpperCase() + ')-(COLOR|CONTRAST)-?(A?\\d\\.?\\d*)?', 'g'), (match, paletteType, colorType, hue) => { - let color = palette[theme[type]] || palette[DEFAULT_THEME_COLORS[type]]; + let color; let colorVariant = hue || 500; + if (theme[type]) { + if (typeof theme[type] === 'string') { + color = palette[theme[type]]; + } else { + color = palette[theme[type].color] || palette[DEFAULT_THEME_COLORS[type]]; + colorVariant = hue || theme[type].hue; + } + } else { + color = palette[DEFAULT_THEME_COLORS[type]]; + } + if (colorType === 'COLOR') { let isDefault = palette[theme[type]]; diff --git a/src/main.js b/src/main.js index e36f77f..4b20476 100644 --- a/src/main.js +++ b/src/main.js @@ -12,13 +12,8 @@ Vue.use(MdButton); Vue.use(MdIcon); Vue.use(MdBottomBar); Vue.use(MdTheme, { - default: { - primary: 'blue', - accent: 'red' - }, 'bottom-bar': { - primary: 'teal', - accent: 'red' + primary: 'teal' } });