Skip to content

Commit 69d51a0

Browse files
author
Yahav UbuntuDevVM
committed
fixing less functions in less file: fomantic/Fomantic-UI#737 
1 parent dea9dde commit 69d51a0

File tree

4 files changed

+149
-58
lines changed

4 files changed

+149
-58
lines changed

‎semantic/src/definitions/elements/button.less

Lines changed: 21 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/*!
2-
* # Semantic UI - Button
3-
* http://github.com/semantic-org/semantic-ui/
2+
* # Fomantic-UI - Button
3+
* http://github.com/fomantic/Fomantic-UI/
44
*
55
*
66
* Released under the MIT license
@@ -185,7 +185,7 @@
185185
Disabled
186186
--------------------*/
187187

188-
.ui.buttons .disabled.button,
188+
.ui.buttons .disabled.button:not(.basic),
189189
.ui.disabled.button,
190190
.ui.button:disabled,
191191
.ui.disabled.button:hover,
@@ -656,6 +656,10 @@
656656
.ui.compact.labeled.icon.button {
657657
padding: @compactVerticalPadding (@compactHorizontalPadding + @labeledIconWidth) ( @compactVerticalPadding + @shadowOffset );
658658
}
659+
.ui.compact.labeled.icon.buttons .button > .icon,
660+
.ui.compact.labeled.icon.button > .icon {
661+
padding: @compactVerticalPadding 0 @compactVerticalPadding 0;
662+
}
659663

660664
/*-------------------
661665
Sizes
@@ -1388,6 +1392,10 @@ each(@colors, {
13881392
@la: @colors[@@color][lightActive];
13891393
@lt: @colors[@@color][lightText];
13901394
@ls: @colors[@@color][lightShadow];
1395+
@ty: @colors[@@color][tertiary];
1396+
@tyh: @colors[@@color][tertiaryHover];
1397+
@tyf: @colors[@@color][tertiaryFocus];
1398+
@tya: @colors[@@color][tertiaryActive];
13911399
@isDark: @colors[@@color][isDark];
13921400
@isVeryDark: @colors[@@color][isVeryDark];
13931401

@@ -1566,20 +1574,12 @@ each(@colors, {
15661574
.ui.tertiary.@{color}.button {
15671575
background: transparent;
15681576

1569-
.tertiaryButtonColor() when (@isVeryDark) {
1570-
@_tertiaryButtonColor: lighten(@c, 20%);
1571-
}
1572-
.tertiaryButtonColor() when not (@isVeryDark) {
1573-
@_tertiaryButtonColor: saturate(@c, 20%);
1574-
}
1575-
.tertiaryButtonColor();
1576-
15771577
& when (@tertiaryWithUnderline = true) {
1578-
box-shadow: inset 0 -@tertiaryLineHeight 0 @_tertiaryButtonColor ;
1578+
box-shadow: inset 0 -@tertiaryLineHeight 0 @ty;
15791579
}
15801580

15811581
& when (@tertiaryWithOverline = true) {
1582-
box-shadow: inset 0 @tertiaryLineHeight 0 @_tertiaryButtonColor ;
1582+
box-shadow: inset 0 @tertiaryLineHeight 0 @ty;
15831583
}
15841584

15851585
& when (@tertiaryWithUnderline = false) and (@tertiaryWithOverline = false){
@@ -1592,67 +1592,38 @@ each(@colors, {
15921592
.ui.tertiary.@{color}.buttons button:hover,
15931593
.ui.tertiary.@{color}.button:hover {
15941594

1595-
.tertiaryButtonColorHover() when (@isVeryDark) {
1596-
@_tertiaryButtonColorHover: lighten(@h, 40%);
1597-
}
1598-
.tertiaryButtonColorHover() when not (@isVeryDark) {
1599-
@_tertiaryButtonColorHover: desaturate(@h, 20%);
1600-
}
1601-
.tertiaryButtonColorHover();
1602-
16031595
& when (@tertiaryHoverWithUnderline = true) {
1604-
box-shadow: inset 0 -@tertiaryLineHeight 0 @_tertiaryButtonColorHover ;
1596+
box-shadow: inset 0 -@tertiaryLineHeight 0 @tyh;
16051597
}
16061598

16071599
& when (@tertiaryHoverWithOverline = true) {
1608-
box-shadow: inset 0 @tertiaryLineHeight 0 @_tertiaryButtonColorHover ;
1600+
box-shadow: inset 0 @tertiaryLineHeight 0 @tyh;
16091601
}
16101602

16111603
& when (@tertiaryHoverWithUnderline = false) and (@tertiaryHoverWithOverline = false) {
16121604
box-shadow: none ;
16131605
}
16141606

1615-
& when (@isVeryDark) {
1616-
color: lighten(@h, 20%) ;
1617-
}
1618-
1619-
& when not (@isVeryDark) {
1620-
color: @_tertiaryButtonColorHover ;
1621-
}
1607+
color: @tyh;
16221608
}
16231609

16241610
.ui.tertiary.@{color}.buttons .button:focus,
16251611
.ui.tertiary.@{color}.buttons .tertiary.button:focus,
16261612
.ui.tertiary.@{color}.button:focus {
16271613

1628-
1629-
.tertiaryButtonColorFocus() when (@isVeryDark) {
1630-
@_tertiaryButtonColorFocus: lighten(@f, 40%);
1631-
}
1632-
.tertiaryButtonColorFocus() when not (@isVeryDark) {
1633-
@_tertiaryButtonColorFocus: desaturate(@f, 20%);
1634-
}
1635-
.tertiaryButtonColorFocus();
1636-
16371614
& when (@tertiaryFocusWithUnderline = true) {
1638-
box-shadow: inset 0 -@tertiaryLineHeight 0 @_tertiaryButtonColorFocus ;
1615+
box-shadow: inset 0 -@tertiaryLineHeight 0 @tyf;
16391616
}
16401617

16411618
& when (@tertiaryFocusWithOverline = true) {
1642-
box-shadow: inset 0 @tertiaryLineHeight 0 @_tertiaryButtonColorFocus ;
1619+
box-shadow: inset 0 @tertiaryLineHeight 0 @tyf;
16431620
}
16441621

16451622
& when (@tertiaryFocusWithUnderline = false) and (@tertiaryFocusWithOverline = false) {
16461623
box-shadow: none;
16471624
}
16481625

1649-
& when (@isVeryDark) {
1650-
color: lighten(@f, 20%) ;
1651-
}
1652-
1653-
& when not (@isVeryDark) {
1654-
color: @_tertiaryButtonColorFocus ;
1655-
}
1626+
color: @tyf;
16561627
}
16571628

16581629
.ui.tertiary.@{color}.buttons .active.button,
@@ -1662,20 +1633,12 @@ each(@colors, {
16621633
.ui.tertiary.@{color}.buttons .tertiary.button:active,
16631634
.ui.tertiary.@{color}.button:active {
16641635

1665-
.tertiaryButtonColorActive() when (@isVeryDark) {
1666-
@_tertiaryButtonColorActive: lighten(@a, 20%);
1667-
}
1668-
.tertiaryButtonColorActive() when not (@isVeryDark) {
1669-
@_tertiaryButtonColorActive: saturate(@a, 20%);
1670-
}
1671-
.tertiaryButtonColorActive();
1672-
16731636
& when (@tertiaryActiveWithUnderline = true) {
1674-
box-shadow: inset 0 -@tertiaryLineHeight 0 @_tertiaryButtonColorActive ;
1637+
box-shadow: inset 0 -@tertiaryLineHeight 0 @tya;
16751638
}
16761639

16771640
& when (@tertiaryActiveWithOverline = true) {
1678-
box-shadow: inset 0 @tertiaryLineHeight 0 @_tertiaryButtonColorActive ;
1641+
box-shadow: inset 0 @tertiaryLineHeight 0 @tya;
16791642
}
16801643

16811644
& when (@tertiaryActiveWithUnderline = false) and (@tertiaryActiveWithOverline = false) {

‎semantic/src/themes/default/globals/colors.less

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,10 @@
2626
lightHover : @lightPrimaryColorHover;
2727
ribbon : @primaryRibbonShadow;
2828
invertedRibbon : @primaryInvertedRibbonShadow;
29+
tertiary : @primaryTertiaryColor;
30+
tertiaryHover : @primaryTertiaryColorHover;
31+
tertiaryFocus : @primaryTertiaryColorFocus;
32+
tertiaryActive : @primaryTertiaryColorActive;
2933
isDark : false;
3034
isVeryDark : false;
3135
};
@@ -52,6 +56,10 @@
5256
lightHover : @lightSecondaryColorHover;
5357
ribbon : @secondaryRibbonShadow;
5458
invertedRibbon : @secondaryInvertedRibbonShadow;
59+
tertiary : @secondaryTertiaryColor;
60+
tertiaryHover : @secondaryTertiaryColorHover;
61+
tertiaryFocus : @secondaryTertiaryColorFocus;
62+
tertiaryActive : @secondaryTertiaryColorActive;
5563
isDark : false;
5664
isVeryDark : false;
5765
};
@@ -78,6 +86,10 @@
7886
lightHover : @lightRedHover;
7987
ribbon : @redRibbonShadow;
8088
invertedRibbon : @redInvertedRibbonShadow;
89+
tertiary : @redTertiaryColor;
90+
tertiaryHover : @redTertiaryColorHover;
91+
tertiaryFocus : @redTertiaryColorFocus;
92+
tertiaryActive : @redTertiaryColorActive;
8193
isDark : false;
8294
isVeryDark : false;
8395
};
@@ -104,6 +116,10 @@
104116
lightHover : @lightOrangeHover;
105117
ribbon : @orangeRibbonShadow;
106118
invertedRibbon : @orangeInvertedRibbonShadow;
119+
tertiary : @orangeTertiaryColor;
120+
tertiaryHover : @orangeTertiaryColorHover;
121+
tertiaryFocus : @orangeTertiaryColorFocus;
122+
tertiaryActive : @orangeTertiaryColorActive;
107123
isDark : false;
108124
isVeryDark : false;
109125
};
@@ -130,6 +146,10 @@
130146
lightHover : @lightYellowHover;
131147
ribbon : @yellowRibbonShadow;
132148
invertedRibbon : @yellowInvertedRibbonShadow;
149+
tertiary : @yellowTertiaryColor;
150+
tertiaryHover : @yellowTertiaryColorHover;
151+
tertiaryFocus : @yellowTertiaryColorFocus;
152+
tertiaryActive : @yellowTertiaryColorActive;
133153
isDark : false;
134154
isVeryDark : false;
135155
};
@@ -156,6 +176,10 @@
156176
lightHover : @lightOliveHover;
157177
ribbon : @oliveRibbonShadow;
158178
invertedRibbon : @oliveInvertedRibbonShadow;
179+
tertiary : @oliveTertiaryColor;
180+
tertiaryHover : @oliveTertiaryColorHover;
181+
tertiaryFocus : @oliveTertiaryColorFocus;
182+
tertiaryActive : @oliveTertiaryColorActive;
159183
isDark : false;
160184
isVeryDark : false;
161185
};
@@ -182,6 +206,10 @@
182206
lightHover : @lightGreenHover;
183207
ribbon : @greenRibbonShadow;
184208
invertedRibbon : @greenInvertedRibbonShadow;
209+
tertiary : @greenTertiaryColor;
210+
tertiaryHover : @greenTertiaryColorHover;
211+
tertiaryFocus : @greenTertiaryColorFocus;
212+
tertiaryActive : @greenTertiaryColorActive;
185213
isDark : false;
186214
isVeryDark : false;
187215
};
@@ -208,6 +236,10 @@
208236
lightHover : @lightTealHover;
209237
ribbon : @tealRibbonShadow;
210238
invertedRibbon : @tealInvertedRibbonShadow;
239+
tertiary : @tealTertiaryColor;
240+
tertiaryHover : @tealTertiaryColorHover;
241+
tertiaryFocus : @tealTertiaryColorFocus;
242+
tertiaryActive : @tealTertiaryColorActive;
211243
isDark : false;
212244
isVeryDark : false;
213245
};
@@ -234,6 +266,10 @@
234266
lightHover : @lightBlueHover;
235267
ribbon : @blueRibbonShadow;
236268
invertedRibbon : @blueInvertedRibbonShadow;
269+
tertiary : @blueTertiaryColor;
270+
tertiaryHover : @blueTertiaryColorHover;
271+
tertiaryFocus : @blueTertiaryColorFocus;
272+
tertiaryActive : @blueTertiaryColorActive;
237273
isDark : false;
238274
isVeryDark : false;
239275
};
@@ -260,6 +296,10 @@
260296
lightHover : @lightVioletHover;
261297
ribbon : @violetRibbonShadow;
262298
invertedRibbon : @violetInvertedRibbonShadow;
299+
tertiary : @violetTertiaryColor;
300+
tertiaryHover : @violetTertiaryColorHover;
301+
tertiaryFocus : @violetTertiaryColorFocus;
302+
tertiaryActive : @violetTertiaryColorActive;
263303
isDark : false;
264304
isVeryDark : false;
265305
};
@@ -286,6 +326,10 @@
286326
lightHover : @lightPurpleHover;
287327
ribbon : @purpleRibbonShadow;
288328
invertedRibbon : @purpleInvertedRibbonShadow;
329+
tertiary : @purpleTertiaryColor;
330+
tertiaryHover : @purpleTertiaryColorHover;
331+
tertiaryFocus : @purpleTertiaryColorFocus;
332+
tertiaryActive : @purpleTertiaryColorActive;
289333
isDark : false;
290334
isVeryDark : false;
291335
};
@@ -312,6 +356,10 @@
312356
lightHover : @lightPinkHover;
313357
ribbon : @pinkRibbonShadow;
314358
invertedRibbon : @pinkInvertedRibbonShadow;
359+
tertiary : @pinkTertiaryColor;
360+
tertiaryHover : @pinkTertiaryColorHover;
361+
tertiaryFocus : @pinkTertiaryColorFocus;
362+
tertiaryActive : @pinkTertiaryColorActive;
315363
isDark : false;
316364
isVeryDark : false;
317365
};
@@ -338,6 +386,10 @@
338386
lightHover : @lightBrownHover;
339387
ribbon : @brownRibbonShadow;
340388
invertedRibbon : @brownInvertedRibbonShadow;
389+
tertiary : @brownTertiaryColor;
390+
tertiaryHover : @brownTertiaryColorHover;
391+
tertiaryFocus : @brownTertiaryColorFocus;
392+
tertiaryActive : @brownTertiaryColorActive;
341393
isDark : false;
342394
isVeryDark : false;
343395
};
@@ -364,6 +416,10 @@
364416
lightHover : @lightGreyHover;
365417
ribbon : @greyRibbonShadow;
366418
invertedRibbon : @greyInvertedRibbonShadow;
419+
tertiary : @greyTertiaryColor;
420+
tertiaryHover : @greyTertiaryColorHover;
421+
tertiaryFocus : @greyTertiaryColorFocus;
422+
tertiaryActive : @greyTertiaryColorActive;
367423
isDark : true;
368424
isVeryDark : false;
369425
};
@@ -390,6 +446,10 @@
390446
lightHover : @lightBlackHover;
391447
ribbon : @blackRibbonShadow;
392448
invertedRibbon : @blackInvertedRibbonShadow;
449+
tertiary : @blackTertiaryColor;
450+
tertiaryHover : @blackTertiaryColorHover;
451+
tertiaryFocus : @blackTertiaryColorFocus;
452+
tertiaryActive : @blackTertiaryColorActive;
393453
isDark : true;
394454
isVeryDark : true;
395455
};

‎semantic/src/themes/default/globals/site.variables

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1234,3 +1234,65 @@
12341234
@whiteActive : darken(@white, 5);
12351235
@offWhiteActive : darken(@offWhite, 5);
12361236
@darkWhiteActive : darken(@darkWhite, 5);
1237+
1238+
/*--- Tertiary ---*/
1239+
@primaryTertiaryColor : saturate(@primaryColor, 20%);
1240+
@primaryTertiaryColorHover : desaturate(@primaryColorHover, 20%);
1241+
@primaryTertiaryColorFocus : desaturate(@primaryColorFocus, 20%);
1242+
@primaryTertiaryColorActive : saturate(@primaryColorActive, 20%);
1243+
@secondaryTertiaryColor : saturate(@secondaryColor, 20%);
1244+
@secondaryTertiaryColorHover : desaturate(@secondaryColorHover, 20%);
1245+
@secondaryTertiaryColorFocus : desaturate(@secondaryColorFocus, 20%);
1246+
@secondaryTertiaryColorActive: saturate(@secondaryColorActive, 20%);
1247+
@redTertiaryColor : saturate(@red, 20%);
1248+
@redTertiaryColorHover : desaturate(@redHover, 20%);
1249+
@redTertiaryColorFocus : desaturate(@redFocus, 20%);
1250+
@redTertiaryColorActive : saturate(@redActive, 20%);
1251+
@orangeTertiaryColor : saturate(@orange, 20%);
1252+
@orangeTertiaryColorHover : desaturate(@orangeHover, 20%);
1253+
@orangeTertiaryColorFocus : desaturate(@orangeFocus, 20%);
1254+
@orangeTertiaryColorActive : saturate(@orangeActive, 20%);
1255+
@yellowTertiaryColor : saturate(@yellow, 20%);
1256+
@yellowTertiaryColorHover : desaturate(@yellowHover, 20%);
1257+
@yellowTertiaryColorFocus : desaturate(@yellowFocus, 20%);
1258+
@yellowTertiaryColorActive : saturate(@yellowActive, 20%);
1259+
@oliveTertiaryColor : saturate(@olive, 20%);
1260+
@oliveTertiaryColorHover : desaturate(@oliveHover, 20%);
1261+
@oliveTertiaryColorFocus : desaturate(@oliveFocus, 20%);
1262+
@oliveTertiaryColorActive : saturate(@oliveActive, 20%);
1263+
@greenTertiaryColor : saturate(@green, 20%);
1264+
@greenTertiaryColorHover : desaturate(@greenHover, 20%);
1265+
@greenTertiaryColorFocus : desaturate(@greenFocus, 20%);
1266+
@greenTertiaryColorActive : saturate(@greenActive, 20%);
1267+
@tealTertiaryColor : saturate(@teal, 20%);
1268+
@tealTertiaryColorHover : desaturate(@tealHover, 20%);
1269+
@tealTertiaryColorFocus : desaturate(@tealFocus, 20%);
1270+
@tealTertiaryColorActive : saturate(@tealActive, 20%);
1271+
@blueTertiaryColor : saturate(@blue, 20%);
1272+
@blueTertiaryColorHover : desaturate(@blueHover, 20%);
1273+
@blueTertiaryColorFocus : desaturate(@blueFocus, 20%);
1274+
@blueTertiaryColorActive : saturate(@blueActive, 20%);
1275+
@violetTertiaryColor : saturate(@violet, 20%);
1276+
@violetTertiaryColorHover : desaturate(@violetHover, 20%);
1277+
@violetTertiaryColorFocus : desaturate(@violetFocus, 20%);
1278+
@violetTertiaryColorActive : saturate(@violetActive, 20%);
1279+
@purpleTertiaryColor : saturate(@purple, 20%);
1280+
@purpleTertiaryColorHover : desaturate(@purpleHover, 20%);
1281+
@purpleTertiaryColorFocus : desaturate(@purpleFocus, 20%);
1282+
@purpleTertiaryColorActive : saturate(@purpleActive, 20%);
1283+
@pinkTertiaryColor : saturate(@pink, 20%);
1284+
@pinkTertiaryColorHover : desaturate(@pinkHover, 20%);
1285+
@pinkTertiaryColorFocus : desaturate(@pinkFocus, 20%);
1286+
@pinkTertiaryColorActive : saturate(@pinkActive, 20%);
1287+
@brownTertiaryColor : saturate(@brown, 20%);
1288+
@brownTertiaryColorHover : desaturate(@brownHover, 20%);
1289+
@brownTertiaryColorFocus : desaturate(@brownFocus, 20%);
1290+
@brownTertiaryColorActive : saturate(@brownActive, 20%);
1291+
@greyTertiaryColor : saturate(@grey, 20%);
1292+
@greyTertiaryColorHover : desaturate(@greyHover, 20%);
1293+
@greyTertiaryColorFocus : desaturate(@greyFocus, 20%);
1294+
@greyTertiaryColorActive : saturate(@greyActive, 20%);
1295+
@blackTertiaryColor : lighten(@black, 20%);
1296+
@blackTertiaryColorHover : lighten(@blackHover, 40%);
1297+
@blackTertiaryColorFocus : lighten(@blackFocus, 40%);
1298+
@blackTertiaryColorActive : lighten(@blackActive, 20%);

0 commit comments

Comments
 (0)