diff --git a/src/definitions/collections/grid.less b/src/definitions/collections/grid.less index 119fab57a..16b26a5fa 100755 --- a/src/definitions/collections/grid.less +++ b/src/definitions/collections/grid.less @@ -558,7 +558,7 @@ margin-right: (@relaxedGutterWidth / 2); width: ~"calc(100% - "@relaxedGutterWidth~")"; } -.ui.very.relaxed[class*="vertically divided"].grid > .row:before { +.ui[class*="very relaxed"][class*="vertically divided"].grid > .row:before { margin-left: @veryRelaxedGutterWidth; margin-right: @veryRelaxedGutterWidth; width: ~"calc(100% - "@veryRelaxedGutterWidth~")"; diff --git a/src/definitions/collections/table.less b/src/definitions/collections/table.less index 2ed6fffd4..723882889 100755 --- a/src/definitions/collections/table.less +++ b/src/definitions/collections/table.less @@ -681,17 +681,17 @@ } /* Very Basic */ -.ui.very.basic.table { +.ui[class*="very basic"].table { border: none; } -.ui.very.basic.table:not(.sortable):not(.striped) th, -.ui.very.basic.table:not(.sortable):not(.striped) td { +.ui[class*="very basic"].table:not(.sortable):not(.striped) th, +.ui[class*="very basic"].table:not(.sortable):not(.striped) td { padding: @basicTableCellVerticalPadding @basicTableCellHorizontalPadding; } -.ui.very.basic.table:not(.sortable):not(.striped) thead th { +.ui[class*="very basic"].table:not(.sortable):not(.striped) thead th { padding-top: 0em; } -.ui.very.basic.table:not(.sortable):not(.striped) tbody tr:last-child td { +.ui[class*="very basic"].table:not(.sortable):not(.striped) tbody tr:last-child td { padding-bottom: 0em; } @@ -709,11 +709,11 @@ } /* Very */ -.ui.very.padded.table th { +.ui[class*="very padded"].table th { padding-left: @veryPaddedHorizontalPadding; padding-right: @veryPaddedHorizontalPadding; } -.ui.very.padded.table td { +.ui[class*="very padded"].table td { padding: @veryPaddedVerticalPadding @veryPaddedHorizontalPadding; } @@ -730,11 +730,11 @@ } /* Very */ -.ui.very.compact.table th { +.ui[class*="very compact"].table th { padding-left: @veryCompactHorizontalPadding; padding-right: @veryCompactHorizontalPadding; } -.ui.very.compact.table td { +.ui[class*="very compact"].table td { padding: @veryCompactVerticalPadding @veryCompactHorizontalPadding; } diff --git a/src/definitions/elements/button.less b/src/definitions/elements/button.less index 77e2111da..dda9c6c43 100755 --- a/src/definitions/elements/button.less +++ b/src/definitions/elements/button.less @@ -480,14 +480,14 @@ Floated --------------------*/ -.ui.left.floated.buttons, -.ui.left.floated.button { +.ui[class*="left floated"].buttons, +.ui[class*="left floated"].button { float: left; margin-left: 0em; margin-right: @floatedMargin; } -.ui.right.floated.buttons, -.ui.right.floated.button { +.ui[class*="right floated"].buttons, +.ui[class*="right floated"].button { float: right; margin-right: 0em; margin-left: @floatedMargin; @@ -918,41 +918,41 @@ } /* Bottom Side */ -.bottom.attached.ui.buttons { +[class*="bottom attached"].ui.buttons { margin-top: @attachedOffset; border-radius: 0em 0em @borderRadius @borderRadius; } -.bottom.attached.ui.buttons .button:first-child { +[class*="bottom attached"].ui.buttons .button:first-child { border-radius: 0em 0em 0em @borderRadius; } -.bottom.attached.ui.buttons .button:last-child { +[class*="bottom attached"].ui.buttons .button:last-child { border-radius: 0em 0em @borderRadius 0em; } /* Left Side */ -.left.attached.ui.buttons { +[class*="left attached"].ui.buttons { margin-left: @attachedOffset; border-radius: 0em @borderRadius @borderRadius 0em; } -.left.attached.ui.buttons .button:first-child { +[class*="left attached"].ui.buttons .button:first-child { margin-left: @attachedOffset; border-radius: 0em @borderRadius 0em 0em; } -.left.attached.ui.buttons .button:last-child { +[class*="left attached"].ui.buttons .button:last-child { margin-left: @attachedOffset; border-radius: 0em 0em @borderRadius 0em; } /* Right Side */ -.right.attached.ui.buttons, -.right.attached.ui.buttons .button { +[class*="right attached"].ui.buttons, +[class*="right attached"].ui.buttons .button { margin-right: @attachedOffset; border-radius: @borderRadius 0em 0em @borderRadius; } -.right.attached.ui.buttons .button:first-child { +[class*="right attached"].ui.buttons .button:first-child { margin-left: @attachedOffset; border-radius: @borderRadius 0em 0em 0em; } -.right.attached.ui.buttons .button:last-child { +[class*="right attached"].ui.buttons .button:last-child { margin-left: @attachedOffset; border-radius: 0em 0em 0em @borderRadius; } diff --git a/src/definitions/elements/list.less b/src/definitions/elements/list.less index ab9a0ff5d..67da6bd9d 100755 --- a/src/definitions/elements/list.less +++ b/src/definitions/elements/list.less @@ -100,7 +100,7 @@ ol.ui.list ol, vertical-align: @iconContentVerticalAlign; transition: @iconTransition; } -.ui.list .item > .top.aligned.icon { +.ui.list .item > [class*="top aligned"].icon { vertical-align: top; } .ui.list .item > .icon:only-child { @@ -117,7 +117,7 @@ ol.ui.list ol, padding-right: @imageDistance; vertical-align: @imageAlign; } -.ui.list .item > .top.aligned.image { +.ui.list .item > [class*="top aligned"].image { vertical-align: top; } .ui.list .item > .image img { @@ -672,14 +672,14 @@ ol.ui.horizontal.list li:before, padding-left: @relaxedHorizontalPadding; padding-right: @relaxedHorizontalPadding; } -.ui.very.relaxed.list:not(.horizontal) .item { +.ui[class*="very relaxed"].list:not(.horizontal) .item { padding-top: @veryRelaxedVerticalPadding; padding-bottom: @veryRelaxedVerticalPadding; } -.ui.very.relaxed.list .header { +.ui[class*="very relaxed"].list .header { /*margin-bottom: @veryRelaxedHeaderMargin;*/ } -.ui.horizontal.very.relaxed.list .item { +.ui.horizontal[class*="very relaxed"].list .item { padding-left: @veryRelaxedHorizontalPadding; padding-right: @veryRelaxedHorizontalPadding; } diff --git a/src/definitions/elements/segment.less b/src/definitions/elements/segment.less index 35b7bb5ef..6c2125cbb 100755 --- a/src/definitions/elements/segment.less +++ b/src/definitions/elements/segment.less @@ -26,16 +26,11 @@ .ui.segment { position: relative; background-color: @background; - box-shadow: @boxShadow; - margin: @margin 0em; padding: @verticalPadding @horizontalPadding; - border-radius: @borderRadius; border: @border; - box-sizing: border-box; - } .ui.segment:first-child { @@ -98,19 +93,19 @@ } /* Label */ -.ui.bottom.attached.segment > .top.attached.label { +.ui[class*="bottom attached"].segment > [class*="top attached"].label { border-top-left-radius: 0em; border-top-right-radius: 0em; } -.ui.top.attached.segment > .bottom.attached.label { +.ui[class*="top attached"].segment > [class*="bottom attached"].label { border-bottom-left-radius: 0em; border-bottom-right-radius: 0em; } -.ui.attached.segment:not(.top):not(.bottom) > .top.attached.label { +.ui.attached.segment:not(.top):not(.bottom) > [class*="top attached"].label { border-top-left-radius: 0em; border-top-right-radius: 0em; } -.ui.attached.segment:not(.top):not(.bottom) > .bottom.attached.label { +.ui.attached.segment:not(.top):not(.bottom) > [class*="bottom attached"].label { border-bottom-left-radius: 0em; border-bottom-right-radius: 0em; } @@ -135,7 +130,7 @@ border: @border; box-shadow: @boxShadow; } -.ui.very.basic.table.segment { +.ui[class*="very basic"].table.segment { padding: @verticalPadding @horizontalPadding; } @@ -369,13 +364,13 @@ Aligned --------------------*/ -.ui.left.aligned.segment { +.ui[class*="left aligned"].segment { text-align: left; } -.ui.right.aligned.segment { +.ui[class*="right aligned"].segment { text-align: right; } -.ui.center.aligned.segment { +.ui[class*="center aligned"].segment { text-align: center; } @@ -384,10 +379,10 @@ --------------------*/ .ui.floated.segment, -.ui.left.floated.segment { +.ui[class*="left floated"].segment { float: left; } -.ui.right.floated.segment { +.ui[class*="right floated"].segment { float: right; } @@ -455,7 +450,7 @@ box-shadow: @attachedBoxShadow; } -.ui.top.attached.segment { +.ui[class*="top attached"].segment { top: @attachedTopOffset; bottom: 0px; @@ -463,11 +458,11 @@ margin-bottom: 0em; border-radius: @borderRadius @borderRadius 0em 0em; } -.ui.segment.top.attached:first-child { +.ui.segment[class*="top attached"]:first-child { margin-top: 0em; } -.ui.segment.bottom.attached { +.ui.segment[class*="bottom attached"] { top: @attachedBottomOffset; bottom: 0px; margin-top: 0em; @@ -475,7 +470,7 @@ box-shadow: @attachedBottomBoxShadow; border-radius: 0em 0em @borderRadius @borderRadius; } -.ui.segment.bottom.attached:last-child { +.ui.segment[class*="bottom attached"]:last-child { margin-bottom: 0em; } diff --git a/src/definitions/modules/popup.less b/src/definitions/modules/popup.less index f65a0d1b4..9687ae0ce 100755 --- a/src/definitions/modules/popup.less +++ b/src/definitions/modules/popup.less @@ -209,7 +209,7 @@ width: @wideWidth; max-width: @wideWidth; } -.ui.very.wide.popup { +.ui[class*="very wide"].popup { width: @veryWideWidth; max-width: @veryWideWidth; } diff --git a/src/definitions/views/card.less b/src/definitions/views/card.less index 9c12c0f9d..e5993a18b 100644 --- a/src/definitions/views/card.less +++ b/src/definitions/views/card.less @@ -172,12 +172,12 @@ Floated ---------------*/ -.ui.cards > .card .left.floated, -.ui.card .left.floated { +.ui.cards > .card [class*="left floated"], +.ui.card [class*="left floated"] { float: left; } -.ui.cards > .card .right.floated, -.ui.card .right.floated { +.ui.cards > .card [class*="right floated"], +.ui.card [class*="right floated"] { float: right; } @@ -242,8 +242,8 @@ margin-right: 0em; } -.ui.cards > .card .meta .right.floated, -.ui.card .meta .right.floated { +.ui.cards > .card .meta [class*="right floated"], +.ui.card .meta [class*="right floated"] { margin-right: 0em; margin-left: @metaSpacing; } diff --git a/src/definitions/views/item.less b/src/definitions/views/item.less index 156f9927b..d4722de97 100755 --- a/src/definitions/views/item.less +++ b/src/definitions/views/item.less @@ -170,7 +170,7 @@ .ui.items > .item .left.floated { float: left; } -.ui.items > .item .right.floated { +.ui.items > .item [class*="right floated"] { float: right; } @@ -228,7 +228,7 @@ margin-right: 0em; } -.ui.items > .item .meta .right.floated { +.ui.items > .item .meta [class*="right floated"] { margin-right: 0em; margin-left: @metaSpacing; } @@ -321,7 +321,7 @@ .ui.items > .item .extra > * { margin-right: @extraSpacing; } -.ui.items > .item .extra > .right.floated { +.ui.items > .item .extra > [class*="right floated"] { margin-left: @extraSpacing; } @@ -343,13 +343,13 @@ Aligned --------------------*/ -.ui.items > .item > .image + .top.aligned.content { +.ui.items > .item > .image + [class*="top aligned"].content { vertical-align: top; } -.ui.items > .item > .image + .middle.aligned.content { +.ui.items > .item > .image + [class*="middle aligned"].content { vertical-align: middle; } -.ui.items > .item > .image + .bottom.aligned.content { +.ui.items > .item > .image + [class*="bottom aligned"].content { vertical-align: bottom; }