honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(docs-infra): move `.filter-button` styles inside `.group-buttons` (#40944) 

Since `.filter-button` elements only appear inside `.group-buttons`
elements, this commit moves `.filter-button` CSS styles inside
`.group-buttons` styles.

PR Close #40944
This commit is contained in:
George Kalpakas 2021-02-23 16:49:18 +02:00 committed by Zach Arend
parent d6f6197728
commit ae50e40216
1 changed files with 21 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
aio/src/styles/2-modules/_buttons.scss
View File

@ -4,8 +4,10 @@ button {
font-family: inherit;
}
.button,
a.button.mat-button {
// This rule overrides some Angular Material styles defined for `.mat-button`
// (hence we include `.mat-button` in the selector).
a.button.mat-button,
.button {
display: inline-block;
@include line-height(32);
padding: 0px 16px;
@ -87,31 +89,28 @@ a.button.mat-button {
}
}
a.filter-button {
width: 140px;
@include font-size(14);
padding: 0px 16px;
margin: 8px;
@include line-height(48);
border: 2px solid $blue;
border-radius: 4px;
&:hover {
background-color: $blue;
color: $white;
}
}
.group-buttons {
margin: 32px auto;
a.selected {
background-color: $blue;
color: $white;
}
// This rule overrides some Angular Material styles defined for `.mat-button`
// (hence we include `.mat-button` in the selector).
a.button.mat-button.filter-button {
width: 140px;
@include font-size(14);
padding: 0px 16px;
margin: 8px;
@include line-height(48);
border: 2px solid $blue;
border-radius: 4px;
@media (max-width: 480px) {
.filter-button.button {
&.selected,
&:hover {
background-color: $blue;
color: $white;
}
@media (max-width: 480px) {
font-size: 1.2rem;
padding: 0;
margin: 0;