mirror of
https://github.com/wbbaddons/Tims-Chat.git
synced 2024-10-31 14:10:08 +00:00
97fed09649
- Converted sass to less files - Adapted LESS files to use WCF style variables and less functions - Adapted chat.tpl and jCounter.jQuery.coffee to not include their css files (they are compiled by lessphp as of now)
78 lines
1.9 KiB
Plaintext
78 lines
1.9 KiB
Plaintext
.jCounterContainer {
|
|
display: table;
|
|
|
|
> div {
|
|
display: table-row;
|
|
}
|
|
}
|
|
|
|
.jCounterInput {
|
|
height: 16px;
|
|
width: 100%;
|
|
position: relative;
|
|
z-index: 9999;
|
|
box-sizing: content-box !important;
|
|
.boxShadowInset(0, 1px, rgba(0, 0, 0, .1));
|
|
.transition(~"border .2s linear 0, box-shadow", .2s);
|
|
|
|
&:hover + .jCounter, &:focus + .jCounter {
|
|
border-color: @wcfInputHoverBorderColor;
|
|
}
|
|
|
|
&:focus + .jCounter {
|
|
.boxShadowNative(~"0 0 5px" fade(@wcfInputHoverBorderColor, 50%) ~", inset 0 1px 5px rgba(0, 0, 0, .1)");
|
|
}
|
|
|
|
.formError & + .jCounter {
|
|
border-color: @wcfErrorBackgroundColor;
|
|
.boxShadowNative(~"0 0 5px" fade(@wcfErrorBackgroundColor, 50%) ~", inset 0 1px 5px rgba(0, 0, 0, .1)");
|
|
}
|
|
|
|
.formSuccess & + .jCounter {
|
|
border-color: @wcfSuccessBackgroundColor;
|
|
.boxShadowNative(~"0 0 5px" fade(@wcfSuccessBackgroundColor, 50%) ~", inset 0 1px 5px rgba(0, 0, 0, .1)");
|
|
}
|
|
}
|
|
|
|
.jCounterInput, .jCounter {
|
|
display: table-cell;
|
|
}
|
|
|
|
.jCounter {
|
|
@backgroundColor: darken(@wcfInputBackgroundColor, 15%);
|
|
.textShadow(darken(@wcfInputBackgroundColor, 15%));
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
background-color: @backgroundColor;
|
|
padding: 0 5px 0 10px;
|
|
position: relative;
|
|
z-index: 0 !important;
|
|
.borderRadius(0px, 5px, 5px, 0px);
|
|
border-color: darken(@wcfInputBorderColor, 20%) @wcfInputBorderColor lighten(@wcfInputBorderColor, 10%);
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
width: 30px;
|
|
|
|
.adapt(@backgroundColor, @color) when (lightness(@backgroundColor) - lightness(@color) >= 40%) {
|
|
color: darken(@color, 8%);
|
|
content: "darken";
|
|
}
|
|
|
|
.adapt(@backgroundColor, @color) when (lightness(@backgroundColor) - lightness(@color) < 40%) {
|
|
color: lighten(@color, 8%);
|
|
content: "lighten";
|
|
}
|
|
|
|
&.color-1 {
|
|
.adapt(@backgroundColor, mix(@wcfInputColor, #666, 50%));
|
|
}
|
|
|
|
&.color-2 {
|
|
.adapt(@backgroundColor, mix(@wcfInputColor, #EECC22, 70%));
|
|
}
|
|
|
|
&.color-3 {
|
|
.adapt(@backgroundColor, mix(@wcfInputColor, #D40D12, 30%));
|
|
}
|
|
}
|