UNPKG

@uiw/react-button-group

Version:

ButtonGroup component

uiwjs.github.io

uiwjs/uiw

58 lines (56 loc) • 1.59 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
@w-btn:~ "w-btn"; .@{w-btn} { &-group > & { border-radius: 0; box-shadow: inset 1px 0 0 0 rgba(0, 0, 0, 0.17), inset -1px 0 0 0 rgba(0, 0, 0, 0.17), inset -1px 0px 0 0 rgba(0, 0, 0, 0.17); } &-group > &:last-child { border-radius: 0 3px 3px 0; } &-group > &:first-child { border-radius: 3px 0 0 3px; } &-group > &:first-child:last-child { border-radius: 3px !important; } &-group > &:focus { z-index: 2; } &-group { .@{w-btn} + .@{w-btn} { margin-left: -1px !important; } .@{w-btn}:not(.@{w-btn}-light):first-child { box-shadow: inset -1px 0px 0 0 rgba(0, 0, 0, 0.17) !important; } .@{w-btn}:not(.@{w-btn}-light):last-child { box-shadow: inset 1px 0 0 0 rgba(0, 0, 0, 0.17), inset 0px 0 0 0 rgba(0, 0, 0, 0.17); } .@{w-btn}-light { box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.17), inset 1px -1px 0 0 rgba(0, 0, 0, 0.17), inset -1px 0px 0 0 rgba(0, 0, 0, 0.17) !important; } } &-group-vertical { .@{w-btn}:not(.@{w-btn}-light) { box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.17), inset 0 1px 0 0 rgba(0, 0, 0, 0.17) !important; } .@{w-btn}:not(.@{w-btn}-light):first-child { box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.17), inset 0 0 0 0 rgba(0, 0, 0, 0.17) !important; } } &-group-vertical .@{w-btn} { width: 100%; & + .@{w-btn} { margin-left: 0 !important; margin-top: -1px !important; } &:last-child { border-radius: 0 0 3px 3px; } &:first-child { border-radius: 3px 3px 0 0; } } }