Skip to content

Commit 12cec17

Browse files
committed
fix(button): adds subtle active state
1 parent 18ba126 commit 12cec17

File tree

1 file changed

+16
-0
lines changed

1 file changed

+16
-0
lines changed

packages/core/src/components/button/_button.scss

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,10 @@
5454
border-color: $ray-color-blue-70;
5555
}
5656

57+
&:active {
58+
box-shadow: 0 0 0 3px transparentize($ray-color-blue-50, 0.75);
59+
}
60+
5761
&.#{$ray-class-prefix}button--danger {
5862
background-color: $ray-color-red-50;
5963
border-color: $ray-color-red-50;
@@ -68,6 +72,10 @@
6872
border-color: $ray-color-red-70;
6973
}
7074

75+
&:active {
76+
box-shadow: 0 0 0 3px transparentize($ray-color-red-50, 0.75);
77+
}
78+
7179
&[disabled] {
7280
background-color: $ray-color-red-20;
7381
border-color: $ray-color-red-20;
@@ -94,6 +102,10 @@
94102
background-color: $ray-color-blue-20;
95103
}
96104

105+
&:active {
106+
box-shadow: 0 0 0 3px transparentize($ray-color-blue-50, 0.75);
107+
}
108+
97109
&.#{$ray-class-prefix}button--danger {
98110
border-color: $ray-color-red-50;
99111
color: $ray-color-red-50;
@@ -106,6 +118,10 @@
106118
background-color: $ray-color-red-20;
107119
}
108120

121+
&:active {
122+
box-shadow: 0 0 0 3px transparentize($ray-color-red-50, 0.75);
123+
}
124+
109125
&[disabled] {
110126
background-color: $ray-color-white;
111127
border-color: rgba($ray-color-red-50, 0.4);

0 commit comments

Comments
 (0)