Commit | Line | Data |
---|---|---|
b8eab696 AE |
1 | button, |
2 | input[type="button"], | |
3 | input[type="reset"], | |
4 | input[type="submit"], | |
5 | .button { | |
6 | background-color: @wcfButtonBackgroundColor; | |
7 | border: 1px solid @wcfButtonBorderColor; | |
8 | border-radius: 3px; | |
9 | color: @wcfButtonColor !important; | |
10 | cursor: pointer; | |
11 | display: inline-block; | |
12 | padding: 5px 10px; | |
13 | transition-duration: .2s; | |
14 | transition-property: background-color, border-color, color; | |
15 | transition-timing-function: linear; | |
16 | ||
17 | .icon { | |
18 | color: @wcfButtonColor; | |
19 | transition: color .2s linear; | |
20 | } | |
21 | ||
22 | &:hover { | |
23 | background-color: @wcfButtonHoverBackgroundColor; | |
24 | border-color: @wcfButtonHoverBorderColor; | |
25 | color: @wcfButtonHoverColor !important; | |
26 | ||
27 | .icon { | |
28 | color: @wcfButtonHoverColor; | |
29 | } | |
30 | } | |
31 | ||
32 | &.small { | |
33 | font-size: .85rem; | |
34 | padding: 4px 7px; | |
35 | } | |
36 | } | |
37 | ||
38 | button.buttonPrimary, | |
39 | input[type="button"].buttonPrimary, | |
40 | input[type="submit"], | |
41 | .button.buttonPrimary { | |
42 | background-color: @wcfButtonPrimaryBackgroundColor; | |
43 | border-color: @wcfButtonPrimaryBorderColor; | |
44 | color: @wcfButtonPrimaryColor !important; | |
45 | ||
46 | .icon { | |
47 | color: @wcfButtonPrimaryColor; | |
48 | } | |
49 | ||
50 | /* @TODO */ | |
51 | &:hover { | |
52 | background-color: @wcfButtonPrimaryBackgroundColor; | |
53 | border-color: @wcfButtonHoverBorderColor; | |
54 | color: @wcfButtonHoverColor; | |
55 | ||
56 | .icon { | |
57 | color: @wcfButtonHoverColor; | |
58 | } | |
59 | } | |
60 | /* @TODO END */ | |
61 | } | |
62 | ||
63 | .buttonList { | |
64 | .inlineList; | |
65 | ||
66 | &.smallButtons .button { | |
67 | font-size: .85rem; | |
68 | padding: 4px 7px; | |
69 | } | |
70 | ||
71 | /* members list */ | |
72 | &.letters { | |
73 | margin-bottom: -10px; | |
74 | ||
75 | > li { | |
76 | flex: 0 0 10%; | |
77 | margin-bottom: 10px; | |
78 | ||
79 | > a { | |
80 | display: block; | |
81 | text-align: center; | |
82 | } | |
83 | } | |
84 | } | |
85 | } | |
86 | ||
87 | .buttonGroupNavigation > ul { | |
88 | .inlineList; | |
89 | } | |
90 | ||
91 | .buttonGroup { | |
92 | .inlineList; | |
93 | ||
94 | > li { | |
95 | &:not(:last-child) { | |
96 | border-right: 1px solid @wcfButtonHoverBackgroundColor; | |
97 | margin-right: 0; | |
98 | } | |
99 | ||
100 | &:first-child .button { | |
101 | border-bottom-left-radius: 3px; | |
102 | border-top-left-radius: 3px; | |
103 | } | |
104 | ||
105 | &:last-child .button { | |
106 | border-bottom-right-radius: 3px; | |
107 | border-top-right-radius: 3px; | |
108 | } | |
109 | ||
110 | .button { | |
111 | border-radius: 0; | |
112 | } | |
113 | } | |
114 | } |