.THEME_NAME { .md-button-toggle, &.md-button-toggle { .md-button { &:after { width: 1px; position: absolute; top: 0; bottom: 0; left: 0; content: " "; } } .md-toggle { color: #{'BACKGROUND-CONTRAST-600'}; background-color: #{'BACKGROUND-COLOR-500'}; &:hover { background-color: #{'BACKGROUND-COLOR-600'}; } + .md-toggle:after { background-color: #{'BACKGROUND-COLOR-600'}; } } &.md-primary .md-toggle { color: #{'PRIMARY-CONTRAST'}; background-color: #{'PRIMARY-COLOR'}; &:hover { background-color: #{'PRIMARY-COLOR-600'}; } + .md-toggle:after { background-color: #{'PRIMARY-COLOR-700'}; } } &.md-accent .md-toggle { color: #{'ACCENT-CONTRAST'}; background-color: #{'ACCENT-COLOR'}; &:hover { background-color: #{'ACCENT-COLOR-600'}; } + .md-toggle:after { background-color: #{'ACCENT-COLOR-700'}; } } &.md-warn .md-toggle { color: #{'WARN-CONTRAST'}; background-color: #{'WARN-COLOR'}; &:hover { background-color: #{'WARN-COLOR-600'}; } + .md-toggle:after { background-color: #{'WARN-COLOR-700'}; } } } }