Skip to content

Commit

Permalink
fix: AppBar text color now defaults to `rmd-theme-var(text-primary-…
Browse files Browse the repository at this point in the history 
…on-background)`

This should have probably been the default to start with instead of
`initial`. It became more of a problem once I started implementing the
"Dark theme elevation" feature.
  • Loading branch information
@mlaursen
mlaursen committed Jul 12, 2020
1 parent 28ba828 commit 2c3ea5e
Show file tree
Hide file tree
Showing 3 changed files with 5 additions and 5 deletions.
2 changes: 1 addition & 1 deletion packages/app-bar/src/_variables.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -167,7 +167,7 @@ $rmd-app-bar-default-color: if(
/// @type Map
$rmd-app-bar-theme-values: (
background-color: transparent,
color: initial,
color: rmd-theme-var(text-primary-on-background),
primary: $rmd-app-bar-primary-background-color,
on-primary: $rmd-app-bar-primary-color,
secondary: $rmd-app-bar-secondary-background-color,
Expand Down
2 changes: 1 addition & 1 deletion packages/app-bar/src/scssVariables.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export default {
"rmd-app-bar-default-color": "#000",
"rmd-app-bar-theme-values": {
"background-color": "transparent",
color: "initial",
color: "var(--rmd-theme-text-primary-on-background, #212121)",
primary: "var(--rmd-theme-primary, #9c27b0)",
"on-primary": "var(--rmd-theme-on-primary, #000)",
secondary: "var(--rmd-theme-secondary, #f50057)",
Expand Down
6 changes: 3 additions & 3 deletions packages/documentation/src/constants/sassdoc/app-bar.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -260,7 +260,7 @@ const sassdoc: PackageSassDoc = {
code:
"$rmd-theme-primary: $rmd-blue-500;\n$rmd-theme-secondary: $rmd-pink-a-200;\n\n.app-bar {\n @include rmd-app-bar-themes;\n}\n",
compiled:
".app-bar {\n background-color: var(--rmd-app-bar-background-color, transparent);\n color: var(--rmd-app-bar-color, initial);\n}\n.app-bar--primary {\n --rmd-app-bar-background-color: var(\n --rmd-app-bar-primary,\n var(--rmd-theme-primary, #9c27b0)\n );\n --rmd-app-bar-color: var(\n --rmd-app-bar-on-primary,\n var(--rmd-theme-on-primary, #000)\n );\n}\n.app-bar--secondary {\n --rmd-app-bar-background-color: var(\n --rmd-app-bar-secondary,\n var(--rmd-theme-secondary, #f50057)\n );\n --rmd-app-bar-color: var(\n --rmd-app-bar-on-secondary,\n var(--rmd-theme-on-secondary, #000)\n );\n}\n.app-bar--default {\n --rmd-app-bar-background-color: var(\n --rmd-app-bar-default-background-color,\n #f5f5f5\n );\n --rmd-app-bar-color: var(--rmd-app-bar-default-color, #000);\n}\n",
".app-bar {\n background-color: var(--rmd-app-bar-background-color, transparent);\n color: var(\n --rmd-app-bar-color,\n var(--rmd-theme-text-primary-on-background, #212121)\n );\n}\n.app-bar--primary {\n --rmd-app-bar-background-color: var(\n --rmd-app-bar-primary,\n var(--rmd-theme-primary, #9c27b0)\n );\n --rmd-app-bar-color: var(\n --rmd-app-bar-on-primary,\n var(--rmd-theme-on-primary, #000)\n );\n}\n.app-bar--secondary {\n --rmd-app-bar-background-color: var(\n --rmd-app-bar-secondary,\n var(--rmd-theme-secondary, #f50057)\n );\n --rmd-app-bar-color: var(\n --rmd-app-bar-on-secondary,\n var(--rmd-theme-on-secondary, #000)\n );\n}\n.app-bar--default {\n --rmd-app-bar-background-color: var(\n --rmd-app-bar-default-background-color,\n #f5f5f5\n );\n --rmd-app-bar-color: var(--rmd-app-bar-default-color, #000);\n}\n",
type: "scss",
description: "Simple Example",
},
Expand Down Expand Up @@ -872,9 +872,9 @@ const sassdoc: PackageSassDoc = {
packageName: "app-bar",
type: "Map",
value:
"(\n background-color: transparent,\n color: initial,\n primary: $rmd-app-bar-primary-background-color,\n on-primary: $rmd-app-bar-primary-color,\n secondary: $rmd-app-bar-secondary-background-color,\n on-secondary: $rmd-app-bar-secondary-color,\n default-background-color: $rmd-app-bar-default-background-color,\n default-light-background-color: $rmd-app-bar-default-light-theme-background-color,\n default-dark-background-color: $rmd-app-bar-default-dark-theme-background-color,\n default-color: $rmd-app-bar-default-color,\n default-light-color: $rmd-app-bar-default-light-theme-color,\n default-dark-color: $rmd-app-bar-default-dark-theme-color,\n height: $rmd-app-bar-height,\n dense-height: $rmd-app-bar-dense-height,\n prominent-height: $rmd-app-bar-prominent-height,\n prominent-dense-height: $rmd-app-bar-prominent-dense-height,\n)",
"(\n background-color: transparent,\n color: rmd-theme-var(text-primary-on-background),\n primary: $rmd-app-bar-primary-background-color,\n on-primary: $rmd-app-bar-primary-color,\n secondary: $rmd-app-bar-secondary-background-color,\n on-secondary: $rmd-app-bar-secondary-color,\n default-background-color: $rmd-app-bar-default-background-color,\n default-light-background-color: $rmd-app-bar-default-light-theme-background-color,\n default-dark-background-color: $rmd-app-bar-default-dark-theme-background-color,\n default-color: $rmd-app-bar-default-color,\n default-light-color: $rmd-app-bar-default-light-theme-color,\n default-dark-color: $rmd-app-bar-default-dark-theme-color,\n height: $rmd-app-bar-height,\n dense-height: $rmd-app-bar-dense-height,\n prominent-height: $rmd-app-bar-prominent-height,\n prominent-dense-height: $rmd-app-bar-prominent-dense-height,\n)",
compiled:
"(\n background-color: transparent,\n color: initial,\n primary: var(--rmd-theme-primary, #9c27b0),\n on-primary: var(--rmd-theme-on-primary, #000),\n secondary: var(--rmd-theme-secondary, #f50057),\n on-secondary: var(--rmd-theme-on-secondary, #000),\n default-background-color: #f5f5f5,\n default-light-background-color: #f5f5f5,\n default-dark-background-color: #212121,\n default-color: #000,\n default-light-color: #000,\n default-dark-color: #fff,\n height: 3.5rem,\n dense-height: 3rem,\n prominent-height: 7rem,\n prominent-dense-height: 6rem,\n)",
"(\n background-color: transparent,\n color: var(--rmd-theme-text-primary-on-background, #212121),\n primary: var(--rmd-theme-primary, #9c27b0),\n on-primary: var(--rmd-theme-on-primary, #000),\n secondary: var(--rmd-theme-secondary, #f50057),\n on-secondary: var(--rmd-theme-on-secondary, #000),\n default-background-color: #f5f5f5,\n default-light-background-color: #f5f5f5,\n default-dark-background-color: #212121,\n default-color: #000,\n default-light-color: #000,\n default-dark-color: #fff,\n height: 3.5rem,\n dense-height: 3rem,\n prominent-height: 7rem,\n prominent-dense-height: 6rem,\n)",
overridable: true,
},
},
Expand Down

0 comments on commit 2c3ea5e

Please sign in to comment.