1 // ----------------------------------------------------------------------------
3 // ----------------------------------------------------------------------------
4 .agora-label-styling() {
13 .agora-inline-label-styling() {
16 vertical-align: bottom;
21 & > input[type="checkbox"],
22 & > input[type="radio"] {
27 border: 1px solid @colorFieldBorder;
32 // ----------------------------------------------------------------------------
34 // ----------------------------------------------------------------------------
36 .button-colors(@bgColor) {
40 // The inner bottom bevel should match the active background color.
41 box-shadow: 0 1px rgba(0, 0, 0, 10%), inset 0 -3px rgba(0, 0, 0, 20%);
42 border-bottom-color: mix(#000, @bgColor, 20%);
46 box-shadow:inset 0px 0px 0px 3px rgba(0, 0, 0, 20%);
47 // box-shadow: 0 1px rgba(0, 0, 0, 10%), inset 0 -3px rgba(0, 0, 0, 20%);
49 // remove outline in Firefox
51 border-color: transparent;
58 // lessphp doesn't implement shade (https://github.com/leafo/lessphp/issues/528);
59 // it passes it through, then ResourceLoader drops it.
60 // background: shade(@bgColor, 20%);
61 background: mix(#000, @bgColor, 20%);
66 .button-colors(@bgColor) when (lightness(@bgColor) >= 70%) {
67 color: @colorButtonText;
68 border: 1px solid @colorGray12;
71 color: @colorDisabledText;
73 // make sure disabled buttons don't have hover and active states
82 .button-colors(@bgColor) when (lightness(@bgColor) < 70%) {
84 // border of the same color as background so that light background and
85 // dark background buttons are the same height (only top and bottom to
86 // make box shadow on hover cover the corners too)
87 border: 1px solid @bgColor;
90 text-shadow: 0 1px rgba(0, 0, 0, .1);
93 background: @colorGray12;
94 border-color: @colorGray12;
96 // make sure disabled buttons don't have hover and active states
105 .button-colors-quiet(@textColor) {
106 // Quiet buttons all start gray, and reveal
107 // constructive/progressive/destructive color on hover and active.
108 color: @colorButtonText;
112 // lessphp doesn't implement tint, see above
113 // color: tint(@textColor, 20%);
114 color: mix(#fff, @textColor, 20%);
119 // lessphp doesn't implement shade, see above
120 // color: shade(@textColor, 20%);
121 color: mix(#000, @textColor, 20%);
125 color: @colorDisabledText;