PrivateCoffee/wishthis
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Update FUI

Browse source
This commit is contained in:
grandeljay 2022-08-05 11:25:53 +02:00
parent ca0e8cb2ee
commit 768e814153
282 changed files with 40683 additions and 27004 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

119
semantic/dist/components/api.js vendored
View file

@ -65,7 +65,7 @@ $.api = $.fn.api = function(parameters) {
// context used for state // context used for state
$context = (settings.stateContext) $context = (settings.stateContext)
? $(settings.stateContext) ? ([window,document].indexOf(settings.stateContext) < 0 ? $(document).find(settings.stateContext) : $(settings.stateContext))
: $module, : $module,
// request details // request details
@ -74,6 +74,7 @@ $.api = $.fn.api = function(parameters) {
url, url,
data, data,
requestStartTime, requestStartTime,
originalData,
// standard module // standard module
element = this, element = this,
@ -86,6 +87,7 @@ $.api = $.fn.api = function(parameters) {
initialize: function() { initialize: function() {
if(!methodInvoked) { if(!methodInvoked) {
originalData = settings.data;
module.bind.events(); module.bind.events();
} }
module.instantiate(); module.instantiate();
@ -132,7 +134,7 @@ $.api = $.fn.api = function(parameters) {
response = JSON.parse(response); response = JSON.parse(response);
} }
catch(e) { catch(e) {
// isnt json string // isn't json string
} }
} }
return response; return response;
@ -148,8 +150,8 @@ $.api = $.fn.api = function(parameters) {
module.error(error.noStorage); module.error(error.noStorage);
return; return;
} }
response = sessionStorage.getItem(url); response = sessionStorage.getItem(url + module.get.normalizedData());
module.debug('Using cached response', url, response); module.debug('Using cached response', url, settings.data, response);
response = module.decode.json(response); response = module.decode.json(response);
return response; return response;
} }
@ -167,8 +169,8 @@ $.api = $.fn.api = function(parameters) {
if( $.isPlainObject(response) ) { if( $.isPlainObject(response) ) {
response = JSON.stringify(response); response = JSON.stringify(response);
} }
sessionStorage.setItem(url, response); sessionStorage.setItem(url + module.get.normalizedData(), response);
module.verbose('Storing cached response for url', url, response); module.verbose('Storing cached response for url', url, settings.data, response);
} }
}, },
@ -197,7 +199,7 @@ $.api = $.fn.api = function(parameters) {
// Add form content // Add form content
if(settings.serializeForm) { if(settings.serializeForm) {
settings.data = module.add.formData(settings.data); settings.data = module.add.formData(originalData || settings.data);
} }
// call beforesend and get any settings changes // call beforesend and get any settings changes
@ -334,10 +336,6 @@ $.api = $.fn.api = function(parameters) {
cancelled: function() { cancelled: function() {
return (module.cancelled || false); return (module.cancelled || false);
}, },
succesful: function() {
module.verbose('This behavior will be deleted due to typo. Use "was successful" instead.');
return module.was.successful();
},
successful: function() { successful: function() {
return (module.request && module.request.state() == 'resolved'); return (module.request && module.request.state() == 'resolved');
}, },
@ -365,8 +363,8 @@ $.api = $.fn.api = function(parameters) {
var var
// allow legacy {$var} style // allow legacy {$var} style
variable = (templatedString.indexOf('$') !== -1) variable = (templatedString.indexOf('$') !== -1)
? templatedString.substr(2, templatedString.length - 3) ? templatedString.slice(2, -1)
: templatedString.substr(1, templatedString.length - 2), : templatedString.slice(1, -1),
value = ($.isPlainObject(urlData) && urlData[variable] !== undefined) value = ($.isPlainObject(urlData) && urlData[variable] !== undefined)
? urlData[variable] ? urlData[variable]
: ($module.data(variable) !== undefined) : ($module.data(variable) !== undefined)
@ -397,8 +395,8 @@ $.api = $.fn.api = function(parameters) {
var var
// allow legacy {/$var} style // allow legacy {/$var} style
variable = (templatedString.indexOf('$') !== -1) variable = (templatedString.indexOf('$') !== -1)
? templatedString.substr(3, templatedString.length - 4) ? templatedString.slice(3, -1)
: templatedString.substr(2, templatedString.length - 3), : templatedString.slice(2, -1),
value = ($.isPlainObject(urlData) && urlData[variable] !== undefined) value = ($.isPlainObject(urlData) && urlData[variable] !== undefined)
? urlData[variable] ? urlData[variable]
: ($module.data(variable) !== undefined) : ($module.data(variable) !== undefined)
@ -429,24 +427,76 @@ $.api = $.fn.api = function(parameters) {
}, },
formData: function(data) { formData: function(data) {
var var
canSerialize = ($.fn.serializeObject !== undefined), formData = {},
formData = (canSerialize) hasOtherData,
? $form.serializeObject() useFormDataApi = settings.serializeForm === 'formdata'
: $form.serialize(),
hasOtherData
; ;
data = data || settings.data; data = data || originalData || settings.data;
hasOtherData = $.isPlainObject(data); hasOtherData = $.isPlainObject(data);
if(hasOtherData) { if (useFormDataApi) {
if(canSerialize) { formData = new FormData($form[0]);
module.debug('Extending existing data with form data', data, formData); settings.processData = typeof settings.processData !== 'undefined' ? settings.processData : false;
data = $.extend(true, {}, data, formData); settings.contentType = typeof settings.contentType !== 'undefined' ? settings.contentType : false;
} else {
var formArray = $form.serializeArray(),
pushes = {},
pushValues= {},
build = function(base, key, value) {
base[key] = value;
return base;
} }
else { ;
module.error(error.missingSerialize); // add files
module.debug('Cant extend data. Replacing data with form data', data, formData); $.each($('input[type="file"]',$form), function(i, tag) {
$.each($(tag)[0].files, function(j, file) {
formArray.push({name:tag.name, value: file});
});
});
$.each(formArray, function(i, el) {
if (!settings.regExp.validate.test(el.name)) return;
var isCheckbox = $('[name="' + el.name + '"]', $form).attr('type') === 'checkbox',
floatValue = parseFloat(el.value),
value = (isCheckbox && el.value === 'on') || el.value === 'true' || (String(floatValue) === el.value ? floatValue : (el.value === 'false' ? false : el.value)),
nameKeys = el.name.match(settings.regExp.key) || [], k, pushKey= el.name.replace(/\[\]$/,'')
;
if(!(pushKey in pushes)) {
pushes[pushKey] = 0;
pushValues[pushKey] = value;
} else if (Array.isArray(pushValues[pushKey])) {
pushValues[pushKey].push(value);
} else {
pushValues[pushKey] = [pushValues[pushKey] , value];
}
value = pushValues[pushKey];
while ((k = nameKeys.pop()) !== undefined) {
// foo[]
if (k == '' && !Array.isArray(value)){
value = build([], pushes[pushKey]++, value);
}
// foo[n]
else if (settings.regExp.fixed.test(k)) {
value = build([], k, value);
}
// foo; foo[bar]
else if (settings.regExp.named.test(k)) {
value = build({}, k, value);
}
}
formData = $.extend(true, formData, value);
});
}
if(hasOtherData) {
module.debug('Extending existing data with form data', data, formData);
if(useFormDataApi) {
$.each(Object.keys(data),function(i, el){
formData.append(el, data[el]);
});
data = formData; data = formData;
} else {
data = $.extend(true, {}, data, formData);
} }
} }
else { else {
@ -698,6 +748,9 @@ $.api = $.fn.api = function(parameters) {
}, },
get: { get: {
normalizedData: function(){
return typeof settings.data === "string" ? settings.data : JSON.stringify(settings.data, Object.keys(settings.data).sort());
},
responseFromXHR: function(xhr) { responseFromXHR: function(xhr) {
return $.isPlainObject(xhr) return $.isPlainObject(xhr)
? (module.is.expectingJSON()) ? (module.is.expectingJSON())
@ -1083,6 +1136,8 @@ $.api.settings = {
defaultData : true, defaultData : true,
// whether to serialize closest form // whether to serialize closest form
// use true to convert complex named keys like a[b][1][c][] into a nested object
// use 'formdata' for formdata web api
serializeForm : false, serializeForm : false,
// how long to wait before request should occur // how long to wait before request should occur
@ -1105,7 +1160,7 @@ $.api.settings = {
responseAsync : false, responseAsync : false,
// whether onResponse should work with response value without force converting into an object // whether onResponse should work with response value without force converting into an object
rawResponse : false, rawResponse : true,
// callbacks before request // callbacks before request
beforeSend : function(settings) { return settings; }, beforeSend : function(settings) { return settings; },
@ -1141,7 +1196,6 @@ $.api.settings = {
legacyParameters : 'You are using legacy API success callback names', legacyParameters : 'You are using legacy API success callback names',
method : 'The method you called is not defined', method : 'The method you called is not defined',
missingAction : 'API action used but no url was defined', missingAction : 'API action used but no url was defined',
missingSerialize : 'jquery-serialize-object is required to add form data to an existing data object',
missingURL : 'No URL specified for api event', missingURL : 'No URL specified for api event',
noReturnedValue : 'The beforeSend callback must return a settings object, beforeSend ignored.', noReturnedValue : 'The beforeSend callback must return a settings object, beforeSend ignored.',
noStorage : 'Caching responses locally requires session storage', noStorage : 'Caching responses locally requires session storage',
@ -1154,6 +1208,11 @@ $.api.settings = {
regExp : { regExp : {
required : /\{\$*[A-z0-9]+\}/g, required : /\{\$*[A-z0-9]+\}/g,
optional : /\{\/\$*[A-z0-9]+\}/g, optional : /\{\/\$*[A-z0-9]+\}/g,
validate: /^[a-z_][a-z0-9_-]*(?:\[[a-z0-9_-]*\])*$/i,
key: /[a-z0-9_-]+|(?=\[\])/gi,
push: /^$/,
fixed: /^\d+$/,
named: /^[a-z0-9_-]+$/i
}, },
className: { className: {

2
semantic/dist/components/api.min.js vendored
View file

File diff suppressed because one or more lines are too long

401
semantic/dist/components/button.css vendored
View file

@ -24,7 +24,7 @@
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
font-family: 'Raleway', sans-serif; font-family: 'Raleway', sans-serif;
margin: 0 0.25em 0 0; margin: 0 0.25em 0 0;
padding: 0.91666667em 1.5em 0.91666667em; padding: 0.78571429em 1.5em 0.78571429em;
text-transform: none; text-transform: none;
text-shadow: none; text-shadow: none;
font-weight: bold; font-weight: bold;
@ -32,7 +32,7 @@
font-style: normal; font-style: normal;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-box-shadow: 0 0 0 1px transparent inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset; -webkit-box-shadow: 0 0 0 1px transparent inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset;
box-shadow: 0 0 0 1px transparent inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset; box-shadow: 0 0 0 1px transparent inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset;
-webkit-user-select: none; -webkit-user-select: none;
@ -133,25 +133,25 @@
-webkit-transition: all 0s linear, opacity 0.1s ease; -webkit-transition: all 0s linear, opacity 0.1s ease;
transition: all 0s linear, opacity 0.1s ease; transition: all 0s linear, opacity 0.1s ease;
} }
.ui.loading.button:before { .ui.loading.button::before {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
left: 50%; left: 50%;
margin: -0.625em 0 0 -0.625em; margin: -0.64285714em 0 0 -0.64285714em;
width: 1.25em; width: 1.28571429em;
height: 1.25em; height: 1.28571429em;
border-radius: 500rem; border-radius: 500rem;
border: 0.2em solid rgba(0, 0, 0, 0.15); border: 0.2em solid rgba(0, 0, 0, 0.15);
} }
.ui.loading.button:after { .ui.loading.button::after {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
left: 50%; left: 50%;
margin: -0.625em 0 0 -0.625em; margin: -0.64285714em 0 0 -0.64285714em;
width: 1.25em; width: 1.28571429em;
height: 1.25em; height: 1.28571429em;
border-radius: 500rem; border-radius: 500rem;
-webkit-animation: loader 0.6s infinite linear; -webkit-animation: loader 0.6s infinite linear;
animation: loader 0.6s infinite linear; animation: loader 0.6s infinite linear;
@ -160,15 +160,20 @@
-webkit-box-shadow: 0 0 0 1px transparent; -webkit-box-shadow: 0 0 0 1px transparent;
box-shadow: 0 0 0 1px transparent; box-shadow: 0 0 0 1px transparent;
} }
.ui.ui.ui.loading.button .label {
background-color: transparent;
border-color: transparent;
color: transparent;
}
.ui.labeled.icon.loading.button .icon { .ui.labeled.icon.loading.button .icon {
background-color: transparent; background-color: transparent;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
.ui.basic.loading.button:not(.inverted):before { .ui.basic.loading.button:not(.inverted)::before {
border-color: rgba(0, 0, 0, 0.1); border-color: rgba(0, 0, 0, 0.1);
} }
.ui.basic.loading.button:not(.inverted):after { .ui.basic.loading.button:not(.inverted)::after {
border-color: #767676; border-color: #767676;
} }
@ -407,7 +412,7 @@
} }
/* Tag */ /* Tag */
.ui.labeled.button > .tag.label:before { .ui.labeled.button > .tag.label::before {
width: 1.85em; width: 1.85em;
height: 1.85em; height: 1.85em;
} }
@ -638,14 +643,14 @@
} }
.ui.button:not(.icon) > .icon:not(.button):not(.dropdown), .ui.button:not(.icon) > .icon:not(.button):not(.dropdown),
.ui.button:not(.icon) > .icons:not(.button):not(.dropdown) { .ui.button:not(.icon) > .icons:not(.button):not(.dropdown) {
margin: 0 0.5em 0 -0.25em; margin: 0 0.42857143em 0 -0.21428571em;
vertical-align: baseline; vertical-align: baseline;
} }
.ui.button:not(.icon) > .icons:not(.button):not(.dropdown) > .icon { .ui.button:not(.icon) > .icons:not(.button):not(.dropdown) > .icon {
vertical-align: baseline; vertical-align: baseline;
} }
.ui.button:not(.icon) > .right.icon:not(.button):not(.dropdown) { .ui.button:not(.icon) > .right.icon:not(.button):not(.dropdown) {
margin: 0 -0.25em 0 0.5em; margin: 0 -0.21428571em 0 0.42857143em;
} }
@ -670,14 +675,14 @@
} }
.ui.stackable.buttons .button:first-child { .ui.stackable.buttons .button:first-child {
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
} }
.ui.stackable.buttons .button:last-child { .ui.stackable.buttons .button:last-child {
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
border-top-right-radius: 0; border-top-right-radius: 0;
} }
.ui.stackable.buttons .button:only-child { .ui.stackable.buttons .button:only-child {
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
} }
@ -704,19 +709,19 @@
.ui.compact.buttons .button, .ui.compact.buttons .button,
.ui.compact.button { .ui.compact.button {
padding: 0.6875em 1.125em 0.6875em; padding: 0.58928571em 1.125em 0.58928571em;
} }
.ui.compact.icon.buttons .button, .ui.compact.icon.buttons .button,
.ui.compact.icon.button { .ui.compact.icon.button {
padding: 0.6875em 0.6875em 0.6875em; padding: 0.58928571em 0.58928571em 0.58928571em;
} }
.ui.compact.labeled.icon.buttons .button, .ui.compact.labeled.icon.buttons .button,
.ui.compact.labeled.icon.button { .ui.compact.labeled.icon.button {
padding: 0.6875em 3.95833333em 0.6875em; padding: 0.58928571em 3.69642857em 0.58928571em;
} }
.ui.compact.labeled.icon.buttons .button > .icon, .ui.compact.labeled.icon.buttons .button > .icon,
.ui.compact.labeled.icon.button > .icon { .ui.compact.labeled.icon.button > .icon {
padding: 0.6875em 0 0.6875em 0; padding: 0.58928571em 0 0.58928571em 0;
} }
/*------------------- /*-------------------
@ -733,49 +738,49 @@
.ui.mini.buttons .button, .ui.mini.buttons .button,
.ui.mini.buttons .or, .ui.mini.buttons .or,
.ui.ui.ui.ui.mini.button { .ui.ui.ui.ui.mini.button {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.buttons .dropdown, .ui.tiny.buttons .dropdown,
.ui.tiny.buttons .dropdown .menu > .item, .ui.tiny.buttons .dropdown .menu > .item,
.ui.tiny.buttons .button, .ui.tiny.buttons .button,
.ui.tiny.buttons .or, .ui.tiny.buttons .or,
.ui.ui.ui.ui.tiny.button { .ui.ui.ui.ui.tiny.button {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.buttons .dropdown, .ui.small.buttons .dropdown,
.ui.small.buttons .dropdown .menu > .item, .ui.small.buttons .dropdown .menu > .item,
.ui.small.buttons .button, .ui.small.buttons .button,
.ui.small.buttons .or, .ui.small.buttons .or,
.ui.ui.ui.ui.small.button { .ui.ui.ui.ui.small.button {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.buttons .dropdown, .ui.large.buttons .dropdown,
.ui.large.buttons .dropdown .menu > .item, .ui.large.buttons .dropdown .menu > .item,
.ui.large.buttons .button, .ui.large.buttons .button,
.ui.large.buttons .or, .ui.large.buttons .or,
.ui.ui.ui.ui.large.button { .ui.ui.ui.ui.large.button {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.buttons .dropdown, .ui.big.buttons .dropdown,
.ui.big.buttons .dropdown .menu > .item, .ui.big.buttons .dropdown .menu > .item,
.ui.big.buttons .button, .ui.big.buttons .button,
.ui.big.buttons .or, .ui.big.buttons .or,
.ui.ui.ui.ui.big.button { .ui.ui.ui.ui.big.button {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.buttons .dropdown, .ui.huge.buttons .dropdown,
.ui.huge.buttons .dropdown .menu > .item, .ui.huge.buttons .dropdown .menu > .item,
.ui.huge.buttons .button, .ui.huge.buttons .button,
.ui.huge.buttons .or, .ui.huge.buttons .or,
.ui.ui.ui.ui.huge.button { .ui.ui.ui.ui.huge.button {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.buttons .dropdown, .ui.massive.buttons .dropdown,
.ui.massive.buttons .dropdown .menu > .item, .ui.massive.buttons .dropdown .menu > .item,
.ui.massive.buttons .button, .ui.massive.buttons .button,
.ui.massive.buttons .or, .ui.massive.buttons .or,
.ui.ui.ui.ui.massive.button { .ui.ui.ui.ui.massive.button {
font-size: 1.75rem; font-size: 1.71428571rem;
} }
/*-------------- /*--------------
@ -784,7 +789,7 @@
.ui.icon.buttons .button, .ui.icon.buttons .button,
.ui.icon.button:not(.animated):not(.compact):not(.labeled) { .ui.icon.button:not(.animated):not(.compact):not(.labeled) {
padding: 0.91666667em 0.91666667em 0.91666667em; padding: 0.78571429em 0.78571429em 0.78571429em;
} }
.ui.animated.icon.button > .content > .icon, .ui.animated.icon.button > .content > .icon,
.ui.icon.buttons .button > .icon, .ui.icon.buttons .button > .icon,
@ -806,7 +811,7 @@
background: transparent none; background: transparent none;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
font-weight: normal; font-weight: normal;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
text-transform: none; text-transform: none;
text-shadow: none !important; text-shadow: none !important;
-webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
@ -816,7 +821,8 @@
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
border-right: none;
} }
.ui.basic.buttons .button { .ui.basic.buttons .button {
border-radius: 0; border-radius: 0;
@ -853,8 +859,6 @@
.ui.basic.active.button:hover { .ui.basic.active.button:hover {
background-color: rgba(0, 0, 0, 0.05); background-color: rgba(0, 0, 0, 0.05);
} }
/* Vertical */
.ui.basic.buttons .button:hover { .ui.basic.buttons .button:hover {
-webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.35) inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset inset; -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.35) inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset inset;
box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.35) inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset inset; box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.35) inset, 0 0 0 0 rgba(34, 36, 38, 0.15) inset inset;
@ -911,8 +915,8 @@
} }
/* Basic Group */ /* Basic Group */
.ui.basic.buttons .button { .ui.basic.buttons:not(.inverted) .button:not(.basic) {
border-left: 1px solid rgba(34, 36, 38, 0.15); border-right: 1px solid rgba(34, 36, 38, 0.15);
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -921,8 +925,8 @@
border-left-width: 0; border-left-width: 0;
border-top: 1px solid rgba(34, 36, 38, 0.15); border-top: 1px solid rgba(34, 36, 38, 0.15);
} }
.ui.basic.vertical.buttons .button:first-child { .ui.basic.vertical.buttons:not(.spaced) .button:first-child {
border-top-width: 0; border-top: none;
} }
/*------------------- /*-------------------
@ -935,8 +939,8 @@
-webkit-transition: color 0.1s ease !important; -webkit-transition: color 0.1s ease !important;
transition: color 0.1s ease !important; transition: color 0.1s ease !important;
border-radius: 0; border-radius: 0;
margin: 0.41666667em 0.25em 0.41666667em 0 !important; margin: 0.28571429em 0.25em 0.28571429em 0 !important;
padding: 0.5em !important; padding: 0.5em 0.5em !important;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
@ -957,7 +961,7 @@
.ui.tertiary.button:active { .ui.tertiary.button:active {
-webkit-box-shadow: inset 0 -0.2em 0 #999999; -webkit-box-shadow: inset 0 -0.2em 0 #999999;
box-shadow: inset 0 -0.2em 0 #999999; box-shadow: inset 0 -0.2em 0 #999999;
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
color: #666666; color: #666666;
background: none; background: none;
} }
@ -969,7 +973,7 @@
.ui.labeled.icon.buttons .button, .ui.labeled.icon.buttons .button,
.ui.labeled.icon.button { .ui.labeled.icon.button {
position: relative; position: relative;
padding-left: 4.33333333em !important; padding-left: 4.07142857em !important;
padding-right: 1.5em !important; padding-right: 1.5em !important;
} }
@ -987,9 +991,9 @@
text-align: center; text-align: center;
-webkit-animation: none; -webkit-animation: none;
animation: none; animation: none;
padding: 0.91666667em 0 0.91666667em 0; padding: 0.78571429em 0 0.78571429em 0;
margin: 0; margin: 0;
width: 2.83333333em; width: 2.57142857em;
background-color: rgba(0, 0, 0, 0.05); background-color: rgba(0, 0, 0, 0.05);
color: ''; color: '';
-webkit-box-shadow: -1px 0 0 0 transparent inset; -webkit-box-shadow: -1px 0 0 0 transparent inset;
@ -998,7 +1002,7 @@
/* Right Labeled */ /* Right Labeled */
.ui[class*="right labeled"].icon.button { .ui[class*="right labeled"].icon.button {
padding-right: 4.33333333em !important; padding-right: 4.07142857em !important;
padding-left: 1.5em !important; padding-left: 1.5em !important;
} }
.ui[class*="right labeled"].icon.button > .icon { .ui[class*="right labeled"].icon.button > .icon {
@ -1010,10 +1014,10 @@
-webkit-box-shadow: 1px 0 0 0 transparent inset; -webkit-box-shadow: 1px 0 0 0 transparent inset;
box-shadow: 1px 0 0 0 transparent inset; box-shadow: 1px 0 0 0 transparent inset;
} }
.ui.labeled.icon.buttons > .button > .icon:before, .ui.labeled.icon.buttons > .button > .icon::before,
.ui.labeled.icon.button > .icon:before, .ui.labeled.icon.button > .icon::before,
.ui.labeled.icon.buttons > .button > .icon:after, .ui.labeled.icon.buttons > .button > .icon::after,
.ui.labeled.icon.button > .icon:after { .ui.labeled.icon.button > .icon::after {
display: block; display: block;
position: relative; position: relative;
width: 100%; width: 100%;
@ -1024,24 +1028,24 @@
border-radius: 0; border-radius: 0;
} }
.ui.labeled.icon.buttons .button:first-child > .icon { .ui.labeled.icon.buttons .button:first-child > .icon {
border-top-left-radius: 0.33333333rem; border-top-left-radius: 0.28571429rem;
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
} }
.ui.labeled.icon.buttons .button:last-child > .icon { .ui.labeled.icon.buttons .button:last-child > .icon {
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
border-bottom-right-radius: 0.33333333rem; border-bottom-right-radius: 0.28571429rem;
} }
.ui.vertical.labeled.icon.buttons .button:first-child > .icon { .ui.vertical.labeled.icon.buttons .button:first-child > .icon {
border-radius: 0; border-radius: 0;
border-top-left-radius: 0.33333333rem; border-top-left-radius: 0.28571429rem;
} }
.ui.vertical.labeled.icon.buttons .button:last-child > .icon { .ui.vertical.labeled.icon.buttons .button:last-child > .icon {
border-radius: 0; border-radius: 0;
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
} }
/* Loading Icon in Labeled Button */ /* Loading Icon in Labeled Button */
.ui.labeled.icon.button > .loading.icon:before { .ui.labeled.icon.button > .loading.icon::before {
-webkit-animation: loader 2s linear infinite; -webkit-animation: loader 2s linear infinite;
animation: loader 2s linear infinite; animation: loader 2s linear infinite;
} }
@ -1086,10 +1090,10 @@
.ui.buttons .or { .ui.buttons .or {
position: relative; position: relative;
width: 0.3em; width: 0.3em;
height: 2.83333333em; height: 2.57142857em;
z-index: 3; z-index: 3;
} }
.ui.buttons .or:before { .ui.buttons .or::before {
position: absolute; position: absolute;
text-align: center; text-align: center;
border-radius: 500rem; border-radius: 500rem;
@ -1098,18 +1102,18 @@
left: 50%; left: 50%;
background-color: #FFFFFF; background-color: #FFFFFF;
text-shadow: none; text-shadow: none;
margin-top: -0.95833333em; margin-top: -0.89285714em;
margin-left: -0.95833333em; margin-left: -0.89285714em;
width: 1.91666667em; width: 1.78571429em;
height: 1.91666667em; height: 1.78571429em;
line-height: 1.91666667em; line-height: 1.78571429em;
color: rgba(0, 0, 0, 0.4); color: rgba(0, 0, 0, 0.4);
font-style: normal; font-style: normal;
font-weight: bold; font-weight: bold;
-webkit-box-shadow: 0 0 0 1px transparent inset; -webkit-box-shadow: 0 0 0 1px transparent inset;
box-shadow: 0 0 0 1px transparent inset; box-shadow: 0 0 0 1px transparent inset;
} }
.ui.buttons .or[data-text]:before { .ui.buttons .or[data-text]::before {
content: attr(data-text); content: attr(data-text);
} }
@ -1117,7 +1121,7 @@
.ui.fluid.buttons .or { .ui.fluid.buttons .or {
width: 0 !important; width: 0 !important;
} }
.ui.fluid.buttons .or:after { .ui.fluid.buttons .or::after {
display: none; display: none;
} }
@ -1138,10 +1142,10 @@
/* Top / Bottom */ /* Top / Bottom */
.ui.attached.top.button { .ui.attached.top.button {
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui.attached.bottom.button { .ui.attached.bottom.button {
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
/* Left / Right */ /* Left / Right */
@ -1150,13 +1154,13 @@
border-left: none; border-left: none;
text-align: right; text-align: right;
padding-right: 0.75em; padding-right: 0.75em;
border-radius: 0.33333333rem 0 0 0.33333333rem; border-radius: 0.28571429rem 0 0 0.28571429rem;
} }
.ui.right.attached.button { .ui.right.attached.button {
display: inline-block; display: inline-block;
text-align: left; text-align: left;
padding-left: 0.75em; padding-left: 0.75em;
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
} }
/* Plural */ /* Plural */
@ -1183,24 +1187,24 @@
/* Top / Bottom */ /* Top / Bottom */
.ui[class*="top attached"].buttons { .ui[class*="top attached"].buttons {
margin-bottom: -1px; margin-bottom: 0;
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui[class*="top attached"].buttons .button:first-child { .ui[class*="top attached"].buttons .button:first-child {
border-radius: 0.33333333rem 0 0 0; border-radius: 0.28571429rem 0 0 0;
} }
.ui[class*="top attached"].buttons .button:last-child { .ui[class*="top attached"].buttons .button:last-child {
border-radius: 0 0.33333333rem 0 0; border-radius: 0 0.28571429rem 0 0;
} }
.ui[class*="bottom attached"].buttons { .ui[class*="bottom attached"].buttons {
margin-top: -1px; margin-top: -1px;
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
.ui[class*="bottom attached"].buttons .button:first-child { .ui[class*="bottom attached"].buttons .button:first-child {
border-radius: 0 0 0 0.33333333rem; border-radius: 0 0 0 0.28571429rem;
} }
.ui[class*="bottom attached"].buttons .button:last-child { .ui[class*="bottom attached"].buttons .button:last-child {
border-radius: 0 0 0.33333333rem 0; border-radius: 0 0 0.28571429rem 0;
} }
/* Left / Right */ /* Left / Right */
@ -1210,15 +1214,15 @@
display: inline-flex; display: inline-flex;
margin-right: 0; margin-right: 0;
margin-left: -1px; margin-left: -1px;
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
} }
.ui[class*="left attached"].buttons .button:first-child { .ui[class*="left attached"].buttons .button:first-child {
margin-left: -1px; margin-left: -1px;
border-radius: 0 0.33333333rem 0 0; border-radius: 0 0.28571429rem 0 0;
} }
.ui[class*="left attached"].buttons .button:last-child { .ui[class*="left attached"].buttons .button:last-child {
margin-left: -1px; margin-left: -1px;
border-radius: 0 0 0.33333333rem 0; border-radius: 0 0 0.28571429rem 0;
} }
.ui[class*="right attached"].buttons { .ui[class*="right attached"].buttons {
display: -webkit-inline-box; display: -webkit-inline-box;
@ -1226,15 +1230,15 @@
display: inline-flex; display: inline-flex;
margin-left: 0; margin-left: 0;
margin-right: -1px; margin-right: -1px;
border-radius: 0.33333333rem 0 0 0.33333333rem; border-radius: 0.28571429rem 0 0 0.28571429rem;
} }
.ui[class*="right attached"].buttons .button:first-child { .ui[class*="right attached"].buttons .button:first-child {
margin-left: -1px; margin-left: -1px;
border-radius: 0.33333333rem 0 0 0; border-radius: 0.28571429rem 0 0 0;
} }
.ui[class*="right attached"].buttons .button:last-child { .ui[class*="right attached"].buttons .button:last-child {
margin-left: -1px; margin-left: -1px;
border-radius: 0 0 0 0.33333333rem; border-radius: 0 0 0 0.28571429rem;
} }
/*------------------- /*-------------------
@ -1366,7 +1370,7 @@
.ui.primary.buttons .button, .ui.primary.buttons .button,
.ui.primary.button { .ui.primary.button {
background-color: #6435C9; background-color: #2185D0;
color: #FFFFFF; color: #FFFFFF;
text-shadow: none; text-shadow: none;
background-image: none; background-image: none;
@ -1377,19 +1381,19 @@
} }
.ui.primary.buttons .button:hover, .ui.primary.buttons .button:hover,
.ui.primary.button:hover { .ui.primary.button:hover {
background-color: #5829bb; background-color: #1678c2;
color: #FFFFFF; color: #FFFFFF;
text-shadow: none; text-shadow: none;
} }
.ui.primary.buttons .button:focus, .ui.primary.buttons .button:focus,
.ui.primary.button:focus { .ui.primary.button:focus {
background-color: #4f20b5; background-color: #0d71bb;
color: #FFFFFF; color: #FFFFFF;
text-shadow: none; text-shadow: none;
} }
.ui.primary.buttons .button:active, .ui.primary.buttons .button:active,
.ui.primary.button:active { .ui.primary.button:active {
background-color: #502aa1; background-color: #1a69a4;
color: #FFFFFF; color: #FFFFFF;
text-shadow: none; text-shadow: none;
} }
@ -1397,7 +1401,7 @@
.ui.primary.buttons .active.button:active, .ui.primary.buttons .active.button:active,
.ui.primary.active.button, .ui.primary.active.button,
.ui.primary.button .active.button:active { .ui.primary.button .active.button:active {
background-color: #5626bf; background-color: #1279c6;
color: #FFFFFF; color: #FFFFFF;
text-shadow: none; text-shadow: none;
} }
@ -1406,39 +1410,36 @@
.ui.basic.primary.buttons .button, .ui.basic.primary.buttons .button,
.ui.basic.primary.button { .ui.basic.primary.button {
background: transparent; background: transparent;
-webkit-box-shadow: 0 0 0 1px #6435C9 inset; -webkit-box-shadow: 0 0 0 1px #2185D0 inset;
box-shadow: 0 0 0 1px #6435C9 inset; box-shadow: 0 0 0 1px #2185D0 inset;
color: #6435C9; color: #2185D0;
} }
.ui.basic.primary.buttons .button:hover, .ui.basic.primary.buttons .button:hover,
.ui.basic.primary.button:hover { .ui.basic.primary.button:hover {
background: transparent; background: transparent;
-webkit-box-shadow: 0 0 0 1px #5829bb inset; -webkit-box-shadow: 0 0 0 1px #1678c2 inset;
box-shadow: 0 0 0 1px #5829bb inset; box-shadow: 0 0 0 1px #1678c2 inset;
color: #5829bb; color: #1678c2;
} }
.ui.basic.primary.buttons .button:focus, .ui.basic.primary.buttons .button:focus,
.ui.basic.primary.button:focus { .ui.basic.primary.button:focus {
background: transparent; background: transparent;
-webkit-box-shadow: 0 0 0 1px #4f20b5 inset; -webkit-box-shadow: 0 0 0 1px #0d71bb inset;
box-shadow: 0 0 0 1px #4f20b5 inset; box-shadow: 0 0 0 1px #0d71bb inset;
color: #5829bb; color: #1678c2;
} }
.ui.basic.primary.buttons .active.button, .ui.basic.primary.buttons .active.button,
.ui.basic.primary.active.button { .ui.basic.primary.active.button {
background: transparent; background: transparent;
-webkit-box-shadow: 0 0 0 1px #5626bf inset; -webkit-box-shadow: 0 0 0 1px #1279c6 inset;
box-shadow: 0 0 0 1px #5626bf inset; box-shadow: 0 0 0 1px #1279c6 inset;
color: #502aa1; color: #1a69a4;
} }
.ui.basic.primary.buttons .button:active, .ui.basic.primary.buttons .button:active,
.ui.basic.primary.button:active { .ui.basic.primary.button:active {
-webkit-box-shadow: 0 0 0 1px #502aa1 inset; -webkit-box-shadow: 0 0 0 1px #1a69a4 inset;
box-shadow: 0 0 0 1px #502aa1 inset; box-shadow: 0 0 0 1px #1a69a4 inset;
color: #502aa1; color: #1a69a4;
}
.ui.buttons:not(.vertical) > .basic.primary.button:not(:first-child) {
margin-left: -1px;
} }
/* Inverted */ /* Inverted */
@ -1523,21 +1524,21 @@
background: transparent; background: transparent;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
color: #6435C9; color: #2185D0;
} }
.ui.tertiary.primary.buttons .button:hover, .ui.tertiary.primary.buttons .button:hover,
.ui.tertiary.primary.buttons button:hover, .ui.tertiary.primary.buttons button:hover,
.ui.tertiary.primary.button:hover { .ui.tertiary.primary.button:hover {
-webkit-box-shadow: inset 0 -0.2em 0 #6040a5; -webkit-box-shadow: inset 0 -0.2em 0 #2b75ac;
box-shadow: inset 0 -0.2em 0 #6040a5; box-shadow: inset 0 -0.2em 0 #2b75ac;
color: #6040a5; color: #2b75ac;
} }
.ui.tertiary.primary.buttons .button:focus, .ui.tertiary.primary.buttons .button:focus,
.ui.tertiary.primary.buttons .tertiary.button:focus, .ui.tertiary.primary.buttons .tertiary.button:focus,
.ui.tertiary.primary.button:focus { .ui.tertiary.primary.button:focus {
-webkit-box-shadow: inset 0 -0.2em 0 #5735a0; -webkit-box-shadow: inset 0 -0.2em 0 #216ea7;
box-shadow: inset 0 -0.2em 0 #5735a0; box-shadow: inset 0 -0.2em 0 #216ea7;
color: #5735a0; color: #216ea7;
} }
.ui.tertiary.primary.buttons .active.button, .ui.tertiary.primary.buttons .active.button,
.ui.tertiary.primary.buttons .tertiary.active.button, .ui.tertiary.primary.buttons .tertiary.active.button,
@ -1545,9 +1546,9 @@
.ui.tertiary.primary.buttons .button:active, .ui.tertiary.primary.buttons .button:active,
.ui.tertiary.primary.buttons .tertiary.button:active, .ui.tertiary.primary.buttons .tertiary.button:active,
.ui.tertiary.primary.button:active { .ui.tertiary.primary.button:active {
-webkit-box-shadow: inset 0 -0.2em 0 #4e0fd6; -webkit-box-shadow: inset 0 -0.2em 0 #007bd8;
box-shadow: inset 0 -0.2em 0 #4e0fd6; box-shadow: inset 0 -0.2em 0 #007bd8;
color: #5626bf; color: #1279c6;
} }
.ui.secondary.buttons .button, .ui.secondary.buttons .button,
.ui.secondary.button { .ui.secondary.button {
@ -1622,9 +1623,6 @@
box-shadow: 0 0 0 1px #343637 inset; box-shadow: 0 0 0 1px #343637 inset;
color: #343637; color: #343637;
} }
.ui.buttons:not(.vertical) > .basic.secondary.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.secondary.buttons .button, .ui.inverted.secondary.buttons .button,
@ -1807,9 +1805,6 @@
box-shadow: 0 0 0 1px #b21e1e inset; box-shadow: 0 0 0 1px #b21e1e inset;
color: #b21e1e; color: #b21e1e;
} }
.ui.buttons:not(.vertical) > .basic.red.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.red.buttons .button, .ui.inverted.red.buttons .button,
@ -1992,9 +1987,6 @@
box-shadow: 0 0 0 1px #cf590c inset; box-shadow: 0 0 0 1px #cf590c inset;
color: #cf590c; color: #cf590c;
} }
.ui.buttons:not(.vertical) > .basic.orange.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.orange.buttons .button, .ui.inverted.orange.buttons .button,
@ -2177,9 +2169,6 @@
box-shadow: 0 0 0 1px #cd9903 inset; box-shadow: 0 0 0 1px #cd9903 inset;
color: #cd9903; color: #cd9903;
} }
.ui.buttons:not(.vertical) > .basic.yellow.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.yellow.buttons .button, .ui.inverted.yellow.buttons .button,
@ -2362,9 +2351,6 @@
box-shadow: 0 0 0 1px #8d9e13 inset; box-shadow: 0 0 0 1px #8d9e13 inset;
color: #8d9e13; color: #8d9e13;
} }
.ui.buttons:not(.vertical) > .basic.olive.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.olive.buttons .button, .ui.inverted.olive.buttons .button,
@ -2547,9 +2533,6 @@
box-shadow: 0 0 0 1px #198f35 inset; box-shadow: 0 0 0 1px #198f35 inset;
color: #198f35; color: #198f35;
} }
.ui.buttons:not(.vertical) > .basic.green.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.green.buttons .button, .ui.inverted.green.buttons .button,
@ -2732,9 +2715,6 @@
box-shadow: 0 0 0 1px #00827c inset; box-shadow: 0 0 0 1px #00827c inset;
color: #00827c; color: #00827c;
} }
.ui.buttons:not(.vertical) > .basic.teal.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.teal.buttons .button, .ui.inverted.teal.buttons .button,
@ -2917,9 +2897,6 @@
box-shadow: 0 0 0 1px #1a69a4 inset; box-shadow: 0 0 0 1px #1a69a4 inset;
color: #1a69a4; color: #1a69a4;
} }
.ui.buttons:not(.vertical) > .basic.blue.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.blue.buttons .button, .ui.inverted.blue.buttons .button,
@ -3102,9 +3079,6 @@
box-shadow: 0 0 0 1px #502aa1 inset; box-shadow: 0 0 0 1px #502aa1 inset;
color: #502aa1; color: #502aa1;
} }
.ui.buttons:not(.vertical) > .basic.violet.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.violet.buttons .button, .ui.inverted.violet.buttons .button,
@ -3287,9 +3261,6 @@
box-shadow: 0 0 0 1px #82299f inset; box-shadow: 0 0 0 1px #82299f inset;
color: #82299f; color: #82299f;
} }
.ui.buttons:not(.vertical) > .basic.purple.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.purple.buttons .button, .ui.inverted.purple.buttons .button,
@ -3472,9 +3443,6 @@
box-shadow: 0 0 0 1px #c71f7e inset; box-shadow: 0 0 0 1px #c71f7e inset;
color: #c71f7e; color: #c71f7e;
} }
.ui.buttons:not(.vertical) > .basic.pink.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.pink.buttons .button, .ui.inverted.pink.buttons .button,
@ -3657,9 +3625,6 @@
box-shadow: 0 0 0 1px #805031 inset; box-shadow: 0 0 0 1px #805031 inset;
color: #805031; color: #805031;
} }
.ui.buttons:not(.vertical) > .basic.brown.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.brown.buttons .button, .ui.inverted.brown.buttons .button,
@ -3842,9 +3807,6 @@
box-shadow: 0 0 0 1px #909090 inset; box-shadow: 0 0 0 1px #909090 inset;
color: #909090; color: #909090;
} }
.ui.buttons:not(.vertical) > .basic.grey.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.grey.buttons .button, .ui.inverted.grey.buttons .button,
@ -3933,16 +3895,16 @@
.ui.tertiary.grey.buttons .button:hover, .ui.tertiary.grey.buttons .button:hover,
.ui.tertiary.grey.buttons button:hover, .ui.tertiary.grey.buttons button:hover,
.ui.tertiary.grey.button:hover { .ui.tertiary.grey.button:hover {
-webkit-box-shadow: inset 0 -0.2em 0 #838383; -webkit-box-shadow: inset 0 -0.2em 0 #909090;
box-shadow: inset 0 -0.2em 0 #838383; box-shadow: inset 0 -0.2em 0 #909090;
color: #838383; color: #909090;
} }
.ui.tertiary.grey.buttons .button:focus, .ui.tertiary.grey.buttons .button:focus,
.ui.tertiary.grey.buttons .tertiary.button:focus, .ui.tertiary.grey.buttons .tertiary.button:focus,
.ui.tertiary.grey.button:focus { .ui.tertiary.grey.button:focus {
-webkit-box-shadow: inset 0 -0.2em 0 #8a8a8a; -webkit-box-shadow: inset 0 -0.2em 0 #9f9f9f;
box-shadow: inset 0 -0.2em 0 #8a8a8a; box-shadow: inset 0 -0.2em 0 #9f9f9f;
color: #8a8a8a; color: #9f9f9f;
} }
.ui.tertiary.grey.buttons .active.button, .ui.tertiary.grey.buttons .active.button,
.ui.tertiary.grey.buttons .tertiary.active.button, .ui.tertiary.grey.buttons .tertiary.active.button,
@ -3950,8 +3912,8 @@
.ui.tertiary.grey.buttons .button:active, .ui.tertiary.grey.buttons .button:active,
.ui.tertiary.grey.buttons .tertiary.button:active, .ui.tertiary.grey.buttons .tertiary.button:active,
.ui.tertiary.grey.button:active { .ui.tertiary.grey.button:active {
-webkit-box-shadow: inset 0 -0.2em 0 #7e5454; -webkit-box-shadow: inset 0 -0.2em 0 #5d5d5d;
box-shadow: inset 0 -0.2em 0 #7e5454; box-shadow: inset 0 -0.2em 0 #5d5d5d;
color: #696969; color: #696969;
} }
.ui.black.buttons .button, .ui.black.buttons .button,
@ -4027,9 +3989,6 @@
box-shadow: 0 0 0 1px #343637 inset; box-shadow: 0 0 0 1px #343637 inset;
color: #343637; color: #343637;
} }
.ui.buttons:not(.vertical) > .basic.black.button:not(:first-child) {
margin-left: -1px;
}
/* Inverted */ /* Inverted */
.ui.inverted.black.buttons .button, .ui.inverted.black.buttons .button,
@ -4329,7 +4288,7 @@
} }
/* Clearfix */ /* Clearfix */
.ui.buttons:after { .ui.buttons::after {
content: "."; content: ".";
display: block; display: block;
height: 0; height: 0;
@ -4352,12 +4311,12 @@
.ui.buttons .button:first-child { .ui.buttons .button:first-child {
border-left: none; border-left: none;
margin-left: 0; margin-left: 0;
border-top-left-radius: 0.33333333rem; border-top-left-radius: 0.28571429rem;
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
} }
.ui.buttons .button:last-child { .ui.buttons .button:last-child {
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
border-bottom-right-radius: 0.33333333rem; border-bottom-right-radius: 0.28571429rem;
} }
/* Vertical Style */ /* Vertical Style */
@ -4375,21 +4334,109 @@
float: none; float: none;
width: 100%; width: 100%;
margin: 0 0 0 0; margin: 0 0 0 0;
-webkit-box-shadow: none;
box-shadow: none;
border-radius: 0; border-radius: 0;
} }
.ui.vertical.buttons .button:not(.basic) {
-webkit-box-shadow: none;
box-shadow: none;
}
.ui.vertical.buttons .button:first-child { .ui.vertical.buttons .button:first-child {
border-top-left-radius: 0.33333333rem; border-top-left-radius: 0.28571429rem;
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
} }
.ui.vertical.buttons .button:last-child { .ui.vertical.buttons .button:last-child {
margin-bottom: 0; margin-bottom: 0;
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
border-bottom-right-radius: 0.33333333rem; border-bottom-right-radius: 0.28571429rem;
} }
.ui.vertical.buttons .button:only-child { .ui.vertical.buttons .button:only-child {
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
}
.ui.vertical.buttons .basic.button:not(:first-child) {
border-top: none;
}
.ui.wrapping.buttons {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.ui.wrapping.basic.buttons {
border-bottom: none;
}
.ui.wrapping.basic.buttons .button {
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
}
.ui.wrapping.basic.buttons .button:hover {
background: transparent !important;
}
.ui.compact.wrapping.buttons .button {
-webkit-box-flex: 0;
-ms-flex: none;
flex: none;
}
.ui.wrapped.buttons:not(.spaced) {
border-top-right-radius: 0;
}
.ui.wrapped.buttons:not(.spaced) .button:first-child {
border-radius: 0.28571429rem 0 0 0;
}
.ui.wrapped.buttons:not(.spaced) .button:last-child {
border-radius: 0 0 0.28571429rem 0;
}
.ui.wrapped[class*="top attached"].buttons {
border-radius: 0.28571429rem 0 0 0;
}
.ui.wrapped[class*="top attached"].buttons .button:last-child {
border-radius: 0;
}
.ui.wrapped[class*="bottom attached"].buttons {
border-radius: 0 0 0 0.28571429rem;
}
.ui.wrapped[class*="bottom attached"].buttons .button:first-child {
border-radius: 0;
}
.ui.spaced.buttons .ui.button {
margin-bottom: 1em;
margin-right: 1em;
border-radius: 0.28571429rem;
}
.ui.spaced.basic.buttons {
border: none;
}
.ui.spaced.basic.buttons .button {
border: 1px solid rgba(34, 36, 38, 0.15);
}
.ui.spaced.basic.buttons .button.basic {
border: none;
}
.ui.spaced.basic.vertical.buttons .button:first-child {
border-top: 1px solid rgba(34, 36, 38, 0.15);
}
.ui.spaced.basic.wrapping.buttons .button:not(.basic) {
border-top: 1px solid rgba(34, 36, 38, 0.15);
border-right: 1px solid rgba(34, 36, 38, 0.15);
}
.ui.spaced.basic.wrapping.buttons .button:not(.basic):first-child {
border-left: 1px solid rgba(34, 36, 38, 0.15);
}
.ui.spaced.basic.inverted.buttons .basic.button {
margin-bottom: calc(1em + 1px);
margin-top: 1px;
}
.ui.basic.buttons:not(.vertical).inverted .button,
.ui.basic.buttons:not(.vertical) .basic.button {
margin-left: -1px;
border-right: none;
}
.ui.basic.buttons:not(.vertical):not(.spaced):not(.inverted) .basic.button {
margin-top: -1px;
border-bottom: none;
}
.ui.inverted.basic.buttons:not(.spaced) .button,
.ui.attached.basic.buttons:not(.wrapping):not(.inverted) .basic.button {
margin-bottom: -1px;
}
.ui.basic.buttons:not(.vertical):not(.attached):not(.spaced):not(.wrapping):not(.inverted) .basic.button {
margin-bottom: -1px;
} }

2
semantic/dist/components/button.min.css vendored
View file

File diff suppressed because one or more lines are too long

26
semantic/dist/components/calendar.css vendored
View file

@ -68,7 +68,6 @@
.ui.calendar .ui.table tr td { .ui.calendar .ui.table tr td {
padding: 0.5em; padding: 0.5em;
white-space: nowrap; white-space: nowrap;
text-align: center;
} }
.ui.calendar .ui.table tr th { .ui.calendar .ui.table tr th {
border-left: none; border-left: none;
@ -130,8 +129,8 @@
} }
.ui.calendar:not(.disabled) .calendar:focus .ui.table tbody tr td.focus, .ui.calendar:not(.disabled) .calendar:focus .ui.table tbody tr td.focus,
.ui.calendar:not(.disabled) .calendar.active .ui.table tbody tr td.focus { .ui.calendar:not(.disabled) .calendar.active .ui.table tbody tr td.focus {
-webkit-box-shadow: inset 0 0 0 1px #6435C9; -webkit-box-shadow: inset 0 0 0 1px #85B7D9;
box-shadow: inset 0 0 0 1px #6435C9; box-shadow: inset 0 0 0 1px #85B7D9;
} }
.ui.inverted.calendar .ui.table.inverted tr td.range { .ui.inverted.calendar .ui.table.inverted tr td.range {
background: rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.08);
@ -141,8 +140,8 @@
} }
.ui.inverted.calendar:not(.disabled) .calendar:focus .ui.table.inverted tbody tr td.focus, .ui.inverted.calendar:not(.disabled) .calendar:focus .ui.table.inverted tbody tr td.focus,
.ui.inverted.calendar:not(.disabled) .calendar.active .ui.table.inverted tbody tr td.focus { .ui.inverted.calendar:not(.disabled) .calendar.active .ui.table.inverted tbody tr td.focus {
-webkit-box-shadow: inset 0 0 0 1px #6435C9; -webkit-box-shadow: inset 0 0 0 1px #85B7D9;
box-shadow: inset 0 0 0 1px #6435C9; box-shadow: inset 0 0 0 1px #85B7D9;
} }
.ui.inverted.calendar .ui.inverted.table tr .disabled { .ui.inverted.calendar .ui.inverted.table tr .disabled {
color: rgba(225, 225, 225, 0.3); color: rgba(225, 225, 225, 0.3);
@ -151,6 +150,23 @@
color: rgba(255, 255, 255, 0.8); color: rgba(255, 255, 255, 0.8);
background: rgba(255, 255, 255, 0.02); background: rgba(255, 255, 255, 0.02);
} }
.ui.calendar.popup > .ui.ui.grid {
margin: -1rem;
}
.ui.calendar.popup > .ui.ui.grid > .column:not(:first-child) {
padding-left: 0;
}
.ui.calendar.popup > .ui.ui.grid > .column:not(:first-child) > .ui.table {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.ui.calendar.popup > .ui.ui.grid > .column:not(:last-child) {
padding-right: 0;
}
.ui.calendar.popup > .ui.ui.grid > .column:not(:last-child) > .ui.table {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
/******************************* /*******************************

266
semantic/dist/components/calendar.js vendored
View file

@ -122,7 +122,7 @@ $.fn.calendar = function(parameters) {
module.set.maxDate($module.data(metadata.maxDate)); module.set.maxDate($module.data(metadata.maxDate));
} }
module.setting('type', module.get.type()); module.setting('type', module.get.type());
module.setting('on', settings.on || ($input.length ? 'focus' : 'click')); module.setting('on', settings.on || 'click');
}, },
popup: function () { popup: function () {
if (settings.inline) { if (settings.inline) {
@ -153,7 +153,10 @@ $.fn.calendar = function(parameters) {
module.refreshTooltips(); module.refreshTooltips();
return settings.onVisible.apply($container, arguments); return settings.onVisible.apply($container, arguments);
}; };
var onHidden = settings.onHidden; var onHidden = function () {
module.blur();
return settings.onHidden.apply($container, arguments)
}
if (!$input.length) { if (!$input.length) {
//no input, $container has to handle focus/blur //no input, $container has to handle focus/blur
$container.attr('tabindex', '0'); $container.attr('tabindex', '0');
@ -162,10 +165,6 @@ $.fn.calendar = function(parameters) {
module.focus(); module.focus();
return settings.onVisible.apply($container, arguments); return settings.onVisible.apply($container, arguments);
}; };
onHidden = function () {
module.blur();
return settings.onHidden.apply($container, arguments);
};
} }
var onShow = function () { var onShow = function () {
//reset the focus date onShow //reset the focus date onShow
@ -323,7 +322,7 @@ $.fn.calendar = function(parameters) {
var headerDate = isYear || isMonth ? new Date(year, 0, 1) : var headerDate = isYear || isMonth ? new Date(year, 0, 1) :
isDay ? new Date(year, month, 1) : new Date(year, month, day, hour, minute); isDay ? new Date(year, month, 1) : new Date(year, month, day, hour, minute);
var headerText = $('<span/>').addClass(className.link).appendTo(cell); var headerText = $('<span/>').addClass(className.link).appendTo(cell);
headerText.text(formatter.header(headerDate, mode, settings)); headerText.text(module.helper.dateFormat(formatter[mode+'Header'], headerDate));
var newMode = isMonth ? (settings.disableYear ? 'day' : 'year') : var newMode = isMonth ? (settings.disableYear ? 'day' : 'year') :
isDay ? (settings.disableMonth ? 'year' : 'month') : 'day'; isDay ? (settings.disableMonth ? 'year' : 'month') : 'day';
headerText.data(metadata.mode, newMode); headerText.data(metadata.mode, newMode);
@ -371,7 +370,7 @@ $.fn.calendar = function(parameters) {
isHour ? new Date(year, month, day, i) : new Date(year, month, day, hour, i * settings.minTimeGap); isHour ? new Date(year, month, day, i) : new Date(year, month, day, hour, i * settings.minTimeGap);
var cellText = isYear ? i : var cellText = isYear ? i :
isMonth ? settings.text.monthsShort[i] : isDay ? cellDate.getDate() : isMonth ? settings.text.monthsShort[i] : isDay ? cellDate.getDate() :
formatter.time(cellDate, settings, true); module.helper.dateFormat(formatter.cellTime,cellDate);
cell = $('<td/>').addClass(className.cell).appendTo(row); cell = $('<td/>').addClass(className.cell).appendTo(row);
cell.text(cellText); cell.text(cellText);
cell.data(metadata.date, cellDate); cell.data(metadata.date, cellDate);
@ -390,6 +389,19 @@ $.fn.calendar = function(parameters) {
cell.attr("data-variation", disabledDate[metadata.variation]); cell.attr("data-variation", disabledDate[metadata.variation]);
} }
} }
if (mode === 'hour') {
var disabledHour = module.helper.findHourAsObject(cellDate, mode, settings.disabledHours);
if (disabledHour !== null && disabledHour[metadata.message]) {
cell.attr("data-tooltip", disabledHour[metadata.message]);
cell.attr("data-position", disabledHour[metadata.position] || tooltipPosition);
if(disabledHour[metadata.inverted] || (isInverted && disabledHour[metadata.inverted] === undefined)) {
cell.attr("data-inverted", '');
}
if(disabledHour[metadata.variation]) {
cell.attr("data-variation", disabledHour[metadata.variation]);
}
}
}
} else { } else {
eventDate = module.helper.findDayAsObject(cellDate, mode, settings.eventDates); eventDate = module.helper.findDayAsObject(cellDate, mode, settings.eventDates);
if (eventDate !== null) { if (eventDate !== null) {
@ -490,7 +502,7 @@ $.fn.calendar = function(parameters) {
var winWidth = $(window).width(); var winWidth = $(window).width();
$container.find('td[data-position]').each(function () { $container.find('td[data-position]').each(function () {
var cell = $(this); var cell = $(this);
var tooltipWidth = window.getComputedStyle(cell[0], ':after').width.replace(/[^0-9\.]/g,''); var tooltipWidth = window.getComputedStyle(cell[0], '::after').width.replace(/[^0-9\.]/g,'');
var tooltipPosition = cell.attr('data-position'); var tooltipPosition = cell.attr('data-position');
// use a fallback width of 250 (calendar width) for IE/Edge (which return "auto") // use a fallback width of 250 (calendar width) for IE/Edge (which return "auto")
var calcPosition = (winWidth - cell.width() - (parseInt(tooltipWidth,10) || 250)) > cell.offset().left ? 'right' : 'left'; var calcPosition = (winWidth - cell.width() - (parseInt(tooltipWidth,10) || 250)) > cell.offset().left ? 'right' : 'left';
@ -611,8 +623,10 @@ $.fn.calendar = function(parameters) {
var mode = module.get.mode(); var mode = module.get.mode();
var date = module.get.focusDate(); var date = module.get.focusDate();
if (date && !settings.isDisabled(date, mode) && !module.helper.isDisabled(date, mode) && module.helper.isEnabled(date, mode)) { if (date && !settings.isDisabled(date, mode) && !module.helper.isDisabled(date, mode) && module.helper.isEnabled(date, mode)) {
if (settings.onSelect.call(element, date, module.get.mode()) !== false) {
module.selectDate(date); module.selectDate(date);
} }
}
//disable form submission: //disable form submission:
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
@ -637,7 +651,7 @@ $.fn.calendar = function(parameters) {
$container.removeClass(className.active); $container.removeClass(className.active);
if (settings.formatInput) { if (settings.formatInput) {
var date = module.get.date(); var date = module.get.date();
var text = formatter.datetime(date, settings); var text = module.helper.dateFormat(formatter[settings.type], date);
$input.val(text); $input.val(text);
} }
if(selectionComplete){ if(selectionComplete){
@ -708,6 +722,9 @@ $.fn.calendar = function(parameters) {
return AWN - Math.floor(Date.UTC(Wyr, 0, 7) / ms7d) + 1; return AWN - Math.floor(Date.UTC(Wyr, 0, 7) / ms7d) + 1;
}(); }();
}, },
formattedDate: function(format, date) {
return module.helper.dateFormat(format || formatter[settings.type], date || module.get.date());
},
date: function () { date: function () {
return module.helper.sanitiseDate($module.data(metadata.date)) || null; return module.helper.sanitiseDate($module.data(metadata.date)) || null;
}, },
@ -732,7 +749,7 @@ $.fn.calendar = function(parameters) {
return $module.data(metadata.maxDate) || null; return $module.data(metadata.maxDate) || null;
}, },
monthOffset: function () { monthOffset: function () {
return $module.data(metadata.monthOffset) || 0; return $module.data(metadata.monthOffset) || settings.monthOffset || 0;
}, },
mode: function () { mode: function () {
//only returns valid modes for the current settings //only returns valid modes for the current settings
@ -786,7 +803,7 @@ $.fn.calendar = function(parameters) {
return null; return null;
} }
if (!(selector instanceof $)) { if (!(selector instanceof $)) {
selector = $(selector).first(); selector = $(document).find(selector).first();
} }
//assume range related calendars are using the same namespace //assume range related calendars are using the same namespace
return selector.data(moduleNamespace); return selector.data(moduleNamespace);
@ -801,7 +818,7 @@ $.fn.calendar = function(parameters) {
date = module.helper.dateInRange(date); date = module.helper.dateInRange(date);
var mode = module.get.mode(); var mode = module.get.mode();
var text = formatter.datetime(date, settings); var text = module.helper.dateFormat(formatter[settings.type],date);
if (fireChange && settings.onBeforeChange.call(element, date, text, mode) === false) { if (fireChange && settings.onBeforeChange.call(element, date, text, mode) === false) {
return false; return false;
@ -923,6 +940,7 @@ $.fn.calendar = function(parameters) {
//if this is a range calendar, focus the container or input. This will open the popup from its event listeners. //if this is a range calendar, focus the container or input. This will open the popup from its event listeners.
var endModule = module.get.calendarModule(settings.endCalendar); var endModule = module.get.calendarModule(settings.endCalendar);
if (endModule) { if (endModule) {
endModule.refresh();
if (endModule.setting('on') !== 'focus') { if (endModule.setting('on') !== 'focus') {
endModule.popup('show'); endModule.popup('show');
} }
@ -971,8 +989,62 @@ $.fn.calendar = function(parameters) {
}, },
helper: { helper: {
dateFormat: function(format,date) {
if (!(date instanceof Date)) {
return '';
}
if(typeof format === 'function') {
return format.call(module, date, settings);
}
var D = date.getDate(),
M = date.getMonth(),
Y = date.getFullYear(),
d = date.getDay(),
H = date.getHours(),
m = date.getMinutes(),
s = date.getSeconds(),
w = module.get.weekOfYear(Y,M,D+1-settings.firstDayOfWeek),
h = H % 12 || 12,
a = H < 12 ? settings.text.am.toLowerCase() : settings.text.pm.toLowerCase(),
tokens = {
D: D,
DD: ('0'+D).slice(-2),
M: M + 1,
MM: ('0'+(M+1)).slice(-2),
MMM: settings.text.monthsShort[M],
MMMM: settings.text.months[M],
Y: Y,
YY: String(Y).slice(2),
YYYY: Y,
d: d,
dd: settings.text.dayNamesShort[d].slice(0,2),
ddd: settings.text.dayNamesShort[d],
dddd: settings.text.dayNames[d],
h: h,
hh: ('0'+h).slice(-2),
H: H,
HH: ('0'+H).slice(-2),
m: m,
mm: ('0'+m).slice(-2),
s: s,
ss: ('0'+s).slice(-2),
a: a,
A: a.toUpperCase(),
S: ['th', 'st', 'nd', 'rd'][D % 10 > 3 ? 0 : (D % 100 - D % 10 !== 10) * D % 10],
w: w,
ww: ('0'+w).slice(-2)
}
;
return format.replace(settings.regExp.token, function (match) {
if (match in tokens) {
return tokens[match];
}
return match.slice(1, match.length - 1);
});
},
isDisabled: function(date, mode) { isDisabled: function(date, mode) {
return (mode === 'day' || mode === 'month' || mode === 'year') && ((mode === 'day' && settings.disabledDaysOfWeek.indexOf(date.getDay()) !== -1) || settings.disabledDates.some(function(d){ return (mode === 'day' || mode === 'month' || mode === 'year' || mode === 'hour') && (((mode === 'day' && settings.disabledDaysOfWeek.indexOf(date.getDay()) !== -1) || settings.disabledDates.some(function(d){
if(typeof d === 'string') { if(typeof d === 'string') {
d = module.helper.sanitiseDate(d); d = module.helper.sanitiseDate(d);
} }
@ -1005,7 +1077,45 @@ $.fn.calendar = function(parameters) {
} }
} }
} }
})); })) || (mode === 'hour' && settings.disabledHours.some(function(d){
if (typeof d === 'string') {
d = module.helper.sanitiseDate(d);
}
if (d instanceof Date) {
return module.helper.dateEqual(date, d, mode);
} else if (typeof d === 'number') {
return date.getHours() === d;
}
if (d !== null && typeof d === 'object') {
var blocked = true;
if (d[metadata.date]) {
if (d[metadata.date] instanceof Date) {
blocked = module.helper.dateEqual(date, module.helper.sanitiseDate(d[metadata.date]));
} else if (Array.isArray(d[metadata.date])) {
return d[metadata.date].some(function(idate) {
blocked = module.helper.dateEqual(date, idate, mode);
});
}
}
if (d[metadata.days]) {
if (typeof d[metadata.days] === 'number') {
blocked = date.getDay() == d[metadata.days];
} else if (Array.isArray(d[metadata.days])) {
blocked = d[metadata.days].indexOf(date.getDay()) > -1;
}
}
if (d[metadata.hours]) {
if (typeof d[metadata.hours] === 'number') {
return blocked && date.getHours() == d[metadata.hours];
} else if (Array.isArray(d[metadata.hours])) {
return blocked && d[metadata.hours].indexOf(date.getHours()) > -1;
}
}
}
})));
}, },
isEnabled: function(date, mode) { isEnabled: function(date, mode) {
if (mode === 'day') { if (mode === 'day') {
@ -1073,6 +1183,49 @@ $.fn.calendar = function(parameters) {
} }
return null; return null;
}, },
findHourAsObject: function(date, mode, hours) {
if (mode === 'hour') {
var d;
var hourCheck = function(date, d) {
if (d[metadata.hours]) {
if (typeof d[metadata.hours] === 'number' && date.getHours() == d[metadata.hours]) {
return d;
} else if (Array.isArray(d[metadata.hours])) {
if (d[metadata.hours].indexOf(date.getHours()) > -1) {
return d;
}
}
}
}
for (var i = 0; i < hours.length; i++) {
d = hours[i];
if (typeof d === 'number' && date.getHours() == d) {
return null;
} else if (d !== null && typeof d === 'object') {
if (d[metadata.days] && hourCheck(date,d)) {
if (typeof d[metadata.days] === 'number' && date.getDay() == d[metadata.days]) {
return d;
} else if (Array.isArray(d[metadata.days])) {
if (d[metadata.days].indexOf(date.getDay()) > -1) {
return d;
}
}
} else if (d[metadata.date] && hourCheck(date,d)) {
if (d[metadata.date] instanceof Date && module.helper.dateEqual(date, module.helper.sanitiseDate(d[metadata.date]))) {
return d;
} else if (Array.isArray(d[metadata.date])) {
if (d[metadata.date].some(function(idate) { return module.helper.dateEqual(date, idate, mode); })) {
return d;
}
}
} else if (hourCheck(date,d)) {
return d;
}
}
}
}
return null;
},
sanitiseDate: function (date) { sanitiseDate: function (date) {
if (!(date instanceof Date)) { if (!(date instanceof Date)) {
date = parser.date('' + date, settings); date = parser.date('' + date, settings);
@ -1340,7 +1493,7 @@ $.fn.calendar.settings = {
constantHeight : true, // add rows to shorter months to keep day calendar height consistent (6 rows) constantHeight : true, // add rows to shorter months to keep day calendar height consistent (6 rows)
today : false, // show a 'today/now' button at the bottom of the calendar today : false, // show a 'today/now' button at the bottom of the calendar
closable : true, // close the popup after selecting a date/time closable : true, // close the popup after selecting a date/time
monthFirst : true, // month before day when parsing/converting date from/to text monthFirst : true, // month before day when parsing date from text
touchReadonly : true, // set input to readonly on touch devices touchReadonly : true, // set input to readonly on touch devices
inline : false, // create the calendar inline instead of inside a popup inline : false, // create the calendar inline instead of inside a popup
on : null, // when to show the popup (defaults to 'focus' for input, 'click' for others) on : null, // when to show the popup (defaults to 'focus' for input, 'click' for others)
@ -1348,7 +1501,6 @@ $.fn.calendar.settings = {
startMode : false, // display mode to start in, can be 'year', 'month', 'day', 'hour', 'minute' (false = 'day') startMode : false, // display mode to start in, can be 'year', 'month', 'day', 'hour', 'minute' (false = 'day')
minDate : null, // minimum date/time that can be selected, dates/times before are disabled minDate : null, // minimum date/time that can be selected, dates/times before are disabled
maxDate : null, // maximum date/time that can be selected, dates/times after are disabled maxDate : null, // maximum date/time that can be selected, dates/times after are disabled
ampm : true, // show am/pm in time mode
disableYear : false, // disable year selection mode disableYear : false, // disable year selection mode
disableMonth : false, // disable month selection mode disableMonth : false, // disable month selection mode
disableMinute : false, // disable minute selection mode disableMinute : false, // disable minute selection mode
@ -1356,8 +1508,10 @@ $.fn.calendar.settings = {
startCalendar : null, // jquery object or selector for another calendar that represents the start date of a date range startCalendar : null, // jquery object or selector for another calendar that represents the start date of a date range
endCalendar : null, // jquery object or selector for another calendar that represents the end date of a date range endCalendar : null, // jquery object or selector for another calendar that represents the end date of a date range
multiMonth : 1, // show multiple months when in 'day' mode multiMonth : 1, // show multiple months when in 'day' mode
monthOffset : 0, // position current month by offset when multimonth > 1
minTimeGap : 5, minTimeGap : 5,
showWeekNumbers : null, // show Number of Week at the very first column of a dayView showWeekNumbers : false, // show Number of Week at the very first column of a dayView
disabledHours : [], // specific hour(s) which won't be selectable and contain additional information.
disabledDates : [], // specific day(s) which won't be selectable and contain additional information. disabledDates : [], // specific day(s) which won't be selectable and contain additional information.
disabledDaysOfWeek : [], // day(s) which won't be selectable(s) (0 = Sunday) disabledDaysOfWeek : [], // day(s) which won't be selectable(s) (0 = Sunday)
enabledDates : [], // specific day(s) which will be selectable, all other days will be disabled enabledDates : [], // specific day(s) which will be selectable, all other days will be disabled
@ -1370,11 +1524,14 @@ $.fn.calendar.settings = {
position: 'bottom left', position: 'bottom left',
lastResort: 'bottom left', lastResort: 'bottom left',
prefer: 'opposite', prefer: 'opposite',
observeChanges: false,
hideOnScroll: false hideOnScroll: false
}, },
text: { text: {
days: ['S', 'M', 'T', 'W', 'T', 'F', 'S'], days: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
today: 'Today', today: 'Today',
@ -1385,67 +1542,23 @@ $.fn.calendar.settings = {
}, },
formatter: { formatter: {
header: function (date, mode, settings) {
return mode === 'year' ? settings.formatter.yearHeader(date, settings) :
mode === 'month' ? settings.formatter.monthHeader(date, settings) :
mode === 'day' ? settings.formatter.dayHeader(date, settings) :
mode === 'hour' ? settings.formatter.hourHeader(date, settings) :
settings.formatter.minuteHeader(date, settings);
},
yearHeader: function (date, settings) { yearHeader: function (date, settings) {
var decadeYear = Math.ceil(date.getFullYear() / 10) * 10; var decadeYear = Math.ceil(date.getFullYear() / 10) * 10;
return (decadeYear - 9) + ' - ' + (decadeYear + 2); return (decadeYear - 9) + ' - ' + (decadeYear + 2);
}, },
monthHeader: function (date, settings) { monthHeader: 'YYYY',
return date.getFullYear(); dayHeader: 'MMMM YYYY',
}, hourHeader: 'MMMM D, YYYY',
dayHeader: function (date, settings) { minuteHeader: 'MMMM D, YYYY',
var month = settings.text.months[date.getMonth()];
var year = date.getFullYear();
return month + ' ' + year;
},
hourHeader: function (date, settings) {
return settings.formatter.date(date, settings);
},
minuteHeader: function (date, settings) {
return settings.formatter.date(date, settings);
},
dayColumnHeader: function (day, settings) { dayColumnHeader: function (day, settings) {
return settings.text.days[day]; return settings.text.days[day];
}, },
datetime: function (date, settings) { datetime: 'MMMM D, YYYY h:mm A',
if (!date) { date: 'MMMM D, YYYY',
return ''; time: 'h:mm A',
} cellTime: 'h:mm A',
var day = settings.type === 'time' ? '' : settings.formatter.date(date, settings); month: 'MMMM YYYY',
var time = settings.type.indexOf('time') < 0 ? '' : settings.formatter.time(date, settings, false); year: 'YYYY',
var separator = settings.type === 'datetime' ? ' ' : '';
return day + separator + time;
},
date: function (date, settings) {
if (!date) {
return '';
}
var day = date.getDate();
var month = settings.text.months[date.getMonth()];
var year = date.getFullYear();
return settings.type === 'year' ? year :
settings.type === 'month' ? month + ' ' + year :
(settings.monthFirst ? month + ' ' + day : day + ' ' + month) + ', ' + year;
},
time: function (date, settings, forCalendar) {
if (!date) {
return '';
}
var hour = date.getHours();
var minute = date.getMinutes();
var ampm = '';
if (settings.ampm) {
ampm = ' ' + (hour < 12 ? settings.text.am : settings.text.pm);
hour = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour;
}
return hour + ':' + (minute < 10 ? '0' : '') + minute + ampm;
},
today: function (settings) { today: function (settings) {
return settings.type === 'date' ? settings.text.today : settings.text.now; return settings.type === 'date' ? settings.text.today : settings.text.now;
}, },
@ -1461,7 +1574,7 @@ $.fn.calendar.settings = {
if (!text) { if (!text) {
return null; return null;
} }
text = String(text).trim(); text = String(text).trim().replace(/([.:\/\-])\s+/g,'$1').replace(/\s+([.:\/-])/g,'$1').replace(/\s+/g,' ');
if (text.length === 0) { if (text.length === 0) {
return null; return null;
} }
@ -1714,7 +1827,8 @@ $.fn.calendar.settings = {
regExp: { regExp: {
dateWords: /[^A-Za-z\u00C0-\u024F]+/g, dateWords: /[^A-Za-z\u00C0-\u024F]+/g,
dateNumbers: /[^\d:]+/g dateNumbers: /[^\d:]+/g,
token: /d{1,4}|D{1,2}|M{1,4}|YY(?:YY)?|([Hhmsw])\1?|[SAaY]|"[^"]*"|'[^']*'/g
}, },
error: { error: {
@ -1763,7 +1877,9 @@ $.fn.calendar.settings = {
variation: 'variation', variation: 'variation',
position: 'position', position: 'position',
month: 'month', month: 'month',
year: 'year' year: 'year',
hours: 'hours',
days: 'days'
}, },
eventClass: 'blue' eventClass: 'blue'

2
semantic/dist/components/calendar.min.css vendored
View file

@ -6,4 +6,4 @@
* Released under the MIT license * Released under the MIT license
* http://opensource.org/licenses/MIT * http://opensource.org/licenses/MIT
* *
*/.ui.calendar .ui.popup{max-width:none;padding:0;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ui.calendar .calendar:focus{outline:0}.ui.calendar .ui.popup .ui.grid{display:block;white-space:nowrap}.ui.calendar .ui.popup .ui.grid>.column{width:auto}.ui.calendar .ui.table.minute,.ui.calendar .ui.table.month,.ui.calendar .ui.table.year{min-width:15em}.ui.calendar .ui.table.day{min-width:18em}.ui.calendar .ui.table.day.andweek{min-width:22em}.ui.calendar .ui.table.hour{min-width:20em}.ui.calendar .ui.table tr td,.ui.calendar .ui.table tr th{padding:.5em;white-space:nowrap;text-align:center}.ui.calendar .ui.table tr th{border-left:none}.ui.calendar .ui.table tr th i.icon{margin:0}.ui.calendar .ui.table tr:first-child th{position:relative;padding-left:0;padding-right:0}.ui.calendar .ui.table.day tr:first-child th{border:none}.ui.calendar .ui.table.day tr:nth-child(2) th{padding-top:.2em;padding-bottom:.3em}.ui.calendar .ui.table tr td{padding-left:.1em;padding-right:.1em}.ui.calendar .ui.table tr .link{cursor:pointer}.ui.calendar .ui.table tr .prev.link{width:14.28571429%;position:absolute;left:0}.ui.calendar .ui.table tr .next.link{width:14.28571429%;position:absolute;right:0}.ui.ui.calendar .ui.table tr .disabled{pointer-events:auto;cursor:default;color:rgba(40,40,40,.3)}.ui.calendar .ui.table tr .adjacent:not(.disabled):not(.active){color:rgba(0,0,0,.6);background:rgba(0,0,0,.03)}.ui.calendar .ui.table tr td.today{font-weight:700}.ui.calendar .ui.table tr td.range{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);-webkit-box-shadow:none;box-shadow:none}.ui.calendar:not(.disabled) .calendar.active .ui.table tbody tr td.focus,.ui.calendar:not(.disabled) .calendar:focus .ui.table tbody tr td.focus{-webkit-box-shadow:inset 0 0 0 1px #6435c9;box-shadow:inset 0 0 0 1px #6435c9}.ui.inverted.calendar .ui.table.inverted tr td.range{background:rgba(255,255,255,.08);color:#fff;-webkit-box-shadow:none;box-shadow:none}.ui.inverted.calendar:not(.disabled) .calendar.active .ui.table.inverted tbody tr td.focus,.ui.inverted.calendar:not(.disabled) .calendar:focus .ui.table.inverted tbody tr td.focus{-webkit-box-shadow:inset 0 0 0 1px #6435c9;box-shadow:inset 0 0 0 1px #6435c9}.ui.inverted.calendar .ui.inverted.table tr .disabled{color:rgba(225,225,225,.3)}.ui.inverted.calendar .ui.inverted.table tr .adjacent:not(.disabled):not(.active){color:rgba(255,255,255,.8);background:rgba(255,255,255,.02)}.ui.disabled.calendar{opacity:.45}.ui.disabled.calendar .ui.table tr .link,.ui.disabled.calendar>.input{pointer-events:none} */.ui.calendar .ui.popup{max-width:none;padding:0;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ui.calendar .calendar:focus{outline:0}.ui.calendar .ui.popup .ui.grid{display:block;white-space:nowrap}.ui.calendar .ui.popup .ui.grid>.column{width:auto}.ui.calendar .ui.table.minute,.ui.calendar .ui.table.month,.ui.calendar .ui.table.year{min-width:15em}.ui.calendar .ui.table.day{min-width:18em}.ui.calendar .ui.table.day.andweek{min-width:22em}.ui.calendar .ui.table.hour{min-width:20em}.ui.calendar .ui.table tr td,.ui.calendar .ui.table tr th{padding:.5em;white-space:nowrap}.ui.calendar .ui.table tr th{border-left:none}.ui.calendar .ui.table tr th i.icon{margin:0}.ui.calendar .ui.table tr:first-child th{position:relative;padding-left:0;padding-right:0}.ui.calendar .ui.table.day tr:first-child th{border:none}.ui.calendar .ui.table.day tr:nth-child(2) th{padding-top:.2em;padding-bottom:.3em}.ui.calendar .ui.table tr td{padding-left:.1em;padding-right:.1em}.ui.calendar .ui.table tr .link{cursor:pointer}.ui.calendar .ui.table tr .prev.link{width:14.28571429%;position:absolute;left:0}.ui.calendar .ui.table tr .next.link{width:14.28571429%;position:absolute;right:0}.ui.ui.calendar .ui.table tr .disabled{pointer-events:auto;cursor:default;color:rgba(40,40,40,.3)}.ui.calendar .ui.table tr .adjacent:not(.disabled):not(.active){color:rgba(0,0,0,.6);background:rgba(0,0,0,.03)}.ui.calendar .ui.table tr td.today{font-weight:700}.ui.calendar .ui.table tr td.range{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);-webkit-box-shadow:none;box-shadow:none}.ui.calendar:not(.disabled) .calendar.active .ui.table tbody tr td.focus,.ui.calendar:not(.disabled) .calendar:focus .ui.table tbody tr td.focus{-webkit-box-shadow:inset 0 0 0 1px #85b7d9;box-shadow:inset 0 0 0 1px #85b7d9}.ui.inverted.calendar .ui.table.inverted tr td.range{background:rgba(255,255,255,.08);color:#fff;-webkit-box-shadow:none;box-shadow:none}.ui.inverted.calendar:not(.disabled) .calendar.active .ui.table.inverted tbody tr td.focus,.ui.inverted.calendar:not(.disabled) .calendar:focus .ui.table.inverted tbody tr td.focus{-webkit-box-shadow:inset 0 0 0 1px #85b7d9;box-shadow:inset 0 0 0 1px #85b7d9}.ui.inverted.calendar .ui.inverted.table tr .disabled{color:rgba(225,225,225,.3)}.ui.inverted.calendar .ui.inverted.table tr .adjacent:not(.disabled):not(.active){color:rgba(255,255,255,.8);background:rgba(255,255,255,.02)}.ui.calendar.popup>.ui.ui.grid{margin:-1rem}.ui.calendar.popup>.ui.ui.grid>.column:not(:first-child){padding-left:0}.ui.calendar.popup>.ui.ui.grid>.column:not(:first-child)>.ui.table{border-top-left-radius:0;border-bottom-left-radius:0}.ui.calendar.popup>.ui.ui.grid>.column:not(:last-child){padding-right:0}.ui.calendar.popup>.ui.ui.grid>.column:not(:last-child)>.ui.table{border-top-right-radius:0;border-bottom-right-radius:0}.ui.disabled.calendar{opacity:.45}.ui.disabled.calendar .ui.table tr .link,.ui.disabled.calendar>.input{pointer-events:none}

2
semantic/dist/components/calendar.min.js vendored
View file

File diff suppressed because one or more lines are too long

879
semantic/dist/components/card.css vendored
View file

File diff suppressed because it is too large Load diff

2
semantic/dist/components/card.min.css vendored
View file

File diff suppressed because one or more lines are too long

267
semantic/dist/components/checkbox.css vendored
View file

@ -53,7 +53,7 @@
outline: none; outline: none;
font-size: 1em; font-size: 1em;
} }
.ui.checkbox label:before { .ui.checkbox label::before {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@ -61,7 +61,7 @@
height: 17px; height: 17px;
content: ''; content: '';
background: #FFFFFF; background: #FFFFFF;
border-radius: 0.25rem; border-radius: 0.21428571rem;
-webkit-transition: border 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease; -webkit-transition: border 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease;
transition: border 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease; transition: border 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease;
transition: border 0.1s ease, opacity 0.1s ease, transform 0.1s ease, box-shadow 0.1s ease; transition: border 0.1s ease, opacity 0.1s ease, transform 0.1s ease, box-shadow 0.1s ease;
@ -73,7 +73,7 @@
Checkmark Checkmark
---------------*/ ---------------*/
.ui.checkbox label:after { .ui.checkbox label::after {
position: absolute; position: absolute;
font-size: 14px; font-size: 14px;
top: 0; top: 0;
@ -92,8 +92,8 @@
padding-left: 0; padding-left: 0;
padding-right: 1.85714em; padding-right: 1.85714em;
} }
.ui.right.aligned.checkbox label:after, .ui.right.aligned.checkbox label::after,
.ui.right.aligned.checkbox label:before { .ui.right.aligned.checkbox label::before {
right: 0; right: 0;
left: auto; left: auto;
} }
@ -154,11 +154,11 @@
Focus Focus
---------------*/ ---------------*/
.ui.checkbox input:focus ~ label:before { .ui.checkbox input:focus ~ label::before {
background: #FFFFFF; background: #FFFFFF;
border-color: #a285df; border-color: #96C8DA;
} }
.ui.checkbox input:focus ~ label:after { .ui.checkbox input:focus ~ label::after {
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
} }
.ui.checkbox input:focus ~ label { .ui.checkbox input:focus ~ label {
@ -169,11 +169,11 @@
Active Active
---------------*/ ---------------*/
.ui.checkbox input:checked ~ label:before { .ui.checkbox input:checked ~ label::before {
background: #FFFFFF; background: #FFFFFF;
border-color: rgba(34, 36, 38, 0.35); border-color: rgba(34, 36, 38, 0.35);
} }
.ui.checkbox input:checked ~ label:after { .ui.checkbox input:checked ~ label::after {
opacity: 1; opacity: 1;
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
} }
@ -182,21 +182,21 @@
Indeterminate Indeterminate
---------------*/ ---------------*/
.ui.checkbox input:not([type=radio]):indeterminate ~ label:before { .ui.checkbox input:not([type=radio]):indeterminate ~ label::before {
background: #FFFFFF; background: #FFFFFF;
border-color: rgba(34, 36, 38, 0.35); border-color: rgba(34, 36, 38, 0.35);
} }
.ui.checkbox input:not([type=radio]):indeterminate ~ label:after { .ui.checkbox input:not([type=radio]):indeterminate ~ label::after {
opacity: 1; opacity: 1;
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
} }
.ui.indeterminate.toggle.checkbox input:not([type=radio]):indeterminate ~ label:before { .ui.indeterminate.toggle.checkbox input:not([type=radio]):indeterminate ~ label::before {
background: rgba(0, 0, 0, 0.15); background: rgba(0, 0, 0, 0.15);
} }
.ui.indeterminate.toggle.checkbox input:not([type=radio]) ~ label:after { .ui.indeterminate.toggle.checkbox input:not([type=radio]) ~ label::after {
left: 1.075rem; left: 1.075rem;
} }
.ui.right.aligned.indeterminate.toggle.checkbox input:not([type=radio]) ~ label:after { .ui.right.aligned.indeterminate.toggle.checkbox input:not([type=radio]) ~ label::after {
left: auto; left: auto;
right: 1.075rem; right: 1.075rem;
} }
@ -205,13 +205,13 @@
Active Focus Active Focus
---------------*/ ---------------*/
.ui.checkbox input:not([type=radio]):indeterminate:focus ~ label:before, .ui.checkbox input:not([type=radio]):indeterminate:focus ~ label::before,
.ui.checkbox input:checked:focus ~ label:before { .ui.checkbox input:checked:focus ~ label::before {
background: #FFFFFF; background: #FFFFFF;
border-color: #a285df; border-color: #96C8DA;
} }
.ui.checkbox input:not([type=radio]):indeterminate:focus ~ label:after, .ui.checkbox input:not([type=radio]):indeterminate:focus ~ label::after,
.ui.checkbox input:checked:focus ~ label:after { .ui.checkbox input:checked:focus ~ label::after {
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
} }
@ -249,6 +249,7 @@
} }
/* Selectable Label */ /* Selectable Label */
.ui.checkbox input + label[for],
.ui.checkbox input.hidden + label { .ui.checkbox input.hidden + label {
cursor: pointer; cursor: pointer;
-webkit-user-select: none; -webkit-user-select: none;
@ -275,7 +276,7 @@
} }
/* Box */ /* Box */
.ui.radio.checkbox label:before { .ui.radio.checkbox label::before {
content: ''; content: '';
-webkit-transform: none; -webkit-transform: none;
transform: none; transform: none;
@ -287,7 +288,7 @@
} }
/* Bullet */ /* Bullet */
.ui.radio.checkbox label:after { .ui.radio.checkbox label::after {
border: none; border: none;
content: '' !important; content: '' !important;
line-height: 15px; line-height: 15px;
@ -302,31 +303,31 @@
} }
/* Focus */ /* Focus */
.ui.radio.checkbox input:focus ~ label:before { .ui.radio.checkbox input:focus ~ label::before {
background-color: #FFFFFF; background-color: #FFFFFF;
} }
.ui.radio.checkbox input:focus ~ label:after { .ui.radio.checkbox input:focus ~ label::after {
background-color: rgba(0, 0, 0, 0.95); background-color: rgba(0, 0, 0, 0.95);
} }
/* Indeterminate */ /* Indeterminate */
.ui.radio.checkbox input:indeterminate ~ label:after { .ui.radio.checkbox input:indeterminate ~ label::after {
opacity: 0; opacity: 0;
} }
/* Active */ /* Active */
.ui.radio.checkbox input:checked ~ label:before { .ui.radio.checkbox input:checked ~ label::before {
background-color: #FFFFFF; background-color: #FFFFFF;
} }
.ui.radio.checkbox input:checked ~ label:after { .ui.radio.checkbox input:checked ~ label::after {
background-color: rgba(0, 0, 0, 0.95); background-color: rgba(0, 0, 0, 0.95);
} }
/* Active Focus */ /* Active Focus */
.ui.radio.checkbox input:focus:checked ~ label:before { .ui.radio.checkbox input:focus:checked ~ label::before {
background-color: #FFFFFF; background-color: #FFFFFF;
} }
.ui.radio.checkbox input:focus:checked ~ label:after { .ui.radio.checkbox input:focus:checked ~ label::after {
background-color: rgba(0, 0, 0, 0.95); background-color: rgba(0, 0, 0, 0.95);
} }
@ -352,7 +353,7 @@
} }
/* Line */ /* Line */
.ui.slider.checkbox label:before { .ui.slider.checkbox label::before {
display: block; display: block;
position: absolute; position: absolute;
content: ''; content: '';
@ -364,14 +365,14 @@
top: 0.4rem; top: 0.4rem;
background-color: rgba(0, 0, 0, 0.05); background-color: rgba(0, 0, 0, 0.05);
width: 3.5rem; width: 3.5rem;
height: 0.25rem; height: 0.21428571rem;
border-radius: 500rem; border-radius: 500rem;
-webkit-transition: background 0.3s ease; -webkit-transition: background 0.3s ease;
transition: background 0.3s ease; transition: background 0.3s ease;
} }
/* Handle */ /* Handle */
.ui.slider.checkbox label:after { .ui.slider.checkbox label::after {
background: #FFFFFF -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05))); background: #FFFFFF -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
background: #FFFFFF -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05)); background: #FFFFFF -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
background: #FFFFFF linear-gradient(transparent, rgba(0, 0, 0, 0.05)); background: #FFFFFF linear-gradient(transparent, rgba(0, 0, 0, 0.05));
@ -394,7 +395,7 @@
} }
/* Focus */ /* Focus */
.ui.slider.checkbox input:focus ~ label:before { .ui.slider.checkbox input:focus ~ label::before {
background-color: rgba(0, 0, 0, 0.15); background-color: rgba(0, 0, 0, 0.15);
border: none; border: none;
} }
@ -411,10 +412,10 @@
.ui.slider.checkbox input:checked ~ label { .ui.slider.checkbox input:checked ~ label {
color: rgba(0, 0, 0, 0.95) !important; color: rgba(0, 0, 0, 0.95) !important;
} }
.ui.slider.checkbox input:checked ~ label:before { .ui.slider.checkbox input:checked ~ label::before {
background-color: #545454 !important; background-color: #545454 !important;
} }
.ui.slider.checkbox input:checked ~ label:after { .ui.slider.checkbox input:checked ~ label::after {
left: 2rem; left: 2rem;
} }
@ -422,20 +423,20 @@
.ui.slider.checkbox input:focus:checked ~ label { .ui.slider.checkbox input:focus:checked ~ label {
color: rgba(0, 0, 0, 0.95) !important; color: rgba(0, 0, 0, 0.95) !important;
} }
.ui.slider.checkbox input:focus:checked ~ label:before { .ui.slider.checkbox input:focus:checked ~ label::before {
background-color: #000000 !important; background-color: #000000 !important;
} }
.ui.right.aligned.slider.checkbox label { .ui.right.aligned.slider.checkbox label {
padding-left: 0; padding-left: 0;
padding-right: 4.5rem; padding-right: 4.5rem;
} }
.ui.right.aligned.slider.checkbox label:after { .ui.right.aligned.slider.checkbox label::after {
left: auto; left: auto;
right: 2rem; right: 2rem;
-webkit-transition: right 0.3s ease; -webkit-transition: right 0.3s ease;
transition: right 0.3s ease; transition: right 0.3s ease;
} }
.ui.right.aligned.slider.checkbox input:checked ~ label:after { .ui.right.aligned.slider.checkbox input:checked ~ label::after {
left: auto; left: auto;
right: 0; right: 0;
} }
@ -465,7 +466,7 @@
} }
/* Switch */ /* Switch */
.ui.toggle.checkbox label:before { .ui.toggle.checkbox label::before {
display: block; display: block;
position: absolute; position: absolute;
content: ''; content: '';
@ -483,7 +484,7 @@
} }
/* Handle */ /* Handle */
.ui.toggle.checkbox label:after { .ui.toggle.checkbox label::after {
background: #FFFFFF -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05))); background: #FFFFFF -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
background: #FFFFFF -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05)); background: #FFFFFF -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
background: #FFFFFF linear-gradient(transparent, rgba(0, 0, 0, 0.05)); background: #FFFFFF linear-gradient(transparent, rgba(0, 0, 0, 0.05));
@ -502,14 +503,14 @@
-webkit-transition: background 0.3s ease, left 0.3s ease; -webkit-transition: background 0.3s ease, left 0.3s ease;
transition: background 0.3s ease, left 0.3s ease; transition: background 0.3s ease, left 0.3s ease;
} }
.ui.toggle.checkbox input ~ label:after { .ui.toggle.checkbox input ~ label::after {
left: -0.05rem; left: -0.05rem;
-webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), 0 0 0 1px rgba(34, 36, 38, 0.15) inset; -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), 0 0 0 1px rgba(34, 36, 38, 0.15) inset; box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
} }
/* Focus */ /* Focus */
.ui.toggle.checkbox input:focus ~ label:before { .ui.toggle.checkbox input:focus ~ label::before {
background-color: rgba(0, 0, 0, 0.15); background-color: rgba(0, 0, 0, 0.15);
border: none; border: none;
} }
@ -524,10 +525,10 @@
.ui.toggle.checkbox input:checked ~ label { .ui.toggle.checkbox input:checked ~ label {
color: rgba(0, 0, 0, 0.95) !important; color: rgba(0, 0, 0, 0.95) !important;
} }
.ui.toggle.checkbox input:checked ~ label:before { .ui.toggle.checkbox input:checked ~ label::before {
background-color: #6435C9 !important; background-color: #2185D0 !important;
} }
.ui.toggle.checkbox input:checked ~ label:after { .ui.toggle.checkbox input:checked ~ label::after {
left: 2.15rem; left: 2.15rem;
-webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), 0 0 0 1px rgba(34, 36, 38, 0.15) inset; -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), 0 0 0 1px rgba(34, 36, 38, 0.15) inset; box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
@ -537,20 +538,20 @@
.ui.toggle.checkbox input:focus:checked ~ label { .ui.toggle.checkbox input:focus:checked ~ label {
color: rgba(0, 0, 0, 0.95) !important; color: rgba(0, 0, 0, 0.95) !important;
} }
.ui.toggle.checkbox input:focus:checked ~ label:before { .ui.toggle.checkbox input:focus:checked ~ label::before {
background-color: #4f20b5 !important; background-color: #0d71bb !important;
} }
.ui.right.aligned.toggle.checkbox label { .ui.right.aligned.toggle.checkbox label {
padding-left: 0; padding-left: 0;
padding-right: 4.5rem; padding-right: 4.5rem;
} }
.ui.right.aligned.toggle.checkbox input ~ label:after { .ui.right.aligned.toggle.checkbox input ~ label::after {
left: auto; left: auto;
right: 2.15rem; right: 2.15rem;
-webkit-transition: background 0.3s ease, right 0.3s ease; -webkit-transition: background 0.3s ease, right 0.3s ease;
transition: background 0.3s ease, right 0.3s ease; transition: background 0.3s ease, right 0.3s ease;
} }
.ui.right.aligned.toggle.checkbox input:checked ~ label:after { .ui.right.aligned.toggle.checkbox input:checked ~ label::after {
left: auto; left: auto;
right: -0.05rem; right: -0.05rem;
} }
@ -597,7 +598,7 @@
} }
/* Slider Line */ /* Slider Line */
.ui.inverted.slider.checkbox label:before { .ui.inverted.slider.checkbox label::before {
background-color: rgba(255, 255, 255, 0.5) !important; background-color: rgba(255, 255, 255, 0.5) !important;
} }
@ -610,7 +611,7 @@
.ui.inverted.slider.checkbox input:checked ~ label { .ui.inverted.slider.checkbox input:checked ~ label {
color: #ffffff !important; color: #ffffff !important;
} }
.ui.inverted.slider.checkbox input:checked ~ label:before { .ui.inverted.slider.checkbox input:checked ~ label::before {
background-color: rgba(255, 255, 255, 0.8) !important; background-color: rgba(255, 255, 255, 0.8) !important;
} }
@ -618,12 +619,12 @@
.ui.inverted.slider.checkbox input:focus:checked ~ label { .ui.inverted.slider.checkbox input:focus:checked ~ label {
color: #ffffff !important; color: #ffffff !important;
} }
.ui.inverted.slider.checkbox input:focus:checked ~ label:before { .ui.inverted.slider.checkbox input:focus:checked ~ label::before {
background-color: rgba(255, 255, 255, 0.8) !important; background-color: rgba(255, 255, 255, 0.8) !important;
} }
/* Toggle Switch */ /* Toggle Switch */
.ui.inverted.toggle.checkbox label:before { .ui.inverted.toggle.checkbox label::before {
background-color: rgba(255, 255, 255, 0.9) !important; background-color: rgba(255, 255, 255, 0.9) !important;
} }
@ -636,16 +637,16 @@
.ui.inverted.toggle.checkbox input:checked ~ label { .ui.inverted.toggle.checkbox input:checked ~ label {
color: #ffffff !important; color: #ffffff !important;
} }
.ui.inverted.toggle.checkbox input:checked ~ label:before { .ui.inverted.toggle.checkbox input:checked ~ label::before {
background-color: #6435C9 !important; background-color: #2185D0 !important;
} }
/* Toggle Active Focus */ /* Toggle Active Focus */
.ui.inverted.toggle.checkbox input:focus:checked ~ label { .ui.inverted.toggle.checkbox input:focus:checked ~ label {
color: #ffffff !important; color: #ffffff !important;
} }
.ui.inverted.toggle.checkbox input:focus:checked ~ label:before { .ui.inverted.toggle.checkbox input:focus:checked ~ label::before {
background-color: #4f20b5 !important; background-color: #0d71bb !important;
} }
/*-------------------- /*--------------------
@ -653,121 +654,121 @@
---------------------*/ ---------------------*/
.ui.mini.checkbox { .ui.mini.checkbox {
font-size: 0.75em; font-size: 0.78571429em;
} }
.ui.tiny.checkbox { .ui.tiny.checkbox {
font-size: 0.83333333em; font-size: 0.85714286em;
} }
.ui.small.checkbox { .ui.small.checkbox {
font-size: 0.91666667em; font-size: 0.92857143em;
} }
.ui.large.checkbox { .ui.large.checkbox {
font-size: 1.16666667em; font-size: 1.14285714em;
} }
.ui.large.form .checkbox:not(.slider):not(.toggle):not(.radio) label:after, .ui.large.form .checkbox:not(.slider):not(.toggle):not(.radio) label::after,
.ui.large.checkbox:not(.slider):not(.toggle):not(.radio) label:after, .ui.large.checkbox:not(.slider):not(.toggle):not(.radio) label::after,
.ui.large.form .checkbox:not(.slider):not(.toggle):not(.radio) label:before, .ui.large.form .checkbox:not(.slider):not(.toggle):not(.radio) label::before,
.ui.large.checkbox:not(.slider):not(.toggle):not(.radio) label:before { .ui.large.checkbox:not(.slider):not(.toggle):not(.radio) label::before {
-webkit-transform: scale(1.16666667); -webkit-transform: scale(1.14285714);
transform: scale(1.16666667); transform: scale(1.14285714);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
} }
.ui.large.form .checkbox.radio label:before, .ui.large.form .checkbox.radio label::before,
.ui.large.checkbox.radio label:before { .ui.large.checkbox.radio label::before {
-webkit-transform: scale(1.16666667); -webkit-transform: scale(1.14285714);
transform: scale(1.16666667); transform: scale(1.14285714);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
} }
.ui.large.form .checkbox.radio label:after, .ui.large.form .checkbox.radio label::after,
.ui.large.checkbox.radio label:after { .ui.large.checkbox.radio label::after {
-webkit-transform: scale(0.58333333); -webkit-transform: scale(0.57142857);
transform: scale(0.58333333); transform: scale(0.57142857);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
left: 0.34166667em; left: 0.33571429em;
} }
.ui.big.checkbox { .ui.big.checkbox {
font-size: 1.25em; font-size: 1.28571429em;
} }
.ui.big.form .checkbox:not(.slider):not(.toggle):not(.radio) label:after, .ui.big.form .checkbox:not(.slider):not(.toggle):not(.radio) label::after,
.ui.big.checkbox:not(.slider):not(.toggle):not(.radio) label:after, .ui.big.checkbox:not(.slider):not(.toggle):not(.radio) label::after,
.ui.big.form .checkbox:not(.slider):not(.toggle):not(.radio) label:before, .ui.big.form .checkbox:not(.slider):not(.toggle):not(.radio) label::before,
.ui.big.checkbox:not(.slider):not(.toggle):not(.radio) label:before { .ui.big.checkbox:not(.slider):not(.toggle):not(.radio) label::before {
-webkit-transform: scale(1.25); -webkit-transform: scale(1.28571429);
transform: scale(1.25); transform: scale(1.28571429);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
} }
.ui.big.form .checkbox.radio label:before, .ui.big.form .checkbox.radio label::before,
.ui.big.checkbox.radio label:before { .ui.big.checkbox.radio label::before {
-webkit-transform: scale(1.25); -webkit-transform: scale(1.28571429);
transform: scale(1.25); transform: scale(1.28571429);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
} }
.ui.big.form .checkbox.radio label:after, .ui.big.form .checkbox.radio label::after,
.ui.big.checkbox.radio label:after { .ui.big.checkbox.radio label::after {
-webkit-transform: scale(0.625); -webkit-transform: scale(0.64285714);
transform: scale(0.625); transform: scale(0.64285714);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
left: 0.3625em; left: 0.37142857em;
} }
.ui.huge.checkbox { .ui.huge.checkbox {
font-size: 1.41666667em; font-size: 1.42857143em;
} }
.ui.huge.form .checkbox:not(.slider):not(.toggle):not(.radio) label:after, .ui.huge.form .checkbox:not(.slider):not(.toggle):not(.radio) label::after,
.ui.huge.checkbox:not(.slider):not(.toggle):not(.radio) label:after, .ui.huge.checkbox:not(.slider):not(.toggle):not(.radio) label::after,
.ui.huge.form .checkbox:not(.slider):not(.toggle):not(.radio) label:before, .ui.huge.form .checkbox:not(.slider):not(.toggle):not(.radio) label::before,
.ui.huge.checkbox:not(.slider):not(.toggle):not(.radio) label:before { .ui.huge.checkbox:not(.slider):not(.toggle):not(.radio) label::before {
-webkit-transform: scale(1.41666667); -webkit-transform: scale(1.42857143);
transform: scale(1.41666667); transform: scale(1.42857143);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
} }
.ui.huge.form .checkbox.radio label:before, .ui.huge.form .checkbox.radio label::before,
.ui.huge.checkbox.radio label:before { .ui.huge.checkbox.radio label::before {
-webkit-transform: scale(1.41666667); -webkit-transform: scale(1.42857143);
transform: scale(1.41666667); transform: scale(1.42857143);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
} }
.ui.huge.form .checkbox.radio label:after, .ui.huge.form .checkbox.radio label::after,
.ui.huge.checkbox.radio label:after { .ui.huge.checkbox.radio label::after {
-webkit-transform: scale(0.70833333); -webkit-transform: scale(0.71428571);
transform: scale(0.70833333); transform: scale(0.71428571);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
left: 0.40416667em; left: 0.40714286em;
} }
.ui.massive.checkbox { .ui.massive.checkbox {
font-size: 1.75em; font-size: 1.71428571em;
} }
.ui.massive.form .checkbox:not(.slider):not(.toggle):not(.radio) label:after, .ui.massive.form .checkbox:not(.slider):not(.toggle):not(.radio) label::after,
.ui.massive.checkbox:not(.slider):not(.toggle):not(.radio) label:after, .ui.massive.checkbox:not(.slider):not(.toggle):not(.radio) label::after,
.ui.massive.form .checkbox:not(.slider):not(.toggle):not(.radio) label:before, .ui.massive.form .checkbox:not(.slider):not(.toggle):not(.radio) label::before,
.ui.massive.checkbox:not(.slider):not(.toggle):not(.radio) label:before { .ui.massive.checkbox:not(.slider):not(.toggle):not(.radio) label::before {
-webkit-transform: scale(1.75); -webkit-transform: scale(1.71428571);
transform: scale(1.75); transform: scale(1.71428571);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
} }
.ui.massive.form .checkbox.radio label:before, .ui.massive.form .checkbox.radio label::before,
.ui.massive.checkbox.radio label:before { .ui.massive.checkbox.radio label::before {
-webkit-transform: scale(1.75); -webkit-transform: scale(1.71428571);
transform: scale(1.75); transform: scale(1.71428571);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
} }
.ui.massive.form .checkbox.radio label:after, .ui.massive.form .checkbox.radio label::after,
.ui.massive.checkbox.radio label:after { .ui.massive.checkbox.radio label::after {
-webkit-transform: scale(0.875); -webkit-transform: scale(0.85714286);
transform: scale(0.875); transform: scale(0.85714286);
-webkit-transform-origin: left; -webkit-transform-origin: left;
transform-origin: left; transform-origin: left;
left: 0.4875em; left: 0.47857143em;
} }
@ -781,27 +782,27 @@
} }
/* Checkmark */ /* Checkmark */
.ui.checkbox label:after, .ui.checkbox label::after,
.ui.checkbox .box:after { .ui.checkbox .box::after {
font-family: 'Checkbox'; font-family: 'Checkbox';
} }
/* Checked */ /* Checked */
.ui.checkbox input:checked ~ .box:after, .ui.checkbox input:checked ~ .box::after,
.ui.checkbox input:checked ~ label:after { .ui.checkbox input:checked ~ label::after {
content: '\e800'; content: '\e800';
} }
/* Indeterminate */ /* Indeterminate */
.ui.checkbox input:indeterminate ~ .box:after, .ui.checkbox input:indeterminate ~ .box::after,
.ui.checkbox input:indeterminate ~ label:after { .ui.checkbox input:indeterminate ~ label::after {
font-size: 12px; font-size: 12px;
content: '\e801'; content: '\e801';
} }
/* UTF Reference /* UTF Reference
.check:before { content: '\e800'; } .check::before { content: '\e800'; }
.dash:before { content: '\e801'; } .dash::before { content: '\e801'; }
.plus:before { content: '\e802'; } .plus::before { content: '\e802'; }
*/ */

18
semantic/dist/components/checkbox.js vendored
View file

@ -239,18 +239,26 @@ $.fn.checkbox = function(parameters) {
} }
} }
shortcutPressed = false;
if(key == keyCode.escape) { if(key == keyCode.escape) {
module.verbose('Escape key pressed blurring field'); module.verbose('Escape key pressed blurring field');
$input.blur(); $input.blur();
shortcutPressed = true; shortcutPressed = true;
} }
else if(!event.ctrlKey && ( key == keyCode.space || (key == keyCode.enter && settings.enableEnterKey)) ) { else if(!event.ctrlKey && module.can.change()) {
if( key == keyCode.space || (key == keyCode.enter && settings.enableEnterKey) ) {
module.verbose('Enter/space key pressed, toggling checkbox'); module.verbose('Enter/space key pressed, toggling checkbox');
module.toggle(); module.toggle();
shortcutPressed = true; shortcutPressed = true;
} else if($module.is('.toggle, .slider') && !module.is.radio()) {
if(key == keyCode.left && module.is.checked()) {
module.uncheck();
shortcutPressed = true;
} else if(key == keyCode.right && module.is.unchecked()) {
module.check();
shortcutPressed = true;
}
} }
else {
shortcutPressed = false;
} }
}, },
keyup: function(event) { keyup: function(event) {
@ -323,7 +331,6 @@ $.fn.checkbox = function(parameters) {
settings.onEnable.call(input); settings.onEnable.call(input);
// preserve legacy callbacks // preserve legacy callbacks
settings.onEnabled.call(input); settings.onEnabled.call(input);
module.trigger.change();
} }
}, },
@ -338,7 +345,6 @@ $.fn.checkbox = function(parameters) {
settings.onDisable.call(input); settings.onDisable.call(input);
// preserve legacy callbacks // preserve legacy callbacks
settings.onDisabled.call(input); settings.onDisabled.call(input);
module.trigger.change();
} }
}, },
@ -866,7 +872,7 @@ $.fn.checkbox.settings = {
selector : { selector : {
checkbox : '.ui.checkbox', checkbox : '.ui.checkbox',
label : 'label, .box', label : 'label',
input : 'input[type="checkbox"], input[type="radio"]', input : 'input[type="checkbox"], input[type="radio"]',
link : 'a[href]' link : 'a[href]'
} }

2
semantic/dist/components/checkbox.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/checkbox.min.js vendored
View file

File diff suppressed because one or more lines are too long

119
semantic/dist/components/container.css vendored
View file

@ -41,54 +41,54 @@
/* Tablet */ /* Tablet */
@media only screen and (min-width: 768px) and (max-width: 991.98px) { @media only screen and (min-width: 768px) and (max-width: 991.98px) {
.ui.ui.ui.container:not(.fluid) { .ui.ui.ui.container:not(.fluid) {
width: 719px; width: 713.66666667px;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
.ui.ui.ui.grid.container { .ui.ui.ui.grid.container {
width: calc(719px + 1rem); width: calc(713.6666666666666px + 2rem);
} }
.ui.ui.ui.relaxed.grid.container { .ui.ui.ui.relaxed.grid.container {
width: calc(719px + 3rem); width: calc(713.6666666666666px + 3rem);
} }
.ui.ui.ui.very.relaxed.grid.container { .ui.ui.ui.very.relaxed.grid.container {
width: calc(719px + 5rem); width: calc(713.6666666666666px + 5rem);
} }
} }
/* Small Monitor */ /* Small Monitor */
@media only screen and (min-width: 992px) and (max-width: 1199.98px) { @media only screen and (min-width: 992px) and (max-width: 1199.98px) {
.ui.ui.ui.container:not(.fluid) { .ui.ui.ui.container:not(.fluid) {
width: 927px; width: 919px;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
.ui.ui.ui.grid.container { .ui.ui.ui.grid.container {
width: calc(927px + 1rem); width: calc(919px + 2rem);
} }
.ui.ui.ui.relaxed.grid.container { .ui.ui.ui.relaxed.grid.container {
width: calc(927px + 3rem); width: calc(919px + 3rem);
} }
.ui.ui.ui.very.relaxed.grid.container { .ui.ui.ui.very.relaxed.grid.container {
width: calc(927px + 5rem); width: calc(919px + 5rem);
} }
} }
/* Large Monitor */ /* Large Monitor */
@media only screen and (min-width: 1200px) { @media only screen and (min-width: 1200px) {
.ui.ui.ui.container:not(.fluid) { .ui.ui.ui.container:not(.fluid) {
width: 1119px; width: 1108.33333333px;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
.ui.ui.ui.grid.container { .ui.ui.ui.grid.container {
width: calc(1119px + 1rem); width: calc(1108.3333333333333px + 2rem);
} }
.ui.ui.ui.relaxed.grid.container { .ui.ui.ui.relaxed.grid.container {
width: calc(1119px + 3rem); width: calc(1108.3333333333333px + 3rem);
} }
.ui.ui.ui.very.relaxed.grid.container { .ui.ui.ui.very.relaxed.grid.container {
width: calc(1119px + 5rem); width: calc(1108.3333333333333px + 5rem);
} }
} }
@ -103,7 +103,24 @@
font-family: 'Raleway', sans-serif; font-family: 'Raleway', sans-serif;
max-width: 700px; max-width: 700px;
line-height: 1.5; line-height: 1.5;
font-size: 1.16666667rem; font-size: 1.14285714rem;
}
/* Wide Container */
@media only screen and (min-width: 768px) and (max-width: 991.98px) {
.ui.ui.ui.wide.container {
width: 856.4px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199.98px) {
.ui.ui.ui.wide.container {
width: 1102.8px;
}
}
@media only screen and (min-width: 1200px) {
.ui.ui.ui.wide.container {
width: 1330px;
}
} }
/* Fluid */ /* Fluid */
@ -132,6 +149,82 @@
hyphens: auto; hyphens: auto;
} }
/*--------------
Scrolling
---------------*/
.ui.scrolling.container {
overflow: auto;
}
@media only screen and (max-width: 767.98px) {
.ui.scrolling.container.short {
max-height: 11.25em;
}
.ui.scrolling.container[class*="very short"] {
max-height: 7.5em;
}
.ui.scrolling.container {
max-height: 15em;
}
.ui.scrolling.container.long {
max-height: 30em;
}
.ui.scrolling.container[class*="very long"] {
max-height: 45em;
}
}
@media only screen and (min-width: 768px) {
.ui.scrolling.container.short {
max-height: 13.5em;
}
.ui.scrolling.container[class*="very short"] {
max-height: 9em;
}
.ui.scrolling.container {
max-height: 18em;
}
.ui.scrolling.container.long {
max-height: 36em;
}
.ui.scrolling.container[class*="very long"] {
max-height: 54em;
}
}
@media only screen and (min-width: 992px) {
.ui.scrolling.container.short {
max-height: 18em;
}
.ui.scrolling.container[class*="very short"] {
max-height: 12em;
}
.ui.scrolling.container {
max-height: 24em;
}
.ui.scrolling.container.long {
max-height: 48em;
}
.ui.scrolling.container[class*="very long"] {
max-height: 72em;
}
}
@media only screen and (min-width: 1920px) {
.ui.scrolling.container.short {
max-height: 22.5em;
}
.ui.scrolling.container[class*="very short"] {
max-height: 15em;
}
.ui.scrolling.container {
max-height: 30em;
}
.ui.scrolling.container.long {
max-height: 60em;
}
.ui.scrolling.container[class*="very long"] {
max-height: 90em;
}
}
/******************************* /*******************************
Theme Overrides Theme Overrides

2
semantic/dist/components/container.min.css vendored
View file

@ -6,4 +6,4 @@
* Released under the MIT license * Released under the MIT license
* http://opensource.org/licenses/MIT * http://opensource.org/licenses/MIT
* *
*/.ui.container{display:block;max-width:100%}@media only screen and (max-width:767.98px){.ui.ui.ui.container:not(.fluid){width:auto;margin-left:1em;margin-right:1em}.ui.ui.ui.grid.container{width:auto}.ui.ui.ui.relaxed.grid.container{width:auto}.ui.ui.ui.very.relaxed.grid.container{width:auto}}@media only screen and (min-width:768px) and (max-width:991.98px){.ui.ui.ui.container:not(.fluid){width:719px;margin-left:auto;margin-right:auto}.ui.ui.ui.grid.container{width:calc(719px + 1rem)}.ui.ui.ui.relaxed.grid.container{width:calc(719px + 3rem)}.ui.ui.ui.very.relaxed.grid.container{width:calc(719px + 5rem)}}@media only screen and (min-width:992px) and (max-width:1199.98px){.ui.ui.ui.container:not(.fluid){width:927px;margin-left:auto;margin-right:auto}.ui.ui.ui.grid.container{width:calc(927px + 1rem)}.ui.ui.ui.relaxed.grid.container{width:calc(927px + 3rem)}.ui.ui.ui.very.relaxed.grid.container{width:calc(927px + 5rem)}}@media only screen and (min-width:1200px){.ui.ui.ui.container:not(.fluid){width:1119px;margin-left:auto;margin-right:auto}.ui.ui.ui.grid.container{width:calc(1119px + 1rem)}.ui.ui.ui.relaxed.grid.container{width:calc(1119px + 3rem)}.ui.ui.ui.very.relaxed.grid.container{width:calc(1119px + 5rem)}}.ui.text.container{font-family:Raleway,sans-serif;max-width:700px;line-height:1.5;font-size:1.16666667rem}.ui.fluid.container{width:100%}.ui[class*="left aligned"].container{text-align:left}.ui[class*="center aligned"].container{text-align:center}.ui[class*="right aligned"].container{text-align:right}.ui.justified.container{text-align:justify;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto} */.ui.container{display:block;max-width:100%}@media only screen and (max-width:767.98px){.ui.ui.ui.container:not(.fluid){width:auto;margin-left:1em;margin-right:1em}.ui.ui.ui.grid.container{width:auto}.ui.ui.ui.relaxed.grid.container{width:auto}.ui.ui.ui.very.relaxed.grid.container{width:auto}}@media only screen and (min-width:768px) and (max-width:991.98px){.ui.ui.ui.container:not(.fluid){width:713.66666667px;margin-left:auto;margin-right:auto}.ui.ui.ui.grid.container{width:calc(713.6666666666666px + 2rem)}.ui.ui.ui.relaxed.grid.container{width:calc(713.6666666666666px + 3rem)}.ui.ui.ui.very.relaxed.grid.container{width:calc(713.6666666666666px + 5rem)}}@media only screen and (min-width:992px) and (max-width:1199.98px){.ui.ui.ui.container:not(.fluid){width:919px;margin-left:auto;margin-right:auto}.ui.ui.ui.grid.container{width:calc(919px + 2rem)}.ui.ui.ui.relaxed.grid.container{width:calc(919px + 3rem)}.ui.ui.ui.very.relaxed.grid.container{width:calc(919px + 5rem)}}@media only screen and (min-width:1200px){.ui.ui.ui.container:not(.fluid){width:1108.33333333px;margin-left:auto;margin-right:auto}.ui.ui.ui.grid.container{width:calc(1108.3333333333333px + 2rem)}.ui.ui.ui.relaxed.grid.container{width:calc(1108.3333333333333px + 3rem)}.ui.ui.ui.very.relaxed.grid.container{width:calc(1108.3333333333333px + 5rem)}}.ui.text.container{font-family:Raleway,sans-serif;max-width:700px;line-height:1.5;font-size:1.14285714rem}@media only screen and (min-width:768px) and (max-width:991.98px){.ui.ui.ui.wide.container{width:856.4px}}@media only screen and (min-width:992px) and (max-width:1199.98px){.ui.ui.ui.wide.container{width:1102.8px}}@media only screen and (min-width:1200px){.ui.ui.ui.wide.container{width:1330px}}.ui.fluid.container{width:100%}.ui[class*="left aligned"].container{text-align:left}.ui[class*="center aligned"].container{text-align:center}.ui[class*="right aligned"].container{text-align:right}.ui.justified.container{text-align:justify;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.ui.scrolling.container{overflow:auto}@media only screen and (max-width:767.98px){.ui.scrolling.container.short{max-height:11.25em}.ui.scrolling.container[class*="very short"]{max-height:7.5em}.ui.scrolling.container{max-height:15em}.ui.scrolling.container.long{max-height:30em}.ui.scrolling.container[class*="very long"]{max-height:45em}}@media only screen and (min-width:768px){.ui.scrolling.container.short{max-height:13.5em}.ui.scrolling.container[class*="very short"]{max-height:9em}.ui.scrolling.container{max-height:18em}.ui.scrolling.container.long{max-height:36em}.ui.scrolling.container[class*="very long"]{max-height:54em}}@media only screen and (min-width:992px){.ui.scrolling.container.short{max-height:18em}.ui.scrolling.container[class*="very short"]{max-height:12em}.ui.scrolling.container{max-height:24em}.ui.scrolling.container.long{max-height:48em}.ui.scrolling.container[class*="very long"]{max-height:72em}}@media only screen and (min-width:1920px){.ui.scrolling.container.short{max-height:22.5em}.ui.scrolling.container[class*="very short"]{max-height:15em}.ui.scrolling.container{max-height:30em}.ui.scrolling.container.long{max-height:60em}.ui.scrolling.container[class*="very long"]{max-height:90em}}

19
semantic/dist/components/dimmer.css vendored
View file

@ -33,8 +33,8 @@
animation-fill-mode: both; animation-fill-mode: both;
-webkit-animation-duration: 0.5s; -webkit-animation-duration: 0.5s;
animation-duration: 0.5s; animation-duration: 0.5s;
-webkit-transition: background-color 0.5s linear; -webkit-transition: all 0.5s linear;
transition: background-color 0.5s linear; transition: all 0.5s linear;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-box-direction: normal; -webkit-box-direction: normal;
-ms-flex-direction: column; -ms-flex-direction: column;
@ -80,6 +80,17 @@
.ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb:hover { .ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb:hover {
background: rgba(255, 255, 255, 0.35); background: rgba(255, 255, 255, 0.35);
} }
.ui.dimmer:not(.inverted) {
/* IE11 */
scrollbar-face-color: #656565;
scrollbar-shadow-color: #656565;
scrollbar-track-color: #323232;
scrollbar-arrow-color: #323232;
/* firefox : first color thumb, second track */
scrollbar-color: rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.1);
}
/******************************* /*******************************
@ -170,6 +181,7 @@ body.dimmable > .dimmer {
Blurring Blurring
---------------*/ ---------------*/
@supports (not (-webkit-backdrop-filter: none)) and (not ((-webkit-backdrop-filter: none) or (backdrop-filter: none))) {
.blurring.dimmable > :not(.dimmer) { .blurring.dimmable > :not(.dimmer) {
-webkit-filter: initial; -webkit-filter: initial;
filter: initial; filter: initial;
@ -182,10 +194,13 @@ body.dimmable > .dimmer {
-webkit-filter: blur(5px) grayscale(0.7); -webkit-filter: blur(5px) grayscale(0.7);
filter: blur(5px) grayscale(0.7); filter: blur(5px) grayscale(0.7);
} }
}
/* Dimmer Color */ /* Dimmer Color */
.blurring.dimmable > .dimmer { .blurring.dimmable > .dimmer {
background: rgba(0, 0, 0, 0.6); background: rgba(0, 0, 0, 0.6);
-webkit-backdrop-filter: blur(5px) grayscale(0.7);
backdrop-filter: blur(5px) grayscale(0.7);
} }
.blurring.dimmable > .inverted.dimmer { .blurring.dimmable > .inverted.dimmer {
background: rgba(255, 255, 255, 0.6); background: rgba(255, 255, 255, 0.6);

18
semantic/dist/components/dimmer.js vendored
View file

@ -192,11 +192,14 @@ $.fn.dimmer = function(parameters) {
? callback ? callback
: function(){} : function(){}
; ;
if( (!module.is.dimmed() || module.is.animating()) && module.is.enabled() ) {
if(settings.onShow.call(element) === false) {
module.verbose('Show callback returned false cancelling dimmer show');
return;
}
module.debug('Showing dimmer', $dimmer, settings); module.debug('Showing dimmer', $dimmer, settings);
module.set.variation(); module.set.variation();
if( (!module.is.dimmed() || module.is.animating()) && module.is.enabled() ) {
module.animate.show(callback); module.animate.show(callback);
settings.onShow.call(element);
settings.onChange.call(element); settings.onChange.call(element);
} }
else { else {
@ -210,9 +213,12 @@ $.fn.dimmer = function(parameters) {
: function(){} : function(){}
; ;
if( module.is.dimmed() || module.is.animating() ) { if( module.is.dimmed() || module.is.animating() ) {
if(settings.onHide.call(element) === false) {
module.verbose('Hide callback returned false cancelling dimmer hide');
return;
}
module.debug('Hiding dimmer', $dimmer); module.debug('Hiding dimmer', $dimmer);
module.animate.hide(callback); module.animate.hide(callback);
settings.onHide.call(element);
settings.onChange.call(element); settings.onChange.call(element);
} }
else { else {
@ -264,6 +270,7 @@ $.fn.dimmer = function(parameters) {
}, },
onComplete : function() { onComplete : function() {
module.set.active(); module.set.active();
settings.onVisible.call($dimmer);
callback(); callback();
} }
}) })
@ -285,6 +292,7 @@ $.fn.dimmer = function(parameters) {
.fadeTo(module.get.duration(), settings.opacity, function() { .fadeTo(module.get.duration(), settings.opacity, function() {
$dimmer.removeAttr('style'); $dimmer.removeAttr('style');
module.set.active(); module.set.active();
settings.onVisible.call($dimmer);
callback(); callback();
}) })
; ;
@ -310,6 +318,7 @@ $.fn.dimmer = function(parameters) {
module.remove.dimmed(); module.remove.dimmed();
module.remove.variation(); module.remove.variation();
module.remove.active(); module.remove.active();
settings.onHidden.call($dimmer);
callback(); callback();
} }
}) })
@ -323,6 +332,7 @@ $.fn.dimmer = function(parameters) {
module.remove.dimmed(); module.remove.dimmed();
module.remove.active(); module.remove.active();
$dimmer.removeAttr('style'); $dimmer.removeAttr('style');
settings.onHidden.call($dimmer);
callback(); callback();
}) })
; ;
@ -704,6 +714,8 @@ $.fn.dimmer.settings = {
onChange : function(){}, onChange : function(){},
onShow : function(){}, onShow : function(){},
onHide : function(){}, onHide : function(){},
onVisible : function(){},
onHidden : function(){},
error : { error : {
method : 'The method you called is not defined.' method : 'The method you called is not defined.'

2
semantic/dist/components/dimmer.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/dimmer.min.js vendored
View file

File diff suppressed because one or more lines are too long

74
semantic/dist/components/divider.css vendored
View file

@ -60,8 +60,8 @@
line-height: 1; line-height: 1;
text-align: center; text-align: center;
} }
.ui.horizontal.divider:before, .ui.horizontal.divider::before,
.ui.horizontal.divider:after { .ui.horizontal.divider::after {
content: ''; content: '';
display: table-cell; display: table-cell;
position: relative; position: relative;
@ -69,10 +69,10 @@
width: 50%; width: 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.ui.horizontal.divider:before { .ui.horizontal.divider::before {
background-position: right 1em top 50%; background-position: right 1em top 50%;
} }
.ui.horizontal.divider:after { .ui.horizontal.divider::after {
background-position: left 1em top 50%; background-position: left 1em top 50%;
} }
@ -94,8 +94,8 @@
-webkit-transform: translateX(-50%); -webkit-transform: translateX(-50%);
transform: translateX(-50%); transform: translateX(-50%);
} }
.ui.vertical.divider:before, .ui.vertical.divider::before,
.ui.vertical.divider:after { .ui.vertical.divider::after {
position: absolute; position: absolute;
left: 50%; left: 50%;
content: ''; content: '';
@ -105,10 +105,10 @@
width: 0; width: 0;
height: calc(100% - 1rem); height: calc(100% - 1rem);
} }
.ui.vertical.divider:before { .ui.vertical.divider::before {
top: -100%; top: -100%;
} }
.ui.vertical.divider:after { .ui.vertical.divider::after {
top: auto; top: auto;
bottom: 0; bottom: 0;
} }
@ -130,10 +130,10 @@
-webkit-transform: none; -webkit-transform: none;
transform: none; transform: none;
} }
.ui.stackable.grid .ui.vertical.divider:before, .ui.stackable.grid .ui.vertical.divider::before,
.ui.grid .stackable.row .ui.vertical.divider:before, .ui.grid .stackable.row .ui.vertical.divider::before,
.ui.stackable.grid .ui.vertical.divider:after, .ui.stackable.grid .ui.vertical.divider::after,
.ui.grid .stackable.row .ui.vertical.divider:after { .ui.grid .stackable.row .ui.vertical.divider::after {
left: 0; left: 0;
border-left: none; border-left: none;
border-right: none; border-right: none;
@ -144,12 +144,12 @@
width: 50%; width: 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.ui.stackable.grid .ui.vertical.divider:before, .ui.stackable.grid .ui.vertical.divider::before,
.ui.grid .stackable.row .ui.vertical.divider:before { .ui.grid .stackable.row .ui.vertical.divider::before {
background-position: right 1em top 50%; background-position: right 1em top 50%;
} }
.ui.stackable.grid .ui.vertical.divider:after, .ui.stackable.grid .ui.vertical.divider::after,
.ui.grid .stackable.row .ui.vertical.divider:after { .ui.grid .stackable.row .ui.vertical.divider::after {
background-position: left 1em top 50%; background-position: left 1em top 50%;
} }
} }
@ -169,16 +169,16 @@
Header Header
---------------*/ ---------------*/
.ui.horizontal.divider[class*="left aligned"]:before { .ui.horizontal.divider[class*="left aligned"]::before {
display: none; display: none;
} }
.ui.horizontal.divider[class*="left aligned"]:after { .ui.horizontal.divider[class*="left aligned"]::after {
width: 100%; width: 100%;
} }
.ui.horizontal.divider[class*="right aligned"]:before { .ui.horizontal.divider[class*="right aligned"]::before {
width: 100%; width: 100%;
} }
.ui.horizontal.divider[class*="right aligned"]:after { .ui.horizontal.divider[class*="right aligned"]::after {
display: none; display: none;
} }
@ -195,8 +195,8 @@
.ui.hidden.divider { .ui.hidden.divider {
border-color: transparent !important; border-color: transparent !important;
} }
.ui.hidden.divider:before, .ui.hidden.divider::before,
.ui.hidden.divider:after { .ui.hidden.divider::after {
display: none; display: none;
} }
@ -210,8 +210,8 @@
color: #FFFFFF; color: #FFFFFF;
} }
.ui.divider.inverted, .ui.divider.inverted,
.ui.divider.inverted:after, .ui.divider.inverted::after,
.ui.divider.inverted:before { .ui.divider.inverted::before {
border-top-color: rgba(34, 36, 38, 0.15) !important; border-top-color: rgba(34, 36, 38, 0.15) !important;
border-left-color: rgba(34, 36, 38, 0.15) !important; border-left-color: rgba(34, 36, 38, 0.15) !important;
border-bottom-color: rgba(255, 255, 255, 0.15) !important; border-bottom-color: rgba(255, 255, 255, 0.15) !important;
@ -251,25 +251,25 @@
font-size: 1rem; font-size: 1rem;
} }
.ui.mini.divider { .ui.mini.divider {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.divider { .ui.tiny.divider {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.divider { .ui.small.divider {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.divider { .ui.large.divider {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.divider { .ui.big.divider {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.divider { .ui.huge.divider {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.divider { .ui.massive.divider {
font-size: 1.75rem; font-size: 1.71428571rem;
} }
@ -277,15 +277,15 @@
Theme Overrides Theme Overrides
*******************************/ *******************************/
.ui.horizontal.divider:before, .ui.horizontal.divider::before,
.ui.horizontal.divider:after { .ui.horizontal.divider::after {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC'); background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC');
} }
@media only screen and (max-width: 767px) { @media only screen and (max-width: 767px) {
.ui.stackable.grid .ui.vertical.divider:before, .ui.stackable.grid .ui.vertical.divider::before,
.ui.grid .stackable.row .ui.vertical.divider:before, .ui.grid .stackable.row .ui.vertical.divider::before,
.ui.stackable.grid .ui.vertical.divider:after, .ui.stackable.grid .ui.vertical.divider::after,
.ui.grid .stackable.row .ui.vertical.divider:after { .ui.grid .stackable.row .ui.vertical.divider::after {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC'); background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC');
} }
} }

2
semantic/dist/components/divider.min.css vendored
View file

File diff suppressed because one or more lines are too long

358
semantic/dist/components/dropdown.css vendored
View file

@ -58,10 +58,10 @@
-webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-transition: opacity 0.1s ease; -webkit-transition: opacity 0.1s ease;
transition: opacity 0.1s ease; transition: opacity 0.1s ease;
z-index: 103; z-index: 11;
will-change: transform, opacity; will-change: transform, opacity;
} }
.ui.dropdown .menu > * { .ui.dropdown .menu > * {
@ -85,7 +85,7 @@
position: relative; position: relative;
width: auto; width: auto;
min-width: 1em; min-width: 1em;
font-size: 1em; font-size: 0.85714286em;
margin: 0 0 0 1em; margin: 0 0 0 1em;
} }
.ui.dropdown .menu > .item .dropdown.icon { .ui.dropdown .menu > .item .dropdown.icon {
@ -117,13 +117,13 @@
display: block; display: block;
border: none; border: none;
height: auto; height: auto;
min-height: 2.5rem; min-height: 2.57142857rem;
text-align: left; text-align: left;
border-top: none; border-top: none;
line-height: 1em; line-height: 1em;
font-size: 1rem; font-size: 1rem;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
padding: 0.75rem 1.16666667rem !important; padding: 0.78571429rem 1.14285714rem;
text-transform: none; text-transform: none;
font-weight: normal; font-weight: normal;
-webkit-box-shadow: none; -webkit-box-shadow: none;
@ -172,13 +172,13 @@
.ui.dropdown .menu > .header { .ui.dropdown .menu > .header {
margin: 1rem 0 0.75rem; margin: 1rem 0 0.75rem;
padding: 0 1.16666667rem; padding: 0 1.14285714rem;
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
} }
.ui.dropdown .menu > .header:not(.ui) { .ui.dropdown .menu > .header:not(.ui) {
color: rgba(0, 0, 0, 0.85); color: rgba(0, 0, 0, 0.85);
font-size: 0.91666667em; font-size: 0.78571429em;
} }
.ui.dropdown .menu > .divider { .ui.dropdown .menu > .divider {
border-top: 1px solid rgba(34, 36, 38, 0.1); border-top: 1px solid rgba(34, 36, 38, 0.1);
@ -188,19 +188,19 @@
.ui.dropdown .menu > .horizontal.divider { .ui.dropdown .menu > .horizontal.divider {
border-top: none; border-top: none;
} }
.ui.dropdown.dropdown .menu > .input { .ui.ui.ui.dropdown .menu > .input {
width: auto; width: auto;
display: -webkit-box; display: -webkit-box;
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
margin: 1.16666667rem 0.75rem; margin: 1.14285714rem 0.78571429rem;
min-width: 10rem; min-width: 10rem;
} }
.ui.dropdown .menu > .header + .input { .ui.dropdown .menu > .header + .input {
margin-top: 0; margin-top: 0;
} }
.ui.dropdown .menu > .input:not(.transparent) input { .ui.dropdown .menu > .input:not(.transparent) input {
padding: 0.5em 1.16666667em; padding: 0.5em 1em;
} }
.ui.dropdown .menu > .input:not(.transparent) .button, .ui.dropdown .menu > .input:not(.transparent) .button,
.ui.dropdown .menu > .input:not(.transparent) i.icon, .ui.dropdown .menu > .input:not(.transparent) i.icon,
@ -236,7 +236,7 @@
-------------------*/ -------------------*/
.ui.dropdown .menu > .message { .ui.dropdown .menu > .message {
padding: 0.75rem 1.16666667rem; padding: 0.78571429rem 1.14285714rem;
font-weight: normal; font-weight: normal;
} }
.ui.dropdown .menu > .message:not(.ui) { .ui.dropdown .menu > .message:not(.ui) {
@ -252,12 +252,12 @@
left: 100%; left: 100%;
right: auto; right: auto;
margin: 0 -0.5em !important; margin: 0 -0.5em !important;
border-radius: 0.33333333rem !important; border-radius: 0.28571429rem !important;
z-index: 21 !important; z-index: 21 !important;
} }
/* Hide Arrow */ /* Hide Arrow */
.ui.dropdown .menu .menu:after { .ui.dropdown .menu .menu::after {
display: none; display: none;
} }
@ -297,7 +297,7 @@
.ui.dropdown .menu > .item > img { .ui.dropdown .menu > .item > img {
margin-left: 0; margin-left: 0;
float: none; float: none;
margin-right: 0.75rem; margin-right: 0.78571429rem;
} }
/*-------------- /*--------------
@ -328,8 +328,8 @@
/* Remove Menu Item Divider */ /* Remove Menu Item Divider */
.ui.dropdown .ui.menu > .item:before, .ui.dropdown .ui.menu > .item::before,
.ui.menu .ui.dropdown .menu > .item:before { .ui.menu .ui.dropdown .menu > .item::before {
display: none; display: none;
} }
@ -365,9 +365,15 @@
.ui.dropdown.icon.button > .dropdown.icon { .ui.dropdown.icon.button > .dropdown.icon {
margin: 0; margin: 0;
} }
.ui.button.dropdown .menu { .ui.dropdown.button .menu {
min-width: 100%; min-width: 100%;
} }
.ui.dropdown.button:not(.pointing):not(.floating).active {
border-radius: 0.28571429rem 0.28571429rem 0 0;
}
.ui.dropdown.button:not(.pointing):not(.floating) > .menu {
border-radius: 0 0 0.28571429rem 0.28571429rem;
}
/******************************* /*******************************
@ -396,15 +402,15 @@ select.ui.dropdown {
-webkit-transform: rotateZ(0deg); -webkit-transform: rotateZ(0deg);
transform: rotateZ(0deg); transform: rotateZ(0deg);
min-width: 14em; min-width: 14em;
min-height: 2.96428571em; min-height: 2.71428571em;
background: #FFFFFF; background: #FFFFFF;
display: inline-block; display: inline-block;
padding: 0.91666667em 3.36666667em 0.91666667em 1.16666667em; padding: 0.78571429em 3.2em 0.78571429em 1em;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-transition: width 0.1s ease, -webkit-box-shadow 0.1s ease; -webkit-transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
transition: width 0.1s ease, -webkit-box-shadow 0.1s ease; transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
transition: box-shadow 0.1s ease, width 0.1s ease; transition: box-shadow 0.1s ease, width 0.1s ease;
@ -422,10 +428,10 @@ select.ui.dropdown {
width: auto; width: auto;
height: auto; height: auto;
line-height: 1.21428571em; line-height: 1.21428571em;
top: 0.91666667em; top: 0.78571429em;
right: 1.16666667em; right: 1em;
z-index: 3; z-index: 3;
margin: -0.91666667em; margin: -0.78571429em;
padding: 0.91666667em; padding: 0.91666667em;
opacity: 0.8; opacity: 0.8;
-webkit-transition: opacity 0.1s ease; -webkit-transition: opacity 0.1s ease;
@ -450,14 +456,14 @@ select.ui.dropdown {
margin: 0 -1px; margin: 0 -1px;
min-width: calc(100% + 2px); min-width: calc(100% + 2px);
width: calc(100% + 2px); width: calc(100% + 2px);
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
-webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
-webkit-transition: opacity 0.1s ease; -webkit-transition: opacity 0.1s ease;
transition: opacity 0.1s ease; transition: opacity 0.1s ease;
} }
.ui.selection.dropdown .menu:after, .ui.selection.dropdown .menu::after,
.ui.selection.dropdown .menu:before { .ui.selection.dropdown .menu::before {
display: none; display: none;
} }
@ -466,81 +472,81 @@ select.ui.dropdown {
---------------*/ ---------------*/
.ui.selection.dropdown .menu > .message { .ui.selection.dropdown .menu > .message {
padding: 0.75rem 1.16666667rem; padding: 0.78571429rem 1.14285714rem;
} }
@media only screen and (max-width: 767.98px) { @media only screen and (max-width: 767.98px) {
.ui.selection.dropdown.short .menu { .ui.selection.dropdown.short .menu {
max-height: 5.85rem; max-height: 6.01071429rem;
} }
.ui.selection.dropdown[class*="very short"] .menu { .ui.selection.dropdown[class*="very short"] .menu {
max-height: 3.9rem; max-height: 4.00714286rem;
} }
.ui.selection.dropdown .menu { .ui.selection.dropdown .menu {
max-height: 7.8rem; max-height: 8.01428571rem;
} }
.ui.selection.dropdown.long .menu { .ui.selection.dropdown.long .menu {
max-height: 15.6rem; max-height: 16.02857143rem;
} }
.ui.selection.dropdown[class*="very long"] .menu { .ui.selection.dropdown[class*="very long"] .menu {
max-height: 23.4rem; max-height: 24.04285714rem;
} }
} }
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
.ui.selection.dropdown.short .menu { .ui.selection.dropdown.short .menu {
max-height: 7.8rem; max-height: 8.01428571rem;
} }
.ui.selection.dropdown[class*="very short"] .menu { .ui.selection.dropdown[class*="very short"] .menu {
max-height: 5.2rem; max-height: 5.34285714rem;
} }
.ui.selection.dropdown .menu { .ui.selection.dropdown .menu {
max-height: 10.4rem; max-height: 10.68571429rem;
} }
.ui.selection.dropdown.long .menu { .ui.selection.dropdown.long .menu {
max-height: 20.8rem; max-height: 21.37142857rem;
} }
.ui.selection.dropdown[class*="very long"] .menu { .ui.selection.dropdown[class*="very long"] .menu {
max-height: 31.2rem; max-height: 32.05714286rem;
} }
} }
@media only screen and (min-width: 992px) { @media only screen and (min-width: 992px) {
.ui.selection.dropdown.short .menu { .ui.selection.dropdown.short .menu {
max-height: 11.7rem; max-height: 12.02142857rem;
} }
.ui.selection.dropdown[class*="very short"] .menu { .ui.selection.dropdown[class*="very short"] .menu {
max-height: 7.8rem; max-height: 8.01428571rem;
} }
.ui.selection.dropdown .menu { .ui.selection.dropdown .menu {
max-height: 15.6rem; max-height: 16.02857143rem;
} }
.ui.selection.dropdown.long .menu { .ui.selection.dropdown.long .menu {
max-height: 31.2rem; max-height: 32.05714286rem;
} }
.ui.selection.dropdown[class*="very long"] .menu { .ui.selection.dropdown[class*="very long"] .menu {
max-height: 46.8rem; max-height: 48.08571429rem;
} }
} }
@media only screen and (min-width: 1920px) { @media only screen and (min-width: 1920px) {
.ui.selection.dropdown.short .menu { .ui.selection.dropdown.short .menu {
max-height: 15.6rem; max-height: 16.02857143rem;
} }
.ui.selection.dropdown[class*="very short"] .menu { .ui.selection.dropdown[class*="very short"] .menu {
max-height: 10.4rem; max-height: 10.68571429rem;
} }
.ui.selection.dropdown .menu { .ui.selection.dropdown .menu {
max-height: 20.8rem; max-height: 21.37142857rem;
} }
.ui.selection.dropdown.long .menu { .ui.selection.dropdown.long .menu {
max-height: 41.6rem; max-height: 42.74285714rem;
} }
.ui.selection.dropdown[class*="very long"] .menu { .ui.selection.dropdown[class*="very long"] .menu {
max-height: 62.4rem; max-height: 64.11428571rem;
} }
} }
/* Menu Item */ /* Menu Item */
.ui.selection.dropdown .menu > .item { .ui.selection.dropdown .menu > .item {
border-top: 1px solid #FAFAFA; border-top: 1px solid #FAFAFA;
padding: 0.75rem 1.16666667rem !important; padding: 0.78571429rem 1.14285714rem;
white-space: normal; white-space: normal;
word-wrap: normal; word-wrap: normal;
} }
@ -558,25 +564,27 @@ select.ui.dropdown {
} }
/* Active */ /* Active */
.ui.selection.simple.dropdown:hover,
.ui.selection.active.dropdown { .ui.selection.active.dropdown {
border-color: #a285df; border-color: #96C8DA;
-webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
} }
.ui.selection.simple.dropdown:hover .menu,
.ui.selection.active.dropdown .menu { .ui.selection.active.dropdown .menu {
border-color: #a285df; border-color: #96C8DA;
-webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
} }
/* Focus */ /* Focus */
.ui.selection.dropdown:focus { .ui.selection.dropdown:focus {
border-color: #a285df; border-color: #96C8DA;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
.ui.selection.dropdown:focus .menu { .ui.selection.dropdown:focus .menu {
border-color: #a285df; border-color: #96C8DA;
-webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
} }
@ -589,12 +597,12 @@ select.ui.dropdown {
/* Visible Hover */ /* Visible Hover */
.ui.selection.active.dropdown:hover { .ui.selection.active.dropdown:hover {
border-color: #a285df; border-color: #96C8DA;
-webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
} }
.ui.selection.active.dropdown:hover .menu { .ui.selection.active.dropdown:hover .menu {
border-color: #a285df; border-color: #96C8DA;
-webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
} }
@ -614,7 +622,7 @@ select.ui.dropdown {
/* Empty Connecting Border */ /* Empty Connecting Border */
.ui.active.empty.selection.dropdown { .ui.active.empty.selection.dropdown {
border-radius: 0.33333333rem !important; border-radius: 0.28571429rem !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
} }
@ -627,7 +635,7 @@ select.ui.dropdown {
/* CSS specific to iOS devices or firefox mobile only */ /* CSS specific to iOS devices or firefox mobile only */
@supports (-webkit-touch-callout: none) or (-webkit-overflow-scrolling: touch) or (-moz-appearance:none) { @supports (-webkit-touch-callout: none) or (-webkit-overflow-scrolling: touch) or (-moz-appearance:none) {
@media (-moz-touch-enabled), (pointer: coarse) { @media (-moz-touch-enabled), (pointer: coarse) {
.ui.dropdown .scrollhint.menu:not(.hidden):before { .ui.dropdown .scrollhint.menu:not(.hidden)::before {
-webkit-animation: scrollhint 2s ease 2; -webkit-animation: scrollhint 2s ease 2;
animation: scrollhint 2s ease 2; animation: scrollhint 2s ease 2;
content: ''; content: '';
@ -646,7 +654,7 @@ select.ui.dropdown {
border-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.75)), to(rgba(0, 0, 0, 0))) 1 100%; border-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.75)), to(rgba(0, 0, 0, 0))) 1 100%;
border-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)) 1 100%; border-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)) 1 100%;
} }
.ui.inverted.dropdown .scrollhint.menu:not(.hidden):before { .ui.inverted.dropdown .scrollhint.menu:not(.hidden)::before {
-webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.75)), to(rgba(255, 255, 255, 0))) 1 100%; -webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.75)), to(rgba(255, 255, 255, 0))) 1 100%;
-webkit-border-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0)) 1 100%; -webkit-border-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0)) 1 100%;
-o-border-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0)) 1 100%; -o-border-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0)) 1 100%;
@ -716,13 +724,13 @@ select.ui.dropdown {
/* Search Selection */ /* Search Selection */
.ui.search.selection.dropdown > input.search { .ui.search.selection.dropdown > input.search {
line-height: 1.21428571em; line-height: 1.21428571em;
padding: 0.80952381em 3.36666667em 0.80952381em 1.16666667em; padding: 0.67857143em 3.2em 0.67857143em 1em;
} }
/* Used to size multi select input to character width */ /* Used to size multi select input to character width */
.ui.search.selection.dropdown > span.sizer { .ui.search.selection.dropdown > span.sizer {
line-height: 1.21428571em; line-height: 1.21428571em;
padding: 0.80952381em 3.36666667em 0.80952381em 1.16666667em; padding: 0.67857143em 3.2em 0.67857143em 1em;
display: none; display: none;
white-space: pre; white-space: pre;
} }
@ -759,33 +767,33 @@ select.ui.dropdown {
} }
@media only screen and (max-width: 767.98px) { @media only screen and (max-width: 767.98px) {
.ui.search.dropdown .menu { .ui.search.dropdown .menu {
max-height: 7.8rem; max-height: 8.01428571rem;
} }
} }
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
.ui.search.dropdown .menu { .ui.search.dropdown .menu {
max-height: 10.4rem; max-height: 10.68571429rem;
} }
} }
@media only screen and (min-width: 992px) { @media only screen and (min-width: 992px) {
.ui.search.dropdown .menu { .ui.search.dropdown .menu {
max-height: 15.6rem; max-height: 16.02857143rem;
} }
} }
@media only screen and (min-width: 1920px) { @media only screen and (min-width: 1920px) {
.ui.search.dropdown .menu { .ui.search.dropdown .menu {
max-height: 20.8rem; max-height: 21.37142857rem;
} }
} }
/* Clearable Selection */ /* Clearable Selection */
.ui.dropdown > .remove.icon { .ui.dropdown > .remove.icon {
cursor: pointer; cursor: pointer;
font-size: 1em; font-size: 0.85714286em;
margin: -0.91666667em; margin: -0.78571429em;
padding: 0.91666667em; padding: 0.91666667em;
right: 2em; right: 2em;
top: 0.91666667em; top: 0.78571429em;
position: absolute; position: absolute;
opacity: 0.6; opacity: 0.6;
z-index: 3; z-index: 3;
@ -820,7 +828,7 @@ select.ui.dropdown {
/* Multiple Selection */ /* Multiple Selection */
.ui.ui.multiple.dropdown { .ui.ui.multiple.dropdown {
padding: 0.26984127em 3.36666667em 0.26984127em 0.41666667em; padding: 0.22619048em 3.2em 0.22619048em 0.35714286em;
} }
.ui.multiple.dropdown .menu { .ui.multiple.dropdown .menu {
cursor: auto; cursor: auto;
@ -831,8 +839,8 @@ select.ui.dropdown {
display: inline-block; display: inline-block;
white-space: normal; white-space: normal;
font-size: 1em; font-size: 1em;
padding: 0.41666667em 0.75em; padding: 0.35714286em 0.78571429em;
margin: 0.16666667rem 0.33333333rem 0.16666667rem 0; margin: 0.14285714rem 0.28571429rem 0.14285714rem 0;
-webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
} }
@ -848,8 +856,8 @@ select.ui.dropdown {
position: static; position: static;
padding: 0; padding: 0;
max-width: 100%; max-width: 100%;
margin: 0.53968254em 0 0.53968254em 0.75em; margin: 0.45238095em 0 0.45238095em 0.64285714em;
line-height: 1.41666667em; line-height: 1.21428571em;
} }
.ui.multiple.dropdown > .text.default { .ui.multiple.dropdown > .text.default {
white-space: nowrap; white-space: nowrap;
@ -857,20 +865,20 @@ select.ui.dropdown {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.ui.multiple.dropdown > .label ~ input.search { .ui.multiple.dropdown > .label ~ input.search {
margin-left: 0.16666667em !important; margin-left: 0.14285714em !important;
} }
.ui.multiple.dropdown > .label ~ .text { .ui.multiple.dropdown > .label ~ .text {
display: none; display: none;
} }
.ui.multiple.dropdown > .label:not(.image) > img:not(.centered) { .ui.multiple.dropdown > .label:not(.image) > img:not(.centered) {
margin-right: 0.75rem; margin-right: 0.78571429rem;
} }
.ui.multiple.dropdown > .label:not(.image) > img.ui:not(.avatar) { .ui.multiple.dropdown > .label:not(.image) > img.ui:not(.avatar) {
margin-bottom: 0.375rem; margin-bottom: 0.39285714rem;
} }
.ui.multiple.dropdown > .image.label img { .ui.multiple.dropdown > .image.label img {
margin: -0.41666667em 0.75em -0.41666667em -0.75em; margin: -0.35714286em 0.78571429em -0.35714286em -0.78571429em;
height: 1.83333333em; height: 1.71428571em;
} }
/*----------------- /*-----------------
@ -891,8 +899,8 @@ select.ui.dropdown {
top: 0; top: 0;
left: 0; left: 0;
padding: inherit; padding: inherit;
margin: 0.53968254em 0 0.53968254em 0.75em; margin: 0.45238095em 0 0.45238095em 0.64285714em;
line-height: 1.41666667em; line-height: 1.21428571em;
} }
.ui.multiple.search.dropdown > .label ~ .text { .ui.multiple.search.dropdown > .label ~ .text {
display: none; display: none;
@ -903,9 +911,9 @@ select.ui.dropdown {
position: static; position: static;
padding: 0; padding: 0;
max-width: 100%; max-width: 100%;
margin: 0.53968254em 0 0.53968254em 0.75em; margin: 0.45238095em 0 0.45238095em 0.64285714em;
width: 2.2em; width: 2.2em;
line-height: 1.41666667em; line-height: 1.21428571em;
} }
.ui.multiple.search.dropdown.button { .ui.multiple.search.dropdown.button {
min-width: 14em; min-width: 14em;
@ -921,7 +929,7 @@ select.ui.dropdown {
color: inherit; color: inherit;
} }
.ui.inline.dropdown .dropdown.icon { .ui.inline.dropdown .dropdown.icon {
margin: 0 0.25em 0 0.25em; margin: 0 0.21428571em 0 0.21428571em;
vertical-align: baseline; vertical-align: baseline;
} }
.ui.inline.dropdown > .text { .ui.inline.dropdown > .text {
@ -929,8 +937,8 @@ select.ui.dropdown {
} }
.ui.inline.dropdown .menu { .ui.inline.dropdown .menu {
cursor: auto; cursor: auto;
margin-top: 0.25em; margin-top: 0.21428571em;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
@ -951,7 +959,7 @@ select.ui.dropdown {
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
z-index: 104; z-index: 12;
} }
/*-------------------- /*--------------------
@ -963,7 +971,7 @@ select.ui.dropdown {
.ui.dropdown .menu > .item:hover { .ui.dropdown .menu > .item:hover {
background: rgba(0, 0, 0, 0.05); background: rgba(0, 0, 0, 0.05);
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
z-index: 105; z-index: 13;
} }
/*-------------------- /*--------------------
@ -984,32 +992,32 @@ select.ui.dropdown {
---------------------*/ ---------------------*/
.ui.loading.dropdown > i.icon { .ui.loading.dropdown > i.icon {
height: 1.16666667em !important; height: 1em !important;
} }
.ui.loading.selection.dropdown > i.icon { .ui.loading.selection.dropdown > i.icon {
padding: 1.75em 1.5em !important; padding: 1.5em 1.28571429em !important;
} }
.ui.loading.dropdown > i.icon:before { .ui.loading.dropdown > i.icon::before {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
left: 50%; left: 50%;
margin: -0.625em 0 0 -0.625em; margin: -0.64285714em 0 0 -0.64285714em;
width: 1.25em; width: 1.28571429em;
height: 1.25em; height: 1.28571429em;
border-radius: 500rem; border-radius: 500rem;
border: 0.2em solid rgba(0, 0, 0, 0.1); border: 0.2em solid rgba(0, 0, 0, 0.1);
} }
.ui.loading.dropdown > i.icon:after { .ui.loading.dropdown > i.icon::after {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
left: 50%; left: 50%;
-webkit-box-shadow: 0 0 0 1px transparent; -webkit-box-shadow: 0 0 0 1px transparent;
box-shadow: 0 0 0 1px transparent; box-shadow: 0 0 0 1px transparent;
margin: -0.625em 0 0 -0.625em; margin: -0.64285714em 0 0 -0.64285714em;
width: 1.25em; width: 1.28571429em;
height: 1.25em; height: 1.28571429em;
-webkit-animation: loader 0.6s infinite linear; -webkit-animation: loader 0.6s infinite linear;
animation: loader 0.6s infinite linear; animation: loader 0.6s infinite linear;
border: 0.2em solid #767676; border: 0.2em solid #767676;
@ -1017,8 +1025,8 @@ select.ui.dropdown {
} }
/* Coupling */ /* Coupling */
.ui.loading.dropdown.button > i.icon:before, .ui.loading.dropdown.button > i.icon::before,
.ui.loading.dropdown.button > i.icon:after { .ui.loading.dropdown.button > i.icon::after {
display: none; display: none;
} }
.ui.loading.dropdown > .text { .ui.loading.dropdown > .text {
@ -1257,7 +1265,7 @@ select.ui.dropdown {
.ui.dropdown .menu .right.menu { .ui.dropdown .menu .right.menu {
left: 100% !important; left: 100% !important;
right: auto !important; right: auto !important;
border-radius: 0.33333333rem !important; border-radius: 0.28571429rem !important;
} }
/* Leftward Opening Menu */ /* Leftward Opening Menu */
@ -1270,7 +1278,7 @@ select.ui.dropdown {
left: auto; left: auto;
right: 100%; right: 100%;
margin: 0 -0.5em 0 0 !important; margin: 0 -0.5em 0 0 !important;
border-radius: 0.33333333rem !important; border-radius: 0.28571429rem !important;
} }
.ui.dropdown .item .left.dropdown.icon, .ui.dropdown .item .left.dropdown.icon,
.ui.dropdown .left.menu .item .dropdown.icon { .ui.dropdown .left.menu .item .dropdown.icon {
@ -1301,7 +1309,6 @@ select.ui.dropdown {
bottom: 100%; bottom: 100%;
-webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08); -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08);
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08);
border-radius: 0.33333333rem 0.33333333rem 0 0;
} }
/* Upward Sub Menu */ /* Upward Sub Menu */
@ -1313,18 +1320,24 @@ select.ui.dropdown {
/* Active Upward */ /* Active Upward */
.ui.simple.upward.active.dropdown, .ui.simple.upward.active.dropdown,
.ui.simple.upward.dropdown:hover { .ui.simple.upward.dropdown:hover {
border-radius: 0.33333333rem 0.33333333rem 0 0 !important; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
/* Button */
.ui.upward.dropdown.button:not(.pointing):not(.floating).active { .ui.upward.dropdown.button:not(.pointing):not(.floating).active {
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0 0 0.28571429rem 0.28571429rem;
}
.ui.upward.dropdown.button:not(.pointing):not(.floating) > .menu {
border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
/* Selection */ /* Selection */
.ui.upward.selection.dropdown .menu { .ui.ui.upward.selection.dropdown .menu {
border-top-width: 1px !important; border-top-width: 1px !important;
border-bottom-width: 0 !important; border-bottom-width: 0 !important;
-webkit-box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.08); -webkit-box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.08);
box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.08);
border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui.upward.selection.dropdown:hover { .ui.upward.selection.dropdown:hover {
-webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.05); -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.05);
@ -1333,14 +1346,14 @@ select.ui.dropdown {
/* Active Upward */ /* Active Upward */
.ui.active.upward.selection.dropdown { .ui.active.upward.selection.dropdown {
border-radius: 0 0 0.33333333rem 0.33333333rem !important; border-radius: 0 0 0.28571429rem 0.28571429rem !important;
} }
/* Visible Upward */ /* Visible Upward */
.ui.upward.selection.dropdown.visible { .ui.upward.selection.dropdown.visible {
-webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08); -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08);
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08);
border-radius: 0 0 0.33333333rem 0.33333333rem !important; border-radius: 0 0 0.28571429rem 0.28571429rem !important;
} }
/* Visible Hover Upward */ /* Visible Hover Upward */
@ -1408,25 +1421,25 @@ select.ui.dropdown {
@media only screen and (max-width: 767.98px) { @media only screen and (max-width: 767.98px) {
.ui.scrolling.dropdown .menu, .ui.scrolling.dropdown .menu,
.ui.dropdown .scrolling.menu { .ui.dropdown .scrolling.menu {
max-height: 10rem; max-height: 10.28571429rem;
} }
} }
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
.ui.scrolling.dropdown .menu, .ui.scrolling.dropdown .menu,
.ui.dropdown .scrolling.menu { .ui.dropdown .scrolling.menu {
max-height: 15rem; max-height: 15.42857143rem;
} }
} }
@media only screen and (min-width: 992px) { @media only screen and (min-width: 992px) {
.ui.scrolling.dropdown .menu, .ui.scrolling.dropdown .menu,
.ui.dropdown .scrolling.menu { .ui.dropdown .scrolling.menu {
max-height: 20rem; max-height: 20.57142857rem;
} }
} }
@media only screen and (min-width: 1920px) { @media only screen and (min-width: 1920px) {
.ui.scrolling.dropdown .menu, .ui.scrolling.dropdown .menu,
.ui.dropdown .scrolling.menu { .ui.dropdown .scrolling.menu {
max-height: 20rem; max-height: 20.57142857rem;
} }
} }
@ -1480,8 +1493,8 @@ select.ui.dropdown {
/* Displays without javascript */ /* Displays without javascript */
.ui.simple.dropdown .menu:before, .ui.simple.dropdown .menu::before,
.ui.simple.dropdown .menu:after { .ui.simple.dropdown .menu::after {
display: none; display: none;
} }
.ui.simple.dropdown .menu { .ui.simple.dropdown .menu {
@ -1499,14 +1512,23 @@ select.ui.dropdown {
transition: opacity 0.1s ease; transition: opacity 0.1s ease;
margin-top: 0 !important; margin-top: 0 !important;
} }
.ui.simple.dropdown .upward.menu {
margin-bottom: 1.5em;
}
.ui.simple.selection.dropdown .upward.menu {
margin-bottom: 2.5em;
}
.ui.menu:not(.vertical) .ui.simple.dropdown.item .upward.menu {
margin-bottom: 2.8em;
}
.ui.simple.active.dropdown, .ui.simple.active.dropdown,
.ui.simple.dropdown:hover { .ui.simple.dropdown:hover {
border-bottom-left-radius: 0 !important; border-bottom-left-radius: 0;
border-bottom-right-radius: 0 !important; border-bottom-right-radius: 0;
} }
.ui.simple.active.dropdown > .menu, .ui.simple.active.dropdown > .menu,
.ui.simple.dropdown:hover > .menu { .ui.simple.dropdown:hover > .menu {
overflow: visible; overflow: auto;
width: auto; width: auto;
height: auto; height: auto;
top: 100%; top: 100%;
@ -1514,7 +1536,7 @@ select.ui.dropdown {
} }
.ui.simple.dropdown > .menu > .item:active > .menu, .ui.simple.dropdown > .menu > .item:active > .menu,
.ui.simple.dropdown .menu .item:hover > .menu { .ui.simple.dropdown .menu .item:hover > .menu {
overflow: visible; overflow: auto;
width: auto; width: auto;
height: auto; height: auto;
top: 0 !important; top: 0 !important;
@ -1569,10 +1591,10 @@ select.ui.dropdown {
right: auto; right: auto;
-webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15) !important; -webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15) !important;
box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15) !important; box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15) !important;
border-radius: 0.33333333rem !important; border-radius: 0.28571429rem !important;
} }
.ui.floating.dropdown > .menu { .ui.floating.dropdown > .menu {
border-radius: 0.33333333rem !important; border-radius: 0.28571429rem !important;
} }
.ui:not(.upward).floating.dropdown > .menu { .ui:not(.upward).floating.dropdown > .menu {
margin-top: 0.5em; margin-top: 0.5em;
@ -1587,10 +1609,10 @@ select.ui.dropdown {
.ui.pointing.dropdown > .menu { .ui.pointing.dropdown > .menu {
top: 100%; top: 100%;
margin-top: 0.75rem; margin-top: 0.78571429rem;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
.ui.pointing.dropdown > .menu:not(.hidden):after { .ui.pointing.dropdown > .menu:not(.hidden)::after {
display: block; display: block;
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;
@ -1598,17 +1620,17 @@ select.ui.dropdown {
visibility: visible; visibility: visible;
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
width: 0.58333333em; width: 0.5em;
height: 0.58333333em; height: 0.5em;
-webkit-box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15);
box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15); box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15);
background: #FFFFFF; background: #FFFFFF;
z-index: 2; z-index: 2;
} }
.ui.pointing.dropdown > .menu:not(.hidden):after { .ui.pointing.dropdown > .menu:not(.hidden)::after {
top: -0.29166667em; top: -0.25em;
left: 50%; left: 50%;
margin: 0 0 0 -0.29166667em; margin: 0 0 0 -0.25em;
} }
/* Top Left Pointing */ /* Top Left Pointing */
@ -1626,8 +1648,8 @@ select.ui.dropdown {
right: auto; right: auto;
margin: 1em 0 0; margin: 1em 0 0;
} }
.ui.top.left.pointing.dropdown > .menu:after { .ui.top.left.pointing.dropdown > .menu::after {
top: -0.29166667em; top: -0.25em;
left: 1em; left: 1em;
right: auto; right: auto;
margin: 0; margin: 0;
@ -1643,9 +1665,9 @@ select.ui.dropdown {
left: auto; left: auto;
margin: 1em 0 0; margin: 1em 0 0;
} }
.ui.top.pointing.dropdown > .left.menu:after, .ui.top.pointing.dropdown > .left.menu::after,
.ui.top.right.pointing.dropdown > .menu:after { .ui.top.right.pointing.dropdown > .menu::after {
top: -0.29166667em; top: -0.25em;
left: auto !important; left: auto !important;
right: 1em !important; right: 1em !important;
margin: 0; margin: 0;
@ -1660,9 +1682,9 @@ select.ui.dropdown {
right: auto; right: auto;
margin: 0 0 0 1em; margin: 0 0 0 1em;
} }
.ui.left.pointing.dropdown > .menu:after { .ui.left.pointing.dropdown > .menu::after {
top: 1em; top: 1em;
left: -0.29166667em; left: -0.25em;
margin: 0 0 0 0; margin: 0 0 0 0;
-webkit-transform: rotate(-45deg); -webkit-transform: rotate(-45deg);
transform: rotate(-45deg); transform: rotate(-45deg);
@ -1672,10 +1694,10 @@ select.ui.dropdown {
right: 100% !important; right: 100% !important;
margin: 0 1em 0 0; margin: 0 1em 0 0;
} }
.ui.left:not(.top):not(.bottom).pointing.dropdown > .left.menu:after { .ui.left:not(.top):not(.bottom).pointing.dropdown > .left.menu::after {
top: 1em; top: 1em;
left: auto; left: auto;
right: -0.29166667em; right: -0.25em;
margin: 0 0 0 0; margin: 0 0 0 0;
-webkit-transform: rotate(135deg); -webkit-transform: rotate(135deg);
transform: rotate(135deg); transform: rotate(135deg);
@ -1688,10 +1710,10 @@ select.ui.dropdown {
right: 100%; right: 100%;
margin: 0 1em 0 0; margin: 0 1em 0 0;
} }
.ui.right.pointing.dropdown > .menu:after { .ui.right.pointing.dropdown > .menu::after {
top: 1em; top: 1em;
left: auto; left: auto;
right: -0.29166667em; right: -0.25em;
margin: 0 0 0 0; margin: 0 0 0 0;
-webkit-transform: rotate(135deg); -webkit-transform: rotate(135deg);
transform: rotate(135deg); transform: rotate(135deg);
@ -1705,9 +1727,9 @@ select.ui.dropdown {
right: auto; right: auto;
margin: 0 0 1em; margin: 0 0 1em;
} }
.ui.bottom.pointing.dropdown > .menu:after { .ui.bottom.pointing.dropdown > .menu::after {
top: auto; top: auto;
bottom: -0.29166667em; bottom: -0.25em;
right: auto; right: auto;
margin: 0; margin: 0;
-webkit-transform: rotate(-135deg); -webkit-transform: rotate(-135deg);
@ -1725,7 +1747,7 @@ select.ui.dropdown {
left: 0; left: 0;
right: auto; right: auto;
} }
.ui.bottom.left.pointing.dropdown > .menu:after { .ui.bottom.left.pointing.dropdown > .menu::after {
left: 1em; left: 1em;
right: auto; right: auto;
} }
@ -1735,7 +1757,7 @@ select.ui.dropdown {
right: 0; right: 0;
left: auto; left: auto;
} }
.ui.bottom.right.pointing.dropdown > .menu:after { .ui.bottom.right.pointing.dropdown > .menu::after {
left: auto; left: auto;
right: 1em; right: 1em;
} }
@ -1745,16 +1767,16 @@ select.ui.dropdown {
.ui.top.pointing.upward.dropdown .menu { .ui.top.pointing.upward.dropdown .menu {
top: auto !important; top: auto !important;
bottom: 100% !important; bottom: 100% !important;
margin: 0 0 0.75rem; margin: 0 0 0.78571429rem;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
.ui.pointing.upward.dropdown .menu:after, .ui.pointing.upward.dropdown .menu::after,
.ui.top.pointing.upward.dropdown .menu:after { .ui.top.pointing.upward.dropdown .menu::after {
top: 100% !important; top: 100% !important;
bottom: auto !important; bottom: auto !important;
-webkit-box-shadow: 1px 1px 0 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 1px 1px 0 0 rgba(34, 36, 38, 0.15);
box-shadow: 1px 1px 0 0 rgba(34, 36, 38, 0.15); box-shadow: 1px 1px 0 0 rgba(34, 36, 38, 0.15);
margin: -0.29166667em 0 0; margin: -0.25em 0 0;
} }
/* Right Pointing Upward */ /* Right Pointing Upward */
@ -1763,7 +1785,7 @@ select.ui.dropdown {
bottom: 0 !important; bottom: 0 !important;
margin: 0 1em 0 0; margin: 0 1em 0 0;
} }
.ui.right.pointing.upward.dropdown:not(.top):not(.bottom) .menu:after { .ui.right.pointing.upward.dropdown:not(.top):not(.bottom) .menu::after {
top: auto !important; top: auto !important;
bottom: 0 !important; bottom: 0 !important;
margin: 0 0 1em 0; margin: 0 0 1em 0;
@ -1777,7 +1799,7 @@ select.ui.dropdown {
bottom: 0 !important; bottom: 0 !important;
margin: 0 0 0 1em; margin: 0 0 0 1em;
} }
.ui.left.pointing.upward.dropdown:not(.top):not(.bottom) .menu:after { .ui.left.pointing.upward.dropdown:not(.top):not(.bottom) .menu::after {
top: auto !important; top: auto !important;
bottom: 0 !important; bottom: 0 !important;
margin: 0 0 1em 0; margin: 0 0 1em 0;
@ -1795,31 +1817,31 @@ select.ui.dropdown {
} }
.ui.mini.dropdown, .ui.mini.dropdown,
.ui.mini.dropdown .menu > .item { .ui.mini.dropdown .menu > .item {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.dropdown, .ui.tiny.dropdown,
.ui.tiny.dropdown .menu > .item { .ui.tiny.dropdown .menu > .item {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.dropdown, .ui.small.dropdown,
.ui.small.dropdown .menu > .item { .ui.small.dropdown .menu > .item {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.dropdown, .ui.large.dropdown,
.ui.large.dropdown .menu > .item { .ui.large.dropdown .menu > .item {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.dropdown, .ui.big.dropdown,
.ui.big.dropdown .menu > .item { .ui.big.dropdown .menu > .item {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.dropdown, .ui.huge.dropdown,
.ui.huge.dropdown .menu > .item { .ui.huge.dropdown .menu > .item {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.dropdown, .ui.massive.dropdown,
.ui.massive.dropdown .menu > .item { .ui.massive.dropdown .menu > .item {
font-size: 1.75rem; font-size: 1.71428571rem;
} }
/*-------------- /*--------------
@ -1893,6 +1915,8 @@ select.ui.dropdown {
.ui.inverted.selection.visible.dropdown > .text:not(.default) { .ui.inverted.selection.visible.dropdown > .text:not(.default) {
color: rgba(255, 255, 255, 0.9); color: rgba(255, 255, 255, 0.9);
} }
.ui.selection.simple.dropdown:hover .inverted.menu,
.ui.inverted.selection.simple.dropdown:hover .menu,
.ui.selection.active.dropdown .inverted.menu, .ui.selection.active.dropdown .inverted.menu,
.ui.inverted.selection.active.dropdown .menu, .ui.inverted.selection.active.dropdown .menu,
.ui.inverted.selection.active.dropdown:hover { .ui.inverted.selection.active.dropdown:hover {
@ -1989,8 +2013,20 @@ select.ui.dropdown {
.ui.inverted.dropdown .menu::-webkit-scrollbar-thumb:hover { .ui.inverted.dropdown .menu::-webkit-scrollbar-thumb:hover {
background: rgba(255, 255, 255, 0.35); background: rgba(255, 255, 255, 0.35);
} }
.ui.pointing.dropdown > .inverted.menu:after, .ui.dropdown .inverted.menu,
.ui.inverted.pointing.dropdown > .menu:after { .ui.inverted.dropdown .menu {
/* IE11 */
scrollbar-face-color: #656565;
scrollbar-shadow-color: #656565;
scrollbar-track-color: #323232;
scrollbar-arrow-color: #323232;
/* firefox : first color thumb, second track */
scrollbar-color: rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.1);
}
.ui.pointing.dropdown > .inverted.menu::after,
.ui.inverted.pointing.dropdown > .menu::after {
background: #1B1C1D; background: #1B1C1D;
-webkit-box-shadow: -1px -1px 0 0 rgba(255, 255, 255, 0.15); -webkit-box-shadow: -1px -1px 0 0 rgba(255, 255, 255, 0.15);
box-shadow: -1px -1px 0 0 rgba(255, 255, 255, 0.15); box-shadow: -1px -1px 0 0 rgba(255, 255, 255, 0.15);
@ -2023,21 +2059,21 @@ select.ui.dropdown {
.ui.dropdown > .dropdown.icon { .ui.dropdown > .dropdown.icon {
width: auto; width: auto;
} }
.ui.dropdown > .dropdown.icon:before { .ui.dropdown > .dropdown.icon::before {
content: '\f0d7'; content: '\f0d7';
} }
/* Sub Menu */ /* Sub Menu */
.ui.dropdown .menu .item .dropdown.icon:before { .ui.dropdown .menu .item .dropdown.icon::before {
content: '\f0da' /*rtl:'\f0d9'*/; content: '\f0da' /*rtl:'\f0d9'*/;
} }
.ui.dropdown .item .left.dropdown.icon:before, .ui.dropdown .item .left.dropdown.icon::before,
.ui.dropdown .left.menu .item .dropdown.icon:before { .ui.dropdown .left.menu .item .dropdown.icon::before {
content: "\f0d9" /*rtl:"\f0da"*/; content: "\f0d9" /*rtl:"\f0da"*/;
} }
/* Vertical Menu Dropdown */ /* Vertical Menu Dropdown */
.ui.vertical.menu .dropdown.item > .dropdown.icon:before { .ui.vertical.menu .dropdown.item > .dropdown.icon::before {
content: "\f0da" /*rtl:"\f0d9"*/; content: "\f0da" /*rtl:"\f0d9"*/;
} }
/* Icons for Reference /* Icons for Reference

261
semantic/dist/components/dropdown.js vendored
View file

@ -30,11 +30,6 @@ $.fn.dropdown = function(parameters) {
moduleSelector = $allModules.selector || '', moduleSelector = $allModules.selector || '',
hasTouch = ('ontouchstart' in document.documentElement),
clickEvent = hasTouch
? 'touchstart'
: 'click',
time = new Date().getTime(), time = new Date().getTime(),
performance = [], performance = [],
@ -66,7 +61,7 @@ $.fn.dropdown = function(parameters) {
moduleNamespace = 'module-' + namespace, moduleNamespace = 'module-' + namespace,
$module = $(this), $module = $(this),
$context = $(settings.context), $context = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context),
$text = $module.find(selector.text), $text = $module.find(selector.text),
$search = $module.find(selector.search), $search = $module.find(selector.search),
$sizer = $module.find(selector.sizer), $sizer = $module.find(selector.sizer),
@ -200,6 +195,7 @@ $.fn.dropdown = function(parameters) {
select: function() { select: function() {
if(module.has.input() && selectObserver) { if(module.has.input() && selectObserver) {
selectObserver.observe($module[0], { selectObserver.observe($module[0], {
attributes: true,
childList : true, childList : true,
subtree : true subtree : true
}); });
@ -224,7 +220,7 @@ $.fn.dropdown = function(parameters) {
create: { create: {
id: function() { id: function() {
id = (Math.random().toString(16) + '000000000').substr(2, 8); id = (Math.random().toString(16) + '000000000').slice(2, 10);
elementNamespace = '.' + id; elementNamespace = '.' + id;
module.verbose('Creating unique id for element', id); module.verbose('Creating unique id for element', id);
}, },
@ -421,6 +417,9 @@ $.fn.dropdown = function(parameters) {
module.debug('Disabling dropdown'); module.debug('Disabling dropdown');
$module.addClass(className.disabled); $module.addClass(className.disabled);
} }
if($input.is('[required]')) {
settings.forceSelection = true;
}
$input $input
.removeAttr('required') .removeAttr('required')
.removeAttr('class') .removeAttr('class')
@ -537,9 +536,7 @@ $.fn.dropdown = function(parameters) {
} }
if(settings.onShow.call(element) !== false) { if(settings.onShow.call(element) !== false) {
module.animate.show(function() { module.animate.show(function() {
if( module.can.click() ) {
module.bind.intent(); module.bind.intent();
}
if(module.has.search() && !preventFocus) { if(module.has.search() && !preventFocus) {
module.focusSearch(); module.focusSearch();
} }
@ -560,14 +557,23 @@ $.fn.dropdown = function(parameters) {
if(settings.onHide.call(element) !== false) { if(settings.onHide.call(element) !== false) {
module.animate.hide(function() { module.animate.hide(function() {
module.remove.visible(); module.remove.visible();
// hidding search focus // hiding search focus
if ( module.is.focusedOnSearch() && preventBlur !== true ) { if ( module.is.focusedOnSearch() && preventBlur !== true ) {
$search.blur(); $search.blur();
} }
callback.call(element); callback.call(element);
}); });
// Hide submenus explicitly. On some browsers (esp. mobile), they will not automatically receive a
// mouseleave event
var $subMenu = $module.find(selector.menu);
if($subMenu.length > 0) {
module.verbose('Hiding sub-menu', $subMenu);
$subMenu.each(function() {
module.animate.hide(false, $(this));
});
} }
} else if( module.can.click() ) { }
} else {
module.unbind.intent(); module.unbind.intent();
} }
iconClicked = false; iconClicked = false;
@ -625,13 +631,18 @@ $.fn.dropdown = function(parameters) {
$module $module
.on('change' + eventNamespace, selector.input, module.event.change) .on('change' + eventNamespace, selector.input, module.event.change)
; ;
if(module.is.multiple() && module.is.searchSelection()) {
$module
.on('paste' + eventNamespace, selector.search, module.event.paste)
;
}
}, },
mouseEvents: function() { mouseEvents: function() {
module.verbose('Binding mouse events'); module.verbose('Binding mouse events');
if(module.is.multiple()) { if(module.is.multiple()) {
$module $module
.on(clickEvent + eventNamespace, selector.label, module.event.label.click) .on('click' + eventNamespace, selector.label, module.event.label.click)
.on(clickEvent + eventNamespace, selector.remove, module.event.remove.click) .on('click' + eventNamespace, selector.remove, module.event.remove.click)
; ;
} }
if( module.is.searchSelection() ) { if( module.is.searchSelection() ) {
@ -640,31 +651,33 @@ $.fn.dropdown = function(parameters) {
.on('mouseup' + eventNamespace, module.event.mouseup) .on('mouseup' + eventNamespace, module.event.mouseup)
.on('mousedown' + eventNamespace, selector.menu, module.event.menu.mousedown) .on('mousedown' + eventNamespace, selector.menu, module.event.menu.mousedown)
.on('mouseup' + eventNamespace, selector.menu, module.event.menu.mouseup) .on('mouseup' + eventNamespace, selector.menu, module.event.menu.mouseup)
.on(clickEvent + eventNamespace, selector.icon, module.event.icon.click) .on('click' + eventNamespace, selector.icon, module.event.icon.click)
.on(clickEvent + eventNamespace, selector.clearIcon, module.event.clearIcon.click) .on('click' + eventNamespace, selector.clearIcon, module.event.clearIcon.click)
.on('focus' + eventNamespace, selector.search, module.event.search.focus) .on('focus' + eventNamespace, selector.search, module.event.search.focus)
.on(clickEvent + eventNamespace, selector.search, module.event.search.focus) .on('click' + eventNamespace, selector.search, module.event.search.focus)
.on('blur' + eventNamespace, selector.search, module.event.search.blur) .on('blur' + eventNamespace, selector.search, module.event.search.blur)
.on(clickEvent + eventNamespace, selector.text, module.event.text.focus) .on('click' + eventNamespace, selector.text, module.event.text.focus)
; ;
if(module.is.multiple()) { if(module.is.multiple()) {
$module $module
.on(clickEvent + eventNamespace, module.event.click) .on('click' + eventNamespace, module.event.click)
.on(clickEvent + eventNamespace, module.event.search.focus) .on('click' + eventNamespace, module.event.search.focus)
; ;
} }
} }
else { else {
if(settings.on == 'click') { if(settings.on == 'click') {
$module $module
.on(clickEvent + eventNamespace, selector.icon, module.event.icon.click) .on('click' + eventNamespace, selector.icon, module.event.icon.click)
.on(clickEvent + eventNamespace, module.event.test.toggle) .on('click' + eventNamespace, module.event.test.toggle)
; ;
} }
else if(settings.on == 'hover') { else if(settings.on == 'hover') {
$module $module
.on('mouseenter' + eventNamespace, module.delay.show) .on('mouseenter' + eventNamespace, module.delay.show)
.on('mouseleave' + eventNamespace, module.delay.hide) .on('mouseleave' + eventNamespace, module.delay.hide)
.on('touchstart' + eventNamespace, module.event.test.toggle)
.on('touchstart' + eventNamespace, selector.icon, module.event.icon.click)
; ;
} }
else { else {
@ -676,7 +689,7 @@ $.fn.dropdown = function(parameters) {
.on('mousedown' + eventNamespace, module.event.mousedown) .on('mousedown' + eventNamespace, module.event.mousedown)
.on('mouseup' + eventNamespace, module.event.mouseup) .on('mouseup' + eventNamespace, module.event.mouseup)
.on('focus' + eventNamespace, module.event.focus) .on('focus' + eventNamespace, module.event.focus)
.on(clickEvent + eventNamespace, selector.clearIcon, module.event.clearIcon.click) .on('click' + eventNamespace, selector.clearIcon, module.event.clearIcon.click)
; ;
if(module.has.menuSearch() ) { if(module.has.menuSearch() ) {
$module $module
@ -690,21 +703,16 @@ $.fn.dropdown = function(parameters) {
} }
} }
$menu $menu
.on((hasTouch ? 'touchstart' : 'mouseenter') + eventNamespace, selector.item, module.event.item.mouseenter) .on('mouseenter' + eventNamespace, selector.item, module.event.item.mouseenter)
.on('touchstart' + eventNamespace, selector.item, module.event.item.mouseenter)
.on('mouseleave' + eventNamespace, selector.item, module.event.item.mouseleave) .on('mouseleave' + eventNamespace, selector.item, module.event.item.mouseleave)
.on('click' + eventNamespace, selector.item, module.event.item.click) .on('click' + eventNamespace, selector.item, module.event.item.click)
; ;
}, },
intent: function() { intent: function() {
module.verbose('Binding hide intent event to document'); module.verbose('Binding hide intent event to document');
if(hasTouch) {
$document $document
.on('touchstart' + elementNamespace, module.event.test.touch) .on('click' + elementNamespace, module.event.test.hide)
.on('touchmove' + elementNamespace, module.event.test.touch)
;
}
$document
.on(clickEvent + elementNamespace, module.event.test.hide)
; ;
} }
}, },
@ -712,14 +720,8 @@ $.fn.dropdown = function(parameters) {
unbind: { unbind: {
intent: function() { intent: function() {
module.verbose('Removing hide intent event from document'); module.verbose('Removing hide intent event from document');
if(hasTouch) {
$document $document
.off('touchstart' + elementNamespace) .off('click' + elementNamespace)
.off('touchmove' + elementNamespace)
;
}
$document
.off(clickEvent + elementNamespace)
; ;
} }
}, },
@ -812,20 +814,28 @@ $.fn.dropdown = function(parameters) {
throttle : settings.throttle, throttle : settings.throttle,
urlData : { urlData : {
query: query query: query
}
}, },
onError: function() { apiCallbacks = {
onError: function(errorMessage, $module, xhr) {
module.add.message(message.serverError); module.add.message(message.serverError);
iconClicked = false; iconClicked = false;
focused = false; focused = false;
callback.apply(null, callbackParameters); callback.apply(null, callbackParameters);
if(typeof settings.apiSettings.onError === 'function') {
settings.apiSettings.onError.call(this, errorMessage, $module, xhr);
}
}, },
onFailure: function() { onFailure: function(response, $module, xhr) {
module.add.message(message.serverError); module.add.message(message.serverError);
iconClicked = false; iconClicked = false;
focused = false; focused = false;
callback.apply(null, callbackParameters); callback.apply(null, callbackParameters);
if(typeof settings.apiSettings.onFailure === 'function') {
settings.apiSettings.onFailure.call(this, response, $module, xhr);
}
}, },
onSuccess : function(response) { onSuccess : function(response, $module, xhr) {
var var
values = response[fields.remoteValues] values = response[fields.remoteValues]
; ;
@ -844,19 +854,22 @@ $.fn.dropdown = function(parameters) {
var value = module.is.multiple() ? module.get.values() : module.get.value(); var value = module.is.multiple() ? module.get.values() : module.get.value();
if (value !== '') { if (value !== '') {
module.verbose('Value(s) present after click icon, select value(s) in items'); module.verbose('Value(s) present after click icon, select value(s) in items');
module.set.selected(value, null, null, true); module.set.selected(value, null, true, true);
} }
} }
iconClicked = false; iconClicked = false;
focused = false; focused = false;
callback.apply(null, callbackParameters); callback.apply(null, callbackParameters);
if(typeof settings.apiSettings.onSuccess === 'function') {
settings.apiSettings.onSuccess.call(this, response, $module, xhr);
}
} }
} }
; ;
if( !$module.api('get request') ) { if( !$module.api('get request') ) {
module.setup.api(); module.setup.api();
} }
apiSettings = $.extend(true, {}, apiSettings, settings.apiSettings); apiSettings = $.extend(true, {}, apiSettings, settings.apiSettings, apiCallbacks);
$module $module
.api('setting', apiSettings) .api('setting', apiSettings)
.api('query') .api('query')
@ -1044,7 +1057,7 @@ $.fn.dropdown = function(parameters) {
menuConfig[fields.values] = values; menuConfig[fields.values] = values;
module.setup.menu(menuConfig); module.setup.menu(menuConfig);
$.each(values, function(index, item) { $.each(values, function(index, item) {
if(item.selected == true) { if(item.selected === true) {
module.debug('Setting initial selection to', item[fields.value]); module.debug('Setting initial selection to', item[fields.value]);
module.set.selected(item[fields.value]); module.set.selected(item[fields.value]);
if(!module.is.multiple()) { if(!module.is.multiple()) {
@ -1065,7 +1078,7 @@ $.fn.dropdown = function(parameters) {
settings.preserveHTML settings.preserveHTML
) )
; ;
$input.append('<option value="' + value + '">' + name + '</option>'); $input.append('<option value="' + value + '"' + (item.selected === true ? ' selected' : '') + '>' + name + '</option>');
}); });
module.observe.select(); module.observe.select();
} }
@ -1073,6 +1086,15 @@ $.fn.dropdown = function(parameters) {
}, },
event: { event: {
paste: function(event) {
var pasteValue = (event.originalEvent.clipboardData || window.clipboardData).getData('text'),
tokens = pasteValue.split(settings.delimiter)
;
tokens.forEach(function(value){
module.set.selected(module.escape.htmlEntities(value.trim()), null, true, true);
});
event.preventDefault();
},
change: function() { change: function() {
if(!internalChange) { if(!internalChange) {
module.debug('Input changed, updating selection'); module.debug('Input changed, updating selection');
@ -1131,7 +1153,7 @@ $.fn.dropdown = function(parameters) {
if(module.is.multiple()) { if(module.is.multiple()) {
module.remove.activeLabel(); module.remove.activeLabel();
} }
if(!focused && !module.is.active() && (settings.showOnFocus || (event.type !== 'focus' && event.type !== 'focusin'))) { if(!focused && !module.is.active() && (settings.showOnFocus || (event.type !== 'focus' && event.type !== 'focusin')) && event.type !== 'touchstart') {
focused = true; focused = true;
module.search(); module.search();
} }
@ -1249,23 +1271,12 @@ $.fn.dropdown = function(parameters) {
if (!module.is.multiple() || (module.is.multiple() && !module.is.active())) { if (!module.is.multiple() || (module.is.multiple() && !module.is.active())) {
focused = true; focused = true;
} }
if( module.determine.eventOnElement(event, toggleBehavior) ) { if( module.determine.eventOnElement(event, toggleBehavior) && event.type !== 'touchstart') {
// do not preventDefault of touchstart; so emulated mouseenter is triggered on first touch and not later
// (when selecting an item). The double-showing of the dropdown through both events does not hurt.
event.preventDefault(); event.preventDefault();
} }
}, },
touch: function(event) {
module.determine.eventOnElement(event, function() {
if(event.type == 'touchstart') {
module.timer = setTimeout(function() {
module.hide();
}, settings.delay.touch);
}
else if(event.type == 'touchmove') {
clearTimeout(module.timer);
}
});
event.stopPropagation();
},
hide: function(event) { hide: function(event) {
if(module.determine.eventInModule(event, module.hide)){ if(module.determine.eventInModule(event, module.hide)){
if(element.id && $(event.target).attr('for') === element.id){ if(element.id && $(event.target).attr('for') === element.id){
@ -1285,8 +1296,8 @@ $.fn.dropdown = function(parameters) {
}, },
select: { select: {
mutation: function(mutations) { mutation: function(mutations) {
module.debug('<select> modified, recreating menu');
if(module.is.selectMutation(mutations)) { if(module.is.selectMutation(mutations)) {
module.debug('<select> modified, recreating menu');
module.disconnect.selectObserver(); module.disconnect.selectObserver();
module.refresh(); module.refresh();
module.setup.select(); module.setup.select();
@ -1349,13 +1360,15 @@ $.fn.dropdown = function(parameters) {
}, },
mouseleave: function(event) { mouseleave: function(event) {
var var
$subMenu = $(this).children(selector.menu) $subMenu = $(this).find(selector.menu)
; ;
if($subMenu.length > 0) { if($subMenu.length > 0) {
clearTimeout(module.itemTimer); clearTimeout(module.itemTimer);
module.itemTimer = setTimeout(function() { module.itemTimer = setTimeout(function() {
module.verbose('Hiding sub-menu', $subMenu); module.verbose('Hiding sub-menu', $subMenu);
module.animate.hide(false, $subMenu); $subMenu.each(function() {
module.animate.hide(false, $(this));
});
}, settings.delay.hide); }, settings.delay.hide);
} }
}, },
@ -1381,7 +1394,7 @@ $.fn.dropdown = function(parameters) {
module.remove.userAddition(); module.remove.userAddition();
} }
module.remove.searchTerm(); module.remove.searchTerm();
if(!module.is.focusedOnSearch() && !(skipRefocus == true)) { if(!module.is.focusedOnSearch() && skipRefocus !== true) {
module.focusSearch(true); module.focusSearch(true);
} }
} }
@ -1513,7 +1526,7 @@ $.fn.dropdown = function(parameters) {
keydown: function(event) { keydown: function(event) {
var var
pressedKey = event.which, pressedKey = event.which,
isShortcutKey = module.is.inObject(pressedKey, keys) isShortcutKey = module.is.inObject(pressedKey, keys) || event.key === settings.delimiter
; ;
if(isShortcutKey) { if(isShortcutKey) {
var var
@ -1531,7 +1544,7 @@ $.fn.dropdown = function(parameters) {
hasSubMenu = ($subMenu.length> 0), hasSubMenu = ($subMenu.length> 0),
hasSelectedItem = ($selectedItem.length > 0), hasSelectedItem = ($selectedItem.length > 0),
selectedIsSelectable = ($selectedItem.not(selector.unselectable).length > 0), selectedIsSelectable = ($selectedItem.not(selector.unselectable).length > 0),
delimiterPressed = (pressedKey == keys.delimiter && settings.allowAdditions && module.is.multiple()), delimiterPressed = (event.key === settings.delimiter && module.is.multiple()),
isAdditionWithoutMenu = (settings.allowAdditions && settings.hideAdditions && (pressedKey == keys.enter || delimiterPressed) && selectedIsSelectable), isAdditionWithoutMenu = (settings.allowAdditions && settings.hideAdditions && (pressedKey == keys.enter || delimiterPressed) && selectedIsSelectable),
$nextItem, $nextItem,
isSubMenuItem, isSubMenuItem,
@ -1629,7 +1642,7 @@ $.fn.dropdown = function(parameters) {
.addClass(className.selected) .addClass(className.selected)
; ;
module.set.scrollPosition($nextItem); module.set.scrollPosition($nextItem);
if(settings.selectOnKeydown && module.is.single()) { if(settings.selectOnKeydown && module.is.single() && !$nextItem.hasClass(className.actionable)) {
module.set.selectedItem($nextItem); module.set.selectedItem($nextItem);
} }
} }
@ -1656,7 +1669,7 @@ $.fn.dropdown = function(parameters) {
.addClass(className.selected) .addClass(className.selected)
; ;
module.set.scrollPosition($nextItem); module.set.scrollPosition($nextItem);
if(settings.selectOnKeydown && module.is.single()) { if(settings.selectOnKeydown && module.is.single() && !$nextItem.hasClass(className.actionable)) {
module.set.selectedItem($nextItem); module.set.selectedItem($nextItem);
} }
} }
@ -1787,7 +1800,7 @@ $.fn.dropdown = function(parameters) {
; ;
if( module.can.activate( $(element) ) ) { if( module.can.activate( $(element) ) ) {
module.set.selected(value, $(element)); module.set.selected(value, $(element));
if(!module.is.multiple()) { if(!module.is.multiple() && !(!settings.collapseOnActionable && $(element).hasClass(className.actionable))) {
module.hideAndClear(); module.hideAndClear();
} }
} }
@ -1800,7 +1813,7 @@ $.fn.dropdown = function(parameters) {
; ;
if( module.can.activate( $(element) ) ) { if( module.can.activate( $(element) ) ) {
module.set.value(value, text, $(element)); module.set.value(value, text, $(element));
if(!module.is.multiple()) { if(!module.is.multiple() && !(!settings.collapseOnActionable && $(element).hasClass(className.actionable))) {
module.hideAndClear(); module.hideAndClear();
} }
} }
@ -1851,7 +1864,7 @@ $.fn.dropdown = function(parameters) {
; ;
$sizer.text(value); $sizer.text(value);
// prevent rounding issues // prevent rounding issues
return Math.ceil( $sizer.width() + 1); return Math.ceil( $sizer.width() + (module.is.edge() ? 3 : 1));
}, },
selectionCount: function() { selectionCount: function() {
var var
@ -2320,7 +2333,7 @@ $.fn.dropdown = function(parameters) {
module.error(error.noStorage); module.error(error.noStorage);
return; return;
} }
name = sessionStorage.getItem(value); name = sessionStorage.getItem(value + elementNamespace);
return (name !== undefined) return (name !== undefined)
? name ? name
: false : false
@ -2364,7 +2377,7 @@ $.fn.dropdown = function(parameters) {
return; return;
} }
module.verbose('Saving remote data to session storage', value, name); module.verbose('Saving remote data to session storage', value, name);
sessionStorage.setItem(value, name); sessionStorage.setItem(value + elementNamespace, name);
} }
}, },
@ -2424,7 +2437,7 @@ $.fn.dropdown = function(parameters) {
$nextSelectedItem $nextSelectedItem
.addClass(className.selected) .addClass(className.selected)
; ;
if(settings.selectOnKeydown && module.is.single()) { if(settings.selectOnKeydown && module.is.single() && !$nextItem.hasClass(className.actionable)) {
module.set.selectedItem($nextSelectedItem); module.set.selectedItem($nextSelectedItem);
} }
$menu $menu
@ -2510,7 +2523,7 @@ $.fn.dropdown = function(parameters) {
var var
length = module.get.query().length length = module.get.query().length
; ;
$search.val( text.substr(0, length)); $search.val( text.slice(0, length));
}, },
scrollPosition: function($item, forceScroll) { scrollPosition: function($item, forceScroll) {
var var
@ -2627,13 +2640,13 @@ $.fn.dropdown = function(parameters) {
module.set.scrollPosition($nextValue); module.set.scrollPosition($nextValue);
$selectedItem.removeClass(className.selected); $selectedItem.removeClass(className.selected);
$nextValue.addClass(className.selected); $nextValue.addClass(className.selected);
if(settings.selectOnKeydown && module.is.single()) { if(settings.selectOnKeydown && module.is.single() && !$nextItem.hasClass(className.actionable)) {
module.set.selectedItem($nextValue); module.set.selectedItem($nextValue);
} }
} }
}, },
direction: function($menu) { direction: function($menu) {
if(settings.direction == 'auto') { if(settings.direction === 'auto') {
// reset position, remove upward if it's base menu // reset position, remove upward if it's base menu
if (!$menu) { if (!$menu) {
module.remove.upward(); module.remove.upward();
@ -2652,7 +2665,7 @@ $.fn.dropdown = function(parameters) {
module.set.leftward($menu); module.set.leftward($menu);
} }
} }
else if(settings.direction == 'upward') { else if(settings.direction === 'upward') {
module.set.upward($menu); module.set.upward($menu);
} }
}, },
@ -2665,6 +2678,11 @@ $.fn.dropdown = function(parameters) {
$element.addClass(className.leftward); $element.addClass(className.leftward);
}, },
value: function(value, text, $selected, preventChangeTrigger) { value: function(value, text, $selected, preventChangeTrigger) {
if(typeof text === 'boolean') {
preventChangeTrigger = text;
$selected = undefined;
text = undefined;
}
if(value !== undefined && value !== '' && !(Array.isArray(value) && value.length === 0)) { if(value !== undefined && value !== '' && !(Array.isArray(value) && value.length === 0)) {
$input.removeClass(className.noselection); $input.removeClass(className.noselection);
} else { } else {
@ -2728,12 +2746,21 @@ $.fn.dropdown = function(parameters) {
visible: function() { visible: function() {
$module.addClass(className.visible); $module.addClass(className.visible);
}, },
exactly: function(value, $selectedItem) { exactly: function(value, $selectedItem, preventChangeTrigger) {
if(typeof $selectedItem === 'boolean') {
preventChangeTrigger = $selectedItem;
$selectedItem = undefined;
}
module.debug('Setting selected to exact values'); module.debug('Setting selected to exact values');
module.clear(); module.clear();
module.set.selected(value, $selectedItem); module.set.selected(value, $selectedItem, preventChangeTrigger);
}, },
selected: function(value, $selectedItem, preventChangeTrigger, keepSearchTerm) { selected: function(value, $selectedItem, preventChangeTrigger, keepSearchTerm) {
if(typeof $selectedItem === 'boolean') {
keepSearchTerm = preventChangeTrigger;
preventChangeTrigger = $selectedItem;
$selectedItem = undefined;
}
var var
isMultiple = module.is.multiple() isMultiple = module.is.multiple()
; ;
@ -2765,23 +2792,30 @@ $.fn.dropdown = function(parameters) {
isFiltered = $selected.hasClass(className.filtered), isFiltered = $selected.hasClass(className.filtered),
isActive = $selected.hasClass(className.active), isActive = $selected.hasClass(className.active),
isActionable = $selected.hasClass(className.actionable),
isUserValue = $selected.hasClass(className.addition), isUserValue = $selected.hasClass(className.addition),
shouldAnimate = (isMultiple && $selectedItem.length == 1) shouldAnimate = (isMultiple && $selectedItem && $selectedItem.length === 1)
; ;
if(isMultiple) { if(isActionable){
if((!isMultiple || (!isActive || isUserValue)) && settings.apiSettings && settings.saveRemoteData) {
module.save.remoteData(selectedText, selectedValue);
}
settings.onActionable.call(element, selectedValue, selectedText, $selected);
}
else if(isMultiple) {
if(!isActive || isUserValue) { if(!isActive || isUserValue) {
if(settings.apiSettings && settings.saveRemoteData) { if(settings.apiSettings && settings.saveRemoteData) {
module.save.remoteData(selectedText, selectedValue); module.save.remoteData(selectedText, selectedValue);
} }
if(settings.useLabels) { if(settings.useLabels) {
module.add.value(selectedValue, selectedText, $selected, preventChangeTrigger);
module.add.label(selectedValue, selectedText, shouldAnimate); module.add.label(selectedValue, selectedText, shouldAnimate);
module.add.value(selectedValue, selectedText, $selected);
module.set.activeItem($selected); module.set.activeItem($selected);
module.filterActive(); module.filterActive();
module.select.nextAvailable($selectedItem); module.select.nextAvailable($selectedItem);
} }
else { else {
module.add.value(selectedValue, selectedText, $selected); module.add.value(selectedValue, selectedText, $selected, preventChangeTrigger);
module.set.text(module.add.variables(message.count)); module.set.text(module.add.variables(message.count));
module.set.activeItem($selected); module.set.activeItem($selected);
} }
@ -2795,7 +2829,7 @@ $.fn.dropdown = function(parameters) {
if(settings.apiSettings && settings.saveRemoteData) { if(settings.apiSettings && settings.saveRemoteData) {
module.save.remoteData(selectedText, selectedValue); module.save.remoteData(selectedText, selectedValue);
} }
if (!keepSearchTerm) { if (!keepSearchTerm && !$selected.hasClass(className.actionable)) {
module.set.text(selectedText); module.set.text(selectedText);
} }
module.set.value(selectedValue, selectedText, $selected, preventChangeTrigger); module.set.value(selectedValue, selectedText, $selected, preventChangeTrigger);
@ -2894,7 +2928,7 @@ $.fn.dropdown = function(parameters) {
$('<option/>') $('<option/>')
.prop('value', escapedValue) .prop('value', escapedValue)
.addClass(className.addition) .addClass(className.addition)
.html(value) .text(value)
.appendTo($input) .appendTo($input)
; ;
module.verbose('Adding user addition as an <option>', value); module.verbose('Adding user addition as an <option>', value);
@ -2970,7 +3004,12 @@ $.fn.dropdown = function(parameters) {
} }
return message; return message;
}, },
value: function(addedValue, addedText, $selectedItem) { value: function(addedValue, addedText, $selectedItem, preventChangeTrigger) {
if(typeof addedText === 'boolean') {
preventChangeTrigger = addedText;
$selectedItem = undefined;
addedText = undefined;
}
var var
currentValue = module.get.values(true), currentValue = module.get.values(true),
newValue newValue
@ -2985,7 +3024,7 @@ $.fn.dropdown = function(parameters) {
} }
// extend current array // extend current array
if(Array.isArray(currentValue)) { if(Array.isArray(currentValue)) {
newValue = currentValue.concat([addedValue]); newValue = $selectedItem && $selectedItem.hasClass(className.actionable) ? currentValue : currentValue.concat([addedValue]);
newValue = module.get.uniqueArray(newValue); newValue = module.get.uniqueArray(newValue);
} }
else { else {
@ -3009,7 +3048,7 @@ $.fn.dropdown = function(parameters) {
else { else {
settings.onAdd.call(element, addedValue, addedText, $selectedItem); settings.onAdd.call(element, addedValue, addedText, $selectedItem);
} }
module.set.value(newValue, addedText, $selectedItem); module.set.value(newValue, addedText, $selectedItem, preventChangeTrigger);
module.check.maxSelections(); module.check.maxSelections();
}, },
}, },
@ -3069,18 +3108,10 @@ $.fn.dropdown = function(parameters) {
return; return;
} }
// temporarily disconnect observer // temporarily disconnect observer
if(selectObserver) { module.disconnect.selectObserver();
selectObserver.disconnect();
module.verbose('Temporarily disconnecting mutation observer');
}
$option.remove(); $option.remove();
module.verbose('Removing user addition as an <option>', escapedValue); module.verbose('Removing user addition as an <option>', escapedValue);
if(selectObserver) { module.observe.select();
selectObserver.observe($input[0], {
childList : true,
subtree : true
});
}
}, },
message: function() { message: function() {
$menu.children(selector.message).remove(); $menu.children(selector.message).remove();
@ -3379,8 +3410,11 @@ $.fn.dropdown = function(parameters) {
bubbledIconClick: function(event) { bubbledIconClick: function(event) {
return $(event.target).closest($icon).length > 0; return $(event.target).closest($icon).length > 0;
}, },
edge: function() {
return !!window.chrome && !!window.StyleMedia;
},
chrome: function() { chrome: function() {
return !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime); return !!window.chrome && !window.StyleMedia;
}, },
alreadySetup: function() { alreadySetup: function() {
return ($module.is('select') && $module.parent(selector.dropdown).data(moduleNamespace) !== undefined && $module.prev().length === 0); return ($module.is('select') && $module.parent(selector.dropdown).data(moduleNamespace) !== undefined && $module.prev().length === 0);
@ -3445,7 +3479,7 @@ $.fn.dropdown = function(parameters) {
selectChanged = false selectChanged = false
; ;
$.each(mutations, function(index, mutation) { $.each(mutations, function(index, mutation) {
if($(mutation.target).is('select') || $(mutation.addedNodes).is('select')) { if($(mutation.target).is('select, option, optgroup') || $(mutation.addedNodes).is('select')) {
selectChanged = true; selectChanged = true;
return false; return false;
} }
@ -3587,9 +3621,6 @@ $.fn.dropdown = function(parameters) {
$currentMenu.removeClass(className.loading); $currentMenu.removeClass(className.loading);
return canOpenRightward; return canOpenRightward;
}, },
click: function() {
return (hasTouch || settings.on == 'click');
},
extendSelect: function() { extendSelect: function() {
return settings.allowAdditions || settings.apiSettings; return settings.allowAdditions || settings.apiSettings;
}, },
@ -3659,9 +3690,7 @@ $.fn.dropdown = function(parameters) {
start = ($subMenu) start = ($subMenu)
? function() {} ? function() {}
: function() { : function() {
if( module.can.click() ) {
module.unbind.intent(); module.unbind.intent();
}
module.remove.active(); module.remove.active();
}, },
transition = settings.transition.hideMethod || module.get.transition($subMenu) transition = settings.transition.hideMethod || module.get.transition($subMenu)
@ -3990,7 +4019,7 @@ $.fn.dropdown.settings = {
keepOnScreen : true, // Whether dropdown should check whether it is on screen before showing keepOnScreen : true, // Whether dropdown should check whether it is on screen before showing
match : 'both', // what to match against with search selection (both, text, or label) match : 'both', // what to match against with search selection (both, text, or label)
fullTextSearch : false, // search anywhere in value (set to 'exact' to require exact matches) fullTextSearch : 'exact', // search anywhere in value (set to 'exact' to require exact matches)
ignoreDiacritics : false, // match results also if they contain diacritics of the same base character (for example searching for "a" will also match "á" or "â" or "à", etc...) ignoreDiacritics : false, // match results also if they contain diacritics of the same base character (for example searching for "a" will also match "á" or "â" or "à", etc...)
hideDividers : false, // Whether to hide any divider elements (specified in selector.divider) that are sibling to any items when searched (set to true will hide all dividers, set to 'empty' will hide them when they are not followed by a visible item) hideDividers : false, // Whether to hide any divider elements (specified in selector.divider) that are sibling to any items when searched (set to true will hide all dividers, set to 'empty' will hide them when they are not followed by a visible item)
@ -3998,7 +4027,7 @@ $.fn.dropdown.settings = {
preserveHTML : true, // preserve html when selecting value preserveHTML : true, // preserve html when selecting value
sortSelect : false, // sort selection on init sortSelect : false, // sort selection on init
forceSelection : true, // force a choice on blur with search selection forceSelection : false, // force a choice on blur with search selection
allowAdditions : false, // whether multiple select should allow user added values allowAdditions : false, // whether multiple select should allow user added values
ignoreCase : false, // whether to consider case sensitivity when creating labels ignoreCase : false, // whether to consider case sensitivity when creating labels
@ -4009,7 +4038,7 @@ $.fn.dropdown.settings = {
useLabels : true, // whether multiple select should filter currently active selections from choices useLabels : true, // whether multiple select should filter currently active selections from choices
delimiter : ',', // when multiselect uses normal <input> the values will be delimited with this character delimiter : ',', // when multiselect uses normal <input> the values will be delimited with this character
showOnFocus : true, // show menu on focus showOnFocus : false, // show menu on focus
allowReselection : false, // whether current value should trigger callbacks when reselected allowReselection : false, // whether current value should trigger callbacks when reselected
allowTab : true, // add tabindex to element allowTab : true, // add tabindex to element
allowCategorySelection : false, // allow elements with sub-menus to be selected allowCategorySelection : false, // allow elements with sub-menus to be selected
@ -4024,6 +4053,8 @@ $.fn.dropdown.settings = {
headerDivider : true, // whether option headers should have an additional divider line underneath when converted from <select> <optgroup> headerDivider : true, // whether option headers should have an additional divider line underneath when converted from <select> <optgroup>
collapseOnActionable : true, // whether the dropdown should collapse upon selection of an actionable item
// label settings on multi-select // label settings on multi-select
label: { label: {
transition : 'scale', transition : 'scale',
@ -4036,13 +4067,13 @@ $.fn.dropdown.settings = {
hide : 300, hide : 300,
show : 200, show : 200,
search : 20, search : 20,
touch : 50
}, },
/* Callbacks */ /* Callbacks */
onChange : function(value, text, $selected){}, onChange : function(value, text, $selected){},
onAdd : function(value, text, $selected){}, onAdd : function(value, text, $selected){},
onRemove : function(value, text, $selected){}, onRemove : function(value, text, $selected){},
onActionable : function(value, text, $selected){},
onSearch : function(searchTerm){}, onSearch : function(searchTerm){},
onLabelSelect : function($selectedLabels){}, onLabelSelect : function($selectedLabels){},
@ -4105,12 +4136,12 @@ $.fn.dropdown.settings = {
icon : 'icon', // optional icon name icon : 'icon', // optional icon name
iconClass : 'iconClass', // optional individual class for icon (for example to use flag instead) iconClass : 'iconClass', // optional individual class for icon (for example to use flag instead)
class : 'class', // optional individual class for item/header class : 'class', // optional individual class for item/header
divider : 'divider' // optional divider append for group headers divider : 'divider', // optional divider append for group headers
actionable : 'actionable' // optional actionable item
}, },
keys : { keys : {
backspace : 8, backspace : 8,
delimiter : 188, // comma
deleteKey : 46, deleteKey : 46,
enter : 13, enter : 13,
escape : 27, escape : 27,
@ -4177,7 +4208,8 @@ $.fn.dropdown.settings = {
header : 'header', header : 'header',
divider : 'divider', divider : 'divider',
groupIcon : '', groupIcon : '',
unfilterable : 'unfilterable' unfilterable : 'unfilterable',
actionable : 'actionable'
} }
}; };
@ -4252,6 +4284,9 @@ $.fn.dropdown.settings.templates = {
maybeText = (option[fields.text]) maybeText = (option[fields.text])
? ' data-text="' + deQuote(option[fields.text],true) + '"' ? ' data-text="' + deQuote(option[fields.text],true) + '"'
: '', : '',
maybeActionable = (option[fields.actionable])
? className.actionable+' '
: '',
maybeDisabled = (option[fields.disabled]) maybeDisabled = (option[fields.disabled])
? className.disabled+' ' ? className.disabled+' '
: '', : '',
@ -4260,7 +4295,7 @@ $.fn.dropdown.settings.templates = {
: '', : '',
hasDescription = (escape(option[fields.description] || '', preserveHTML) != '') hasDescription = (escape(option[fields.description] || '', preserveHTML) != '')
; ;
html += '<div class="'+ maybeDisabled + maybeDescriptionVertical + (option[fields.class] ? deQuote(option[fields.class]) : className.item)+'" data-value="' + deQuote(option[fields.value],true) + '"' + maybeText + '>'; html += '<div class="'+ maybeActionable + maybeDisabled + maybeDescriptionVertical + (option[fields.class] ? deQuote(option[fields.class]) : className.item)+'" data-value="' + deQuote(option[fields.value],true) + '"' + maybeText + '>';
if (isMenu) { if (isMenu) {
html += '<i class="'+ (itemType.indexOf('left') !== -1 ? 'left' : '') + ' dropdown icon"></i>'; html += '<i class="'+ (itemType.indexOf('left') !== -1 ? 'left' : '') + ' dropdown icon"></i>';
} }

2
semantic/dist/components/dropdown.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/dropdown.min.js vendored
View file

File diff suppressed because one or more lines are too long

287
semantic/dist/components/form.css vendored
View file

@ -55,12 +55,14 @@
.ui.form .field > label { .ui.form .field > label {
display: block; display: block;
margin: 0 0 0.33333333rem 0; margin: 0 0 0.28571429rem 0;
color: rgba(0, 0, 0, 0.87); font-size: 0.92857143em;
font-size: 0.91666667em;
font-weight: bold; font-weight: bold;
text-transform: none; text-transform: none;
} }
.ui.form .field > label:not(.button) {
color: rgba(0, 0, 0, 0.87);
}
/*-------------------- /*--------------------
Standard Inputs Standard Inputs
@ -68,9 +70,11 @@
.ui.form textarea, .ui.form textarea,
.ui.form input:not([type]), .ui.form input:not([type]),
.ui.form input[type="color"],
.ui.form input[type="date"], .ui.form input[type="date"],
.ui.form input[type="datetime-local"], .ui.form input[type="datetime-local"],
.ui.form input[type="email"], .ui.form input[type="email"],
.ui.form input[type="month"],
.ui.form input[type="number"], .ui.form input[type="number"],
.ui.form input[type="password"], .ui.form input[type="password"],
.ui.form input[type="search"], .ui.form input[type="search"],
@ -78,7 +82,8 @@
.ui.form input[type="time"], .ui.form input[type="time"],
.ui.form input[type="text"], .ui.form input[type="text"],
.ui.form input[type="file"], .ui.form input[type="file"],
.ui.form input[type="url"] { .ui.form input[type="url"],
.ui.form input[type="week"] {
width: 100%; width: 100%;
vertical-align: top; vertical-align: top;
} }
@ -89,9 +94,11 @@
height: 1.21428571em; height: 1.21428571em;
} }
.ui.form input:not([type]), .ui.form input:not([type]),
.ui.form input[type="color"],
.ui.form input[type="date"], .ui.form input[type="date"],
.ui.form input[type="datetime-local"], .ui.form input[type="datetime-local"],
.ui.form input[type="email"], .ui.form input[type="email"],
.ui.form input[type="month"],
.ui.form input[type="number"], .ui.form input[type="number"],
.ui.form input[type="password"], .ui.form input[type="password"],
.ui.form input[type="search"], .ui.form input[type="search"],
@ -99,24 +106,35 @@
.ui.form input[type="time"], .ui.form input[type="time"],
.ui.form input[type="text"], .ui.form input[type="text"],
.ui.form input[type="file"], .ui.form input[type="file"],
.ui.form input[type="url"] { .ui.form input[type="url"],
.ui.form input[type="week"] {
font-family: 'Raleway', sans-serif; font-family: 'Raleway', sans-serif;
margin: 0; margin: 0;
outline: none; outline: none;
-webkit-appearance: none; -webkit-appearance: none;
-webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
line-height: 1.21428571em; line-height: 1.21428571em;
padding: 0.80952381em 1.16666667em; padding: 0.67857143em 1em;
font-size: 1em; font-size: 1em;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-box-shadow: 0 0 0 0 transparent inset; -webkit-box-shadow: 0 0 0 0 transparent inset;
box-shadow: 0 0 0 0 transparent inset; box-shadow: 0 0 0 0 transparent inset;
-webkit-transition: color 0.1s ease, border-color 0.1s ease; -webkit-transition: color 0.1s ease, border-color 0.1s ease;
transition: color 0.1s ease, border-color 0.1s ease; transition: color 0.1s ease, border-color 0.1s ease;
} }
.ui.form input[type="color"] {
padding: initial;
}
.ui.form input::-webkit-calendar-picker-indicator {
padding: 0;
opacity: 0.5;
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
cursor: pointer;
}
/* Text Area */ /* Text Area */
.ui.input textarea, .ui.input textarea,
@ -124,12 +142,12 @@
margin: 0; margin: 0;
-webkit-appearance: none; -webkit-appearance: none;
-webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
padding: 0.91666667em 1.16666667em; padding: 0.78571429em 1em;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
outline: none; outline: none;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-box-shadow: 0 0 0 0 transparent inset; -webkit-box-shadow: 0 0 0 0 transparent inset;
box-shadow: 0 0 0 0 transparent inset; box-shadow: 0 0 0 0 transparent inset;
-webkit-transition: color 0.1s ease, border-color 0.1s ease; -webkit-transition: color 0.1s ease, border-color 0.1s ease;
@ -182,7 +200,7 @@
.ui.form .field .transparent.input:not(.icon) input, .ui.form .field .transparent.input:not(.icon) input,
.ui.form .field input.transparent, .ui.form .field input.transparent,
.ui.form .field textarea.transparent { .ui.form .field textarea.transparent {
padding: 0.80952381em 1.16666667em; padding: 0.67857143em 1em;
} }
.ui.form .field input.transparent, .ui.form .field input.transparent,
.ui.form .field textarea.transparent { .ui.form .field textarea.transparent {
@ -210,10 +228,10 @@
width: 100%; width: 100%;
background: #FFFFFF; background: #FFFFFF;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-box-shadow: 0 0 0 0 transparent inset; -webkit-box-shadow: 0 0 0 0 transparent inset;
box-shadow: 0 0 0 0 transparent inset; box-shadow: 0 0 0 0 transparent inset;
padding: 0.62em 1.16666667em; padding: 0.62em 1em;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
-webkit-transition: color 0.1s ease, border-color 0.1s ease; -webkit-transition: color 0.1s ease, border-color 0.1s ease;
transition: color 0.1s ease, border-color 0.1s ease; transition: color 0.1s ease, border-color 0.1s ease;
@ -225,7 +243,7 @@
/* Block */ /* Block */
.ui.form .field > .selection.dropdown { .ui.form .field > .selection.dropdown:not(.compact) {
min-width: auto; min-width: auto;
width: 100%; width: 100%;
} }
@ -321,13 +339,16 @@
border: 1px solid #E0B4B4 !important; border: 1px solid #E0B4B4 !important;
color: #9F3A38 !important; color: #9F3A38 !important;
} }
.ui.form .field .prompt.label li::before {
color: #9F3A38;
}
.ui.form .inline.fields .field .prompt, .ui.form .inline.fields .field .prompt,
.ui.form .inline.field .prompt { .ui.form .inline.field .prompt {
vertical-align: top; vertical-align: top;
margin: -0.25em 0 -0.5em 0.5em; margin: -0.25em 0 -0.5em 0.5em;
} }
.ui.form .inline.fields .field .prompt:before, .ui.form .inline.fields .field .prompt::before,
.ui.form .inline.field .prompt:before { .ui.form .inline.field .prompt::before {
border-width: 0 0 1px 1px; border-width: 0 0 1px 1px;
bottom: auto; bottom: auto;
right: auto; right: auto;
@ -389,9 +410,11 @@
---------------------*/ ---------------------*/
.ui.form input:not([type]):focus, .ui.form input:not([type]):focus,
.ui.form input[type="color"]:focus,
.ui.form input[type="date"]:focus, .ui.form input[type="date"]:focus,
.ui.form input[type="datetime-local"]:focus, .ui.form input[type="datetime-local"]:focus,
.ui.form input[type="email"]:focus, .ui.form input[type="email"]:focus,
.ui.form input[type="month"]:focus,
.ui.form input[type="number"]:focus, .ui.form input[type="number"]:focus,
.ui.form input[type="password"]:focus, .ui.form input[type="password"]:focus,
.ui.form input[type="search"]:focus, .ui.form input[type="search"]:focus,
@ -399,18 +422,21 @@
.ui.form input[type="time"]:focus, .ui.form input[type="time"]:focus,
.ui.form input[type="text"]:focus, .ui.form input[type="text"]:focus,
.ui.form input[type="file"]:focus, .ui.form input[type="file"]:focus,
.ui.form input[type="url"]:focus { .ui.form input[type="url"]:focus,
.ui.form input[type="week"]:focus {
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
border-color: #6435C9; border-color: #85B7D9;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
background: #FFFFFF; background: #FFFFFF;
-webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; -webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset;
box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset;
} }
.ui.form .ui.action.input:not([class*="left action"]) input:not([type]):focus, .ui.form .ui.action.input:not([class*="left action"]) input:not([type]):focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="color"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="date"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="date"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="datetime-local"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="datetime-local"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="email"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="email"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="month"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="number"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="number"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="password"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="password"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="search"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="search"]:focus,
@ -418,14 +444,17 @@
.ui.form .ui.action.input:not([class*="left action"]) input[type="time"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="time"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="text"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="text"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="file"]:focus, .ui.form .ui.action.input:not([class*="left action"]) input[type="file"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="url"]:focus { .ui.form .ui.action.input:not([class*="left action"]) input[type="url"]:focus,
.ui.form .ui.action.input:not([class*="left action"]) input[type="week"]:focus {
border-top-right-radius: 0; border-top-right-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.ui.form .ui[class*="left action"].input input:not([type]), .ui.form .ui[class*="left action"].input input:not([type]),
.ui.form .ui[class*="left action"].input input[type="color"],
.ui.form .ui[class*="left action"].input input[type="date"], .ui.form .ui[class*="left action"].input input[type="date"],
.ui.form .ui[class*="left action"].input input[type="datetime-local"], .ui.form .ui[class*="left action"].input input[type="datetime-local"],
.ui.form .ui[class*="left action"].input input[type="email"], .ui.form .ui[class*="left action"].input input[type="email"],
.ui.form .ui[class*="left action"].input input[type="month"],
.ui.form .ui[class*="left action"].input input[type="number"], .ui.form .ui[class*="left action"].input input[type="number"],
.ui.form .ui[class*="left action"].input input[type="password"], .ui.form .ui[class*="left action"].input input[type="password"],
.ui.form .ui[class*="left action"].input input[type="search"], .ui.form .ui[class*="left action"].input input[type="search"],
@ -433,20 +462,26 @@
.ui.form .ui[class*="left action"].input input[type="time"], .ui.form .ui[class*="left action"].input input[type="time"],
.ui.form .ui[class*="left action"].input input[type="text"], .ui.form .ui[class*="left action"].input input[type="text"],
.ui.form .ui[class*="left action"].input input[type="file"], .ui.form .ui[class*="left action"].input input[type="file"],
.ui.form .ui[class*="left action"].input input[type="url"] { .ui.form .ui[class*="left action"].input input[type="url"],
.ui.form .ui[class*="left action"].input input[type="week"] {
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
border-top-left-radius: 0; border-top-left-radius: 0;
} }
.ui.form textarea:focus { .ui.form textarea:focus {
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
border-color: #6435C9; border-color: #85B7D9;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
background: #FFFFFF; background: #FFFFFF;
-webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; -webkit-box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset;
box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset; box-shadow: 0 0 0 0 rgba(34, 36, 38, 0.35) inset;
-webkit-appearance: none; -webkit-appearance: none;
} }
/* Focus */
.ui.form input:focus::-webkit-calendar-picker-indicator {
opacity: 1;
}
/*-------------------- /*--------------------
States States
---------------------*/ ---------------------*/
@ -500,9 +535,11 @@
.ui.form .fields.error .field textarea, .ui.form .fields.error .field textarea,
.ui.form .fields.error .field select, .ui.form .fields.error .field select,
.ui.form .fields.error .field input:not([type]), .ui.form .fields.error .field input:not([type]),
.ui.form .fields.error .field input[type="color"],
.ui.form .fields.error .field input[type="date"], .ui.form .fields.error .field input[type="date"],
.ui.form .fields.error .field input[type="datetime-local"], .ui.form .fields.error .field input[type="datetime-local"],
.ui.form .fields.error .field input[type="email"], .ui.form .fields.error .field input[type="email"],
.ui.form .fields.error .field input[type="month"],
.ui.form .fields.error .field input[type="number"], .ui.form .fields.error .field input[type="number"],
.ui.form .fields.error .field input[type="password"], .ui.form .fields.error .field input[type="password"],
.ui.form .fields.error .field input[type="search"], .ui.form .fields.error .field input[type="search"],
@ -511,12 +548,15 @@
.ui.form .fields.error .field input[type="text"], .ui.form .fields.error .field input[type="text"],
.ui.form .fields.error .field input[type="file"], .ui.form .fields.error .field input[type="file"],
.ui.form .fields.error .field input[type="url"], .ui.form .fields.error .field input[type="url"],
.ui.form .fields.error .field input[type="week"],
.ui.form .field.error textarea, .ui.form .field.error textarea,
.ui.form .field.error select, .ui.form .field.error select,
.ui.form .field.error input:not([type]), .ui.form .field.error input:not([type]),
.ui.form .field.error input[type="color"],
.ui.form .field.error input[type="date"], .ui.form .field.error input[type="date"],
.ui.form .field.error input[type="datetime-local"], .ui.form .field.error input[type="datetime-local"],
.ui.form .field.error input[type="email"], .ui.form .field.error input[type="email"],
.ui.form .field.error input[type="month"],
.ui.form .field.error input[type="number"], .ui.form .field.error input[type="number"],
.ui.form .field.error input[type="password"], .ui.form .field.error input[type="password"],
.ui.form .field.error input[type="search"], .ui.form .field.error input[type="search"],
@ -524,7 +564,8 @@
.ui.form .field.error input[type="time"], .ui.form .field.error input[type="time"],
.ui.form .field.error input[type="text"], .ui.form .field.error input[type="text"],
.ui.form .field.error input[type="file"], .ui.form .field.error input[type="file"],
.ui.form .field.error input[type="url"] { .ui.form .field.error input[type="url"],
.ui.form .field.error input[type="week"] {
color: #9F3A38; color: #9F3A38;
background: #FFF6F6; background: #FFF6F6;
border-color: #E0B4B4; border-color: #E0B4B4;
@ -532,12 +573,43 @@
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
.ui.form .field input:not(:-moz-placeholder-shown):invalid {
color: #9F3A38;
background: #FFF6F6;
border-color: #E0B4B4;
border-radius: '';
box-shadow: none;
}
.ui.form .field input:not(:-ms-input-placeholder):invalid {
color: #9F3A38;
background: #FFF6F6;
border-color: #E0B4B4;
border-radius: '';
box-shadow: none;
}
.ui.form .field input:not(:placeholder-shown):invalid {
color: #9F3A38;
background: #FFF6F6;
border-color: #E0B4B4;
border-radius: '';
-webkit-box-shadow: none;
box-shadow: none;
}
.ui.form .field input:not(:-ms-input-placeholder):invalid {
color: #9F3A38;
background: #FFF6F6;
border-color: #E0B4B4;
border-radius: '';
box-shadow: none;
}
.ui.form .field.error textarea:focus, .ui.form .field.error textarea:focus,
.ui.form .field.error select:focus, .ui.form .field.error select:focus,
.ui.form .field.error input:not([type]):focus, .ui.form .field.error input:not([type]):focus,
.ui.form .field.error input[type="color"]:focus,
.ui.form .field.error input[type="date"]:focus, .ui.form .field.error input[type="date"]:focus,
.ui.form .field.error input[type="datetime-local"]:focus, .ui.form .field.error input[type="datetime-local"]:focus,
.ui.form .field.error input[type="email"]:focus, .ui.form .field.error input[type="email"]:focus,
.ui.form .field.error input[type="month"]:focus,
.ui.form .field.error input[type="number"]:focus, .ui.form .field.error input[type="number"]:focus,
.ui.form .field.error input[type="password"]:focus, .ui.form .field.error input[type="password"]:focus,
.ui.form .field.error input[type="search"]:focus, .ui.form .field.error input[type="search"]:focus,
@ -545,7 +617,8 @@
.ui.form .field.error input[type="time"]:focus, .ui.form .field.error input[type="time"]:focus,
.ui.form .field.error input[type="text"]:focus, .ui.form .field.error input[type="text"]:focus,
.ui.form .field.error input[type="file"]:focus, .ui.form .field.error input[type="file"]:focus,
.ui.form .field.error input[type="url"]:focus { .ui.form .field.error input[type="url"]:focus,
.ui.form .field.error input[type="week"]:focus {
background: #FFF6F6; background: #FFF6F6;
border-color: #E0B4B4; border-color: #E0B4B4;
color: #9F3A38; color: #9F3A38;
@ -652,22 +725,16 @@
---------------------*/ ---------------------*/
.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label, .ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label,
.ui.form .field.error .checkbox:not(.toggle):not(.slider) label, .ui.form .field.error .checkbox:not(.toggle):not(.slider) label {
.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box,
.ui.form .field.error .checkbox:not(.toggle):not(.slider) .box {
color: #9F3A38; color: #9F3A38;
} }
.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label:before, .ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label::before,
.ui.form .field.error .checkbox:not(.toggle):not(.slider) label:before, .ui.form .field.error .checkbox:not(.toggle):not(.slider) label::before {
.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box:before,
.ui.form .field.error .checkbox:not(.toggle):not(.slider) .box:before {
background: #FFF6F6; background: #FFF6F6;
border-color: #E0B4B4; border-color: #E0B4B4;
} }
.ui.form .fields.error .field .checkbox label:after, .ui.form .fields.error .field .checkbox label::after,
.ui.form .field.error .checkbox label:after, .ui.form .field.error .checkbox label::after {
.ui.form .fields.error .field .checkbox .box:after,
.ui.form .field.error .checkbox .box:after {
color: #9F3A38; color: #9F3A38;
} }
.ui.inverted.form .fields.error .field label, .ui.inverted.form .fields.error .field label,
@ -723,9 +790,11 @@
.ui.form .fields.info .field textarea, .ui.form .fields.info .field textarea,
.ui.form .fields.info .field select, .ui.form .fields.info .field select,
.ui.form .fields.info .field input:not([type]), .ui.form .fields.info .field input:not([type]),
.ui.form .fields.info .field input[type="color"],
.ui.form .fields.info .field input[type="date"], .ui.form .fields.info .field input[type="date"],
.ui.form .fields.info .field input[type="datetime-local"], .ui.form .fields.info .field input[type="datetime-local"],
.ui.form .fields.info .field input[type="email"], .ui.form .fields.info .field input[type="email"],
.ui.form .fields.info .field input[type="month"],
.ui.form .fields.info .field input[type="number"], .ui.form .fields.info .field input[type="number"],
.ui.form .fields.info .field input[type="password"], .ui.form .fields.info .field input[type="password"],
.ui.form .fields.info .field input[type="search"], .ui.form .fields.info .field input[type="search"],
@ -734,12 +803,15 @@
.ui.form .fields.info .field input[type="text"], .ui.form .fields.info .field input[type="text"],
.ui.form .fields.info .field input[type="file"], .ui.form .fields.info .field input[type="file"],
.ui.form .fields.info .field input[type="url"], .ui.form .fields.info .field input[type="url"],
.ui.form .fields.info .field input[type="week"],
.ui.form .field.info textarea, .ui.form .field.info textarea,
.ui.form .field.info select, .ui.form .field.info select,
.ui.form .field.info input:not([type]), .ui.form .field.info input:not([type]),
.ui.form .field.info input[type="color"],
.ui.form .field.info input[type="date"], .ui.form .field.info input[type="date"],
.ui.form .field.info input[type="datetime-local"], .ui.form .field.info input[type="datetime-local"],
.ui.form .field.info input[type="email"], .ui.form .field.info input[type="email"],
.ui.form .field.info input[type="month"],
.ui.form .field.info input[type="number"], .ui.form .field.info input[type="number"],
.ui.form .field.info input[type="password"], .ui.form .field.info input[type="password"],
.ui.form .field.info input[type="search"], .ui.form .field.info input[type="search"],
@ -747,7 +819,8 @@
.ui.form .field.info input[type="time"], .ui.form .field.info input[type="time"],
.ui.form .field.info input[type="text"], .ui.form .field.info input[type="text"],
.ui.form .field.info input[type="file"], .ui.form .field.info input[type="file"],
.ui.form .field.info input[type="url"] { .ui.form .field.info input[type="url"],
.ui.form .field.info input[type="week"] {
color: #276F86; color: #276F86;
background: #F8FFFF; background: #F8FFFF;
border-color: #A9D5DE; border-color: #A9D5DE;
@ -758,9 +831,11 @@
.ui.form .field.info textarea:focus, .ui.form .field.info textarea:focus,
.ui.form .field.info select:focus, .ui.form .field.info select:focus,
.ui.form .field.info input:not([type]):focus, .ui.form .field.info input:not([type]):focus,
.ui.form .field.info input[type="color"]:focus,
.ui.form .field.info input[type="date"]:focus, .ui.form .field.info input[type="date"]:focus,
.ui.form .field.info input[type="datetime-local"]:focus, .ui.form .field.info input[type="datetime-local"]:focus,
.ui.form .field.info input[type="email"]:focus, .ui.form .field.info input[type="email"]:focus,
.ui.form .field.info input[type="month"]:focus,
.ui.form .field.info input[type="number"]:focus, .ui.form .field.info input[type="number"]:focus,
.ui.form .field.info input[type="password"]:focus, .ui.form .field.info input[type="password"]:focus,
.ui.form .field.info input[type="search"]:focus, .ui.form .field.info input[type="search"]:focus,
@ -768,7 +843,8 @@
.ui.form .field.info input[type="time"]:focus, .ui.form .field.info input[type="time"]:focus,
.ui.form .field.info input[type="text"]:focus, .ui.form .field.info input[type="text"]:focus,
.ui.form .field.info input[type="file"]:focus, .ui.form .field.info input[type="file"]:focus,
.ui.form .field.info input[type="url"]:focus { .ui.form .field.info input[type="url"]:focus,
.ui.form .field.info input[type="week"]:focus {
background: #F8FFFF; background: #F8FFFF;
border-color: #A9D5DE; border-color: #A9D5DE;
color: #276F86; color: #276F86;
@ -875,22 +951,16 @@
---------------------*/ ---------------------*/
.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) label, .ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) label,
.ui.form .field.info .checkbox:not(.toggle):not(.slider) label, .ui.form .field.info .checkbox:not(.toggle):not(.slider) label {
.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) .box,
.ui.form .field.info .checkbox:not(.toggle):not(.slider) .box {
color: #276F86; color: #276F86;
} }
.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) label:before, .ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) label::before,
.ui.form .field.info .checkbox:not(.toggle):not(.slider) label:before, .ui.form .field.info .checkbox:not(.toggle):not(.slider) label::before {
.ui.form .fields.info .field .checkbox:not(.toggle):not(.slider) .box:before,
.ui.form .field.info .checkbox:not(.toggle):not(.slider) .box:before {
background: #F8FFFF; background: #F8FFFF;
border-color: #A9D5DE; border-color: #A9D5DE;
} }
.ui.form .fields.info .field .checkbox label:after, .ui.form .fields.info .field .checkbox label::after,
.ui.form .field.info .checkbox label:after, .ui.form .field.info .checkbox label::after {
.ui.form .fields.info .field .checkbox .box:after,
.ui.form .field.info .checkbox .box:after {
color: #276F86; color: #276F86;
} }
.ui.inverted.form .fields.info .field label, .ui.inverted.form .fields.info .field label,
@ -946,9 +1016,11 @@
.ui.form .fields.success .field textarea, .ui.form .fields.success .field textarea,
.ui.form .fields.success .field select, .ui.form .fields.success .field select,
.ui.form .fields.success .field input:not([type]), .ui.form .fields.success .field input:not([type]),
.ui.form .fields.success .field input[type="color"],
.ui.form .fields.success .field input[type="date"], .ui.form .fields.success .field input[type="date"],
.ui.form .fields.success .field input[type="datetime-local"], .ui.form .fields.success .field input[type="datetime-local"],
.ui.form .fields.success .field input[type="email"], .ui.form .fields.success .field input[type="email"],
.ui.form .fields.success .field input[type="month"],
.ui.form .fields.success .field input[type="number"], .ui.form .fields.success .field input[type="number"],
.ui.form .fields.success .field input[type="password"], .ui.form .fields.success .field input[type="password"],
.ui.form .fields.success .field input[type="search"], .ui.form .fields.success .field input[type="search"],
@ -957,12 +1029,15 @@
.ui.form .fields.success .field input[type="text"], .ui.form .fields.success .field input[type="text"],
.ui.form .fields.success .field input[type="file"], .ui.form .fields.success .field input[type="file"],
.ui.form .fields.success .field input[type="url"], .ui.form .fields.success .field input[type="url"],
.ui.form .fields.success .field input[type="week"],
.ui.form .field.success textarea, .ui.form .field.success textarea,
.ui.form .field.success select, .ui.form .field.success select,
.ui.form .field.success input:not([type]), .ui.form .field.success input:not([type]),
.ui.form .field.success input[type="color"],
.ui.form .field.success input[type="date"], .ui.form .field.success input[type="date"],
.ui.form .field.success input[type="datetime-local"], .ui.form .field.success input[type="datetime-local"],
.ui.form .field.success input[type="email"], .ui.form .field.success input[type="email"],
.ui.form .field.success input[type="month"],
.ui.form .field.success input[type="number"], .ui.form .field.success input[type="number"],
.ui.form .field.success input[type="password"], .ui.form .field.success input[type="password"],
.ui.form .field.success input[type="search"], .ui.form .field.success input[type="search"],
@ -970,7 +1045,8 @@
.ui.form .field.success input[type="time"], .ui.form .field.success input[type="time"],
.ui.form .field.success input[type="text"], .ui.form .field.success input[type="text"],
.ui.form .field.success input[type="file"], .ui.form .field.success input[type="file"],
.ui.form .field.success input[type="url"] { .ui.form .field.success input[type="url"],
.ui.form .field.success input[type="week"] {
color: #2C662D; color: #2C662D;
background: #FCFFF5; background: #FCFFF5;
border-color: #A3C293; border-color: #A3C293;
@ -981,9 +1057,11 @@
.ui.form .field.success textarea:focus, .ui.form .field.success textarea:focus,
.ui.form .field.success select:focus, .ui.form .field.success select:focus,
.ui.form .field.success input:not([type]):focus, .ui.form .field.success input:not([type]):focus,
.ui.form .field.success input[type="color"]:focus,
.ui.form .field.success input[type="date"]:focus, .ui.form .field.success input[type="date"]:focus,
.ui.form .field.success input[type="datetime-local"]:focus, .ui.form .field.success input[type="datetime-local"]:focus,
.ui.form .field.success input[type="email"]:focus, .ui.form .field.success input[type="email"]:focus,
.ui.form .field.success input[type="month"]:focus,
.ui.form .field.success input[type="number"]:focus, .ui.form .field.success input[type="number"]:focus,
.ui.form .field.success input[type="password"]:focus, .ui.form .field.success input[type="password"]:focus,
.ui.form .field.success input[type="search"]:focus, .ui.form .field.success input[type="search"]:focus,
@ -991,7 +1069,8 @@
.ui.form .field.success input[type="time"]:focus, .ui.form .field.success input[type="time"]:focus,
.ui.form .field.success input[type="text"]:focus, .ui.form .field.success input[type="text"]:focus,
.ui.form .field.success input[type="file"]:focus, .ui.form .field.success input[type="file"]:focus,
.ui.form .field.success input[type="url"]:focus { .ui.form .field.success input[type="url"]:focus,
.ui.form .field.success input[type="week"]:focus {
background: #FCFFF5; background: #FCFFF5;
border-color: #A3C293; border-color: #A3C293;
color: #2C662D; color: #2C662D;
@ -1098,22 +1177,16 @@
---------------------*/ ---------------------*/
.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) label, .ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) label,
.ui.form .field.success .checkbox:not(.toggle):not(.slider) label, .ui.form .field.success .checkbox:not(.toggle):not(.slider) label {
.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) .box,
.ui.form .field.success .checkbox:not(.toggle):not(.slider) .box {
color: #2C662D; color: #2C662D;
} }
.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) label:before, .ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) label::before,
.ui.form .field.success .checkbox:not(.toggle):not(.slider) label:before, .ui.form .field.success .checkbox:not(.toggle):not(.slider) label::before {
.ui.form .fields.success .field .checkbox:not(.toggle):not(.slider) .box:before,
.ui.form .field.success .checkbox:not(.toggle):not(.slider) .box:before {
background: #FCFFF5; background: #FCFFF5;
border-color: #A3C293; border-color: #A3C293;
} }
.ui.form .fields.success .field .checkbox label:after, .ui.form .fields.success .field .checkbox label::after,
.ui.form .field.success .checkbox label:after, .ui.form .field.success .checkbox label::after {
.ui.form .fields.success .field .checkbox .box:after,
.ui.form .field.success .checkbox .box:after {
color: #2C662D; color: #2C662D;
} }
.ui.inverted.form .fields.success .field label, .ui.inverted.form .fields.success .field label,
@ -1169,9 +1242,11 @@
.ui.form .fields.warning .field textarea, .ui.form .fields.warning .field textarea,
.ui.form .fields.warning .field select, .ui.form .fields.warning .field select,
.ui.form .fields.warning .field input:not([type]), .ui.form .fields.warning .field input:not([type]),
.ui.form .fields.warning .field input[type="color"],
.ui.form .fields.warning .field input[type="date"], .ui.form .fields.warning .field input[type="date"],
.ui.form .fields.warning .field input[type="datetime-local"], .ui.form .fields.warning .field input[type="datetime-local"],
.ui.form .fields.warning .field input[type="email"], .ui.form .fields.warning .field input[type="email"],
.ui.form .fields.warning .field input[type="month"],
.ui.form .fields.warning .field input[type="number"], .ui.form .fields.warning .field input[type="number"],
.ui.form .fields.warning .field input[type="password"], .ui.form .fields.warning .field input[type="password"],
.ui.form .fields.warning .field input[type="search"], .ui.form .fields.warning .field input[type="search"],
@ -1180,12 +1255,15 @@
.ui.form .fields.warning .field input[type="text"], .ui.form .fields.warning .field input[type="text"],
.ui.form .fields.warning .field input[type="file"], .ui.form .fields.warning .field input[type="file"],
.ui.form .fields.warning .field input[type="url"], .ui.form .fields.warning .field input[type="url"],
.ui.form .fields.warning .field input[type="week"],
.ui.form .field.warning textarea, .ui.form .field.warning textarea,
.ui.form .field.warning select, .ui.form .field.warning select,
.ui.form .field.warning input:not([type]), .ui.form .field.warning input:not([type]),
.ui.form .field.warning input[type="color"],
.ui.form .field.warning input[type="date"], .ui.form .field.warning input[type="date"],
.ui.form .field.warning input[type="datetime-local"], .ui.form .field.warning input[type="datetime-local"],
.ui.form .field.warning input[type="email"], .ui.form .field.warning input[type="email"],
.ui.form .field.warning input[type="month"],
.ui.form .field.warning input[type="number"], .ui.form .field.warning input[type="number"],
.ui.form .field.warning input[type="password"], .ui.form .field.warning input[type="password"],
.ui.form .field.warning input[type="search"], .ui.form .field.warning input[type="search"],
@ -1193,7 +1271,8 @@
.ui.form .field.warning input[type="time"], .ui.form .field.warning input[type="time"],
.ui.form .field.warning input[type="text"], .ui.form .field.warning input[type="text"],
.ui.form .field.warning input[type="file"], .ui.form .field.warning input[type="file"],
.ui.form .field.warning input[type="url"] { .ui.form .field.warning input[type="url"],
.ui.form .field.warning input[type="week"] {
color: #573A08; color: #573A08;
background: #FFFAF3; background: #FFFAF3;
border-color: #C9BA9B; border-color: #C9BA9B;
@ -1204,9 +1283,11 @@
.ui.form .field.warning textarea:focus, .ui.form .field.warning textarea:focus,
.ui.form .field.warning select:focus, .ui.form .field.warning select:focus,
.ui.form .field.warning input:not([type]):focus, .ui.form .field.warning input:not([type]):focus,
.ui.form .field.warning input[type="color"]:focus,
.ui.form .field.warning input[type="date"]:focus, .ui.form .field.warning input[type="date"]:focus,
.ui.form .field.warning input[type="datetime-local"]:focus, .ui.form .field.warning input[type="datetime-local"]:focus,
.ui.form .field.warning input[type="email"]:focus, .ui.form .field.warning input[type="email"]:focus,
.ui.form .field.warning input[type="month"]:focus,
.ui.form .field.warning input[type="number"]:focus, .ui.form .field.warning input[type="number"]:focus,
.ui.form .field.warning input[type="password"]:focus, .ui.form .field.warning input[type="password"]:focus,
.ui.form .field.warning input[type="search"]:focus, .ui.form .field.warning input[type="search"]:focus,
@ -1214,7 +1295,8 @@
.ui.form .field.warning input[type="time"]:focus, .ui.form .field.warning input[type="time"]:focus,
.ui.form .field.warning input[type="text"]:focus, .ui.form .field.warning input[type="text"]:focus,
.ui.form .field.warning input[type="file"]:focus, .ui.form .field.warning input[type="file"]:focus,
.ui.form .field.warning input[type="url"]:focus { .ui.form .field.warning input[type="url"]:focus,
.ui.form .field.warning input[type="week"]:focus {
background: #FFFAF3; background: #FFFAF3;
border-color: #C9BA9B; border-color: #C9BA9B;
color: #573A08; color: #573A08;
@ -1321,22 +1403,16 @@
---------------------*/ ---------------------*/
.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) label, .ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) label,
.ui.form .field.warning .checkbox:not(.toggle):not(.slider) label, .ui.form .field.warning .checkbox:not(.toggle):not(.slider) label {
.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) .box,
.ui.form .field.warning .checkbox:not(.toggle):not(.slider) .box {
color: #573A08; color: #573A08;
} }
.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) label:before, .ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) label::before,
.ui.form .field.warning .checkbox:not(.toggle):not(.slider) label:before, .ui.form .field.warning .checkbox:not(.toggle):not(.slider) label::before {
.ui.form .fields.warning .field .checkbox:not(.toggle):not(.slider) .box:before,
.ui.form .field.warning .checkbox:not(.toggle):not(.slider) .box:before {
background: #FFFAF3; background: #FFFAF3;
border-color: #C9BA9B; border-color: #C9BA9B;
} }
.ui.form .fields.warning .field .checkbox label:after, .ui.form .fields.warning .field .checkbox label::after,
.ui.form .field.warning .checkbox label:after, .ui.form .field.warning .checkbox label::after {
.ui.form .fields.warning .field .checkbox .box:after,
.ui.form .field.warning .checkbox .box:after {
color: #573A08; color: #573A08;
} }
.ui.inverted.form .fields.warning .field label, .ui.inverted.form .fields.warning .field label,
@ -1371,7 +1447,7 @@
cursor: default; cursor: default;
pointer-events: none; pointer-events: none;
} }
.ui.loading.form:before { .ui.loading.form::before {
position: absolute; position: absolute;
content: ''; content: '';
top: 0; top: 0;
@ -1381,10 +1457,10 @@
height: 100%; height: 100%;
z-index: 100; z-index: 100;
} }
.ui.loading.form.segments:before { .ui.loading.form.segments::before {
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
.ui.loading.form:after { .ui.loading.form::after {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
@ -1412,25 +1488,25 @@
Required Field Required Field
---------------------*/ ---------------------*/
.ui.form .required.fields:not(.grouped) > .field > label:after, .ui.form .required.fields:not(.grouped) > .field > label::after,
.ui.form .required.fields.grouped > label:after, .ui.form .required.fields.grouped > label::after,
.ui.form .required.field > label:after, .ui.form .required.field > label::after,
.ui.form .required.fields:not(.grouped) > .field > .checkbox:after, .ui.form .required.fields:not(.grouped) > .field > .checkbox::after,
.ui.form .required.field > .checkbox:after, .ui.form .required.field > .checkbox::after,
.ui.form label.required:after { .ui.form label.required::after {
margin: -0.2em 0 0 0.2em; margin: -0.2em 0 0 0.2em;
content: '*'; content: '*';
color: #DB2828; color: #DB2828;
} }
.ui.form .required.fields:not(.grouped) > .field > label:after, .ui.form .required.fields:not(.grouped) > .field > label::after,
.ui.form .required.fields.grouped > label:after, .ui.form .required.fields.grouped > label::after,
.ui.form .required.field > label:after, .ui.form .required.field > label::after,
.ui.form label.required:after { .ui.form label.required::after {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
} }
.ui.form .required.fields:not(.grouped) > .field > .checkbox:after, .ui.form .required.fields:not(.grouped) > .field > .checkbox::after,
.ui.form .required.field > .checkbox:after { .ui.form .required.field > .checkbox::after {
position: absolute; position: absolute;
top: 0; top: 0;
left: 100%; left: 100%;
@ -1449,9 +1525,7 @@
.ui.inverted.form label, .ui.inverted.form label,
.ui.form .inverted.segment label, .ui.form .inverted.segment label,
.ui.form .inverted.segment .ui.checkbox label, .ui.form .inverted.segment .ui.checkbox label,
.ui.form .inverted.segment .ui.checkbox .box,
.ui.inverted.form .ui.checkbox label, .ui.inverted.form .ui.checkbox label,
.ui.inverted.form .ui.checkbox .box,
.ui.inverted.form .inline.fields > label, .ui.inverted.form .inline.fields > label,
.ui.inverted.form .inline.fields .field > label, .ui.inverted.form .inline.fields .field > label,
.ui.inverted.form .inline.fields .field > p, .ui.inverted.form .inline.fields .field > p,
@ -1462,15 +1536,17 @@
.ui.inverted.loading.form { .ui.inverted.loading.form {
color: #FFFFFF; color: #FFFFFF;
} }
.ui.inverted.loading.form:before { .ui.inverted.loading.form::before {
background: rgba(0, 0, 0, 0.85); background: rgba(0, 0, 0, 0.85);
} }
/* Inverted Field */ /* Inverted Field */
.ui.inverted.form input:not([type]), .ui.inverted.form input:not([type]),
.ui.inverted.form input[type="color"],
.ui.inverted.form input[type="date"], .ui.inverted.form input[type="date"],
.ui.inverted.form input[type="datetime-local"], .ui.inverted.form input[type="datetime-local"],
.ui.inverted.form input[type="email"], .ui.inverted.form input[type="email"],
.ui.inverted.form input[type="month"],
.ui.inverted.form input[type="number"], .ui.inverted.form input[type="number"],
.ui.inverted.form input[type="password"], .ui.inverted.form input[type="password"],
.ui.inverted.form input[type="search"], .ui.inverted.form input[type="search"],
@ -1478,7 +1554,8 @@
.ui.inverted.form input[type="time"], .ui.inverted.form input[type="time"],
.ui.inverted.form input[type="text"], .ui.inverted.form input[type="text"],
.ui.inverted.form input[type="file"], .ui.inverted.form input[type="file"],
.ui.inverted.form input[type="url"] { .ui.inverted.form input[type="url"],
.ui.inverted.form input[type="week"] {
background: #FFFFFF; background: #FFFFFF;
border-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.1);
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
@ -1500,9 +1577,9 @@
margin-bottom: 0; margin-bottom: 0;
} }
.ui.form .grouped.fields > label { .ui.form .grouped.fields > label {
margin: 0 0 0.33333333rem 0; margin: 0 0 0.28571429rem 0;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
font-size: 0.91666667em; font-size: 0.92857143em;
font-weight: bold; font-weight: bold;
text-transform: none; text-transform: none;
} }
@ -1690,7 +1767,7 @@
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
vertical-align: baseline; vertical-align: baseline;
font-size: 0.91666667em; font-size: 0.92857143em;
font-weight: bold; font-weight: bold;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
text-transform: none; text-transform: none;
@ -1725,7 +1802,7 @@
/* Label */ /* Label */
.ui.form .inline.fields .field > :first-child, .ui.form .inline.fields .field > :first-child,
.ui.form .inline.field > :first-child { .ui.form .inline.field > :first-child {
margin: 0 0.83333333em 0 0; margin: 0 0.85714286em 0 0;
} }
.ui.form .inline.fields .field > :only-child, .ui.form .inline.fields .field > :only-child,
.ui.form .inline.field > :only-child { .ui.form .inline.field > :only-child {
@ -1758,37 +1835,37 @@
.ui.mini.form, .ui.mini.form,
.ui.mini.form .field .dropdown, .ui.mini.form .field .dropdown,
.ui.mini.form .field .dropdown .menu > .item { .ui.mini.form .field .dropdown .menu > .item {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.form, .ui.tiny.form,
.ui.tiny.form .field .dropdown, .ui.tiny.form .field .dropdown,
.ui.tiny.form .field .dropdown .menu > .item { .ui.tiny.form .field .dropdown .menu > .item {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.form, .ui.small.form,
.ui.small.form .field .dropdown, .ui.small.form .field .dropdown,
.ui.small.form .field .dropdown .menu > .item { .ui.small.form .field .dropdown .menu > .item {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.form, .ui.large.form,
.ui.large.form .field .dropdown, .ui.large.form .field .dropdown,
.ui.large.form .field .dropdown .menu > .item { .ui.large.form .field .dropdown .menu > .item {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.form, .ui.big.form,
.ui.big.form .field .dropdown, .ui.big.form .field .dropdown,
.ui.big.form .field .dropdown .menu > .item { .ui.big.form .field .dropdown .menu > .item {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.form, .ui.huge.form,
.ui.huge.form .field .dropdown, .ui.huge.form .field .dropdown,
.ui.huge.form .field .dropdown .menu > .item { .ui.huge.form .field .dropdown .menu > .item {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.form, .ui.massive.form,
.ui.massive.form .field .dropdown, .ui.massive.form .field .dropdown,
.ui.massive.form .field .dropdown .menu > .item { .ui.massive.form .field .dropdown .menu > .item {
font-size: 1.75rem; font-size: 1.71428571rem;
} }

67
semantic/dist/components/form.js vendored
View file

@ -131,6 +131,11 @@ $.fn.form = function(parameters) {
$reset = $module.find(selector.reset); $reset = $module.find(selector.reset);
}, },
refreshEvents: function() {
module.removeEvents();
module.bindEvents();
},
submit: function() { submit: function() {
module.verbose('Submitting form', $module); module.verbose('Submitting form', $module);
submitting = true; submitting = true;
@ -391,7 +396,6 @@ $.fn.form = function(parameters) {
$module.off(eventNamespace); $module.off(eventNamespace);
$field.off(eventNamespace); $field.off(eventNamespace);
$submit.off(eventNamespace); $submit.off(eventNamespace);
$field.off(eventNamespace);
}, },
event: { event: {
@ -419,6 +423,7 @@ $.fn.form = function(parameters) {
$field.one('keyup' + eventNamespace, module.event.field.keyup); $field.one('keyup' + eventNamespace, module.event.field.keyup);
module.submit(); module.submit();
module.debug('Enter pressed on input submitting form'); module.debug('Enter pressed on input submitting form');
event.preventDefault();
} }
keyHeldDown = true; keyHeldDown = true;
} }
@ -543,7 +548,7 @@ $.fn.form = function(parameters) {
parts, parts,
suffixPrompt suffixPrompt
; ;
if(ancillary && ancillary.indexOf('..') >= 0) { if(ancillary && ['integer', 'decimal', 'number'].indexOf(ruleName) >= 0 && ancillary.indexOf('..') >= 0) {
parts = ancillary.split('..', 2); parts = ancillary.split('..', 2);
if(!rule.prompt) { if(!rule.prompt) {
suffixPrompt = ( suffixPrompt = (
@ -585,7 +590,7 @@ $.fn.form = function(parameters) {
if(isLegacySettings) { if(isLegacySettings) {
// 1.x (ducktyped) // 1.x (ducktyped)
settings = $.extend(true, {}, $.fn.form.settings, legacyParameters); settings = $.extend(true, {}, $.fn.form.settings, legacyParameters);
validation = $.extend({}, $.fn.form.settings.defaults, parameters); validation = $.extend(true, {}, $.fn.form.settings.defaults, parameters);
module.error(settings.error.oldSyntax, element); module.error(settings.error.oldSyntax, element);
module.verbose('Extending settings from legacy parameters', validation, settings); module.verbose('Extending settings from legacy parameters', validation, settings);
} }
@ -595,13 +600,13 @@ $.fn.form = function(parameters) {
parameters.fields = module.get.fieldsFromShorthand(parameters.fields); parameters.fields = module.get.fieldsFromShorthand(parameters.fields);
} }
settings = $.extend(true, {}, $.fn.form.settings, parameters); settings = $.extend(true, {}, $.fn.form.settings, parameters);
validation = $.extend({}, $.fn.form.settings.defaults, settings.fields); validation = $.extend(true, {}, $.fn.form.settings.defaults, settings.fields);
module.verbose('Extending settings', validation, settings); module.verbose('Extending settings', validation, settings);
} }
} }
else { else {
settings = $.fn.form.settings; settings = $.extend(true, {}, $.fn.form.settings);
validation = $.fn.form.settings.defaults; validation = $.extend(true, {}, $.fn.form.settings.defaults);
module.verbose('Using default form validation', validation, settings); module.verbose('Using default form validation', validation, settings);
} }
@ -863,9 +868,11 @@ $.fn.form = function(parameters) {
} }
}); });
module.debug('Adding rules', newValidation.rules, validation); module.debug('Adding rules', newValidation.rules, validation);
module.refreshEvents();
}, },
fields: function(fields) { fields: function(fields) {
validation = $.extend({}, validation, module.get.fieldsFromShorthand(fields)); validation = $.extend(true, {}, validation, module.get.fieldsFromShorthand(fields));
module.refreshEvents();
}, },
prompt: function(identifier, errors, internal) { prompt: function(identifier, errors, internal) {
var var
@ -886,13 +893,13 @@ $.fn.form = function(parameters) {
} }
if(settings.inline) { if(settings.inline) {
if(!promptExists) { if(!promptExists) {
$prompt = settings.templates.prompt(errors, className.label); $prompt = $('<div/>').addClass(className.label);
$prompt $prompt
.appendTo($fieldGroup) .appendTo($fieldGroup)
; ;
} }
$prompt $prompt
.html(errors[0]) .html(settings.templates.prompt(errors))
; ;
if(!promptExists) { if(!promptExists) {
if(settings.transition && module.can.useElement('transition') && $module.transition('is supported')) { if(settings.transition && module.can.useElement('transition') && $module.transition('is supported')) {
@ -962,6 +969,7 @@ $.fn.form = function(parameters) {
$.each(fields, function(index, field) { $.each(fields, function(index, field) {
module.remove.rule(field); module.remove.rule(field);
}); });
module.refreshEvents();
}, },
// alias // alias
rules: function(field, rules) { rules: function(field, rules) {
@ -1085,12 +1093,15 @@ $.fn.form = function(parameters) {
} }
else if(isCheckbox) { else if(isCheckbox) {
module.verbose('Setting checkbox value', value, $element); module.verbose('Setting checkbox value', value, $element);
if(value === true || value === 1) { if(value === true || value === 1 || value === 'on') {
$element.checkbox('check'); $element.checkbox('check');
} }
else { else {
$element.checkbox('uncheck'); $element.checkbox('uncheck');
} }
if(typeof value === 'string') {
$field.val(value);
}
} }
else if(isDropdown) { else if(isDropdown) {
module.verbose('Setting dropdown value', value, $element); module.verbose('Setting dropdown value', value, $element);
@ -1203,10 +1214,10 @@ $.fn.form = function(parameters) {
if(event && $module.data('moduleApi') !== undefined) { if(event && $module.data('moduleApi') !== undefined) {
event.stopImmediatePropagation(); event.stopImmediatePropagation();
} }
if(settings.errorFocus) { if(settings.errorFocus && ignoreCallbacks !== true) {
var focusElement, hasTabIndex = true; var focusElement, hasTabIndex = true;
if (typeof settings.errorFocus === 'string') { if (typeof settings.errorFocus === 'string') {
focusElement = $(settings.errorFocus); focusElement = $(document).find(settings.errorFocus);
hasTabIndex = focusElement.is('[tabindex]'); hasTabIndex = focusElement.is('[tabindex]');
// to be able to focus/scroll into non input elements we need a tabindex // to be able to focus/scroll into non input elements we need a tabindex
if (!hasTabIndex) { if (!hasTabIndex) {
@ -1526,7 +1537,7 @@ $.fn.form.settings = {
autoCheckRequired : false, autoCheckRequired : false,
preventLeaving : false, preventLeaving : false,
errorFocus : false, errorFocus : true,
dateHandling : 'date', // 'date', 'input', 'formatter' dateHandling : 'date', // 'date', 'input', 'formatter'
onValid : function() {}, onValid : function() {},
@ -1582,7 +1593,6 @@ $.fn.form.settings = {
doesntContain : '{name} cannot contain "{ruleValue}"', doesntContain : '{name} cannot contain "{ruleValue}"',
doesntContainExactly : '{name} cannot contain exactly "{ruleValue}"', doesntContainExactly : '{name} cannot contain exactly "{ruleValue}"',
minLength : '{name} must be at least {ruleValue} characters', minLength : '{name} must be at least {ruleValue} characters',
length : '{name} must be at least {ruleValue} characters',
exactLength : '{name} must be exactly {ruleValue} characters', exactLength : '{name} must be exactly {ruleValue} characters',
maxLength : '{name} cannot be longer than {ruleValue} characters', maxLength : '{name} cannot be longer than {ruleValue} characters',
match : '{name} must match {ruleValue} field', match : '{name} must match {ruleValue} field',
@ -1596,7 +1606,7 @@ $.fn.form.settings = {
selector : { selector : {
checkbox : 'input[type="checkbox"], input[type="radio"]', checkbox : 'input[type="checkbox"], input[type="radio"]',
clear : '.clear', clear : '.clear',
field : 'input:not(.search):not([type="file"]), textarea, select', field : 'input:not(.search):not([type="file"]):not([type="reset"]):not([type="button"]):not([type="submit"]), textarea, select',
group : '.field', group : '.field',
input : 'input:not([type="file"])', input : 'input:not([type="file"])',
message : '.error.message', message : '.error.message',
@ -1637,15 +1647,22 @@ $.fn.form.settings = {
html += '<li>' + value + '</li>'; html += '<li>' + value + '</li>';
}); });
html += '</ul>'; html += '</ul>';
return $(html); return html;
}, },
// template that produces label // template that produces label content
prompt: function(errors, labelClasses) { prompt: function(errors) {
return $('<div/>') if(errors.length === 1){
.addClass(labelClasses) return errors[0];
.html(errors[0]) }
var
html = '<ul class="ui list">'
; ;
$.each(errors, function(index, value) {
html += '<li>' + value + '</li>';
});
html += '</ul>';
return html;
} }
}, },
@ -1855,14 +1872,6 @@ $.fn.form.settings = {
; ;
}, },
// see rls notes for 2.0.6 (this is a duplicate of minLength)
length: function(value, requiredLength) {
return (value !== undefined)
? (value.length >= requiredLength)
: false
;
},
// is exactly length // is exactly length
exactLength: function(value, requiredLength) { exactLength: function(value, requiredLength) {
return (value !== undefined) return (value !== undefined)

2
semantic/dist/components/form.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/form.min.js vendored
View file

File diff suppressed because one or more lines are too long

121
semantic/dist/components/grid.css vendored
View file

@ -34,10 +34,10 @@
-----------------------*/ -----------------------*/
.ui.grid { .ui.grid {
margin-top: -0.5rem; margin-top: -1rem;
margin-bottom: -0.5rem; margin-bottom: -1rem;
margin-left: -0.5625rem; margin-left: -1rem;
margin-right: -0.5625rem; margin-right: -1rem;
} }
.ui.relaxed.grid { .ui.relaxed.grid {
margin-left: -1.5rem; margin-left: -1.5rem;
@ -50,7 +50,7 @@
/* Preserve Rows Spacing on Consecutive Grids */ /* Preserve Rows Spacing on Consecutive Grids */
.ui.grid + .grid { .ui.grid + .grid {
margin-top: 0.5rem; margin-top: 1rem;
} }
/*------------------- /*-------------------
@ -64,13 +64,13 @@
position: relative; position: relative;
display: inline-block; display: inline-block;
width: 6.25%; width: 6.25%;
padding-left: 0.5625rem; padding-left: 1rem;
padding-right: 0.5625rem; padding-right: 1rem;
vertical-align: top; vertical-align: top;
} }
.ui.grid > * { .ui.grid > * {
padding-left: 0.5625rem; padding-left: 1rem;
padding-right: 0.5625rem; padding-right: 1rem;
} }
/*------------------- /*-------------------
@ -96,8 +96,8 @@
align-items: stretch; align-items: stretch;
width: 100% !important; width: 100% !important;
padding: 0; padding: 0;
padding-top: 0.5rem; padding-top: 1rem;
padding-bottom: 0.5rem; padding-bottom: 1rem;
} }
/*------------------- /*-------------------
@ -107,8 +107,8 @@
/* Vertical padding when no rows */ /* Vertical padding when no rows */
.ui.grid > .column:not(.row) { .ui.grid > .column:not(.row) {
padding-top: 0.5rem; padding-top: 1rem;
padding-bottom: 0.5rem; padding-bottom: 1rem;
} }
.ui.grid > .row > .column { .ui.grid > .row > .column {
margin-top: 0; margin-top: 0;
@ -148,10 +148,10 @@
-webkit-box-flex: 1; -webkit-box-flex: 1;
-ms-flex-positive: 1; -ms-flex-positive: 1;
flex-grow: 1; flex-grow: 1;
margin: 0.5rem 0.5625rem; margin: 1rem 1rem;
} }
.ui.grid .column + .ui.vertical.divider { .ui.grid .column + .ui.vertical.divider {
height: calc(50% - 0.5rem); height: calc(50% - 1rem);
} }
/* Remove Border on Last Horizontal Segment */ /* Remove Border on Last Horizontal Segment */
@ -1051,8 +1051,8 @@
/* Swap from padding to margin on columns to have dividers align */ /* Swap from padding to margin on columns to have dividers align */
.ui[class*="vertically divided"].grid > .column:not(.row), .ui[class*="vertically divided"].grid > .column:not(.row),
.ui[class*="vertically divided"].grid > .row > .column { .ui[class*="vertically divided"].grid > .row > .column {
margin-top: 0.5rem; margin-top: 1rem;
margin-bottom: 0.5rem; margin-bottom: 1rem;
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
} }
@ -1087,14 +1087,14 @@
.ui[class*="vertically divided"].grid > .row { .ui[class*="vertically divided"].grid > .row {
position: relative; position: relative;
} }
.ui[class*="vertically divided"].grid > .row:before { .ui[class*="vertically divided"].grid > .row::before {
position: absolute; position: absolute;
content: ""; content: "";
top: 0; top: 0;
left: 0; left: 0;
width: calc(100% - 1.125rem); width: calc(100% - 2rem);
height: 1px; height: 1px;
margin: 0 0.5625rem; margin: 0 1rem;
-webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
} }
@ -1106,7 +1106,7 @@
} }
/* First Row Vertically Divided */ /* First Row Vertically Divided */
.ui[class*="vertically divided"].grid > .row:first-child:before { .ui[class*="vertically divided"].grid > .row:first-child::before {
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -1122,18 +1122,18 @@
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
.ui.inverted[class*="vertically divided"].grid > .row:before { .ui.inverted[class*="vertically divided"].grid > .row::before {
-webkit-box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.1); -webkit-box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.1);
box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.1); box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.1);
} }
/* Relaxed */ /* Relaxed */
.ui.relaxed[class*="vertically divided"].grid > .row:before { .ui.relaxed[class*="vertically divided"].grid > .row::before {
margin-left: 1.5rem; margin-left: 1.5rem;
margin-right: 1.5rem; margin-right: 1.5rem;
width: calc(100% - 3rem); width: calc(100% - 3rem);
} }
.ui[class*="very relaxed"][class*="vertically divided"].grid > .row:before { .ui[class*="very relaxed"][class*="vertically divided"].grid > .row::before {
margin-left: 2.5rem; margin-left: 2.5rem;
margin-right: 2.5rem; margin-right: 2.5rem;
width: calc(100% - 5rem); width: calc(100% - 5rem);
@ -1332,7 +1332,7 @@
.ui.grid > .primary.row, .ui.grid > .primary.row,
.ui.grid > .primary.column, .ui.grid > .primary.column,
.ui.grid > .row > .primary.column { .ui.grid > .row > .primary.column {
background-color: #6435C9; background-color: #2185D0;
color: #FFFFFF; color: #FFFFFF;
} }
.ui.grid > .secondary.row, .ui.grid > .secondary.row,
@ -1476,11 +1476,11 @@
} }
/* Vertically Divided Reversed */ /* Vertically Divided Reversed */
.ui.grid[class*="vertically divided"][class*="mobile vertically reversed"] > .row:first-child:before { .ui.grid[class*="vertically divided"][class*="mobile vertically reversed"] > .row:first-child::before {
-webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
} }
.ui.grid[class*="vertically divided"][class*="mobile vertically reversed"] > .row:last-child:before { .ui.grid[class*="vertically divided"][class*="mobile vertically reversed"] > .row:last-child::before {
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -1526,11 +1526,11 @@
} }
/* Vertically Divided Reversed */ /* Vertically Divided Reversed */
.ui.grid[class*="vertically divided"][class*="tablet vertically reversed"] > .row:first-child:before { .ui.grid[class*="vertically divided"][class*="tablet vertically reversed"] > .row:first-child::before {
-webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
} }
.ui.grid[class*="vertically divided"][class*="tablet vertically reversed"] > .row:last-child:before { .ui.grid[class*="vertically divided"][class*="tablet vertically reversed"] > .row:last-child::before {
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -1576,11 +1576,11 @@
} }
/* Vertically Divided Reversed */ /* Vertically Divided Reversed */
.ui.grid[class*="vertically divided"][class*="computer vertically reversed"] > .row:first-child:before { .ui.grid[class*="vertically divided"][class*="computer vertically reversed"] > .row:first-child::before {
-webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15); box-shadow: 0 -1px 0 0 rgba(34, 36, 38, 0.15);
} }
.ui.grid[class*="vertically divided"][class*="computer vertically reversed"] > .row:last-child:before { .ui.grid[class*="vertically divided"][class*="computer vertically reversed"] > .row:last-child::before {
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -1613,13 +1613,16 @@
} }
.ui.grid > .doubling.row > .column, .ui.grid > .doubling.row > .column,
.ui.doubling.grid > .row > .column { .ui.doubling.grid > .row > .column {
display: inline-block !important; padding-top: 1rem !important;
padding-top: 0.5rem !important; padding-bottom: 1rem !important;
padding-bottom: 0.5rem !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
margin: 0; margin: 0;
} }
.ui.grid:not(.stretched) > .doubling.row:not(.stretched) > .column:not(.stretched),
.ui.doubling.grid:not(.stretched) > .row:not(.stretched) > .column:not(.stretched) {
display: inline-block !important;
}
.ui[class*="two column"].doubling.grid > .row > .column, .ui[class*="two column"].doubling.grid > .row > .column,
.ui[class*="two column"].doubling.grid > .column:not(.row), .ui[class*="two column"].doubling.grid > .column:not(.row),
.ui.grid > [class*="two column"].doubling.row.row > .column { .ui.grid > [class*="two column"].doubling.row.row > .column {
@ -1706,8 +1709,8 @@
} }
.ui.grid > .doubling.row > .column, .ui.grid > .doubling.row > .column,
.ui.doubling.grid > .row > .column { .ui.doubling.grid > .row > .column {
padding-top: 0.5rem !important; padding-top: 1rem !important;
padding-bottom: 0.5rem !important; padding-bottom: 1rem !important;
margin: 0 !important; margin: 0 !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
@ -1810,7 +1813,7 @@
margin: 0 0 !important; margin: 0 0 !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
padding: 0.5rem 0.5625rem; padding: 1rem 1rem;
} }
.ui.stackable.grid:not(.vertically) > .row { .ui.stackable.grid:not(.vertically) > .row {
margin: 0; margin: 0;
@ -1827,8 +1830,8 @@
/* Don't pad inside segment or nested grid */ /* Don't pad inside segment or nested grid */
.ui.grid .ui.stackable.grid, .ui.grid .ui.stackable.grid,
.ui.segment:not(.vertical) .ui.stackable.page.grid { .ui.segment:not(.vertical) .ui.stackable.page.grid {
margin-left: -0.5625rem !important; margin-left: -1rem !important;
margin-right: -0.5625rem !important; margin-right: -1rem !important;
} }
/* Divided Stackable */ /* Divided Stackable */
@ -1851,8 +1854,8 @@
border-top: 1px solid rgba(34, 36, 38, 0.15); border-top: 1px solid rgba(34, 36, 38, 0.15);
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
padding-top: 1rem !important; padding-top: 2rem !important;
padding-bottom: 1rem !important; padding-bottom: 2rem !important;
} }
.ui.stackable.celled.grid > .row { .ui.stackable.celled.grid > .row {
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
@ -1999,30 +2002,30 @@
-----------------*/ -----------------*/
.ui.ui.ui.compact.grid { .ui.ui.ui.compact.grid {
margin: -0.28125rem; margin: -0.5rem;
} }
.ui.ui.ui.compact.grid > .column:not(.row), .ui.ui.ui.compact.grid > .column:not(.row),
.ui.ui.ui.compact.grid > .row > .column { .ui.ui.ui.compact.grid > .row > .column {
padding-left: 0.28125rem; padding-left: 0.5rem;
padding-right: 0.28125rem; padding-right: 0.5rem;
} }
.ui.ui.ui.compact.grid > * { .ui.ui.ui.compact.grid > * {
padding-left: 0.28125rem; padding-left: 0.5rem;
padding-right: 0.28125rem; padding-right: 0.5rem;
} }
/* Row */ /* Row */
.ui.ui.ui.compact.grid > .row { .ui.ui.ui.compact.grid > .row {
padding-top: 0.25rem; padding-top: 0.5rem;
padding-bottom: 0.25rem; padding-bottom: 0.5rem;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
} }
/* Columns */ /* Columns */
.ui.ui.ui.compact.grid > .column:not(.row) { .ui.ui.ui.compact.grid > .column:not(.row) {
padding-top: 0.25rem; padding-top: 0.5rem;
padding-bottom: 0.25rem; padding-bottom: 0.5rem;
} }
/* Relaxed + Celled */ /* Relaxed + Celled */
@ -2040,30 +2043,30 @@
-----------------*/ -----------------*/
.ui.ui.ui[class*="very compact"].grid { .ui.ui.ui[class*="very compact"].grid {
margin: -0.140625rem; margin: -0.25rem;
} }
.ui.ui.ui[class*="very compact"].grid > .column:not(.row), .ui.ui.ui[class*="very compact"].grid > .column:not(.row),
.ui.ui.ui[class*="very compact"].grid > .row > .column { .ui.ui.ui[class*="very compact"].grid > .row > .column {
padding-left: 0.140625rem; padding-left: 0.25rem;
padding-right: 0.140625rem; padding-right: 0.25rem;
} }
.ui.ui.ui[class*="very compact"].grid > * { .ui.ui.ui[class*="very compact"].grid > * {
padding-left: 0.140625rem; padding-left: 0.25rem;
padding-right: 0.140625rem; padding-right: 0.25rem;
} }
/* Row */ /* Row */
.ui.ui.ui[class*="very compact"].grid > .row { .ui.ui.ui[class*="very compact"].grid > .row {
padding-top: 0.125rem; padding-top: 0.25rem;
padding-bottom: 0.125rem; padding-bottom: 0.25rem;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
} }
/* Columns */ /* Columns */
.ui.ui.ui[class*="very compact"].grid > .column:not(.row) { .ui.ui.ui[class*="very compact"].grid > .column:not(.row) {
padding-top: 0.125rem; padding-top: 0.25rem;
padding-bottom: 0.125rem; padding-bottom: 0.25rem;
} }
/* Relaxed + Celled */ /* Relaxed + Celled */

2
semantic/dist/components/grid.min.css vendored
View file

File diff suppressed because one or more lines are too long

88
semantic/dist/components/header.css vendored
View file

@ -137,13 +137,13 @@ h1.ui.header {
font-size: 2rem; font-size: 2rem;
} }
h1.ui.header .sub.header { h1.ui.header .sub.header {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
h2.ui.header { h2.ui.header {
font-size: 1.71428571rem; font-size: 1.71428571rem;
} }
h2.ui.header .sub.header { h2.ui.header .sub.header {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
h3.ui.header { h3.ui.header {
font-size: 1.28571429rem; font-size: 1.28571429rem;
@ -161,13 +161,13 @@ h5.ui.header {
font-size: 1rem; font-size: 1rem;
} }
h5.ui.header .sub.header { h5.ui.header .sub.header {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
h6.ui.header { h6.ui.header {
font-size: 0.85714286rem; font-size: 0.85714286rem;
} }
h6.ui.header .sub.header { h6.ui.header .sub.header {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
/*-------------- /*--------------
@ -178,19 +178,19 @@ h6.ui.header .sub.header {
font-size: 0.85714286em; font-size: 0.85714286em;
} }
.ui.mini.header .sub.header { .ui.mini.header .sub.header {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.mini.sub.header { .ui.mini.sub.header {
font-size: 0.75em; font-size: 0.78571429em;
} }
.ui.tiny.header { .ui.tiny.header {
font-size: 1em; font-size: 1em;
} }
.ui.tiny.header .sub.header { .ui.tiny.header .sub.header {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.tiny.sub.header { .ui.tiny.sub.header {
font-size: 0.75em; font-size: 0.78571429em;
} }
.ui.small.header { .ui.small.header {
font-size: 1.07142857em; font-size: 1.07142857em;
@ -199,22 +199,22 @@ h6.ui.header .sub.header {
font-size: 1rem; font-size: 1rem;
} }
.ui.small.sub.header { .ui.small.sub.header {
font-size: 0.75em; font-size: 0.78571429em;
} }
.ui.large.header { .ui.large.header {
font-size: 1.71428571em; font-size: 1.71428571em;
} }
.ui.large.header .sub.header { .ui.large.header .sub.header {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.large.sub.header { .ui.large.sub.header {
font-size: 0.91666667em; font-size: 0.92857143em;
} }
.ui.big.header { .ui.big.header {
font-size: 1.85714286em; font-size: 1.85714286em;
} }
.ui.big.header .sub.header { .ui.big.header .sub.header {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.sub.header { .ui.big.sub.header {
font-size: 1em; font-size: 1em;
@ -224,7 +224,7 @@ h6.ui.header .sub.header {
min-height: 1em; min-height: 1em;
} }
.ui.huge.header .sub.header { .ui.huge.header .sub.header {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.huge.sub.header { .ui.huge.sub.header {
font-size: 1em; font-size: 1em;
@ -234,10 +234,10 @@ h6.ui.header .sub.header {
min-height: 1em; min-height: 1em;
} }
.ui.massive.header .sub.header { .ui.massive.header .sub.header {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.sub.header { .ui.massive.sub.header {
font-size: 1.16666667em; font-size: 1.14285714em;
} }
/*-------------- /*--------------
@ -246,9 +246,9 @@ h6.ui.header .sub.header {
.ui.sub.header { .ui.sub.header {
padding: 0; padding: 0;
margin-bottom: 0.16666667rem; margin-bottom: 0.14285714rem;
font-weight: bold; font-weight: bold;
font-size: 0.83333333em; font-size: 0.85714286em;
text-transform: uppercase; text-transform: uppercase;
color: ''; color: '';
} }
@ -262,7 +262,7 @@ h6.ui.header .sub.header {
text-align: center; text-align: center;
margin: 2rem 0 1rem; margin: 2rem 0 1rem;
} }
.ui.icon.header:after { .ui.icon.header::after {
content: ''; content: '';
display: block; display: block;
height: 0; height: 0;
@ -272,6 +272,7 @@ h6.ui.header .sub.header {
.ui.icon.header:first-child { .ui.icon.header:first-child {
margin-top: 0; margin-top: 0;
} }
.ui.icon.header > .image.icon,
.ui.icon.header > .icons, .ui.icon.header > .icons,
.ui.icon.header > i.icon { .ui.icon.header > i.icon {
float: none; float: none;
@ -297,6 +298,7 @@ h6.ui.header .sub.header {
.ui.icon.header > i.square { .ui.icon.header > i.square {
font-size: 2em; font-size: 2em;
} }
.ui.block.icon.header > .image.icon,
.ui.block.icon.header > .icons, .ui.block.icon.header > .icons,
.ui.block.icon.header > i.icon { .ui.block.icon.header > i.icon {
margin-bottom: 0; margin-bottom: 0;
@ -352,13 +354,13 @@ h6.ui.header .sub.header {
--------------------*/ --------------------*/
.ui.primary.header { .ui.primary.header {
color: #6435C9; color: #2185D0;
} }
a.ui.primary.header:hover { a.ui.primary.header:hover {
color: #5829bb; color: #1678c2;
} }
.ui.primary.dividing.header { .ui.primary.dividing.header {
border-bottom: 2px solid #6435C9; border-bottom: 2px solid #2185D0;
} }
.ui.inverted.primary.header.header.header { .ui.inverted.primary.header.header.header {
color: #54C8FF; color: #54C8FF;
@ -639,7 +641,7 @@ a.ui.inverted.black.header.header.header:hover {
.ui.justified.header { .ui.justified.header {
text-align: justify; text-align: justify;
} }
.ui.justified.header:after { .ui.justified.header::after {
display: inline-block; display: inline-block;
content: ''; content: '';
width: 100%; width: 100%;
@ -674,11 +676,11 @@ a.ui.inverted.black.header.header.header:hover {
--------------------*/ --------------------*/
.ui.dividing.header { .ui.dividing.header {
padding-bottom: 0.25rem; padding-bottom: 0.21428571rem;
border-bottom: 1px solid rgba(34, 36, 38, 0.15); border-bottom: 1px solid rgba(34, 36, 38, 0.15);
} }
.ui.dividing.header .sub.header { .ui.dividing.header .sub.header {
padding-bottom: 0.25rem; padding-bottom: 0.21428571rem;
} }
.ui.dividing.header i.icon { .ui.dividing.header i.icon {
margin-bottom: 0; margin-bottom: 0;
@ -693,35 +695,35 @@ a.ui.inverted.black.header.header.header:hover {
.ui.block.header { .ui.block.header {
background: #F3F4F5; background: #F3F4F5;
padding: 0.75rem 1rem; padding: 0.78571429rem 1rem;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
border: 1px solid #D4D4D5; border: 1px solid #D4D4D5;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
.ui.block.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) { .ui.block.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
font-size: 1rem; font-size: 1rem;
} }
.ui.mini.block.header { .ui.mini.block.header {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.block.header { .ui.tiny.block.header {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.block.header { .ui.small.block.header {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.block.header { .ui.large.block.header {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.block.header { .ui.big.block.header {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.block.header { .ui.huge.block.header {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.block.header { .ui.massive.block.header {
font-size: 1.75rem; font-size: 1.71428571rem;
} }
/*------------------- /*-------------------
@ -730,7 +732,7 @@ a.ui.inverted.black.header.header.header:hover {
.ui.attached.header { .ui.attached.header {
background: #FFFFFF; background: #FFFFFF;
padding: 0.75rem 1rem; padding: 0.78571429rem 1rem;
margin: 0 -1px 0 -1px; margin: 0 -1px 0 -1px;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
@ -744,10 +746,10 @@ a.ui.inverted.black.header.header.header:hover {
border-top: none; border-top: none;
} }
.ui.top.attached.header { .ui.top.attached.header {
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui.bottom.attached.header { .ui.bottom.attached.header {
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
/* Attached Sizes */ /* Attached Sizes */
@ -755,25 +757,25 @@ a.ui.inverted.black.header.header.header:hover {
font-size: 1em; font-size: 1em;
} }
.ui.mini.attached.header { .ui.mini.attached.header {
font-size: 0.75em; font-size: 0.78571429em;
} }
.ui.tiny.attached.header { .ui.tiny.attached.header {
font-size: 0.83333333em; font-size: 0.85714286em;
} }
.ui.small.attached.header { .ui.small.attached.header {
font-size: 0.91666667em; font-size: 0.92857143em;
} }
.ui.large.attached.header { .ui.large.attached.header {
font-size: 1.16666667em; font-size: 1.14285714em;
} }
.ui.big.attached.header { .ui.big.attached.header {
font-size: 1.25em; font-size: 1.28571429em;
} }
.ui.huge.attached.header { .ui.huge.attached.header {
font-size: 1.41666667em; font-size: 1.42857143em;
} }
.ui.massive.attached.header { .ui.massive.attached.header {
font-size: 1.75em; font-size: 1.71428571em;
} }
/*------------------- /*-------------------

2
semantic/dist/components/header.min.css vendored
View file

File diff suppressed because one or more lines are too long

4049
semantic/dist/components/icon.css vendored
View file

File diff suppressed because it is too large Load diff

2
semantic/dist/components/icon.min.css vendored
View file

File diff suppressed because one or more lines are too long

14
semantic/dist/components/image.css vendored
View file

@ -259,7 +259,7 @@ img.ui.bordered.image {
.ui.mini.image { .ui.mini.image {
width: 35px; width: 35px;
height: auto; height: auto;
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.images .image, .ui.tiny.images .image,
.ui.tiny.images img, .ui.tiny.images img,
@ -267,7 +267,7 @@ img.ui.bordered.image {
.ui.tiny.image { .ui.tiny.image {
width: 80px; width: 80px;
height: auto; height: auto;
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.images .image, .ui.small.images .image,
.ui.small.images img, .ui.small.images img,
@ -275,7 +275,7 @@ img.ui.bordered.image {
.ui.small.image { .ui.small.image {
width: 150px; width: 150px;
height: auto; height: auto;
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.images .image, .ui.large.images .image,
.ui.large.images img, .ui.large.images img,
@ -283,7 +283,7 @@ img.ui.bordered.image {
.ui.large.image { .ui.large.image {
width: 450px; width: 450px;
height: auto; height: auto;
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.images .image, .ui.big.images .image,
.ui.big.images img, .ui.big.images img,
@ -291,7 +291,7 @@ img.ui.bordered.image {
.ui.big.image { .ui.big.image {
width: 600px; width: 600px;
height: auto; height: auto;
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.images .image, .ui.huge.images .image,
.ui.huge.images img, .ui.huge.images img,
@ -299,7 +299,7 @@ img.ui.bordered.image {
.ui.huge.image { .ui.huge.image {
width: 800px; width: 800px;
height: auto; height: auto;
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.images .image, .ui.massive.images .image,
.ui.massive.images img, .ui.massive.images img,
@ -307,7 +307,7 @@ img.ui.bordered.image {
.ui.massive.image { .ui.massive.image {
width: 960px; width: 960px;
height: auto; height: auto;
font-size: 1.75rem; font-size: 1.71428571rem;
} }

2
semantic/dist/components/image.min.css vendored
View file

@ -6,4 +6,4 @@
* Released under the MIT license * Released under the MIT license
* http://opensource.org/licenses/MIT * http://opensource.org/licenses/MIT
* *
*/.ui.image{position:relative;display:inline-block;vertical-align:middle;max-width:100%;background-color:transparent}img.ui.image{display:block}.ui.image img,.ui.image svg{display:block;max-width:100%;height:auto}.ui.hidden.images,.ui.ui.hidden.image{display:none}.ui.hidden.transition.image,.ui.hidden.transition.images{display:block;visibility:hidden}.ui.images>.hidden.transition{display:inline-block;visibility:hidden}.ui.disabled.image,.ui.disabled.images{cursor:default;opacity:.45}.ui.inline.image,.ui.inline.image img,.ui.inline.image svg{display:inline-block}.ui.top.aligned.image,.ui.top.aligned.image img,.ui.top.aligned.image svg{display:inline-block;vertical-align:top}.ui.middle.aligned.image,.ui.middle.aligned.image img,.ui.middle.aligned.image svg{display:inline-block;vertical-align:middle}.ui.bottom.aligned.image,.ui.bottom.aligned.image img,.ui.bottom.aligned.image svg{display:inline-block;vertical-align:bottom}.ui.images .ui.top.aligned.image,.ui.top.aligned.images .image{-ms-flex-item-align:start;align-self:flex-start}.ui.images .ui.middle.aligned.image,.ui.middle.aligned.images .image{-ms-flex-item-align:center;align-self:center}.ui.bottom.aligned.images .image,.ui.images .ui.bottom.aligned.image{-ms-flex-item-align:end;align-self:flex-end}.ui.rounded.image,.ui.rounded.image>*,.ui.rounded.images .image,.ui.rounded.images .image>*{border-radius:.3125em}.ui.bordered.image img,.ui.bordered.image svg,.ui.bordered.images .image,.ui.bordered.images img,.ui.bordered.images svg,img.ui.bordered.image{border:1px solid rgba(0,0,0,.1)}.ui.circular.image,.ui.circular.images{overflow:hidden}.ui.circular.image,.ui.circular.image>*,.ui.circular.images .image,.ui.circular.images .image>*{border-radius:500rem}.ui.fluid.image,.ui.fluid.image img,.ui.fluid.image svg,.ui.fluid.images,.ui.fluid.images img,.ui.fluid.images svg{display:block;width:100%;height:auto}.ui.avatar.image,.ui.avatar.image img,.ui.avatar.image svg,.ui.avatar.images .image,.ui.avatar.images img,.ui.avatar.images svg{margin-right:.25em;display:inline-block;width:2em;height:2em;border-radius:500rem}.ui.spaced.image{display:inline-block!important;margin-left:.5em;margin-right:.5em}.ui[class*="left spaced"].image{margin-left:.5em;margin-right:0}.ui[class*="right spaced"].image{margin-left:0;margin-right:.5em}.ui.floated.image,.ui.floated.images{float:left;margin-right:1em;margin-bottom:1em}.ui.right.floated.image,.ui.right.floated.images{float:right;margin-right:0;margin-bottom:1em;margin-left:1em}.ui.floated.image:last-child,.ui.floated.images:last-child{margin-bottom:0}.ui.centered.image{display:block;margin-left:auto;margin-right:auto}.ui.centered.images{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ui.medium.image,.ui.medium.images .image,.ui.medium.images img,.ui.medium.images svg{width:300px;height:auto;font-size:1rem}.ui.mini.image,.ui.mini.images .image,.ui.mini.images img,.ui.mini.images svg{width:35px;height:auto;font-size:.75rem}.ui.tiny.image,.ui.tiny.images .image,.ui.tiny.images img,.ui.tiny.images svg{width:80px;height:auto;font-size:.83333333rem}.ui.small.image,.ui.small.images .image,.ui.small.images img,.ui.small.images svg{width:150px;height:auto;font-size:.91666667rem}.ui.large.image,.ui.large.images .image,.ui.large.images img,.ui.large.images svg{width:450px;height:auto;font-size:1.16666667rem}.ui.big.image,.ui.big.images .image,.ui.big.images img,.ui.big.images svg{width:600px;height:auto;font-size:1.25rem}.ui.huge.image,.ui.huge.images .image,.ui.huge.images img,.ui.huge.images svg{width:800px;height:auto;font-size:1.41666667rem}.ui.massive.image,.ui.massive.images .image,.ui.massive.images img,.ui.massive.images svg{width:960px;height:auto;font-size:1.75rem}.ui.images{font-size:0;margin:0 -.25rem 0}.ui.images .image,.ui.images>img,.ui.images>svg{display:inline-block;margin:0 .25rem .5rem} */.ui.image{position:relative;display:inline-block;vertical-align:middle;max-width:100%;background-color:transparent}img.ui.image{display:block}.ui.image img,.ui.image svg{display:block;max-width:100%;height:auto}.ui.hidden.images,.ui.ui.hidden.image{display:none}.ui.hidden.transition.image,.ui.hidden.transition.images{display:block;visibility:hidden}.ui.images>.hidden.transition{display:inline-block;visibility:hidden}.ui.disabled.image,.ui.disabled.images{cursor:default;opacity:.45}.ui.inline.image,.ui.inline.image img,.ui.inline.image svg{display:inline-block}.ui.top.aligned.image,.ui.top.aligned.image img,.ui.top.aligned.image svg{display:inline-block;vertical-align:top}.ui.middle.aligned.image,.ui.middle.aligned.image img,.ui.middle.aligned.image svg{display:inline-block;vertical-align:middle}.ui.bottom.aligned.image,.ui.bottom.aligned.image img,.ui.bottom.aligned.image svg{display:inline-block;vertical-align:bottom}.ui.images .ui.top.aligned.image,.ui.top.aligned.images .image{-ms-flex-item-align:start;align-self:flex-start}.ui.images .ui.middle.aligned.image,.ui.middle.aligned.images .image{-ms-flex-item-align:center;align-self:center}.ui.bottom.aligned.images .image,.ui.images .ui.bottom.aligned.image{-ms-flex-item-align:end;align-self:flex-end}.ui.rounded.image,.ui.rounded.image>*,.ui.rounded.images .image,.ui.rounded.images .image>*{border-radius:.3125em}.ui.bordered.image img,.ui.bordered.image svg,.ui.bordered.images .image,.ui.bordered.images img,.ui.bordered.images svg,img.ui.bordered.image{border:1px solid rgba(0,0,0,.1)}.ui.circular.image,.ui.circular.images{overflow:hidden}.ui.circular.image,.ui.circular.image>*,.ui.circular.images .image,.ui.circular.images .image>*{border-radius:500rem}.ui.fluid.image,.ui.fluid.image img,.ui.fluid.image svg,.ui.fluid.images,.ui.fluid.images img,.ui.fluid.images svg{display:block;width:100%;height:auto}.ui.avatar.image,.ui.avatar.image img,.ui.avatar.image svg,.ui.avatar.images .image,.ui.avatar.images img,.ui.avatar.images svg{margin-right:.25em;display:inline-block;width:2em;height:2em;border-radius:500rem}.ui.spaced.image{display:inline-block!important;margin-left:.5em;margin-right:.5em}.ui[class*="left spaced"].image{margin-left:.5em;margin-right:0}.ui[class*="right spaced"].image{margin-left:0;margin-right:.5em}.ui.floated.image,.ui.floated.images{float:left;margin-right:1em;margin-bottom:1em}.ui.right.floated.image,.ui.right.floated.images{float:right;margin-right:0;margin-bottom:1em;margin-left:1em}.ui.floated.image:last-child,.ui.floated.images:last-child{margin-bottom:0}.ui.centered.image{display:block;margin-left:auto;margin-right:auto}.ui.centered.images{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ui.medium.image,.ui.medium.images .image,.ui.medium.images img,.ui.medium.images svg{width:300px;height:auto;font-size:1rem}.ui.mini.image,.ui.mini.images .image,.ui.mini.images img,.ui.mini.images svg{width:35px;height:auto;font-size:.78571429rem}.ui.tiny.image,.ui.tiny.images .image,.ui.tiny.images img,.ui.tiny.images svg{width:80px;height:auto;font-size:.85714286rem}.ui.small.image,.ui.small.images .image,.ui.small.images img,.ui.small.images svg{width:150px;height:auto;font-size:.92857143rem}.ui.large.image,.ui.large.images .image,.ui.large.images img,.ui.large.images svg{width:450px;height:auto;font-size:1.14285714rem}.ui.big.image,.ui.big.images .image,.ui.big.images img,.ui.big.images svg{width:600px;height:auto;font-size:1.28571429rem}.ui.huge.image,.ui.huge.images .image,.ui.huge.images img,.ui.huge.images svg{width:800px;height:auto;font-size:1.42857143rem}.ui.massive.image,.ui.massive.images .image,.ui.massive.images img,.ui.massive.images svg{width:960px;height:auto;font-size:1.71428571rem}.ui.images{font-size:0;margin:0 -.25rem 0}.ui.images .image,.ui.images>img,.ui.images>svg{display:inline-block;margin:0 .25rem .5rem}

843
semantic/dist/components/input.css vendored
View file

File diff suppressed because it is too large Load diff

2
semantic/dist/components/input.min.css vendored
View file

File diff suppressed because one or more lines are too long

218
semantic/dist/components/label.css vendored
View file

@ -17,7 +17,7 @@
display: inline-block; display: inline-block;
line-height: 1; line-height: 1;
vertical-align: baseline; vertical-align: baseline;
margin: 0 0.16666667em; margin: 0 0.14285714em;
background-color: #E8E8E8; background-color: #E8E8E8;
background-image: none; background-image: none;
padding: 0.5833em 0.833em; padding: 0.5833em 0.833em;
@ -25,7 +25,7 @@
text-transform: none; text-transform: none;
font-weight: bold; font-weight: bold;
border: 0 solid transparent; border: 0 solid transparent;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-transition: background 0.1s ease; -webkit-transition: background 0.1s ease;
transition: background 0.1s ease; transition: background 0.1s ease;
} }
@ -61,7 +61,7 @@ a.ui.label {
} }
/* Icon */ /* Icon */
.ui.left.icon.label > .icon, .ui.ui[class*="left icon"].label > .icon,
.ui.label > .icon { .ui.label > .icon {
width: auto; width: auto;
margin: 0 0.75em 0 0; margin: 0 0.75em 0 0;
@ -83,7 +83,7 @@ a.ui.label {
.ui.label > .close.icon, .ui.label > .close.icon,
.ui.label > .delete.icon { .ui.label > .delete.icon {
cursor: pointer; cursor: pointer;
font-size: 0.91666667em; font-size: 0.92857143em;
opacity: 0.5; opacity: 0.5;
-webkit-transition: background 0.1s ease; -webkit-transition: background 0.1s ease;
transition: background 0.1s ease; transition: background 0.1s ease;
@ -94,10 +94,14 @@ a.ui.label {
} }
/* Backward compatible positioning */ /* Backward compatible positioning */
.ui.label.left.icon > .close.icon, .ui.label[class*="left icon"] > .close.icon,
.ui.label.left.icon > .delete.icon { .ui.label[class*="left icon"] > .delete.icon {
margin: 0 0.5em 0 0; margin: 0 0.5em 0 0;
} }
.ui.label[class*="left icon"] > .close.icon.right,
.ui.label[class*="left icon"] > .delete.icon.right {
margin: 0 0 0 0.5em;
}
.ui.label:not(.icon) > .close.icon, .ui.label:not(.icon) > .close.icon,
.ui.label:not(.icon) > .delete.icon { .ui.label:not(.icon) > .delete.icon {
margin: 0 0 0 0.5em; margin: 0 0 0 0.5em;
@ -109,7 +113,7 @@ a.ui.label {
} }
/* Right Side Icon */ /* Right Side Icon */
.ui.right.icon.label > .icon { .ui[class*="right icon"].label > .icon {
margin: 0 0 0 0.75em; margin: 0 0 0 0.75em;
} }
@ -184,7 +188,7 @@ a.ui.label {
text-transform: none; text-transform: none;
background: #E8E8E8; background: #E8E8E8;
padding: 0.5833em 0.833em 0.5833em 0.5em; padding: 0.5833em 0.833em 0.5833em 0.5em;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -196,13 +200,13 @@ a.ui.label {
vertical-align: top; vertical-align: top;
height: 2.1666em; height: 2.1666em;
margin: -0.5833em 0.5em -0.5833em -0.5em; margin: -0.5833em 0.5em -0.5833em -0.5em;
border-radius: 0.33333333rem 0 0 0.33333333rem; border-radius: 0.28571429rem 0 0 0.28571429rem;
} }
.ui.image.label .detail { .ui.image.label .detail {
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
margin: -0.5833em -0.833em -0.5833em 0.5em; margin: -0.5833em -0.833em -0.5833em 0.5em;
padding: 0.5833em 0.833em; padding: 0.5833em 0.833em;
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
} }
.ui.bottom.attached.image.label:not(.right) > img, .ui.bottom.attached.image.label:not(.right) > img,
.ui.top.right.attached.image.label > img { .ui.top.right.attached.image.label > img {
@ -223,12 +227,12 @@ a.ui.label {
position: relative; position: relative;
padding-left: 1.5em; padding-left: 1.5em;
padding-right: 1.5em; padding-right: 1.5em;
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
-webkit-transition: none; -webkit-transition: none;
transition: none; transition: none;
} }
.ui.tag.labels .label:before, .ui.tag.labels .label::before,
.ui.tag.label:before { .ui.tag.label::before {
position: absolute; position: absolute;
-webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg); -webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg);
transform: translateY(-50%) translateX(50%) rotate(-45deg); transform: translateY(-50%) translateX(50%) rotate(-45deg);
@ -242,8 +246,8 @@ a.ui.label {
-webkit-transition: none; -webkit-transition: none;
transition: none; transition: none;
} }
.ui.tag.labels .label:after, .ui.tag.labels .label::after,
.ui.tag.label:after { .ui.tag.label::after {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
@ -256,15 +260,15 @@ a.ui.label {
box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3);
border-radius: 500rem; border-radius: 500rem;
} }
.ui.basic.tag.labels .label:before, .ui.basic.tag.labels .label::before,
.ui.basic.tag.label:before { .ui.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
right: calc(100% + 1px); right: calc(100% + 1px);
} }
.ui.basic.tag.labels .label:after, .ui.basic.tag.labels .label::after,
.ui.basic.tag.label:after { .ui.basic.tag.label::after {
-webkit-box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.8);
box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.8); box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.8);
} }
@ -292,7 +296,7 @@ a.ui.label {
.ui.corner.label { .ui.corner.label {
background-color: transparent !important; background-color: transparent !important;
} }
.ui.corner.label:after { .ui.corner.label::after {
position: absolute; position: absolute;
content: ""; content: "";
right: 0; right: 0;
@ -312,20 +316,20 @@ a.ui.label {
.ui.corner.label .icon { .ui.corner.label .icon {
cursor: inherit; cursor: inherit;
position: absolute; position: absolute;
top: 0.75em; top: 0.64285714em;
left: auto; left: auto;
right: 0.66666667em; right: 0.57142857em;
font-size: 1.16666667em; font-size: 1.14285714em;
margin: 0; margin: 0;
} }
/* Left Corner */ /* Left Corner */
.ui.left.corner.label, .ui.left.corner.label,
.ui.left.corner.label:after { .ui.left.corner.label::after {
right: auto; right: auto;
left: 0; left: 0;
} }
.ui.left.corner.label:after { .ui.left.corner.label::after {
border-top: 4em solid transparent; border-top: 4em solid transparent;
border-right: 4em solid transparent; border-right: 4em solid transparent;
border-bottom: 0 solid transparent; border-bottom: 0 solid transparent;
@ -333,7 +337,7 @@ a.ui.label {
border-top-color: inherit; border-top-color: inherit;
} }
.ui.left.corner.label .icon { .ui.left.corner.label .icon {
left: 0.66666667em; left: 0.57142857em;
right: auto; right: auto;
} }
@ -357,10 +361,10 @@ a.ui.label {
min-width: -webkit-max-content; min-width: -webkit-max-content;
min-width: -moz-max-content; min-width: -moz-max-content;
min-width: max-content; min-width: max-content;
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
border-color: rgba(0, 0, 0, 0.15); border-color: rgba(0, 0, 0, 0.15);
} }
.ui.ribbon.label:after { .ui.ribbon.label::after {
position: absolute; position: absolute;
content: ''; content: '';
top: 100%; top: 100%;
@ -413,11 +417,11 @@ a.ui.label {
text-align: left; text-align: left;
-webkit-transform: translateX(-100%); -webkit-transform: translateX(-100%);
transform: translateX(-100%); transform: translateX(-100%);
border-radius: 0.33333333rem 0 0 0.33333333rem; border-radius: 0.28571429rem 0 0 0.28571429rem;
} }
.ui[class*="right ribbon"].label:after { .ui[class*="right ribbon"].label::after {
left: auto; left: auto;
right: -1px; right: 0;
border-style: solid; border-style: solid;
border-width: 1.2em 1.2em 0 0; border-width: 1.2em 1.2em 0 0;
border-color: transparent; border-color: transparent;
@ -429,10 +433,6 @@ a.ui.label {
.ui.card .image > .ribbon.label { .ui.card .image > .ribbon.label {
position: absolute; position: absolute;
top: 1rem; top: 1rem;
z-index: 1;
}
.ui.card.loading .image > .ribbon.label {
z-index: 100;
} }
.ui.card .image > .ui.ribbon.label, .ui.card .image > .ui.ribbon.label,
.ui.image > .ui.ribbon.label { .ui.image > .ui.ribbon.label {
@ -465,29 +465,29 @@ a.ui.label {
top: 0; top: 0;
left: 0; left: 0;
padding: 0.75em 1em; padding: 0.75em 1em;
border-radius: 0.25rem 0.25rem 0 0; border-radius: 0.21428571rem 0.21428571rem 0 0;
} }
.ui[class*="bottom attached"].label { .ui[class*="bottom attached"].label {
top: auto; top: auto;
bottom: 0; bottom: 0;
border-radius: 0 0 0.25rem 0.25rem; border-radius: 0 0 0.21428571rem 0.21428571rem;
} }
.ui[class*="top left attached"].label { .ui[class*="top left attached"].label {
width: auto; width: auto;
margin-top: 0; margin-top: 0;
border-radius: 0.25rem 0 0.33333333rem 0; border-radius: 0.21428571rem 0 0.28571429rem 0;
} }
.ui[class*="top right attached"].label { .ui[class*="top right attached"].label {
width: auto; width: auto;
left: auto; left: auto;
right: 0; right: 0;
border-radius: 0 0.25rem 0 0.33333333rem; border-radius: 0 0.21428571rem 0 0.28571429rem;
} }
.ui[class*="bottom left attached"].label { .ui[class*="bottom left attached"].label {
width: auto; width: auto;
top: auto; top: auto;
bottom: 0; bottom: 0;
border-radius: 0 0.33333333rem 0 0.25rem; border-radius: 0 0.28571429rem 0 0.21428571rem;
} }
.ui[class*="bottom right attached"].label { .ui[class*="bottom right attached"].label {
top: auto; top: auto;
@ -495,7 +495,7 @@ a.ui.label {
left: auto; left: auto;
right: 0; right: 0;
width: auto; width: auto;
border-radius: 0.33333333rem 0 0.25rem 0; border-radius: 0.28571429rem 0 0.21428571rem 0;
} }
@ -523,8 +523,8 @@ a.ui.label:hover {
background-image: none; background-image: none;
color: rgba(0, 0, 0, 0.8); color: rgba(0, 0, 0, 0.8);
} }
.ui.labels a.label:hover:before, .ui.labels a.label:hover::before,
a.ui.label:hover:before { a.ui.label:hover::before {
color: rgba(0, 0, 0, 0.8); color: rgba(0, 0, 0, 0.8);
} }
@ -538,7 +538,7 @@ a.ui.label:hover:before {
background-image: none; background-image: none;
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
} }
.ui.active.label:before { .ui.active.label::before {
background-color: #D0D0D0; background-color: #D0D0D0;
background-image: none; background-image: none;
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
@ -555,8 +555,8 @@ a.ui.active.label:hover {
background-image: none; background-image: none;
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
} }
.ui.labels a.active.label:hover:before, .ui.labels a.active.label:hover::before,
a.ui.active.label:hover:before { a.ui.active.label:hover::before {
background-color: #C8C8C8; background-color: #C8C8C8;
background-image: none; background-image: none;
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
@ -614,13 +614,13 @@ a.ui.active.label:hover:before {
a.ui.basic.label:hover { a.ui.basic.label:hover {
text-decoration: none; text-decoration: none;
background: none #FFFFFF; background: none #FFFFFF;
color: #4d17c0; color: #1e70bf;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
/* Pointing */ /* Pointing */
.ui.basic.pointing.label:before { .ui.basic.pointing.label::before {
border-color: inherit; border-color: inherit;
} }
@ -659,7 +659,7 @@ a.ui.basic.label:hover {
background: #1B1C1D; background: #1B1C1D;
} }
.ui.inverted.basic.label:hover { .ui.inverted.basic.label:hover {
color: #6435C9; color: #4183C4;
} }
/*------------------- /*-------------------
@ -668,36 +668,36 @@ a.ui.basic.label:hover {
.ui.primary.labels .label, .ui.primary.labels .label,
.ui.ui.ui.primary.label { .ui.ui.ui.primary.label {
background-color: #6435C9; background-color: #2185D0;
border-color: #6435C9; border-color: #2185D0;
color: rgba(255, 255, 255, 0.9); color: rgba(255, 255, 255, 0.9);
} }
/* Link */ /* Link */
.ui.primary.labels a.label:hover, .ui.primary.labels a.label:hover,
a.ui.ui.ui.primary.label:hover { a.ui.ui.ui.primary.label:hover {
background-color: #5829bb; background-color: #1678c2;
border-color: #5829bb; border-color: #1678c2;
color: #FFFFFF; color: #FFFFFF;
} }
/* Ribbon */ /* Ribbon */
.ui.ui.ui.primary.ribbon.label { .ui.ui.ui.primary.ribbon.label {
border-color: #502aa1; border-color: #1a69a4;
} }
/* Basic */ /* Basic */
.ui.basic.labels .primary.label, .ui.basic.labels .primary.label,
.ui.ui.ui.basic.primary.label { .ui.ui.ui.basic.primary.label {
background: none #FFFFFF; background: none #FFFFFF;
border-color: #6435C9; border-color: #2185D0;
color: #6435C9; color: #2185D0;
} }
.ui.basic.labels a.primary.label:hover, .ui.basic.labels a.primary.label:hover,
a.ui.ui.ui.basic.primary.label:hover { a.ui.ui.ui.basic.primary.label:hover {
background: none #FFFFFF; background: none #FFFFFF;
border-color: #5829bb; border-color: #1678c2;
color: #5829bb; color: #1678c2;
} }
/* Inverted */ /* Inverted */
@ -740,8 +740,8 @@ a.ui.ui.ui.inverted.basic.primary.label:hover {
.ui.ui.ui.inverted.primary.basic.tag.label { .ui.ui.ui.inverted.primary.basic.tag.label {
border: 1px solid #54C8FF; border: 1px solid #54C8FF;
} }
.ui.inverted.basic.tag.labels .primary.label:before, .ui.inverted.basic.tag.labels .primary.label::before,
.ui.ui.ui.inverted.primary.basic.tag.label:before { .ui.ui.ui.inverted.primary.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -822,8 +822,8 @@ a.ui.ui.ui.inverted.basic.secondary.label:hover {
.ui.ui.ui.inverted.secondary.basic.tag.label { .ui.ui.ui.inverted.secondary.basic.tag.label {
border: 1px solid #545454; border: 1px solid #545454;
} }
.ui.inverted.basic.tag.labels .secondary.label:before, .ui.inverted.basic.tag.labels .secondary.label::before,
.ui.ui.ui.inverted.secondary.basic.tag.label:before { .ui.ui.ui.inverted.secondary.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -904,8 +904,8 @@ a.ui.ui.ui.inverted.basic.red.label:hover {
.ui.ui.ui.inverted.red.basic.tag.label { .ui.ui.ui.inverted.red.basic.tag.label {
border: 1px solid #FF695E; border: 1px solid #FF695E;
} }
.ui.inverted.basic.tag.labels .red.label:before, .ui.inverted.basic.tag.labels .red.label::before,
.ui.ui.ui.inverted.red.basic.tag.label:before { .ui.ui.ui.inverted.red.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -986,8 +986,8 @@ a.ui.ui.ui.inverted.basic.orange.label:hover {
.ui.ui.ui.inverted.orange.basic.tag.label { .ui.ui.ui.inverted.orange.basic.tag.label {
border: 1px solid #FF851B; border: 1px solid #FF851B;
} }
.ui.inverted.basic.tag.labels .orange.label:before, .ui.inverted.basic.tag.labels .orange.label::before,
.ui.ui.ui.inverted.orange.basic.tag.label:before { .ui.ui.ui.inverted.orange.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1068,8 +1068,8 @@ a.ui.ui.ui.inverted.basic.yellow.label:hover {
.ui.ui.ui.inverted.yellow.basic.tag.label { .ui.ui.ui.inverted.yellow.basic.tag.label {
border: 1px solid #FFE21F; border: 1px solid #FFE21F;
} }
.ui.inverted.basic.tag.labels .yellow.label:before, .ui.inverted.basic.tag.labels .yellow.label::before,
.ui.ui.ui.inverted.yellow.basic.tag.label:before { .ui.ui.ui.inverted.yellow.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1150,8 +1150,8 @@ a.ui.ui.ui.inverted.basic.olive.label:hover {
.ui.ui.ui.inverted.olive.basic.tag.label { .ui.ui.ui.inverted.olive.basic.tag.label {
border: 1px solid #D9E778; border: 1px solid #D9E778;
} }
.ui.inverted.basic.tag.labels .olive.label:before, .ui.inverted.basic.tag.labels .olive.label::before,
.ui.ui.ui.inverted.olive.basic.tag.label:before { .ui.ui.ui.inverted.olive.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1232,8 +1232,8 @@ a.ui.ui.ui.inverted.basic.green.label:hover {
.ui.ui.ui.inverted.green.basic.tag.label { .ui.ui.ui.inverted.green.basic.tag.label {
border: 1px solid #2ECC40; border: 1px solid #2ECC40;
} }
.ui.inverted.basic.tag.labels .green.label:before, .ui.inverted.basic.tag.labels .green.label::before,
.ui.ui.ui.inverted.green.basic.tag.label:before { .ui.ui.ui.inverted.green.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1314,8 +1314,8 @@ a.ui.ui.ui.inverted.basic.teal.label:hover {
.ui.ui.ui.inverted.teal.basic.tag.label { .ui.ui.ui.inverted.teal.basic.tag.label {
border: 1px solid #6DFFFF; border: 1px solid #6DFFFF;
} }
.ui.inverted.basic.tag.labels .teal.label:before, .ui.inverted.basic.tag.labels .teal.label::before,
.ui.ui.ui.inverted.teal.basic.tag.label:before { .ui.ui.ui.inverted.teal.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1396,8 +1396,8 @@ a.ui.ui.ui.inverted.basic.blue.label:hover {
.ui.ui.ui.inverted.blue.basic.tag.label { .ui.ui.ui.inverted.blue.basic.tag.label {
border: 1px solid #54C8FF; border: 1px solid #54C8FF;
} }
.ui.inverted.basic.tag.labels .blue.label:before, .ui.inverted.basic.tag.labels .blue.label::before,
.ui.ui.ui.inverted.blue.basic.tag.label:before { .ui.ui.ui.inverted.blue.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1478,8 +1478,8 @@ a.ui.ui.ui.inverted.basic.violet.label:hover {
.ui.ui.ui.inverted.violet.basic.tag.label { .ui.ui.ui.inverted.violet.basic.tag.label {
border: 1px solid #A291FB; border: 1px solid #A291FB;
} }
.ui.inverted.basic.tag.labels .violet.label:before, .ui.inverted.basic.tag.labels .violet.label::before,
.ui.ui.ui.inverted.violet.basic.tag.label:before { .ui.ui.ui.inverted.violet.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1560,8 +1560,8 @@ a.ui.ui.ui.inverted.basic.purple.label:hover {
.ui.ui.ui.inverted.purple.basic.tag.label { .ui.ui.ui.inverted.purple.basic.tag.label {
border: 1px solid #DC73FF; border: 1px solid #DC73FF;
} }
.ui.inverted.basic.tag.labels .purple.label:before, .ui.inverted.basic.tag.labels .purple.label::before,
.ui.ui.ui.inverted.purple.basic.tag.label:before { .ui.ui.ui.inverted.purple.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1642,8 +1642,8 @@ a.ui.ui.ui.inverted.basic.pink.label:hover {
.ui.ui.ui.inverted.pink.basic.tag.label { .ui.ui.ui.inverted.pink.basic.tag.label {
border: 1px solid #FF8EDF; border: 1px solid #FF8EDF;
} }
.ui.inverted.basic.tag.labels .pink.label:before, .ui.inverted.basic.tag.labels .pink.label::before,
.ui.ui.ui.inverted.pink.basic.tag.label:before { .ui.ui.ui.inverted.pink.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1724,8 +1724,8 @@ a.ui.ui.ui.inverted.basic.brown.label:hover {
.ui.ui.ui.inverted.brown.basic.tag.label { .ui.ui.ui.inverted.brown.basic.tag.label {
border: 1px solid #D67C1C; border: 1px solid #D67C1C;
} }
.ui.inverted.basic.tag.labels .brown.label:before, .ui.inverted.basic.tag.labels .brown.label::before,
.ui.ui.ui.inverted.brown.basic.tag.label:before { .ui.ui.ui.inverted.brown.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1805,8 +1805,8 @@ a.ui.ui.ui.inverted.basic.grey.label:hover {
.ui.ui.ui.inverted.grey.basic.tag.label { .ui.ui.ui.inverted.grey.basic.tag.label {
border: 1px solid #DCDDDE; border: 1px solid #DCDDDE;
} }
.ui.inverted.basic.tag.labels .grey.label:before, .ui.inverted.basic.tag.labels .grey.label::before,
.ui.ui.ui.inverted.grey.basic.tag.label:before { .ui.ui.ui.inverted.grey.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1886,8 +1886,8 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
.ui.ui.ui.inverted.black.basic.tag.label { .ui.ui.ui.inverted.black.basic.tag.label {
border: 1px solid #545454; border: 1px solid #545454;
} }
.ui.inverted.basic.tag.labels .black.label:before, .ui.inverted.basic.tag.labels .black.label::before,
.ui.ui.ui.inverted.black.basic.tag.label:before { .ui.ui.ui.inverted.black.basic.tag.label::before {
border-color: inherit; border-color: inherit;
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
border-style: inherit; border-style: inherit;
@ -1940,7 +1940,7 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
.ui.attached.pointing.label { .ui.attached.pointing.label {
position: absolute; position: absolute;
} }
.ui.pointing.label:before { .ui.pointing.label::before {
background-color: inherit; background-color: inherit;
background-image: inherit; background-image: inherit;
border-width: 0; border-width: 0;
@ -1949,7 +1949,7 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
} }
/* Arrow */ /* Arrow */
.ui.pointing.label:before { .ui.pointing.label::before {
position: absolute; position: absolute;
content: ''; content: '';
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
@ -1968,8 +1968,8 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
.ui[class*="pointing above"].label { .ui[class*="pointing above"].label {
margin-top: 1em; margin-top: 1em;
} }
.ui.pointing.label:before, .ui.pointing.label::before,
.ui[class*="pointing above"].label:before { .ui[class*="pointing above"].label::before {
border-width: 1px 0 0 1px; border-width: 1px 0 0 1px;
-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg);
@ -1984,8 +1984,8 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
margin-top: 0; margin-top: 0;
margin-bottom: 1em; margin-bottom: 1em;
} }
.ui[class*="bottom pointing"].label:before, .ui[class*="bottom pointing"].label::before,
.ui[class*="pointing below"].label:before { .ui[class*="pointing below"].label::before {
border-width: 0 1px 1px 0; border-width: 0 1px 1px 0;
top: auto; top: auto;
right: auto; right: auto;
@ -2001,7 +2001,7 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
margin-top: 0; margin-top: 0;
margin-left: 0.6666em; margin-left: 0.6666em;
} }
.ui[class*="left pointing"].label:before { .ui[class*="left pointing"].label::before {
border-width: 0 0 1px 1px; border-width: 0 0 1px 1px;
-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg);
@ -2017,7 +2017,7 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
margin-top: 0; margin-top: 0;
margin-right: 0.6666em; margin-right: 0.6666em;
} }
.ui[class*="right pointing"].label:before { .ui[class*="right pointing"].label::before {
border-width: 1px 1px 0 0; border-width: 1px 1px 0 0;
-webkit-transform: translateX(50%) translateY(-50%) rotate(45deg); -webkit-transform: translateX(50%) translateY(-50%) rotate(45deg);
transform: translateX(50%) translateY(-50%) rotate(45deg); transform: translateX(50%) translateY(-50%) rotate(45deg);
@ -2031,15 +2031,15 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
/*--- Above ---*/ /*--- Above ---*/
.ui.basic.pointing.label:before, .ui.basic.pointing.label::before,
.ui.basic[class*="pointing above"].label:before { .ui.basic[class*="pointing above"].label::before {
margin-top: -1px; margin-top: -1px;
} }
/*--- Below ---*/ /*--- Below ---*/
.ui.basic[class*="bottom pointing"].label:before, .ui.basic[class*="bottom pointing"].label::before,
.ui.basic[class*="pointing below"].label:before { .ui.basic[class*="pointing below"].label::before {
bottom: auto; bottom: auto;
top: 100%; top: 100%;
margin-top: 1px; margin-top: 1px;
@ -2047,14 +2047,14 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
/*--- Left ---*/ /*--- Left ---*/
.ui.basic[class*="left pointing"].label:before { .ui.basic[class*="left pointing"].label::before {
top: 50%; top: 50%;
left: -1px; left: -1px;
} }
/*--- Right ---*/ /*--- Right ---*/
.ui.basic[class*="right pointing"].label:before { .ui.basic[class*="right pointing"].label::before {
top: 50%; top: 50%;
right: -1px; right: -1px;
} }
@ -2097,19 +2097,19 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
.ui.labels .label, .ui.labels .label,
.ui.label { .ui.label {
font-size: 1rem; font-size: 0.85714286rem;
} }
.ui.mini.labels .label, .ui.mini.labels .label,
.ui.mini.label { .ui.mini.label {
font-size: 0.75rem; font-size: 0.64285714rem;
} }
.ui.tiny.labels .label, .ui.tiny.labels .label,
.ui.tiny.label { .ui.tiny.label {
font-size: 0.83333333rem; font-size: 0.71428571rem;
} }
.ui.small.labels .label, .ui.small.labels .label,
.ui.small.label { .ui.small.label {
font-size: 0.91666667rem; font-size: 0.78571429rem;
} }
.ui.large.labels .label, .ui.large.labels .label,
.ui.large.label { .ui.large.label {
@ -2117,15 +2117,15 @@ a.ui.ui.ui.inverted.basic.black.label:hover {
} }
.ui.big.labels .label, .ui.big.labels .label,
.ui.big.label { .ui.big.label {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.labels .label, .ui.huge.labels .label,
.ui.huge.label { .ui.huge.label {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.labels .label, .ui.massive.labels .label,
.ui.massive.label { .ui.massive.label {
font-size: 1.75rem; font-size: 1.71428571rem;
} }

2
semantic/dist/components/label.min.css vendored
View file

File diff suppressed because one or more lines are too long

136
semantic/dist/components/list.css vendored
View file

@ -48,13 +48,13 @@ ol.ui.list li,
table-layout: fixed; table-layout: fixed;
list-style-type: none; list-style-type: none;
list-style-position: outside; list-style-position: outside;
padding: 0.25em 0; padding: 0.21428571em 0;
line-height: 1.16666667em; line-height: 1.14285714em;
} }
ul.ui.list > li:first-child:after, ul.ui.list > li:first-child::after,
ol.ui.list > li:first-child:after, ol.ui.list > li:first-child::after,
.ui.list > .list > .item:after, .ui.list > .list > .item::after,
.ui.list > .item:after { .ui.list > .item::after {
content: ''; content: '';
display: block; display: block;
height: 0; height: 0;
@ -87,7 +87,7 @@ ol.ui.list ol,
ul.ui.list ul li, ul.ui.list ul li,
ol.ui.list ol li, ol.ui.list ol li,
.ui.list .list > .item { .ui.list .list > .item {
padding: 0.16666667em 0; padding: 0.14285714em 0;
line-height: inherit; line-height: inherit;
} }
@ -103,7 +103,7 @@ ol.ui.list ol li,
} }
.ui.list .list > .item > i.icon:not(.loading), .ui.list .list > .item > i.icon:not(.loading),
.ui.list > .item > i.icon:not(.loading) { .ui.list > .item > i.icon:not(.loading) {
padding-right: 0.33333333em; padding-right: 0.28571429em;
vertical-align: top; vertical-align: top;
} }
.ui.list .list > .item > i.icon:only-child, .ui.list .list > .item > i.icon:only-child,
@ -139,7 +139,7 @@ ol.ui.list ol li,
/* Content */ /* Content */
.ui.list .list > .item > .content, .ui.list .list > .item > .content,
.ui.list > .item > .content { .ui.list > .item > .content {
line-height: 1.16666667em; line-height: 1.14285714em;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
} }
.ui.list .list > .item > .image + .content, .ui.list .list > .item > .image + .content,
@ -153,7 +153,7 @@ ol.ui.list ol li,
} }
.ui.list .list > .item > i.loading.icon + .content, .ui.list .list > .item > i.loading.icon + .content,
.ui.list > .item > i.loading.icon + .content { .ui.list > .item > i.loading.icon + .content {
padding-left: calc(0.3333333333333333em + 0.5em); padding-left: calc(0.2857142857142857em + 0.5em);
} }
.ui.list .list > .item > img.image + .content, .ui.list .list > .item > img.image + .content,
.ui.list > .item > img.image + .content { .ui.list > .item > img.image + .content {
@ -193,11 +193,11 @@ ol.ui.list ol li,
.ui.list .list > a.item, .ui.list .list > a.item,
.ui.list > a.item { .ui.list > a.item {
cursor: pointer; cursor: pointer;
color: #6435C9; color: #4183C4;
} }
.ui.list .list > a.item:hover, .ui.list .list > a.item:hover,
.ui.list > a.item:hover { .ui.list > a.item:hover {
color: #4d17c0; color: #1e70bf;
} }
/* Linked Item Icons */ /* Linked Item Icons */
@ -212,11 +212,11 @@ ol.ui.list ol li,
.ui.list .list > .item a.header, .ui.list .list > .item a.header,
.ui.list > .item a.header { .ui.list > .item a.header {
cursor: pointer; cursor: pointer;
color: #6435C9 !important; color: #4183C4 !important;
} }
.ui.list .list > .item > a.header:hover, .ui.list .list > .item > a.header:hover,
.ui.list > .item > a.header:hover { .ui.list > .item > a.header:hover {
color: #4d17c0 !important; color: #1e70bf !important;
} }
/* Floated Content */ /* Floated Content */
@ -249,11 +249,11 @@ ol.ui.list ol li,
background-color: transparent; background-color: transparent;
list-style-type: none; list-style-type: none;
list-style-position: outside; list-style-position: outside;
padding: 0.25em 0; padding: 0.21428571em 0;
line-height: 1.16666667em; line-height: 1.14285714em;
} }
.ui.menu .ui.list .list > .item:before, .ui.menu .ui.list .list > .item::before,
.ui.menu .ui.list > .item:before { .ui.menu .ui.list > .item::before {
border: none; border: none;
background: none; background: none;
} }
@ -305,8 +305,8 @@ ol.ui.list ol li,
/* Padding on all elements */ /* Padding on all elements */
.ui.horizontal.list > .item:first-child, .ui.horizontal.list > .item:first-child,
.ui.horizontal.list > .item:last-child { .ui.horizontal.list > .item:last-child {
padding-top: 0.25em; padding-top: 0.21428571em;
padding-bottom: 0.25em; padding-bottom: 0.21428571em;
} }
/* Horizontal List */ /* Horizontal List */
@ -392,7 +392,7 @@ ol.ui.list ol li,
} }
.ui.inverted.list .list > a.item:hover, .ui.inverted.list .list > a.item:hover,
.ui.inverted.list > a.item:hover { .ui.inverted.list > a.item:hover {
color: #4d17c0; color: #1e70bf;
} }
/* Linking Content */ /* Linking Content */
@ -400,7 +400,7 @@ ol.ui.list ol li,
color: rgba(255, 255, 255, 0.9) !important; color: rgba(255, 255, 255, 0.9) !important;
} }
.ui.inverted.list .item a:not(.ui):hover { .ui.inverted.list .item a:not(.ui):hover {
color: #4d17c0 !important; color: #1e70bf !important;
} }
/*------------------- /*-------------------
@ -567,9 +567,9 @@ ul.ui.list li,
.ui.bulleted.list > .item { .ui.bulleted.list > .item {
position: relative; position: relative;
} }
ul.ui.list li:before, ul.ui.list li::before,
.ui.bulleted.list .list > .item:before, .ui.bulleted.list .list > .item::before,
.ui.bulleted.list > .item:before { .ui.bulleted.list > .item::before {
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
@ -585,9 +585,9 @@ ul.ui.list li:before,
color: inherit; color: inherit;
vertical-align: top; vertical-align: top;
} }
ul.ui.list li:before, ul.ui.list li::before,
.ui.bulleted.list .list > a.item:before, .ui.bulleted.list .list > a.item::before,
.ui.bulleted.list > a.item:before { .ui.bulleted.list > a.item::before {
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
} }
ul.ui.list ul, ul.ui.list ul,
@ -635,9 +635,9 @@ ol.ui.list li,
list-style-type: none; list-style-type: none;
position: relative; position: relative;
} }
ol.ui.list li:before, ol.ui.list li::before,
.ui.ordered.list .list > .item:before, .ui.ordered.list .list > .item::before,
.ui.ordered.list > .item:before { .ui.ordered.list > .item::before {
position: absolute; position: absolute;
top: auto; top: auto;
left: auto; left: auto;
@ -654,18 +654,18 @@ ol.ui.list li:before,
vertical-align: middle; vertical-align: middle;
opacity: 0.8; opacity: 0.8;
} }
ol.ui.inverted.list li:before, ol.ui.inverted.list li::before,
.ui.ordered.inverted.list .list > .item:before, .ui.ordered.inverted.list .list > .item::before,
.ui.ordered.inverted.list > .item:before { .ui.ordered.inverted.list > .item::before {
color: rgba(255, 255, 255, 0.7); color: rgba(255, 255, 255, 0.7);
} }
/* Value */ /* Value */
.ui.ordered.list .list > .item[data-value]:before, .ui.ordered.list .list > .item[data-value]::before,
.ui.ordered.list > .item[data-value]:before { .ui.ordered.list > .item[data-value]::before {
content: attr(data-value); content: attr(data-value);
} }
ol.ui.list li[value]:before { ol.ui.list li[value]::before {
content: attr(value); content: attr(value);
} }
@ -674,8 +674,8 @@ ol.ui.list ol,
.ui.ordered.list .list:not(.icon) { .ui.ordered.list .list:not(.icon) {
margin-left: 1em; margin-left: 1em;
} }
ol.ui.list ol li:before, ol.ui.list ol li::before,
.ui.ordered.list .list > .item:before { .ui.ordered.list .list > .item::before {
margin-left: -2em; margin-left: -2em;
} }
@ -684,17 +684,17 @@ ol.ui.horizontal.list,
.ui.ordered.horizontal.list { .ui.ordered.horizontal.list {
margin-left: 0; margin-left: 0;
} }
ol.ui.horizontal.list li:before, ol.ui.horizontal.list li::before,
.ui.ordered.horizontal.list .list > .item:before, .ui.ordered.horizontal.list .list > .item::before,
.ui.ordered.horizontal.list > .item:before { .ui.ordered.horizontal.list > .item::before {
position: static; position: static;
margin: 0 0.5em 0 0; margin: 0 0.5em 0 0;
} }
/* Suffixed Ordered */ /* Suffixed Ordered */
ol.ui.suffixed.list li:before, ol.ui.suffixed.list li::before,
.ui.suffixed.ordered.list .list > .item:before, .ui.suffixed.ordered.list .list > .item::before,
.ui.suffixed.ordered.list > .item:before { .ui.suffixed.ordered.list > .item::before {
content: counters(ordered, ".") "."; content: counters(ordered, ".") ".";
} }
@ -742,7 +742,7 @@ ol.ui.suffixed.list li:before,
.ui.divided.ordered.list .item .list:not(.icon) { .ui.divided.ordered.list .item .list:not(.icon) {
margin-left: 0; margin-left: 0;
margin-right: 0; margin-right: 0;
padding-bottom: 0.25em; padding-bottom: 0.21428571em;
} }
.ui.divided.ordered.list .item .list > .item { .ui.divided.ordered.list .item .list > .item {
padding-left: 1em; padding-left: 1em;
@ -799,8 +799,8 @@ ol.ui.suffixed.list li:before,
/* Padding on all elements */ /* Padding on all elements */
.ui.celled.list > .item:first-child, .ui.celled.list > .item:first-child,
.ui.celled.list > .item:last-child { .ui.celled.list > .item:last-child {
padding-top: 0.25em; padding-top: 0.21428571em;
padding-bottom: 0.25em; padding-bottom: 0.21428571em;
} }
/* Sub Menu */ /* Sub Menu */
@ -822,7 +822,7 @@ ol.ui.suffixed.list li:before,
.ui.celled.bulleted.list .item .list:not(.icon) { .ui.celled.bulleted.list .item .list:not(.icon) {
margin-left: -1.25rem; margin-left: -1.25rem;
margin-right: -1.25rem; margin-right: -1.25rem;
padding-bottom: 0.25em; padding-bottom: 0.21428571em;
} }
/* Celled Ordered */ /* Celled Ordered */
@ -836,7 +836,7 @@ ol.ui.suffixed.list li:before,
.ui.celled.ordered.list .item .list:not(.icon) { .ui.celled.ordered.list .item .list:not(.icon) {
margin-left: 0; margin-left: 0;
margin-right: 0; margin-right: 0;
padding-bottom: 0.25em; padding-bottom: 0.21428571em;
} }
.ui.celled.ordered.list .list > .item { .ui.celled.ordered.list .list > .item {
padding-left: 1em; padding-left: 1em;
@ -876,10 +876,10 @@ ol.ui.suffixed.list li:before,
--------------------*/ --------------------*/
.ui.relaxed.list:not(.horizontal) > .item:not(:first-child) { .ui.relaxed.list:not(.horizontal) > .item:not(:first-child) {
padding-top: 0.5em; padding-top: 0.42857143em;
} }
.ui.relaxed.list:not(.horizontal) > .item:not(:last-child) { .ui.relaxed.list:not(.horizontal) > .item:not(:last-child) {
padding-bottom: 0.5em; padding-bottom: 0.42857143em;
} }
.ui.horizontal.relaxed.list .list > .item:not(:first-child), .ui.horizontal.relaxed.list .list > .item:not(:first-child),
.ui.horizontal.relaxed.list > .item:not(:first-child) { .ui.horizontal.relaxed.list > .item:not(:first-child) {
@ -892,10 +892,10 @@ ol.ui.suffixed.list li:before,
/* Very Relaxed */ /* Very Relaxed */
.ui[class*="very relaxed"].list:not(.horizontal) > .item:not(:first-child) { .ui[class*="very relaxed"].list:not(.horizontal) > .item:not(:first-child) {
padding-top: 1em; padding-top: 0.85714286em;
} }
.ui[class*="very relaxed"].list:not(.horizontal) > .item:not(:last-child) { .ui[class*="very relaxed"].list:not(.horizontal) > .item:not(:last-child) {
padding-bottom: 1em; padding-bottom: 0.85714286em;
} }
.ui.horizontal[class*="very relaxed"].list .list > .item:not(:first-child), .ui.horizontal[class*="very relaxed"].list .list > .item:not(:first-child),
.ui.horizontal[class*="very relaxed"].list > .item:not(:first-child) { .ui.horizontal[class*="very relaxed"].list > .item:not(:first-child) {
@ -914,53 +914,53 @@ ol.ui.suffixed.list li:before,
font-size: 1em; font-size: 1em;
} }
.ui.mini.list { .ui.mini.list {
font-size: 0.75em; font-size: 0.78571429em;
} }
.ui.mini.horizontal.list .list > .item, .ui.mini.horizontal.list .list > .item,
.ui.mini.horizontal.list > .item { .ui.mini.horizontal.list > .item {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.list { .ui.tiny.list {
font-size: 0.83333333em; font-size: 0.85714286em;
} }
.ui.tiny.horizontal.list .list > .item, .ui.tiny.horizontal.list .list > .item,
.ui.tiny.horizontal.list > .item { .ui.tiny.horizontal.list > .item {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.list { .ui.small.list {
font-size: 0.91666667em; font-size: 0.92857143em;
} }
.ui.small.horizontal.list .list > .item, .ui.small.horizontal.list .list > .item,
.ui.small.horizontal.list > .item { .ui.small.horizontal.list > .item {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.list { .ui.large.list {
font-size: 1.16666667em; font-size: 1.14285714em;
} }
.ui.large.horizontal.list .list > .item, .ui.large.horizontal.list .list > .item,
.ui.large.horizontal.list > .item { .ui.large.horizontal.list > .item {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.list { .ui.big.list {
font-size: 1.25em; font-size: 1.28571429em;
} }
.ui.big.horizontal.list .list > .item, .ui.big.horizontal.list .list > .item,
.ui.big.horizontal.list > .item { .ui.big.horizontal.list > .item {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.list { .ui.huge.list {
font-size: 1.41666667em; font-size: 1.42857143em;
} }
.ui.huge.horizontal.list .list > .item, .ui.huge.horizontal.list .list > .item,
.ui.huge.horizontal.list > .item { .ui.huge.horizontal.list > .item {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.list { .ui.massive.list {
font-size: 1.75em; font-size: 1.71428571em;
} }
.ui.massive.horizontal.list .list > .item, .ui.massive.horizontal.list .list > .item,
.ui.massive.horizontal.list > .item { .ui.massive.horizontal.list > .item {
font-size: 1.75rem; font-size: 1.71428571rem;
} }

2
semantic/dist/components/list.min.css vendored
View file

File diff suppressed because one or more lines are too long

936
semantic/dist/components/loader.css vendored
View file

File diff suppressed because it is too large Load diff

2
semantic/dist/components/loader.min.css vendored
View file

File diff suppressed because one or more lines are too long

361
semantic/dist/components/menu.css vendored
View file

@ -30,10 +30,10 @@
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
-webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
min-height: 2.83333333em; min-height: 2.85714286em;
} }
.ui.menu:after { .ui.menu::after {
content: ''; content: '';
display: block; display: block;
height: 0; height: 0;
@ -86,7 +86,7 @@
-ms-user-select: none; -ms-user-select: none;
user-select: none; user-select: none;
background: none; background: none;
padding: 0.91666667em 1.16666667em; padding: 0.92857143em 1.14285714em;
text-transform: none; text-transform: none;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
font-weight: normal; font-weight: normal;
@ -96,11 +96,11 @@
transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
} }
.ui.menu > .item:first-child { .ui.menu > .item:first-child {
border-radius: 0.33333333rem 0 0 0.33333333rem; border-radius: 0.28571429rem 0 0 0.28571429rem;
} }
/* Border */ /* Border */
.ui.menu .item:before { .ui.menu .item::before {
position: absolute; position: absolute;
content: ''; content: '';
top: 0; top: 0;
@ -137,7 +137,7 @@
.ui.menu .item > i.icon { .ui.menu .item > i.icon {
opacity: 0.9; opacity: 0.9;
float: none; float: none;
margin: 0 0.41666667em 0 0; margin: 0 0.35714286em 0 0;
} }
/*-------------- /*--------------
@ -148,8 +148,8 @@
position: relative; position: relative;
top: 0; top: 0;
margin: -0.5em 0; margin: -0.5em 0;
padding-bottom: 0.75em; padding-bottom: 0.78571429em;
padding-top: 0.75em; padding-top: 0.78571429em;
font-size: 1em; font-size: 1em;
} }
@ -185,8 +185,8 @@
} }
.ui.menu .item > .input input { .ui.menu .item > .input input {
font-size: 1em; font-size: 1em;
padding-top: 0.66666667em; padding-top: 0.57142857em;
padding-bottom: 0.66666667em; padding-bottom: 0.57142857em;
} }
/*-------------- /*--------------
@ -221,7 +221,7 @@
/* Menu */ /* Menu */
.ui.menu .dropdown.item .menu { .ui.menu .dropdown.item .menu {
min-width: calc(100% - 1px); min-width: calc(100% - 1px);
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
background: #FFFFFF; background: #FFFFFF;
margin: 0 0 0; margin: 0 0 0;
-webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
@ -239,7 +239,7 @@
margin: 0; margin: 0;
text-align: left; text-align: left;
font-size: 1em !important; font-size: 1em !important;
padding: 0.75em 1.16666667em !important; padding: 0.78571429em 1.14285714em !important;
background: transparent !important; background: transparent !important;
color: rgba(0, 0, 0, 0.87) !important; color: rgba(0, 0, 0, 0.87) !important;
text-transform: none !important; text-transform: none !important;
@ -276,8 +276,8 @@
/* Secondary */ /* Secondary */
.ui.secondary.menu .dropdown.item > .menu, .ui.secondary.menu .dropdown.item > .menu,
.ui.text.menu .dropdown.item > .menu { .ui.text.menu .dropdown.item > .menu {
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
margin-top: 0.41666667em; margin-top: 0.35714286em;
} }
/* Pointing */ /* Pointing */
@ -308,7 +308,7 @@
margin: 0 0 0 0; margin: 0 0 0 0;
-webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
border-radius: 0 0.33333333rem 0.33333333rem 0.33333333rem; border-radius: 0 0.28571429rem 0.28571429rem 0.28571429rem;
} }
.ui.vertical.menu .dropdown.item.upward .menu { .ui.vertical.menu .dropdown.item.upward .menu {
bottom: 0; bottom: 0;
@ -336,15 +336,15 @@
.ui.menu .item > .label:not(.floating) { .ui.menu .item > .label:not(.floating) {
margin-left: 1em; margin-left: 1em;
padding: 0.3em 0.75em; padding: 0.3em 0.78571429em;
} }
.ui.vertical.menu .item > .label { .ui.vertical.menu .item > .label {
margin-top: -0.15em; margin-top: -0.15em;
margin-bottom: -0.15em; margin-bottom: -0.15em;
padding: 0.3em 0.75em; padding: 0.3em 0.78571429em;
} }
.ui.menu .item > .floating.label { .ui.menu .item > .floating.label {
padding: 0.3em 0.75em; padding: 0.3em 0.78571429em;
} }
.ui.menu .item > .label { .ui.menu .item > .label {
background: #999999; background: #999999;
@ -382,8 +382,8 @@
---------------*/ ---------------*/
/* Menu divider shouldnt apply */ /* Menu divider shouldn't apply */
.ui.menu .list .item:before { .ui.menu .list .item::before {
background: none !important; background: none !important;
} }
@ -393,7 +393,7 @@
/* Show vertical dividers below last */ /* Show vertical dividers below last */
.ui.vertical.sidebar.menu > .item:first-child:before { .ui.vertical.sidebar.menu > .item:first-child::before {
display: block !important; display: block !important;
} }
.ui.vertical.sidebar.menu > .item::before { .ui.vertical.sidebar.menu > .item::before {
@ -568,10 +568,10 @@ Floated Menu / Item
border-right: none; border-right: none;
} }
.ui.vertical.menu > .item:first-child { .ui.vertical.menu > .item:first-child {
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui.vertical.menu > .item:last-child { .ui.vertical.menu > .item:last-child {
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
/*--- Label ---*/ /*--- Label ---*/
@ -596,7 +596,7 @@ Floated Menu / Item
/*--- Border ---*/ /*--- Border ---*/
.ui.vertical.menu .item:before { .ui.vertical.menu .item::before {
position: absolute; position: absolute;
content: ''; content: '';
top: 0; top: 0;
@ -605,26 +605,26 @@ Floated Menu / Item
height: 1px; height: 1px;
background: rgba(34, 36, 38, 0.1); background: rgba(34, 36, 38, 0.1);
} }
.ui.vertical.menu .item:first-child:before { .ui.vertical.menu .item:first-child::before {
display: none !important; display: none !important;
} }
/*--- Sub Menu ---*/ /*--- Sub Menu ---*/
.ui.vertical.menu .item > .menu { .ui.vertical.menu .item > .menu {
margin: 0.5em -1.16666667em 0; margin: 0.5em -1.14285714em 0;
} }
.ui.vertical.menu .menu .item { .ui.vertical.menu .menu .item {
background: none; background: none;
padding: 0.5em 1.36111111em; padding: 0.5em 1.33333333em;
font-size: 0.83333333em; font-size: 0.85714286em;
color: rgba(0, 0, 0, 0.5); color: rgba(0, 0, 0, 0.5);
} }
.ui.vertical.menu .item .menu a.item:hover, .ui.vertical.menu .item .menu a.item:hover,
.ui.vertical.menu .item .menu .link.item:hover { .ui.vertical.menu .item .menu .link.item:hover {
color: rgba(0, 0, 0, 0.85); color: rgba(0, 0, 0, 0.85);
} }
.ui.vertical.menu .menu .item:before { .ui.vertical.menu .menu .item::before {
display: none; display: none;
} }
@ -636,13 +636,13 @@ Floated Menu / Item
box-shadow: none; box-shadow: none;
} }
.ui.vertical.menu > .active.item:first-child { .ui.vertical.menu > .active.item:first-child {
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui.vertical.menu > .active.item:last-child { .ui.vertical.menu > .active.item:last-child {
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
.ui.vertical.menu > .active.item:only-child { .ui.vertical.menu > .active.item:only-child {
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
.ui.vertical.menu .active.item .menu .active.item { .ui.vertical.menu .active.item .menu .active.item {
border-left: none; border-left: none;
@ -674,10 +674,10 @@ Floated Menu / Item
border-left: 1px solid transparent; border-left: 1px solid transparent;
border-right: 1px solid transparent; border-right: 1px solid transparent;
border-top: 2px solid transparent; border-top: 2px solid transparent;
padding: 0.91666667em 1.41666667em; padding: 0.92857143em 1.42857143em;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
} }
.ui.tabular.menu .item:before { .ui.tabular.menu .item::before {
display: none; display: none;
} }
@ -697,12 +697,14 @@ Floated Menu / Item
margin-bottom: -1px; margin-bottom: -1px;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
border-radius: 0.33333333rem 0.33333333rem 0 0 !important; border-radius: 0.28571429rem 0.28571429rem 0 0 !important;
}
.ui.tabular.menu .active.item:hover {
cursor: default;
} }
/* Coupling with segment for attachment */ /* Coupling with segment for attachment */
.ui.tabular.menu + .attached:not(.top).segment, .ui.tabular.menu ~ .attached:not(.top).segment {
.ui.tabular.menu + .attached:not(.top).segment + .attached:not(.top).segment {
border-top: none; border-top: none;
margin-left: 0; margin-left: 0;
margin-top: 0; margin-top: 0;
@ -736,7 +738,7 @@ Floated Menu / Item
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
border-color: #D4D4D5; border-color: #D4D4D5;
margin: -1px 0 0 0; margin: -1px 0 0 0;
border-radius: 0 0 0.33333333rem 0.33333333rem !important; border-radius: 0 0 0.28571429rem 0.28571429rem !important;
} }
/* Vertical Tabular (Left) */ /* Vertical Tabular (Left) */
@ -760,7 +762,7 @@ Floated Menu / Item
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
border-color: #D4D4D5; border-color: #D4D4D5;
margin: 0 -1px 0 0; margin: 0 -1px 0 0;
border-radius: 0.33333333rem 0 0 0.33333333rem !important; border-radius: 0.28571429rem 0 0 0.28571429rem !important;
} }
/* Vertical Right Tabular */ /* Vertical Right Tabular */
@ -785,7 +787,7 @@ Floated Menu / Item
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
border-color: #D4D4D5; border-color: #D4D4D5;
margin: 0 0 0 -1px; margin: 0 0 0 -1px;
border-radius: 0 0.33333333rem 0.33333333rem 0 !important; border-radius: 0 0.28571429rem 0.28571429rem 0 !important;
} }
/* Dropdown */ /* Dropdown */
@ -796,6 +798,16 @@ Floated Menu / Item
border-top: 2px solid transparent; border-top: 2px solid transparent;
border-bottom: none; border-bottom: none;
} }
.ui.inverted.tabular.menu .active.item,
.ui.inverted.tabular.menu .active.item:hover {
background: none #1B1C1D;
border-color: #555555;
}
.ui.inverted.tabular.menu .item:not(.active):hover {
color: #ffffff;
background: transparent;
cursor: pointer;
}
/*-------------- /*--------------
Pagination Pagination
@ -809,12 +821,12 @@ Floated Menu / Item
vertical-align: middle; vertical-align: middle;
} }
.ui.pagination.menu .item:last-child { .ui.pagination.menu .item:last-child {
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
} }
.ui.compact.menu .item:last-child { .ui.compact.menu .item:last-child {
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
} }
.ui.pagination.menu .item:last-child:before { .ui.pagination.menu .item:last-child::before {
display: none; display: none;
} }
.ui.pagination.menu .item { .ui.pagination.menu .item {
@ -828,7 +840,7 @@ Floated Menu / Item
/* Active */ /* Active */
.ui.pagination.menu .active.item { .ui.pagination.menu .active.item {
border-top: none; border-top: none;
padding-top: 0.91666667em; padding-top: 0.92857143em;
background-color: rgba(0, 0, 0, 0.05); background-color: rgba(0, 0, 0, 0.05);
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
-webkit-box-shadow: none; -webkit-box-shadow: none;
@ -841,8 +853,8 @@ Floated Menu / Item
.ui.secondary.menu { .ui.secondary.menu {
background: none; background: none;
margin-left: -0.41666667em; margin-left: -0.35714286em;
margin-right: -0.41666667em; margin-right: -0.35714286em;
border-radius: 0; border-radius: 0;
border: none; border: none;
-webkit-box-shadow: none; -webkit-box-shadow: none;
@ -856,16 +868,16 @@ Floated Menu / Item
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
border: none; border: none;
padding: 0.75em 0.91666667em; padding: 0.78571429em 0.92857143em;
margin: 0 0.41666667em; margin: 0 0.35714286em;
background: none; background: none;
-webkit-transition: color 0.1s ease; -webkit-transition: color 0.1s ease;
transition: color 0.1s ease; transition: color 0.1s ease;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
/* No Divider */ /* No Divider */
.ui.secondary.menu .item:before { .ui.secondary.menu .item::before {
display: none !important; display: none !important;
} }
@ -895,7 +907,7 @@ Floated Menu / Item
box-shadow: none; box-shadow: none;
background: rgba(0, 0, 0, 0.05); background: rgba(0, 0, 0, 0.05);
color: rgba(0, 0, 0, 0.95); color: rgba(0, 0, 0, 0.95);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
/* Active Hover */ /* Active Hover */
@ -942,16 +954,16 @@ Floated Menu / Item
/* Sub Menu */ /* Sub Menu */
.ui.vertical.secondary.menu .item:not(.dropdown) > .menu { .ui.vertical.secondary.menu .item:not(.dropdown) > .menu {
margin: 0 -0.91666667em; margin: 0 -0.92857143em;
} }
.ui.vertical.secondary.menu .item:not(.dropdown) > .menu > .item { .ui.vertical.secondary.menu .item:not(.dropdown) > .menu > .item {
margin: 0; margin: 0;
padding: 0.58333333em 1.36111111em; padding: 0.5em 1.33333333em;
} }
.ui.secondary.vertical.menu > .item { .ui.secondary.vertical.menu > .item {
border: none; border: none;
margin: 0 0 0.41666667em; margin: 0 0 0.35714286em;
border-radius: 0.33333333rem !important; border-radius: 0.28571429rem !important;
} }
.ui.secondary.vertical.menu > .header.item { .ui.secondary.vertical.menu > .header.item {
border-radius: 0; border-radius: 0;
@ -983,7 +995,7 @@ Floated Menu / Item
-ms-flex-item-align: end; -ms-flex-item-align: end;
align-self: flex-end; align-self: flex-end;
margin: 0 0 -2px; margin: 0 0 -2px;
padding: 0.83333333em 1.16666667em; padding: 0.85714286em 1.14285714em;
border-bottom-width: 2px; border-bottom-width: 2px;
-webkit-transition: color 0.1s ease; -webkit-transition: color 0.1s ease;
transition: color 0.1s ease; transition: color 0.1s ease;
@ -1008,7 +1020,7 @@ Floated Menu / Item
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
} }
.ui.secondary.pointing.menu .item:after { .ui.secondary.pointing.menu .item::after {
display: none; display: none;
} }
@ -1104,7 +1116,7 @@ Floated Menu / Item
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
border: none; border: none;
margin: 1em -0.58333333em; margin: 1em -0.5em;
} }
.ui.text.menu .item { .ui.text.menu .item {
border-radius: 0; border-radius: 0;
@ -1113,7 +1125,7 @@ Floated Menu / Item
-ms-flex-item-align: center; -ms-flex-item-align: center;
align-self: center; align-self: center;
margin: 0 0; margin: 0 0;
padding: 0.41666667em 0.58333333em; padding: 0.35714286em 0.5em;
font-weight: normal; font-weight: normal;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
-webkit-transition: opacity 0.1s ease; -webkit-transition: opacity 0.1s ease;
@ -1121,8 +1133,8 @@ Floated Menu / Item
} }
/* Border */ /* Border */
.ui.text.menu .item:before, .ui.text.menu .item::before,
.ui.text.menu .menu .item:before { .ui.text.menu .menu .item::before {
display: none !important; display: none !important;
} }
@ -1131,7 +1143,7 @@ Floated Menu / Item
background-color: transparent; background-color: transparent;
opacity: 1; opacity: 1;
color: rgba(0, 0, 0, 0.85); color: rgba(0, 0, 0, 0.85);
font-size: 0.91666667em; font-size: 0.92857143em;
text-transform: uppercase; text-transform: uppercase;
font-weight: bold; font-weight: bold;
} }
@ -1159,16 +1171,16 @@ Floated Menu / Item
margin-bottom: 0; margin-bottom: 0;
} }
.ui.vertical.text.menu .item { .ui.vertical.text.menu .item {
margin: 0.66666667em 0; margin: 0.57142857em 0;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
} }
.ui.vertical.text.menu .item > i.icon { .ui.vertical.text.menu .item > i.icon {
float: none; float: none;
margin: 0 0.41666667em 0 0; margin: 0 0.35714286em 0 0;
} }
.ui.vertical.text.menu .header.item { .ui.vertical.text.menu .header.item {
margin: 0.66666667em 0 0.83333333em; margin: 0.57142857em 0 0.71428571em;
} }
/* Vertical Sub Menu */ /* Vertical Sub Menu */
@ -1177,7 +1189,7 @@ Floated Menu / Item
} }
.ui.vertical.text.menu .item:not(.dropdown) > .menu > .item { .ui.vertical.text.menu .item:not(.dropdown) > .menu > .item {
margin: 0; margin: 0;
padding: 0.58333333em 0; padding: 0.5em 0;
} }
/*--- hover ---*/ /*--- hover ---*/
@ -1205,7 +1217,7 @@ Floated Menu / Item
} }
/* Disable Bariations */ /* Disable Bariations */
.ui.text.pointing.menu .active.item:after { .ui.text.pointing.menu .active.item::after {
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
@ -1252,8 +1264,8 @@ Floated Menu / Item
opacity: 1; opacity: 1;
} }
/* Icon Gylph */ /* Icon Glyph */
.ui.icon.menu i.icon:before { .ui.icon.menu i.icon::before {
opacity: 1; opacity: 1;
} }
@ -1299,7 +1311,7 @@ Floated Menu / Item
.ui.labeled.icon.menu > .item > i.icon:not(.dropdown) { .ui.labeled.icon.menu > .item > i.icon:not(.dropdown) {
height: 1em; height: 1em;
display: block; display: block;
font-size: 1.75em !important; font-size: 1.71428571em !important;
margin: 0 auto 0.5rem !important; margin: 0 auto 0.5rem !important;
} }
@ -1325,10 +1337,13 @@ Floated Menu / Item
-ms-flex-direction: column; -ms-flex-direction: column;
flex-direction: column; flex-direction: column;
} }
.ui.stackable.menu.pointing .active.item::after {
display: none;
}
.ui.stackable.menu .item { .ui.stackable.menu .item {
width: 100% !important; width: 100% !important;
} }
.ui.stackable.menu .item:before { .ui.stackable.menu .item::before {
position: absolute; position: absolute;
content: ''; content: '';
top: auto; top: auto;
@ -1368,7 +1383,7 @@ Floated Menu / Item
.ui.ui.ui.menu .primary.active.item, .ui.ui.ui.menu .primary.active.item,
.ui.ui.primary.menu .active.item:hover, .ui.ui.primary.menu .active.item:hover,
.ui.ui.primary.menu .active.item { .ui.ui.primary.menu .active.item {
color: #6435C9; color: #2185D0;
} }
.ui.ui.ui.menu .red.active.item, .ui.ui.ui.menu .red.active.item,
.ui.ui.red.menu .active.item:hover, .ui.ui.red.menu .active.item:hover,
@ -1459,10 +1474,10 @@ Floated Menu / Item
/*--- Border ---*/ /*--- Border ---*/
.ui.inverted.menu .item:before { .ui.inverted.menu .item::before {
background: rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.08);
} }
.ui.vertical.inverted.menu .item:before { .ui.vertical.inverted.menu .item::before {
background: rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.08);
} }
@ -1518,7 +1533,7 @@ Floated Menu / Item
background: transparent; background: transparent;
color: #FFFFFF; color: #FFFFFF;
} }
.ui.inverted.pointing.menu .active.item:after { .ui.inverted.pointing.menu .active.item::after {
background: #3D3E3F; background: #3D3E3F;
margin: 0 !important; margin: 0 !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
@ -1532,7 +1547,7 @@ Floated Menu / Item
background: #3D3E3F; background: #3D3E3F;
color: #FFFFFF !important; color: #FFFFFF !important;
} }
.ui.inverted.pointing.menu .active.item:hover:after { .ui.inverted.pointing.menu .active.item:hover::after {
background: #3D3E3F; background: #3D3E3F;
} }
@ -1544,13 +1559,22 @@ Floated Menu / Item
float: left; float: left;
margin: 0 0.5rem 0 0; margin: 0 0.5rem 0 0;
} }
.ui.floated.menu .item:last-child:before { .ui.floated.menu .item:last-child::before {
display: none; display: none;
} }
.ui.right.floated.menu { .ui.right.floated.menu {
float: right; float: right;
margin: 0 0 0 0.5rem; margin: 0 0 0 0.5rem;
} }
.ui.center.aligned.menu,
.ui.centered.menu {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
margin-left: 50%;
}
/*-------------- /*--------------
Inverted Inverted
@ -1558,22 +1582,22 @@ Floated Menu / Item
.ui.ui.ui.inverted.menu .primary.active.item, .ui.ui.ui.inverted.menu .primary.active.item,
.ui.ui.inverted.primary.menu { .ui.ui.inverted.primary.menu {
background-color: #6435C9; background-color: #2185D0;
} }
.ui.inverted.primary.menu .item:before { .ui.inverted.primary.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.primary.menu .active.item { .ui.ui.inverted.primary.menu .active.item {
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.1);
} }
.ui.inverted.pointing.primary.menu .active.item { .ui.inverted.pointing.primary.menu .active.item {
background-color: #5829bb; background-color: #1678c2;
} }
.ui.ui.ui.inverted.menu .red.active.item, .ui.ui.ui.inverted.menu .red.active.item,
.ui.ui.inverted.red.menu { .ui.ui.inverted.red.menu {
background-color: #DB2828; background-color: #DB2828;
} }
.ui.inverted.red.menu .item:before { .ui.inverted.red.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.red.menu .active.item { .ui.ui.inverted.red.menu .active.item {
@ -1586,7 +1610,7 @@ Floated Menu / Item
.ui.ui.inverted.orange.menu { .ui.ui.inverted.orange.menu {
background-color: #F2711C; background-color: #F2711C;
} }
.ui.inverted.orange.menu .item:before { .ui.inverted.orange.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.orange.menu .active.item { .ui.ui.inverted.orange.menu .active.item {
@ -1599,7 +1623,7 @@ Floated Menu / Item
.ui.ui.inverted.yellow.menu { .ui.ui.inverted.yellow.menu {
background-color: #FBBD08; background-color: #FBBD08;
} }
.ui.inverted.yellow.menu .item:before { .ui.inverted.yellow.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.yellow.menu .active.item { .ui.ui.inverted.yellow.menu .active.item {
@ -1612,7 +1636,7 @@ Floated Menu / Item
.ui.ui.inverted.olive.menu { .ui.ui.inverted.olive.menu {
background-color: #B5CC18; background-color: #B5CC18;
} }
.ui.inverted.olive.menu .item:before { .ui.inverted.olive.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.olive.menu .active.item { .ui.ui.inverted.olive.menu .active.item {
@ -1625,7 +1649,7 @@ Floated Menu / Item
.ui.ui.inverted.green.menu { .ui.ui.inverted.green.menu {
background-color: #21BA45; background-color: #21BA45;
} }
.ui.inverted.green.menu .item:before { .ui.inverted.green.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.green.menu .active.item { .ui.ui.inverted.green.menu .active.item {
@ -1638,7 +1662,7 @@ Floated Menu / Item
.ui.ui.inverted.teal.menu { .ui.ui.inverted.teal.menu {
background-color: #00B5AD; background-color: #00B5AD;
} }
.ui.inverted.teal.menu .item:before { .ui.inverted.teal.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.teal.menu .active.item { .ui.ui.inverted.teal.menu .active.item {
@ -1651,7 +1675,7 @@ Floated Menu / Item
.ui.ui.inverted.blue.menu { .ui.ui.inverted.blue.menu {
background-color: #2185D0; background-color: #2185D0;
} }
.ui.inverted.blue.menu .item:before { .ui.inverted.blue.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.blue.menu .active.item { .ui.ui.inverted.blue.menu .active.item {
@ -1664,7 +1688,7 @@ Floated Menu / Item
.ui.ui.inverted.violet.menu { .ui.ui.inverted.violet.menu {
background-color: #6435C9; background-color: #6435C9;
} }
.ui.inverted.violet.menu .item:before { .ui.inverted.violet.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.violet.menu .active.item { .ui.ui.inverted.violet.menu .active.item {
@ -1677,7 +1701,7 @@ Floated Menu / Item
.ui.ui.inverted.purple.menu { .ui.ui.inverted.purple.menu {
background-color: #A333C8; background-color: #A333C8;
} }
.ui.inverted.purple.menu .item:before { .ui.inverted.purple.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.purple.menu .active.item { .ui.ui.inverted.purple.menu .active.item {
@ -1690,7 +1714,7 @@ Floated Menu / Item
.ui.ui.inverted.pink.menu { .ui.ui.inverted.pink.menu {
background-color: #E03997; background-color: #E03997;
} }
.ui.inverted.pink.menu .item:before { .ui.inverted.pink.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.pink.menu .active.item { .ui.ui.inverted.pink.menu .active.item {
@ -1703,7 +1727,7 @@ Floated Menu / Item
.ui.ui.inverted.brown.menu { .ui.ui.inverted.brown.menu {
background-color: #A5673F; background-color: #A5673F;
} }
.ui.inverted.brown.menu .item:before { .ui.inverted.brown.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.brown.menu .active.item { .ui.ui.inverted.brown.menu .active.item {
@ -1716,7 +1740,7 @@ Floated Menu / Item
.ui.ui.inverted.grey.menu { .ui.ui.inverted.grey.menu {
background-color: #767676; background-color: #767676;
} }
.ui.inverted.grey.menu .item:before { .ui.inverted.grey.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.grey.menu .active.item { .ui.ui.inverted.grey.menu .active.item {
@ -1729,7 +1753,7 @@ Floated Menu / Item
.ui.ui.inverted.black.menu { .ui.ui.inverted.black.menu {
background-color: #1B1C1D; background-color: #1B1C1D;
} }
.ui.inverted.black.menu .item:before { .ui.inverted.black.menu .item::before {
background-color: rgba(34, 36, 38, 0.1); background-color: rgba(34, 36, 38, 0.1);
} }
.ui.ui.inverted.black.menu .active.item { .ui.ui.inverted.black.menu .active.item {
@ -1738,7 +1762,7 @@ Floated Menu / Item
.ui.inverted.pointing.black.menu .active.item { .ui.inverted.pointing.black.menu .active.item {
background-color: #27292a; background-color: #27292a;
} }
.ui.ui.ui.inverted.pointing.menu .active.item:after { .ui.ui.ui.inverted.pointing.menu .active.item::after {
background-color: inherit; background-color: inherit;
} }
@ -1754,23 +1778,23 @@ Floated Menu / Item
.ui.horizontally.fitted.menu .item, .ui.horizontally.fitted.menu .item,
.ui.horizontally.fitted.menu .item .menu .item, .ui.horizontally.fitted.menu .item .menu .item,
.ui.menu .horizontally.fitted.item { .ui.menu .horizontally.fitted.item {
padding-top: 0.91666667em; padding-top: 0.92857143em;
padding-bottom: 0.91666667em; padding-bottom: 0.92857143em;
} }
.ui.vertically.fitted.menu .item, .ui.vertically.fitted.menu .item,
.ui.vertically.fitted.menu .item .menu .item, .ui.vertically.fitted.menu .item .menu .item,
.ui.menu .vertically.fitted.item { .ui.menu .vertically.fitted.item {
padding-left: 1.16666667em; padding-left: 1.14285714em;
padding-right: 1.16666667em; padding-right: 1.14285714em;
} }
/*-------------- /*--------------
Borderless Borderless
---------------*/ ---------------*/
.ui.borderless.menu .item:before, .ui.borderless.menu .item::before,
.ui.borderless.menu .item .menu .item:before, .ui.borderless.menu .item .menu .item::before,
.ui.menu .borderless.item:before { .ui.menu .borderless.item::before {
background: none !important; background: none !important;
} }
@ -1792,9 +1816,9 @@ Floated Menu / Item
display: inline-block; display: inline-block;
} }
.ui.compact.menu:not(.secondary) .item:last-child { .ui.compact.menu:not(.secondary) .item:last-child {
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
} }
.ui.compact.menu .item:last-child:before { .ui.compact.menu .item:last-child::before {
display: none; display: none;
} }
.ui.compact.vertical.menu { .ui.compact.vertical.menu {
@ -1832,7 +1856,7 @@ Floated Menu / Item
.ui.attached.item.menu:not(.tabular) { .ui.attached.item.menu:not(.tabular) {
margin: 0 -1px !important; margin: 0 -1px !important;
} }
.ui.item.menu .item:last-child:before { .ui.item.menu .item:last-child::before {
display: none; display: none;
} }
.ui.menu.two.item .item { .ui.menu.two.item .item {
@ -1937,7 +1961,7 @@ Floated Menu / Item
Pointing Pointing
--------------------*/ --------------------*/
.ui.pointing.menu .item:after { .ui.pointing.menu .item::after {
visibility: hidden; visibility: hidden;
position: absolute; position: absolute;
content: ''; content: '';
@ -1947,8 +1971,8 @@ Floated Menu / Item
transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg);
background: none; background: none;
margin: 0.5px 0 0; margin: 0.5px 0 0;
width: 0.66666667em; width: 0.57142857em;
height: 0.66666667em; height: 0.57142857em;
border: none; border: none;
border-bottom: 1px solid #D4D4D5; border-bottom: 1px solid #D4D4D5;
border-right: 1px solid #D4D4D5; border-right: 1px solid #D4D4D5;
@ -1956,7 +1980,7 @@ Floated Menu / Item
-webkit-transition: background 0.1s ease; -webkit-transition: background 0.1s ease;
transition: background 0.1s ease; transition: background 0.1s ease;
} }
.ui.vertical.pointing.menu .item:after { .ui.vertical.pointing.menu .item::after {
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 0; right: 0;
@ -1969,92 +1993,92 @@ Floated Menu / Item
border-top: 1px solid #D4D4D5; border-top: 1px solid #D4D4D5;
border-right: 1px solid #D4D4D5; border-right: 1px solid #D4D4D5;
} }
@media only screen and (max-width: 767.98px) { .ui.pointing.menu .ui.dropdown .menu .item::after,
.stackable .ui.vertical.pointing.menu .item::after { .ui.vertical.pointing.menu .ui.dropdown .menu .item::after {
display: none;
}
}
.ui.pointing.menu .ui.dropdown .menu .item:after,
.ui.vertical.pointing.menu .ui.dropdown .menu .item:after {
display: none; display: none;
} }
/* Active */ /* Active */
.ui.pointing.menu .active.item:after { .ui.pointing.menu .active.item::after {
visibility: visible; visibility: visible;
} }
.ui.pointing.menu .active.dropdown.item:after { .ui.pointing.menu .active.dropdown.item::after {
visibility: hidden; visibility: hidden;
} }
/* Don't double up pointers */ /* Don't double up pointers */
.ui.pointing.menu .dropdown.active.item:after, .ui.pointing.menu .dropdown.active.item::after,
.ui.pointing.menu .active.item .menu .active.item:after { .ui.pointing.menu .active.item .menu .active.item::after {
display: none; display: none;
} }
/* Colors */ /* Colors */
.ui.pointing.menu .active.item:hover:after { .ui.pointing.menu .active.item:hover::after {
background-color: #F2F2F2; background-color: #F2F2F2;
} }
.ui.pointing.menu .active.item:after { .ui.pointing.menu .active.item::after {
background-color: #F2F2F2; background-color: #F2F2F2;
} }
.ui.pointing.menu .active.item:hover:after { .ui.pointing.menu .active.item:hover::after {
background-color: #F2F2F2; background-color: #F2F2F2;
} }
.ui.vertical.pointing.menu .active.item:hover:after { .ui.vertical.pointing.menu .active.item:hover::after {
background-color: #F2F2F2; background-color: #F2F2F2;
} }
.ui.vertical.pointing.menu .active.item:after { .ui.vertical.pointing.menu .active.item::after {
background-color: #F2F2F2; background-color: #F2F2F2;
} }
.ui.vertical.pointing.menu .menu .active.item:after { .ui.vertical.pointing.menu .menu .active.item::after {
background-color: #FFFFFF; background-color: #FFFFFF;
} }
.ui.inverted.pointing.menu .primary.active.item:after { @media only screen and (max-width: 767.98px) {
background-color: #6435C9; .ui.stackable.grid .ui.fluid.vertical.pointing.menu .active.item::after {
display: none;
} }
.ui.inverted.pointing.menu .secondary.active.item:after {
background-color: #1B1C1D;
} }
.ui.inverted.pointing.menu .red.active.item:after { .ui.inverted.pointing.menu .primary.active.item::after {
background-color: #DB2828;
}
.ui.inverted.pointing.menu .orange.active.item:after {
background-color: #F2711C;
}
.ui.inverted.pointing.menu .yellow.active.item:after {
background-color: #FBBD08;
}
.ui.inverted.pointing.menu .olive.active.item:after {
background-color: #B5CC18;
}
.ui.inverted.pointing.menu .green.active.item:after {
background-color: #21BA45;
}
.ui.inverted.pointing.menu .teal.active.item:after {
background-color: #00B5AD;
}
.ui.inverted.pointing.menu .blue.active.item:after {
background-color: #2185D0; background-color: #2185D0;
} }
.ui.inverted.pointing.menu .violet.active.item:after { .ui.inverted.pointing.menu .secondary.active.item::after {
background-color: #1B1C1D;
}
.ui.inverted.pointing.menu .red.active.item::after {
background-color: #DB2828;
}
.ui.inverted.pointing.menu .orange.active.item::after {
background-color: #F2711C;
}
.ui.inverted.pointing.menu .yellow.active.item::after {
background-color: #FBBD08;
}
.ui.inverted.pointing.menu .olive.active.item::after {
background-color: #B5CC18;
}
.ui.inverted.pointing.menu .green.active.item::after {
background-color: #21BA45;
}
.ui.inverted.pointing.menu .teal.active.item::after {
background-color: #00B5AD;
}
.ui.inverted.pointing.menu .blue.active.item::after {
background-color: #2185D0;
}
.ui.inverted.pointing.menu .violet.active.item::after {
background-color: #6435C9; background-color: #6435C9;
} }
.ui.inverted.pointing.menu .purple.active.item:after { .ui.inverted.pointing.menu .purple.active.item::after {
background-color: #A333C8; background-color: #A333C8;
} }
.ui.inverted.pointing.menu .pink.active.item:after { .ui.inverted.pointing.menu .pink.active.item::after {
background-color: #E03997; background-color: #E03997;
} }
.ui.inverted.pointing.menu .brown.active.item:after { .ui.inverted.pointing.menu .brown.active.item::after {
background-color: #A5673F; background-color: #A5673F;
} }
.ui.inverted.pointing.menu .grey.active.item:after { .ui.inverted.pointing.menu .grey.active.item::after {
background-color: #767676; background-color: #767676;
} }
.ui.inverted.pointing.menu .black.active.item:after { .ui.inverted.pointing.menu .black.active.item::after {
background-color: #1B1C1D; background-color: #1B1C1D;
} }
@ -2084,7 +2108,7 @@ Floated Menu / Item
margin-bottom: 0; margin-bottom: 0;
top: 0; top: 0;
margin-top: 1rem; margin-top: 1rem;
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui.menu[class*="top attached"]:first-child { .ui.menu[class*="top attached"]:first-child {
margin-top: 0; margin-top: 0;
@ -2098,7 +2122,7 @@ Floated Menu / Item
margin-bottom: 1rem; margin-bottom: 1rem;
-webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none;
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none;
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
.ui[class*="bottom attached"].menu:last-child { .ui[class*="bottom attached"].menu:last-child {
margin-bottom: 0; margin-bottom: 0;
@ -2106,19 +2130,22 @@ Floated Menu / Item
/* Attached Menu Item */ /* Attached Menu Item */
.ui.top.attached.menu > .item:first-child { .ui.top.attached.menu > .item:first-child {
border-radius: 0.33333333rem 0 0 0; border-radius: 0.28571429rem 0 0 0;
} }
.ui.bottom.attached.menu > .item:first-child { .ui.bottom.attached.menu > .item:first-child {
border-radius: 0 0 0 0.33333333rem; border-radius: 0 0 0 0.28571429rem;
} }
/* Tabular Attached */ /* Tabular Attached */
.ui.attached.menu:not(.tabular) { .ui.attached.menu:not(.tabular):not(.text) {
border: 1px solid #D4D4D5; border: 1px solid #D4D4D5;
} }
.ui.attached.inverted.menu { .ui.attached.inverted.menu {
border: none; border: none;
} }
.ui[class*="top attached"].inverted.tabular.menu {
border-bottom: 1px solid #555555;
}
.ui.attached.tabular.menu { .ui.attached.tabular.menu {
margin-left: 0; margin-left: 0;
margin-right: 0; margin-right: 0;
@ -2138,7 +2165,7 @@ Floated Menu / Item
.ui.mini.menu, .ui.mini.menu,
.ui.mini.menu .dropdown, .ui.mini.menu .dropdown,
.ui.mini.menu .dropdown .menu > .item { .ui.mini.menu .dropdown .menu > .item {
font-size: 0.91666667rem; font-size: 0.78571429rem;
} }
.ui.mini.vertical.menu:not(.icon) { .ui.mini.vertical.menu:not(.icon) {
width: 9rem; width: 9rem;
@ -2146,7 +2173,7 @@ Floated Menu / Item
.ui.tiny.menu, .ui.tiny.menu,
.ui.tiny.menu .dropdown, .ui.tiny.menu .dropdown,
.ui.tiny.menu .dropdown .menu > .item { .ui.tiny.menu .dropdown .menu > .item {
font-size: 1rem; font-size: 0.85714286rem;
} }
.ui.tiny.vertical.menu:not(.icon) { .ui.tiny.vertical.menu:not(.icon) {
width: 11rem; width: 11rem;
@ -2154,7 +2181,7 @@ Floated Menu / Item
.ui.small.menu, .ui.small.menu,
.ui.small.menu .dropdown, .ui.small.menu .dropdown,
.ui.small.menu .dropdown .menu > .item { .ui.small.menu .dropdown .menu > .item {
font-size: 1.08333333rem; font-size: 0.92857143rem;
} }
.ui.small.vertical.menu:not(.icon) { .ui.small.vertical.menu:not(.icon) {
width: 13rem; width: 13rem;
@ -2162,7 +2189,7 @@ Floated Menu / Item
.ui.large.menu, .ui.large.menu,
.ui.large.menu .dropdown, .ui.large.menu .dropdown,
.ui.large.menu .dropdown .menu > .item { .ui.large.menu .dropdown .menu > .item {
font-size: 1.25rem; font-size: 1.07142857rem;
} }
.ui.large.vertical.menu:not(.icon) { .ui.large.vertical.menu:not(.icon) {
width: 18rem; width: 18rem;
@ -2170,7 +2197,7 @@ Floated Menu / Item
.ui.big.menu, .ui.big.menu,
.ui.big.menu .dropdown, .ui.big.menu .dropdown,
.ui.big.menu .dropdown .menu > .item { .ui.big.menu .dropdown .menu > .item {
font-size: 1.33333333rem; font-size: 1.14285714rem;
} }
.ui.big.vertical.menu:not(.icon) { .ui.big.vertical.menu:not(.icon) {
width: 20rem; width: 20rem;
@ -2178,7 +2205,7 @@ Floated Menu / Item
.ui.huge.menu, .ui.huge.menu,
.ui.huge.menu .dropdown, .ui.huge.menu .dropdown,
.ui.huge.menu .dropdown .menu > .item { .ui.huge.menu .dropdown .menu > .item {
font-size: 1.41666667rem; font-size: 1.21428571rem;
} }
.ui.huge.vertical.menu:not(.icon) { .ui.huge.vertical.menu:not(.icon) {
width: 22rem; width: 22rem;
@ -2186,7 +2213,7 @@ Floated Menu / Item
.ui.massive.menu, .ui.massive.menu,
.ui.massive.menu .dropdown, .ui.massive.menu .dropdown,
.ui.massive.menu .dropdown .menu > .item { .ui.massive.menu .dropdown .menu > .item {
font-size: 1.5rem; font-size: 1.28571429rem;
} }
.ui.massive.vertical.menu:not(.icon) { .ui.massive.vertical.menu:not(.icon) {
width: 25rem; width: 25rem;

2
semantic/dist/components/menu.min.css vendored
View file

File diff suppressed because one or more lines are too long

112
semantic/dist/components/message.css vendored
View file

@ -25,7 +25,7 @@
transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease; transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease; transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 rgba(0, 0, 0, 0); -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 rgba(0, 0, 0, 0);
box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 0 0 0 rgba(0, 0, 0, 0);
} }
@ -51,7 +51,7 @@
/* Default font size */ /* Default font size */
.ui.message .header:not(.ui) { .ui.message .header:not(.ui) {
font-size: 1.16666667em; font-size: 1.14285714em;
} }
/* Paragraph */ /* Paragraph */
@ -89,7 +89,7 @@
margin: 0 0 0.3em 1em; margin: 0 0 0.3em 1em;
padding: 0; padding: 0;
} }
.ui.message .list:not(.ui) li:before { .ui.message .list:not(.ui) li::before {
position: absolute; position: absolute;
content: '•'; content: '•';
left: -1em; left: -1em;
@ -211,7 +211,7 @@
.ui.attached.message { .ui.attached.message {
margin-bottom: -1px; margin-bottom: -1px;
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
-webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset; box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
margin-left: -1px; margin-left: -1px;
@ -223,7 +223,7 @@
} }
.ui.bottom.attached.message { .ui.bottom.attached.message {
margin-top: -1px; margin-top: -1px;
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
-webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset, 0 1px 2px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset, 0 1px 2px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset, 0 1px 2px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset, 0 1px 2px 0 rgba(34, 36, 38, 0.15);
} }
@ -332,46 +332,6 @@
.ui.inverted.negative.message .header { .ui.inverted.negative.message .header {
color: #E0B4B4; color: #E0B4B4;
} }
.ui.info.message {
background-color: #F8FFFF;
color: #276F86;
}
.ui.info.message,
.ui.attached.info.message {
-webkit-box-shadow: 0 0 0 1px #A9D5DE inset, 0 0 0 0 rgba(0, 0, 0, 0);
box-shadow: 0 0 0 1px #A9D5DE inset, 0 0 0 0 rgba(0, 0, 0, 0);
}
.ui.floating.info.message {
-webkit-box-shadow: 0 0 0 1px #A9D5DE inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 0 0 1px #A9D5DE inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
}
.ui.info.message .header {
color: #0E566C;
}
.ui.inverted.info.message,
.ui.inverted.info.message .header {
color: #c6e3e9;
}
.ui.warning.message {
background-color: #FFFAF3;
color: #573A08;
}
.ui.warning.message,
.ui.attached.warning.message {
-webkit-box-shadow: 0 0 0 1px #C9BA9B inset, 0 0 0 0 rgba(0, 0, 0, 0);
box-shadow: 0 0 0 1px #C9BA9B inset, 0 0 0 0 rgba(0, 0, 0, 0);
}
.ui.floating.warning.message {
-webkit-box-shadow: 0 0 0 1px #C9BA9B inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 0 0 1px #C9BA9B inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
}
.ui.warning.message .header {
color: #794B02;
}
.ui.inverted.warning.message,
.ui.inverted.warning.message .header {
color: #d7ccb5;
}
.ui.error.message { .ui.error.message {
background-color: #FFF6F6; background-color: #FFF6F6;
color: #9F3A38; color: #9F3A38;
@ -392,6 +352,26 @@
.ui.inverted.error.message .header { .ui.inverted.error.message .header {
color: #ecd1d1; color: #ecd1d1;
} }
.ui.info.message {
background-color: #F8FFFF;
color: #276F86;
}
.ui.info.message,
.ui.attached.info.message {
-webkit-box-shadow: 0 0 0 1px #A9D5DE inset, 0 0 0 0 rgba(0, 0, 0, 0);
box-shadow: 0 0 0 1px #A9D5DE inset, 0 0 0 0 rgba(0, 0, 0, 0);
}
.ui.floating.info.message {
-webkit-box-shadow: 0 0 0 1px #A9D5DE inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 0 0 1px #A9D5DE inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
}
.ui.info.message .header {
color: #0E566C;
}
.ui.inverted.info.message,
.ui.inverted.info.message .header {
color: #c6e3e9;
}
.ui.success.message { .ui.success.message {
background-color: #FCFFF5; background-color: #FCFFF5;
color: #2C662D; color: #2C662D;
@ -412,18 +392,38 @@
.ui.inverted.success.message .header { .ui.inverted.success.message .header {
color: #b9d1ad; color: #b9d1ad;
} }
.ui.warning.message {
background-color: #FFFAF3;
color: #573A08;
}
.ui.warning.message,
.ui.attached.warning.message {
-webkit-box-shadow: 0 0 0 1px #C9BA9B inset, 0 0 0 0 rgba(0, 0, 0, 0);
box-shadow: 0 0 0 1px #C9BA9B inset, 0 0 0 0 rgba(0, 0, 0, 0);
}
.ui.floating.warning.message {
-webkit-box-shadow: 0 0 0 1px #C9BA9B inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 0 0 1px #C9BA9B inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
}
.ui.warning.message .header {
color: #794B02;
}
.ui.inverted.warning.message,
.ui.inverted.warning.message .header {
color: #d7ccb5;
}
.ui.primary.message { .ui.primary.message {
background-color: #DFF0FF; background-color: #DFF0FF;
color: rgba(255, 255, 255, 0.9); color: rgba(255, 255, 255, 0.9);
} }
.ui.primary.message, .ui.primary.message,
.ui.attached.primary.message { .ui.attached.primary.message {
-webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); -webkit-box-shadow: 0 0 0 1px #2185D0 inset, 0 0 0 0 rgba(0, 0, 0, 0);
box-shadow: 0 0 0 1px #6435C9 inset, 0 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 1px #2185D0 inset, 0 0 0 0 rgba(0, 0, 0, 0);
} }
.ui.floating.primary.message { .ui.floating.primary.message {
-webkit-box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 0 0 1px #2185D0 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 0 0 1px #6435C9 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 0 0 1px #2185D0 inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
} }
.ui.primary.message .header { .ui.primary.message .header {
color: rgba(242, 242, 242, 0.9); color: rgba(242, 242, 242, 0.9);
@ -656,25 +656,25 @@
font-size: 1em; font-size: 1em;
} }
.ui.mini.message { .ui.mini.message {
font-size: 0.75em; font-size: 0.78571429em;
} }
.ui.tiny.message { .ui.tiny.message {
font-size: 0.83333333em; font-size: 0.85714286em;
} }
.ui.small.message { .ui.small.message {
font-size: 0.91666667em; font-size: 0.92857143em;
} }
.ui.large.message { .ui.large.message {
font-size: 1.16666667em; font-size: 1.14285714em;
} }
.ui.big.message { .ui.big.message {
font-size: 1.25em; font-size: 1.28571429em;
} }
.ui.huge.message { .ui.huge.message {
font-size: 1.41666667em; font-size: 1.42857143em;
} }
.ui.massive.message { .ui.massive.message {
font-size: 1.75em; font-size: 1.71428571em;
} }

2
semantic/dist/components/message.min.css vendored
View file

File diff suppressed because one or more lines are too long

45
semantic/dist/components/modal.css vendored
View file

@ -27,7 +27,7 @@
-webkit-box-flex: 0; -webkit-box-flex: 0;
-ms-flex: 0 0 auto; -ms-flex: 0 0 auto;
flex: 0 0 auto; flex: 0 0 auto;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-user-select: text; -webkit-user-select: text;
-moz-user-select: text; -moz-user-select: text;
-ms-user-select: text; -ms-user-select: text;
@ -38,12 +38,12 @@
.ui.modal > i.icon:first-child + *, .ui.modal > i.icon:first-child + *,
.ui.modal > .dimmer:first-child + *:not(.close), .ui.modal > .dimmer:first-child + *:not(.close),
.ui.modal > .dimmer:first-child + i.icon + * { .ui.modal > .dimmer:first-child + i.icon + * {
border-top-left-radius: 0.33333333rem; border-top-left-radius: 0.28571429rem;
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
} }
.ui.modal > :last-child { .ui.modal > :last-child {
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
border-bottom-right-radius: 0.33333333rem; border-bottom-right-radius: 0.28571429rem;
} }
.ui.modal > .ui.dimmer { .ui.modal > .ui.dimmer {
border-radius: inherit; border-radius: inherit;
@ -72,8 +72,10 @@
height: 2.25rem; height: 2.25rem;
padding: 0.625rem 0 0 0; padding: 0.625rem 0 0 0;
} }
.ui.modal > .close:focus,
.ui.modal > .close:hover { .ui.modal > .close:hover {
opacity: 1; opacity: 1;
outline: none;
} }
/*-------------- /*--------------
@ -92,7 +94,7 @@
border-bottom: 1px solid rgba(34, 36, 38, 0.15); border-bottom: 1px solid rgba(34, 36, 38, 0.15);
} }
.ui.modal > .header:not(.ui) { .ui.modal > .header:not(.ui) {
font-size: 1.41666667rem; font-size: 1.42857143rem;
line-height: 1.28571429em; line-height: 1.28571429em;
font-weight: bold; font-weight: bold;
} }
@ -155,9 +157,9 @@
} }
.ui.modal > .content > i.icon + .description, .ui.modal > .content > i.icon + .description,
.ui.modal > .content > .image + .description { .ui.modal > .content > .image + .description {
-webkit-box-flex: 1; -webkit-box-flex: 0;
-ms-flex: 1 1 auto; -ms-flex: 0 1 auto;
flex: 1 1 auto; flex: 0 1 auto;
min-width: ''; min-width: '';
width: auto; width: auto;
padding-left: 2em; padding-left: 2em;
@ -179,14 +181,22 @@
background: #F9FAFB; background: #F9FAFB;
padding: 1rem 1rem; padding: 1rem 1rem;
border-top: 1px solid rgba(34, 36, 38, 0.15); border-top: 1px solid rgba(34, 36, 38, 0.15);
text-align: left; text-align: right;
} }
.ui.modal .actions > .button:not(.fluid) { .ui.modal .actions > .button:not(.fluid) {
margin-left: 0.75em; margin-left: 0.75em;
} }
.ui.modal > .basic.actions,
.ui.basic.modal > .actions { .ui.basic.modal > .actions {
border-top: none; border-top: none;
} }
.ui.modal > .left.actions {
text-align: left;
}
.ui.modal > .left.actions > .button:not(.fluid) {
margin-left: 0.5em;
margin-right: 0.5em;
}
.ui.modal > .centered, .ui.modal > .centered,
.ui.modal > .center.aligned { .ui.modal > .center.aligned {
text-align: center; text-align: center;
@ -220,6 +230,16 @@
width: 850px; width: 850px;
margin: 0 0 0 0; margin: 0 0 0 0;
} }
.ui.modal:not(.fullscreen) > .active.dimmer + .close:not(.inside) {
pointer-events: none;
opacity: 0.1;
}
.ui.dimmer > .ui.modal:not(.fullscreen) > .close:not(.inside) {
text-shadow: -1px -1px 2px rgba(0, 0, 0, 0.3), 1px -1px 2px rgba(0, 0, 0, 0.3), -1px 2px 2px rgba(0, 0, 0, 0.3), 1px 2px 2px rgba(0, 0, 0, 0.3);
}
.ui.inverted.dimmer > .ui.modal:not(.fullscreen) > .close:not(.inside) {
text-shadow: -1px -1px 2px rgba(255, 255, 255, 0.3), 1px -1px 2px rgba(255, 255, 255, 0.3), -1px 2px 2px rgba(255, 255, 255, 0.3), 1px 2px 2px rgba(255, 255, 255, 0.3);
}
} }
@media only screen and (min-width: 1200px) { @media only screen and (min-width: 1200px) {
.ui.modal:not(.fullscreen) { .ui.modal:not(.fullscreen) {
@ -328,11 +348,16 @@
box-shadow: none !important; box-shadow: none !important;
color: #FFFFFF; color: #FFFFFF;
} }
.ui.modal > .basic.header,
.ui.modal > .basic.actions,
.ui.basic.modal > .header, .ui.basic.modal > .header,
.ui.basic.modal > .content, .ui.basic.modal > .content,
.ui.basic.modal > .actions { .ui.basic.modal > .actions {
background-color: transparent; background-color: transparent;
} }
.ui.modal > .basic.header {
border-bottom: none;
}
.ui.basic.modal > .header { .ui.basic.modal > .header {
color: #FFFFFF; color: #FFFFFF;
border-bottom: none; border-bottom: none;

164
semantic/dist/components/modal.js vendored
View file

@ -65,8 +65,9 @@ $.fn.modal = function(parameters) {
moduleNamespace = 'module-' + namespace, moduleNamespace = 'module-' + namespace,
$module = $(this), $module = $(this),
$context = $(settings.context), $context = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context),
$close = $module.find(selector.close), $closeIcon = $module.find(selector.closeIcon),
$inputs,
$allModals, $allModals,
$otherModals, $otherModals,
@ -92,6 +93,7 @@ $.fn.modal = function(parameters) {
module = { module = {
initialize: function() { initialize: function() {
module.create.id();
if(!$module.hasClass('modal')) { if(!$module.hasClass('modal')) {
module.create.modal(); module.create.modal();
if(!$.isFunction(settings.onHidden)) { if(!$.isFunction(settings.onHidden)) {
@ -116,15 +118,17 @@ $.fn.modal = function(parameters) {
$actions.empty(); $actions.empty();
} }
settings.actions.forEach(function (el) { settings.actions.forEach(function (el) {
var icon = el[fields.icon] ? '<i class="' + module.helpers.deQuote(el[fields.icon]) + ' icon"></i>' : '', var icon = el[fields.icon] ? '<i '+(el[fields.text] ? 'aria-hidden="true"' : '')+' class="' + module.helpers.deQuote(el[fields.icon]) + ' icon"></i>' : '',
text = module.helpers.escape(el[fields.text] || '', settings.preserveHTML), text = module.helpers.escape(el[fields.text] || '', settings.preserveHTML),
cls = module.helpers.deQuote(el[fields.class] || ''), cls = module.helpers.deQuote(el[fields.class] || ''),
click = el[fields.click] && $.isFunction(el[fields.click]) ? el[fields.click] : function () {}; click = el[fields.click] && $.isFunction(el[fields.click]) ? el[fields.click] : function () {};
$actions.append($('<button/>', { $actions.append($('<button/>', {
html: icon + text, html: icon + text,
'aria-label': (el[fields.text] || el[fields.icon] || '').replace(/<[^>]+(>|$)/g,''),
class: className.button + ' ' + cls, class: className.button + ' ' + cls,
click: function () { click: function () {
if (click.call(element, $module) === false) { var button = $(this);
if (button.is(selector.approve) || button.is(selector.deny) || click.call(element, $module) === false) {
return; return;
} }
module.hide(); module.hide();
@ -135,7 +139,6 @@ $.fn.modal = function(parameters) {
module.cache = {}; module.cache = {};
module.verbose('Initializing dimmer', $context); module.verbose('Initializing dimmer', $context);
module.create.id();
module.create.dimmer(); module.create.dimmer();
if ( settings.allowMultiple ) { if ( settings.allowMultiple ) {
@ -145,11 +148,9 @@ $.fn.modal = function(parameters) {
$module.addClass('top aligned'); $module.addClass('top aligned');
} }
module.refreshModals(); module.refreshModals();
module.refreshInputs();
module.bind.events(); module.bind.events();
if(settings.observeChanges) {
module.observeChanges(); module.observeChanges();
}
module.instantiate(); module.instantiate();
if(settings.autoShow){ if(settings.autoShow){
module.show(); module.show();
@ -166,16 +167,20 @@ $.fn.modal = function(parameters) {
create: { create: {
modal: function() { modal: function() {
$module = $('<div/>', {class: className.modal}); $module = $('<div/>', {class: className.modal, role: 'dialog', 'aria-modal': true});
if (settings.closeIcon) { if (settings.closeIcon) {
$close = $('<i/>', {class: className.close}) $closeIcon = $('<i/>', {class: className.close, role: 'button', tabindex: 0, 'aria-label': settings.text.close})
$module.append($close); $module.append($closeIcon);
} }
if (settings.title !== '') { if (settings.title !== '') {
$('<div/>', {class: className.title}).appendTo($module); var titleId = '_' + module.get.id() + 'title';
$module.attr('aria-labelledby', titleId);
$('<div/>', {class: className.title, id: titleId}).appendTo($module);
} }
if (settings.content !== '') { if (settings.content !== '') {
$('<div/>', {class: className.content}).appendTo($module); var descId = '_' + module.get.id() + 'desc';
$module.attr('aria-describedby', descId);
$('<div/>', {class: className.content, id: descId}).appendTo($module);
} }
if (module.has.configActions()) { if (module.has.configActions()) {
$('<div/>', {class: className.actions}).appendTo($module); $('<div/>', {class: className.actions}).appendTo($module);
@ -206,13 +211,13 @@ $.fn.modal = function(parameters) {
$dimmer = $dimmable.dimmer('get dimmer'); $dimmer = $dimmable.dimmer('get dimmer');
}, },
id: function() { id: function() {
id = (Math.random().toString(16) + '000000000').substr(2, 8); id = (Math.random().toString(16) + '000000000').slice(2, 10);
elementEventNamespace = '.' + id; elementEventNamespace = '.' + id;
module.verbose('Creating unique id for element', id); module.verbose('Creating unique id for element', id);
}, },
innerDimmer: function() { innerDimmer: function() {
if ( $module.find(selector.dimmer).length == 0 ) { if ( $module.find(selector.dimmer).length === 0 ) {
$module.prepend('<div class="ui inverted dimmer"></div>'); $('<div/>', {class: className.innerDimmer}).prependTo($module);
} }
} }
}, },
@ -228,15 +233,21 @@ $.fn.modal = function(parameters) {
; ;
$window.off(elementEventNamespace); $window.off(elementEventNamespace);
$dimmer.off(elementEventNamespace); $dimmer.off(elementEventNamespace);
$close.off(eventNamespace); $closeIcon.off(elementEventNamespace);
if($inputs) {
$inputs.off(elementEventNamespace);
}
$context.dimmer('destroy'); $context.dimmer('destroy');
}, },
observeChanges: function() { observeChanges: function() {
if('MutationObserver' in window) { if('MutationObserver' in window) {
observer = new MutationObserver(function(mutations) { observer = new MutationObserver(function(mutations) {
if(settings.observeChanges) {
module.debug('DOM tree modified, refreshing'); module.debug('DOM tree modified, refreshing');
module.refresh(); module.refresh();
}
module.refreshInputs();
}); });
observer.observe(element, { observer.observe(element, {
childList : true, childList : true,
@ -261,6 +272,23 @@ $.fn.modal = function(parameters) {
$allModals = $otherModals.add($module); $allModals = $otherModals.add($module);
}, },
refreshInputs: function(){
if($inputs){
$inputs
.off('keydown' + elementEventNamespace)
;
}
$inputs = $module.find('[tabindex], :input').filter(':visible').filter(function() {
return $(this).closest('.disabled').length === 0;
});
$inputs.first()
.on('keydown' + elementEventNamespace, module.event.inputKeyDown.first)
;
$inputs.last()
.on('keydown' + elementEventNamespace, module.event.inputKeyDown.last)
;
},
attachEvents: function(selector, event) { attachEvents: function(selector, event) {
var var
$toggle = $(selector) $toggle = $(selector)
@ -289,6 +317,9 @@ $.fn.modal = function(parameters) {
.on('click' + eventNamespace, selector.approve, module.event.approve) .on('click' + eventNamespace, selector.approve, module.event.approve)
.on('click' + eventNamespace, selector.deny, module.event.deny) .on('click' + eventNamespace, selector.deny, module.event.deny)
; ;
$closeIcon
.on('keyup' + elementEventNamespace, module.event.closeKeyUp)
;
$window $window
.on('resize' + elementEventNamespace, module.event.resize) .on('resize' + elementEventNamespace, module.event.resize)
; ;
@ -307,7 +338,7 @@ $.fn.modal = function(parameters) {
get: { get: {
id: function() { id: function() {
return (Math.random().toString(16) + '000000000').substr(2, 8); return id;
}, },
element: function() { element: function() {
return $module; return $module;
@ -346,10 +377,38 @@ $.fn.modal = function(parameters) {
close: function() { close: function() {
module.hide(); module.hide();
}, },
closeKeyUp: function(event){
var
keyCode = event.which
;
if ((keyCode === settings.keys.enter || keyCode === settings.keys.space) && $module.hasClass(className.front)) {
module.hide();
}
},
inputKeyDown: {
first: function(event) {
var
keyCode = event.which
;
if (keyCode === settings.keys.tab && event.shiftKey) {
$inputs.last().focus();
event.preventDefault();
}
},
last: function(event) {
var
keyCode = event.which
;
if (keyCode === settings.keys.tab && !event.shiftKey) {
$inputs.first().focus();
event.preventDefault();
}
}
},
mousedown: function(event) { mousedown: function(event) {
var var
$target = $(event.target), $target = $(event.target),
isRtl = module.is.rtl(); isRtl = module.is.rtl()
; ;
initialMouseDownInModal = ($target.closest(selector.modal).length > 0); initialMouseDownInModal = ($target.closest(selector.modal).length > 0);
if(initialMouseDownInModal) { if(initialMouseDownInModal) {
@ -397,10 +456,9 @@ $.fn.modal = function(parameters) {
}, },
keyboard: function(event) { keyboard: function(event) {
var var
keyCode = event.which, keyCode = event.which
escapeKey = 27
; ;
if(keyCode == escapeKey) { if(keyCode === settings.keys.escape) {
if(settings.closable) { if(settings.closable) {
module.debug('Escape key pressed hiding modal'); module.debug('Escape key pressed hiding modal');
if ( $module.hasClass(className.front) ) { if ( $module.hasClass(className.front) ) {
@ -456,6 +514,10 @@ $.fn.modal = function(parameters) {
: function(){} : function(){}
; ;
if( module.is.animating() || !module.is.active() ) { if( module.is.animating() || !module.is.active() ) {
if(settings.onShow.call(element) === false) {
module.verbose('Show callback returned false cancelling show');
return;
}
module.showDimmer(); module.showDimmer();
module.cacheSizes(); module.cacheSizes();
module.set.bodyMargin(); module.set.bodyMargin();
@ -485,7 +547,6 @@ $.fn.modal = function(parameters) {
$module.detach().appendTo($dimmer); $module.detach().appendTo($dimmer);
} }
} }
settings.onShow.call(element);
if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) { if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) {
module.debug('Showing modal with css animations'); module.debug('Showing modal with css animations');
$module $module
@ -528,7 +589,6 @@ $.fn.modal = function(parameters) {
? callback ? callback
: function(){} : function(){}
; ;
module.debug('Hiding modal');
if(settings.onHide.call(element, $(this)) === false) { if(settings.onHide.call(element, $(this)) === false) {
module.verbose('Hide callback returned false cancelling hide'); module.verbose('Hide callback returned false cancelling hide');
ignoreRepeatedEvents = false; ignoreRepeatedEvents = false;
@ -536,6 +596,7 @@ $.fn.modal = function(parameters) {
} }
if( module.is.animating() || module.is.active() ) { if( module.is.animating() || module.is.active() ) {
module.debug('Hiding modal');
if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) { if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) {
module.remove.active(); module.remove.active();
$module $module
@ -900,13 +961,10 @@ $.fn.modal = function(parameters) {
set: { set: {
autofocus: function() { autofocus: function() {
var var
$inputs = $module.find('[tabindex], :input').filter(':visible').filter(function() {
return $(this).closest('.disabled').length === 0;
}),
$autofocus = $inputs.filter('[autofocus]'), $autofocus = $inputs.filter('[autofocus]'),
$input = ($autofocus.length > 0) $input = ($autofocus.length > 0)
? $autofocus.first() ? $autofocus.first()
: $inputs.first() : ($inputs.length > 1 ? $inputs.filter(':not(i.close)') : $inputs).first()
; ;
if($input.length > 0) { if($input.length > 0) {
$input.focus(); $input.focus();
@ -1323,11 +1381,19 @@ $.fn.modal.settings = {
// called after deny selector match // called after deny selector match
onDeny : function(){ return true; }, onDeny : function(){ return true; },
keys : {
space : 32,
enter : 13,
escape : 27,
tab : 9,
},
selector : { selector : {
title : '> .header', title : '> .header',
content : '> .content', content : '> .content',
actions : '> .actions', actions : '> .actions',
close : '> .close', close : '> .close',
closeIcon: '> .close',
approve : '.actions .positive, .actions .approve, .actions .ok', approve : '.actions .positive, .actions .approve, .actions .ok',
deny : '.actions .negative, .actions .deny, .actions .cancel', deny : '.actions .negative, .actions .deny, .actions .cancel',
modal : '.ui.modal', modal : '.ui.modal',
@ -1359,11 +1425,13 @@ $.fn.modal.settings = {
template : 'ui tiny modal', template : 'ui tiny modal',
ok : 'positive', ok : 'positive',
cancel : 'negative', cancel : 'negative',
prompt : 'ui fluid input' prompt : 'ui fluid input',
innerDimmer: 'ui inverted dimmer'
}, },
text: { text: {
ok : 'Ok', ok : 'Ok',
cancel: 'Cancel' cancel: 'Cancel',
close : 'Close'
} }
}; };
@ -1389,33 +1457,39 @@ $.fn.modal.settings.templates = {
}, },
alert: function () { alert: function () {
var settings = this.get.settings(), var settings = this.get.settings(),
args = settings.templates.getArguments(arguments) args = settings.templates.getArguments(arguments),
approveFn = args.handler
; ;
return { return {
title : args.title, title : args.title,
content: args.content, content: args.content,
onApprove: approveFn,
actions: [{ actions: [{
text : settings.text.ok, text : settings.text.ok,
class: settings.className.ok, class: settings.className.ok,
click: args.handler click: approveFn
}] }]
} }
}, },
confirm: function () { confirm: function () {
var settings = this.get.settings(), var settings = this.get.settings(),
args = settings.templates.getArguments(arguments) args = settings.templates.getArguments(arguments),
approveFn = function(){args.handler(true)},
denyFn = function(){args.handler(false)}
; ;
return { return {
title : args.title, title : args.title,
content: args.content, content: args.content,
onApprove: approveFn,
onDeny: denyFn,
actions: [{ actions: [{
text : settings.text.ok, text : settings.text.ok,
class: settings.className.ok, class: settings.className.ok,
click: function(){args.handler(true)} click: approveFn
},{ },{
text: settings.text.cancel, text: settings.text.cancel,
class: settings.className.cancel, class: settings.className.cancel,
click: function(){args.handler(false)} click: denyFn
}] }]
} }
}, },
@ -1423,7 +1497,14 @@ $.fn.modal.settings.templates = {
var $this = this, var $this = this,
settings = this.get.settings(), settings = this.get.settings(),
args = settings.templates.getArguments(arguments), args = settings.templates.getArguments(arguments),
input = $($.parseHTML(args.content)).filter('.ui.input') input = $($.parseHTML(args.content)).filter('.ui.input'),
approveFn = function(){
var settings = $this.get.settings(),
inputField = $this.get.element().find(settings.selector.prompt)[0]
;
args.handler($(inputField).val());
},
denyFn = function(){args.handler(null)}
; ;
if (input.length === 0) { if (input.length === 0) {
args.content += '<p><div class="'+settings.className.prompt+'"><input placeholder="'+this.helpers.deQuote(args.placeholder || '')+'" type="text" value="'+this.helpers.deQuote(args.defaultValue || '')+'"></div></p>'; args.content += '<p><div class="'+settings.className.prompt+'"><input placeholder="'+this.helpers.deQuote(args.placeholder || '')+'" type="text" value="'+this.helpers.deQuote(args.defaultValue || '')+'"></div></p>';
@ -1431,19 +1512,16 @@ $.fn.modal.settings.templates = {
return { return {
title : args.title, title : args.title,
content: args.content, content: args.content,
onApprove: approveFn,
onDeny: denyFn,
actions: [{ actions: [{
text: settings.text.ok, text: settings.text.ok,
class: settings.className.ok, class: settings.className.ok,
click: function(){ click: approveFn
var settings = $this.get.settings(),
inputField = $this.get.element().find(settings.selector.prompt)[0]
;
args.handler($(inputField).val());
}
},{ },{
text: settings.text.cancel, text: settings.text.cancel,
class: settings.className.cancel, class: settings.className.cancel,
click: function(){args.handler(null)} click: denyFn
}] }]
} }
} }

2
semantic/dist/components/modal.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/modal.min.js vendored
View file

File diff suppressed because one or more lines are too long

84
semantic/dist/components/placeholder.css vendored
View file

@ -62,10 +62,10 @@
animation-delay: 0.6s; animation-delay: 0.6s;
} }
.ui.placeholder, .ui.placeholder,
.ui.placeholder > :before, .ui.placeholder > ::before,
.ui.placeholder .image.header:after, .ui.placeholder .image.header::after,
.ui.placeholder .line, .ui.placeholder .line,
.ui.placeholder .line:after { .ui.placeholder .line::after {
background-color: #FFFFFF; background-color: #FFFFFF;
} }
.ui.placeholder.hidden { .ui.placeholder.hidden {
@ -94,48 +94,48 @@
/* Lines */ /* Lines */
.ui.placeholder .line { .ui.placeholder .line {
position: relative; position: relative;
height: 1em; height: 0.85714286em;
} }
.ui.placeholder .line:before, .ui.placeholder .line::before,
.ui.placeholder .line:after { .ui.placeholder .line::after {
top: 100%; top: 100%;
position: absolute; position: absolute;
content: ''; content: '';
background-color: inherit; background-color: inherit;
} }
.ui.placeholder .line:before { .ui.placeholder .line::before {
left: 0; left: 0;
} }
.ui.placeholder .line:after { .ui.placeholder .line::after {
right: 0; right: 0;
} }
/* Any Lines */ /* Any Lines */
.ui.placeholder .line { .ui.placeholder .line {
margin-bottom: 0.58333333em; margin-bottom: 0.5em;
} }
.ui.placeholder .line:before, .ui.placeholder .line::before,
.ui.placeholder .line:after { .ui.placeholder .line::after {
height: 0.58333333em; height: 0.5em;
} }
.ui.placeholder .line:not(:first-child) { .ui.placeholder .line:not(:first-child) {
margin-top: 0.58333333em; margin-top: 0.5em;
} }
/* Line Outdent */ /* Line Outdent */
.ui.placeholder .line:nth-child(1):after { .ui.placeholder .line:nth-child(1)::after {
width: 0; width: 0;
} }
.ui.placeholder .line:nth-child(2):after { .ui.placeholder .line:nth-child(2)::after {
width: 50%; width: 50%;
} }
.ui.placeholder .line:nth-child(3):after { .ui.placeholder .line:nth-child(3)::after {
width: 10%; width: 10%;
} }
.ui.placeholder .line:nth-child(4):after { .ui.placeholder .line:nth-child(4)::after {
width: 35%; width: 35%;
} }
.ui.placeholder .line:nth-child(5):after { .ui.placeholder .line:nth-child(5)::after {
width: 65%; width: 65%;
} }
@ -147,31 +147,31 @@
/* Header Line 1 & 2*/ /* Header Line 1 & 2*/
.ui.placeholder .header .line { .ui.placeholder .header .line {
margin-bottom: 0.75em; margin-bottom: 0.64285714em;
} }
.ui.placeholder .header .line:before, .ui.placeholder .header .line::before,
.ui.placeholder .header .line:after { .ui.placeholder .header .line::after {
height: 0.75em; height: 0.64285714em;
} }
.ui.placeholder .header .line:not(:first-child) { .ui.placeholder .header .line:not(:first-child) {
margin-top: 0.75em; margin-top: 0.64285714em;
} }
.ui.placeholder .header .line:after { .ui.placeholder .header .line::after {
width: 20%; width: 20%;
} }
.ui.placeholder .header .line:nth-child(2):after { .ui.placeholder .header .line:nth-child(2)::after {
width: 60%; width: 60%;
} }
/* Image Header */ /* Image Header */
.ui.placeholder .image.header .line { .ui.placeholder .image.header .line {
margin-left: 3em; margin-left: 3em;
} }
.ui.placeholder .image.header .line:before { .ui.placeholder .image.header .line::before {
width: 0.83333333rem; width: 0.71428571rem;
} }
.ui.placeholder .image.header:after { .ui.placeholder .image.header::after {
display: block; display: block;
height: 1em; height: 0.85714286em;
content: ''; content: '';
margin-left: 3em; margin-left: 3em;
} }
@ -182,10 +182,10 @@
.ui.placeholder .header .line:first-child { .ui.placeholder .header .line:first-child {
height: 0.01px; height: 0.01px;
} }
.ui.placeholder .image:not(:first-child):before, .ui.placeholder .image:not(:first-child)::before,
.ui.placeholder .paragraph:not(:first-child):before, .ui.placeholder .paragraph:not(:first-child)::before,
.ui.placeholder .header:not(:first-child):before { .ui.placeholder .header:not(:first-child)::before {
height: 1.66666667em; height: 1.42857143em;
content: ''; content: '';
display: block; display: block;
} }
@ -197,10 +197,10 @@
background-image: linear-gradient(to right, rgba(255, 255, 255, 0.08) 0, rgba(255, 255, 255, 0.14) 15%, rgba(255, 255, 255, 0.08) 30%); background-image: linear-gradient(to right, rgba(255, 255, 255, 0.08) 0, rgba(255, 255, 255, 0.14) 15%, rgba(255, 255, 255, 0.08) 30%);
} }
.ui.inverted.placeholder, .ui.inverted.placeholder,
.ui.inverted.placeholder > :before, .ui.inverted.placeholder > ::before,
.ui.inverted.placeholder .image.header:after, .ui.inverted.placeholder .image.header::after,
.ui.inverted.placeholder .line, .ui.inverted.placeholder .line,
.ui.inverted.placeholder .line:after { .ui.inverted.placeholder .line::after {
background-color: #1B1C1D; background-color: #1B1C1D;
} }
@ -214,22 +214,22 @@
Sizes Sizes
--------------------*/ --------------------*/
.ui.placeholder .full.line.line.line:after { .ui.placeholder .full.line.line.line::after {
width: 0; width: 0;
} }
.ui.placeholder .very.long.line.line.line:after { .ui.placeholder .very.long.line.line.line::after {
width: 10%; width: 10%;
} }
.ui.placeholder .long.line.line.line:after { .ui.placeholder .long.line.line.line::after {
width: 35%; width: 35%;
} }
.ui.placeholder .medium.line.line.line:after { .ui.placeholder .medium.line.line.line::after {
width: 50%; width: 50%;
} }
.ui.placeholder .short.line.line.line:after { .ui.placeholder .short.line.line.line::after {
width: 65%; width: 65%;
} }
.ui.placeholder .very.short.line.line.line:after { .ui.placeholder .very.short.line.line.line::after {
width: 80%; width: 80%;
} }

2
semantic/dist/components/placeholder.min.css vendored
View file

@ -6,4 +6,4 @@
* Released under the MIT license * Released under the MIT license
* http://opensource.org/licenses/MIT * http://opensource.org/licenses/MIT
* *
*/.ui.placeholder{position:static;overflow:hidden;-webkit-animation:placeholderShimmer 2s linear;animation:placeholderShimmer 2s linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;background-color:#fff;background-image:-webkit-gradient(linear,left top,right top,color-stop(0,rgba(0,0,0,.08)),color-stop(15%,rgba(0,0,0,.15)),color-stop(30%,rgba(0,0,0,.08)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.08) 0,rgba(0,0,0,.15) 15%,rgba(0,0,0,.08) 30%);background-image:linear-gradient(to right,rgba(0,0,0,.08) 0,rgba(0,0,0,.15) 15%,rgba(0,0,0,.08) 30%);background-size:1200px 100%;max-width:30rem}@-webkit-keyframes placeholderShimmer{0%{background-position:-1200px 0}100%{background-position:1200px 0}}@keyframes placeholderShimmer{0%{background-position:-1200px 0}100%{background-position:1200px 0}}.ui.placeholder+.ui.placeholder{margin-top:2rem}.ui.placeholder+.ui.placeholder{-webkit-animation-delay:.15s;animation-delay:.15s}.ui.placeholder+.ui.placeholder+.ui.placeholder{-webkit-animation-delay:.3s;animation-delay:.3s}.ui.placeholder+.ui.placeholder+.ui.placeholder+.ui.placeholder{-webkit-animation-delay:.45s;animation-delay:.45s}.ui.placeholder+.ui.placeholder+.ui.placeholder+.ui.placeholder+.ui.placeholder{-webkit-animation-delay:.6s;animation-delay:.6s}.ui.placeholder,.ui.placeholder .image.header:after,.ui.placeholder .line,.ui.placeholder .line:after,.ui.placeholder>:before{background-color:#fff}.ui.placeholder.hidden{display:none}.ui.placeholder .image:not(.header):not(.ui):not(.icon){height:100px}.ui.placeholder .square.image:not(.header){height:0;overflow:hidden;padding-top:100%}.ui.placeholder .rectangular.image:not(.header){height:0;overflow:hidden;padding-top:75%}.ui.placeholder .line{position:relative;height:1em}.ui.placeholder .line:after,.ui.placeholder .line:before{top:100%;position:absolute;content:'';background-color:inherit}.ui.placeholder .line:before{left:0}.ui.placeholder .line:after{right:0}.ui.placeholder .line{margin-bottom:.58333333em}.ui.placeholder .line:after,.ui.placeholder .line:before{height:.58333333em}.ui.placeholder .line:not(:first-child){margin-top:.58333333em}.ui.placeholder .line:nth-child(1):after{width:0}.ui.placeholder .line:nth-child(2):after{width:50%}.ui.placeholder .line:nth-child(3):after{width:10%}.ui.placeholder .line:nth-child(4):after{width:35%}.ui.placeholder .line:nth-child(5):after{width:65%}.ui.placeholder .header{position:relative;overflow:hidden}.ui.placeholder .header .line{margin-bottom:.75em}.ui.placeholder .header .line:after,.ui.placeholder .header .line:before{height:.75em}.ui.placeholder .header .line:not(:first-child){margin-top:.75em}.ui.placeholder .header .line:after{width:20%}.ui.placeholder .header .line:nth-child(2):after{width:60%}.ui.placeholder .image.header .line{margin-left:3em}.ui.placeholder .image.header .line:before{width:.83333333rem}.ui.placeholder .image.header:after{display:block;height:1em;content:'';margin-left:3em}.ui.placeholder .header .line:first-child,.ui.placeholder .image .line:first-child,.ui.placeholder .paragraph .line:first-child{height:.01px}.ui.placeholder .header:not(:first-child):before,.ui.placeholder .image:not(:first-child):before,.ui.placeholder .paragraph:not(:first-child):before{height:1.66666667em;content:'';display:block}.ui.inverted.placeholder{background-image:-webkit-gradient(linear,left top,right top,color-stop(0,rgba(255,255,255,.08)),color-stop(15%,rgba(255,255,255,.14)),color-stop(30%,rgba(255,255,255,.08)));background-image:-webkit-linear-gradient(left,rgba(255,255,255,.08) 0,rgba(255,255,255,.14) 15%,rgba(255,255,255,.08) 30%);background-image:linear-gradient(to right,rgba(255,255,255,.08) 0,rgba(255,255,255,.14) 15%,rgba(255,255,255,.08) 30%)}.ui.inverted.placeholder,.ui.inverted.placeholder .image.header:after,.ui.inverted.placeholder .line,.ui.inverted.placeholder .line:after,.ui.inverted.placeholder>:before{background-color:#1b1c1d}.ui.placeholder .full.line.line.line:after{width:0}.ui.placeholder .very.long.line.line.line:after{width:10%}.ui.placeholder .long.line.line.line:after{width:35%}.ui.placeholder .medium.line.line.line:after{width:50%}.ui.placeholder .short.line.line.line:after{width:65%}.ui.placeholder .very.short.line.line.line:after{width:80%}.ui.fluid.placeholder{max-width:none} */.ui.placeholder{position:static;overflow:hidden;-webkit-animation:placeholderShimmer 2s linear;animation:placeholderShimmer 2s linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;background-color:#fff;background-image:-webkit-gradient(linear,left top,right top,color-stop(0,rgba(0,0,0,.08)),color-stop(15%,rgba(0,0,0,.15)),color-stop(30%,rgba(0,0,0,.08)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.08) 0,rgba(0,0,0,.15) 15%,rgba(0,0,0,.08) 30%);background-image:linear-gradient(to right,rgba(0,0,0,.08) 0,rgba(0,0,0,.15) 15%,rgba(0,0,0,.08) 30%);background-size:1200px 100%;max-width:30rem}@-webkit-keyframes placeholderShimmer{0%{background-position:-1200px 0}100%{background-position:1200px 0}}@keyframes placeholderShimmer{0%{background-position:-1200px 0}100%{background-position:1200px 0}}.ui.placeholder+.ui.placeholder{margin-top:2rem}.ui.placeholder+.ui.placeholder{-webkit-animation-delay:.15s;animation-delay:.15s}.ui.placeholder+.ui.placeholder+.ui.placeholder{-webkit-animation-delay:.3s;animation-delay:.3s}.ui.placeholder+.ui.placeholder+.ui.placeholder+.ui.placeholder{-webkit-animation-delay:.45s;animation-delay:.45s}.ui.placeholder+.ui.placeholder+.ui.placeholder+.ui.placeholder+.ui.placeholder{-webkit-animation-delay:.6s;animation-delay:.6s}.ui.placeholder,.ui.placeholder .image.header::after,.ui.placeholder .line,.ui.placeholder .line::after,.ui.placeholder>::before{background-color:#fff}.ui.placeholder.hidden{display:none}.ui.placeholder .image:not(.header):not(.ui):not(.icon){height:100px}.ui.placeholder .square.image:not(.header){height:0;overflow:hidden;padding-top:100%}.ui.placeholder .rectangular.image:not(.header){height:0;overflow:hidden;padding-top:75%}.ui.placeholder .line{position:relative;height:.85714286em}.ui.placeholder .line::after,.ui.placeholder .line::before{top:100%;position:absolute;content:'';background-color:inherit}.ui.placeholder .line::before{left:0}.ui.placeholder .line::after{right:0}.ui.placeholder .line{margin-bottom:.5em}.ui.placeholder .line::after,.ui.placeholder .line::before{height:.5em}.ui.placeholder .line:not(:first-child){margin-top:.5em}.ui.placeholder .line:nth-child(1)::after{width:0}.ui.placeholder .line:nth-child(2)::after{width:50%}.ui.placeholder .line:nth-child(3)::after{width:10%}.ui.placeholder .line:nth-child(4)::after{width:35%}.ui.placeholder .line:nth-child(5)::after{width:65%}.ui.placeholder .header{position:relative;overflow:hidden}.ui.placeholder .header .line{margin-bottom:.64285714em}.ui.placeholder .header .line::after,.ui.placeholder .header .line::before{height:.64285714em}.ui.placeholder .header .line:not(:first-child){margin-top:.64285714em}.ui.placeholder .header .line::after{width:20%}.ui.placeholder .header .line:nth-child(2)::after{width:60%}.ui.placeholder .image.header .line{margin-left:3em}.ui.placeholder .image.header .line::before{width:.71428571rem}.ui.placeholder .image.header::after{display:block;height:.85714286em;content:'';margin-left:3em}.ui.placeholder .header .line:first-child,.ui.placeholder .image .line:first-child,.ui.placeholder .paragraph .line:first-child{height:.01px}.ui.placeholder .header:not(:first-child)::before,.ui.placeholder .image:not(:first-child)::before,.ui.placeholder .paragraph:not(:first-child)::before{height:1.42857143em;content:'';display:block}.ui.inverted.placeholder{background-image:-webkit-gradient(linear,left top,right top,color-stop(0,rgba(255,255,255,.08)),color-stop(15%,rgba(255,255,255,.14)),color-stop(30%,rgba(255,255,255,.08)));background-image:-webkit-linear-gradient(left,rgba(255,255,255,.08) 0,rgba(255,255,255,.14) 15%,rgba(255,255,255,.08) 30%);background-image:linear-gradient(to right,rgba(255,255,255,.08) 0,rgba(255,255,255,.14) 15%,rgba(255,255,255,.08) 30%)}.ui.inverted.placeholder,.ui.inverted.placeholder .image.header::after,.ui.inverted.placeholder .line,.ui.inverted.placeholder .line::after,.ui.inverted.placeholder>::before{background-color:#1b1c1d}.ui.placeholder .full.line.line.line::after{width:0}.ui.placeholder .very.long.line.line.line::after{width:10%}.ui.placeholder .long.line.line.line::after{width:35%}.ui.placeholder .medium.line.line.line::after{width:50%}.ui.placeholder .short.line.line.line::after{width:65%}.ui.placeholder .very.short.line.line.line::after{width:80%}.ui.fluid.placeholder{max-width:none}

334
semantic/dist/components/popup.css vendored
View file

@ -32,25 +32,25 @@
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
} }
.ui.popup > .header { .ui.popup > .header {
padding: 0; padding: 0;
font-family: 'Raleway', sans-serif; font-family: 'Raleway', sans-serif;
font-size: 1.16666667em; font-size: 1.14285714em;
line-height: 1.2; line-height: 1.2;
font-weight: bold; font-weight: bold;
} }
.ui.popup > .header + .content { .ui.popup > .header + .content {
padding-top: 0.58333333em; padding-top: 0.5em;
} }
.ui.popup:before { .ui.popup::before {
position: absolute; position: absolute;
content: ''; content: '';
width: 0.83333333em; width: 0.71428571em;
height: 0.83333333em; height: 0.71428571em;
background: #FFFFFF; background: #FFFFFF;
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
@ -76,13 +76,13 @@
} }
/* Arrow */ /* Arrow */
[data-tooltip]:before { [data-tooltip]::before {
pointer-events: none; pointer-events: none;
position: absolute; position: absolute;
content: ''; content: '';
font-size: 1rem; font-size: 1rem;
width: 0.83333333em; width: 0.71428571em;
height: 0.83333333em; height: 0.71428571em;
background: #FFFFFF; background: #FFFFFF;
-webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg);
transform: rotate(45deg); transform: rotate(45deg);
@ -92,7 +92,7 @@
} }
/* Popup */ /* Popup */
[data-tooltip]:after { [data-tooltip]::after {
pointer-events: none; pointer-events: none;
content: attr(data-tooltip); content: attr(data-tooltip);
position: absolute; position: absolute;
@ -109,33 +109,33 @@
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
z-index: 1900; z-index: 1900;
} }
/* Default Position (Top Center) */ /* Default Position (Top Center) */
[data-tooltip]:not([data-position]):before { [data-tooltip]:not([data-position])::before {
top: auto; top: auto;
right: auto; right: auto;
bottom: 100%; bottom: 100%;
left: 50%; left: 50%;
background: #FFFFFF; background: #FFFFFF;
margin-left: -0.08333333rem; margin-left: -0.07142857rem;
margin-bottom: 0.16666667rem; margin-bottom: 0.14285714rem;
} }
[data-tooltip]:not([data-position]):after { [data-tooltip]:not([data-position])::after {
left: 50%; left: 50%;
-webkit-transform: translateX(-50%); -webkit-transform: translateX(-50%);
transform: translateX(-50%); transform: translateX(-50%);
bottom: 100%; bottom: 100%;
margin-bottom: 0.58333333em; margin-bottom: 0.5em;
} }
/* Animation */ /* Animation */
[data-tooltip]:before, [data-tooltip]::before,
[data-tooltip]:after { [data-tooltip]::after {
pointer-events: none; pointer-events: none;
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
@ -144,76 +144,76 @@
transition: transform 0.1s ease, opacity 0.1s ease; transition: transform 0.1s ease, opacity 0.1s ease;
transition: transform 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease; transition: transform 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease;
} }
[data-tooltip]:before { [data-tooltip]::before {
-webkit-transform: rotate(45deg) scale(0) !important; -webkit-transform: rotate(45deg) scale(0) !important;
transform: rotate(45deg) scale(0) !important; transform: rotate(45deg) scale(0) !important;
-webkit-transform-origin: center top; -webkit-transform-origin: center top;
transform-origin: center top; transform-origin: center top;
} }
[data-tooltip]:after { [data-tooltip]::after {
-webkit-transform-origin: center bottom; -webkit-transform-origin: center bottom;
transform-origin: center bottom; transform-origin: center bottom;
} }
[data-tooltip]:hover:before, [data-tooltip]:hover::before,
[data-tooltip]:hover:after { [data-tooltip]:hover::after {
visibility: visible; visibility: visible;
pointer-events: auto; pointer-events: auto;
opacity: 1; opacity: 1;
} }
[data-tooltip]:hover:before { [data-tooltip]:hover::before {
-webkit-transform: rotate(45deg) scale(1) !important; -webkit-transform: rotate(45deg) scale(1) !important;
transform: rotate(45deg) scale(1) !important; transform: rotate(45deg) scale(1) !important;
} }
/* Animation Position */ /* Animation Position */
[data-tooltip]:after, [data-tooltip]::after,
[data-tooltip][data-position="top center"]:after, [data-tooltip][data-position="top center"]::after,
[data-tooltip][data-position="bottom center"]:after { [data-tooltip][data-position="bottom center"]::after {
-webkit-transform: translateX(-50%) scale(0) !important; -webkit-transform: translateX(-50%) scale(0) !important;
transform: translateX(-50%) scale(0) !important; transform: translateX(-50%) scale(0) !important;
} }
[data-tooltip]:hover:after, [data-tooltip]:hover::after,
[data-tooltip][data-position="bottom center"]:hover:after { [data-tooltip][data-position="bottom center"]:hover::after {
-webkit-transform: translateX(-50%) scale(1) !important; -webkit-transform: translateX(-50%) scale(1) !important;
transform: translateX(-50%) scale(1) !important; transform: translateX(-50%) scale(1) !important;
} }
[data-tooltip][data-position="left center"]:after, [data-tooltip][data-position="left center"]::after,
[data-tooltip][data-position="right center"]:after { [data-tooltip][data-position="right center"]::after {
-webkit-transform: translateY(-50%) scale(0) !important; -webkit-transform: translateY(-50%) scale(0) !important;
transform: translateY(-50%) scale(0) !important; transform: translateY(-50%) scale(0) !important;
} }
[data-tooltip][data-position="left center"]:hover:after, [data-tooltip][data-position="left center"]:hover::after,
[data-tooltip][data-position="right center"]:hover:after { [data-tooltip][data-position="right center"]:hover::after {
-webkit-transform: translateY(-50%) scale(1) !important; -webkit-transform: translateY(-50%) scale(1) !important;
transform: translateY(-50%) scale(1) !important; transform: translateY(-50%) scale(1) !important;
-moz-transform: translateY(-50%) scale(1.0001) !important; -moz-transform: translateY(-50%) scale(1.0001) !important;
} }
[data-tooltip][data-position="top left"]:after, [data-tooltip][data-position="top left"]::after,
[data-tooltip][data-position="top right"]:after, [data-tooltip][data-position="top right"]::after,
[data-tooltip][data-position="bottom left"]:after, [data-tooltip][data-position="bottom left"]::after,
[data-tooltip][data-position="bottom right"]:after { [data-tooltip][data-position="bottom right"]::after {
-webkit-transform: scale(0) !important; -webkit-transform: scale(0) !important;
transform: scale(0) !important; transform: scale(0) !important;
} }
[data-tooltip][data-position="top left"]:hover:after, [data-tooltip][data-position="top left"]:hover::after,
[data-tooltip][data-position="top right"]:hover:after, [data-tooltip][data-position="top right"]:hover::after,
[data-tooltip][data-position="bottom left"]:hover:after, [data-tooltip][data-position="bottom left"]:hover::after,
[data-tooltip][data-position="bottom right"]:hover:after { [data-tooltip][data-position="bottom right"]:hover::after {
-webkit-transform: scale(1) !important; -webkit-transform: scale(1) !important;
transform: scale(1) !important; transform: scale(1) !important;
} }
[data-tooltip][data-variation~="fixed"]:after { [data-tooltip][data-variation~="fixed"]::after {
white-space: normal; white-space: normal;
width: 250px; width: 250px;
} }
[data-tooltip][data-variation*="wide fixed"]:after { [data-tooltip][data-variation*="wide fixed"]::after {
width: 350px; width: 350px;
} }
[data-tooltip][data-variation*="very wide fixed"]:after { [data-tooltip][data-variation*="very wide fixed"]::after {
width: 550px; width: 550px;
} }
@media only screen and (max-width: 767.98px) { @media only screen and (max-width: 767.98px) {
[data-tooltip][data-variation~="fixed"]:after { [data-tooltip][data-variation~="fixed"]::after {
width: 250px; width: 250px;
} }
} }
@ -224,223 +224,221 @@
/* Arrow */ /* Arrow */
[data-tooltip][data-inverted]:before { [data-tooltip][data-inverted]::before {
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
} }
/* Arrow Position */ /* Arrow Position */
[data-tooltip][data-inverted]:before { [data-tooltip][data-inverted]::before {
background: #1B1C1D; background: #1B1C1D;
} }
/* Popup */ /* Popup */
[data-tooltip][data-inverted]:after { [data-tooltip][data-inverted]::after {
background: #1B1C1D; background: #1B1C1D;
color: #FFFFFF; color: #FFFFFF;
border: none; border: none;
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
[data-tooltip][data-inverted]:after .header {
background: none;
color: #FFFFFF;
}
/*-------------- /*--------------
Position Position
---------------*/ ---------------*/
[data-position~="top"][data-tooltip]:before { [data-position~="top"][data-tooltip]::before {
background: #FFFFFF; background: #FFFFFF;
} }
/* Top Center */ /* Top Center */
[data-position="top center"][data-tooltip]:after { [data-position="top center"][data-tooltip]::after {
top: auto; top: auto;
right: auto; right: auto;
left: 50%; left: 50%;
bottom: 100%; bottom: 100%;
-webkit-transform: translateX(-50%); -webkit-transform: translateX(-50%);
transform: translateX(-50%); transform: translateX(-50%);
margin-bottom: 0.58333333em; margin-bottom: 0.5em;
} }
[data-position="top center"][data-tooltip]:before { [data-position="top center"][data-tooltip]::before {
top: auto; top: auto;
right: auto; right: auto;
bottom: 100%; bottom: 100%;
left: 50%; left: 50%;
background: #FFFFFF; background: #FFFFFF;
margin-left: -0.08333333rem; margin-left: -0.07142857rem;
margin-bottom: 0.16666667rem; margin-bottom: 0.14285714rem;
} }
/* Top Left */ /* Top Left */
[data-position="top left"][data-tooltip]:after { [data-position="top left"][data-tooltip]::after {
top: auto; top: auto;
right: auto; right: auto;
left: 0; left: 0;
bottom: 100%; bottom: 100%;
margin-bottom: 0.58333333em; margin-bottom: 0.5em;
} }
[data-position="top left"][data-tooltip]:before { [data-position="top left"][data-tooltip]::before {
top: auto; top: auto;
right: auto; right: auto;
bottom: 100%; bottom: 100%;
left: 1em; left: 1em;
margin-left: -0.08333333rem; margin-left: -0.07142857rem;
margin-bottom: 0.16666667rem; margin-bottom: 0.14285714rem;
} }
/* Top Right */ /* Top Right */
[data-position="top right"][data-tooltip]:after { [data-position="top right"][data-tooltip]::after {
top: auto; top: auto;
left: auto; left: auto;
right: 0; right: 0;
bottom: 100%; bottom: 100%;
margin-bottom: 0.58333333em; margin-bottom: 0.5em;
} }
[data-position="top right"][data-tooltip]:before { [data-position="top right"][data-tooltip]::before {
top: auto; top: auto;
left: auto; left: auto;
bottom: 100%; bottom: 100%;
right: 1em; right: 1em;
margin-left: -0.08333333rem; margin-left: -0.07142857rem;
margin-bottom: 0.16666667rem; margin-bottom: 0.14285714rem;
} }
[data-position~="bottom"][data-tooltip]:before { [data-position~="bottom"][data-tooltip]::before {
background: #FFFFFF; background: #FFFFFF;
-webkit-box-shadow: -1px -1px 0 0 #bababc; -webkit-box-shadow: -1px -1px 0 0 #bababc;
box-shadow: -1px -1px 0 0 #bababc; box-shadow: -1px -1px 0 0 #bababc;
} }
/* Bottom Center */ /* Bottom Center */
[data-position="bottom center"][data-tooltip]:after { [data-position="bottom center"][data-tooltip]::after {
bottom: auto; bottom: auto;
right: auto; right: auto;
left: 50%; left: 50%;
top: 100%; top: 100%;
-webkit-transform: translateX(-50%); -webkit-transform: translateX(-50%);
transform: translateX(-50%); transform: translateX(-50%);
margin-top: 0.58333333em; margin-top: 0.5em;
} }
[data-position="bottom center"][data-tooltip]:before { [data-position="bottom center"][data-tooltip]::before {
bottom: auto; bottom: auto;
right: auto; right: auto;
top: 100%; top: 100%;
left: 50%; left: 50%;
margin-left: -0.08333333rem; margin-left: -0.07142857rem;
margin-top: 0.36666667em; margin-top: 0.30714286em;
-webkit-transform-origin: center top;
transform-origin: center top;
} }
/* Bottom Left */ /* Bottom Left */
[data-position="bottom left"][data-tooltip]:after { [data-position="bottom left"][data-tooltip]::after {
left: 0; left: 0;
top: 100%; top: 100%;
margin-top: 0.58333333em; margin-top: 0.5em;
} }
[data-position="bottom left"][data-tooltip]:before { [data-position="bottom left"][data-tooltip]::before {
bottom: auto; bottom: auto;
right: auto; right: auto;
top: 100%; top: 100%;
left: 1em; left: 1em;
margin-left: -0.08333333rem; margin-left: -0.07142857rem;
margin-top: 0.16666667rem; margin-top: 0.14285714rem;
} }
/* Bottom Right */ /* Bottom Right */
[data-position="bottom right"][data-tooltip]:after { [data-position="bottom right"][data-tooltip]::after {
right: 0; right: 0;
top: 100%; top: 100%;
margin-top: 0.58333333em; margin-top: 0.5em;
} }
[data-position="bottom right"][data-tooltip]:before { [data-position="bottom right"][data-tooltip]::before {
bottom: auto; bottom: auto;
left: auto; left: auto;
top: 100%; top: 100%;
right: 1em; right: 1em;
margin-left: -0.16666667rem; margin-left: -0.14285714rem;
margin-top: 0.08333333rem; margin-top: 0.07142857rem;
} }
/* Left Center */ /* Left Center */
[data-position="left center"][data-tooltip]:after { [data-position="left center"][data-tooltip]::after {
right: 100%; right: 100%;
top: 50%; top: 50%;
margin-right: 0.58333333em; margin-right: 0.5em;
-webkit-transform: translateY(-50%); -webkit-transform: translateY(-50%);
transform: translateY(-50%); transform: translateY(-50%);
} }
[data-position="left center"][data-tooltip]:before { [data-position="left center"][data-tooltip]::before {
right: 100%; right: 100%;
top: 50%; top: 50%;
margin-top: -0.16666667rem; margin-top: -0.14285714rem;
margin-right: -0.08333333rem; margin-right: -0.07142857rem;
background: #FFFFFF; background: #FFFFFF;
-webkit-box-shadow: 1px -1px 0 0 #bababc; -webkit-box-shadow: 1px -1px 0 0 #bababc;
box-shadow: 1px -1px 0 0 #bababc; box-shadow: 1px -1px 0 0 #bababc;
} }
/* Right Center */ /* Right Center */
[data-position="right center"][data-tooltip]:after { [data-position="right center"][data-tooltip]::after {
left: 100%; left: 100%;
top: 50%; top: 50%;
margin-left: 0.58333333em; margin-left: 0.5em;
-webkit-transform: translateY(-50%); -webkit-transform: translateY(-50%);
transform: translateY(-50%); transform: translateY(-50%);
} }
[data-position="right center"][data-tooltip]:before { [data-position="right center"][data-tooltip]::before {
left: 100%; left: 100%;
top: 50%; top: 50%;
margin-top: -0.08333333rem; margin-top: -0.07142857rem;
margin-left: 0.16666667rem; margin-left: 0.14285714rem;
background: #FFFFFF; background: #FFFFFF;
-webkit-box-shadow: -1px 1px 0 0 #bababc; -webkit-box-shadow: -1px 1px 0 0 #bababc;
box-shadow: -1px 1px 0 0 #bababc; box-shadow: -1px 1px 0 0 #bababc;
} }
/* Inverted Arrow Color */ /* Inverted Arrow Color */
[data-inverted][data-position~="bottom"][data-tooltip]:before { [data-inverted][data-position~="bottom"][data-tooltip]::before {
background: #1B1C1D; background: #1B1C1D;
-webkit-box-shadow: -1px -1px 0 0 #bababc; -webkit-box-shadow: -1px -1px 0 0 #bababc;
box-shadow: -1px -1px 0 0 #bababc; box-shadow: -1px -1px 0 0 #bababc;
} }
[data-inverted][data-position="left center"][data-tooltip]:before { [data-inverted][data-position="left center"][data-tooltip]::before {
background: #1B1C1D; background: #1B1C1D;
-webkit-box-shadow: 1px -1px 0 0 #bababc; -webkit-box-shadow: 1px -1px 0 0 #bababc;
box-shadow: 1px -1px 0 0 #bababc; box-shadow: 1px -1px 0 0 #bababc;
} }
[data-inverted][data-position="right center"][data-tooltip]:before { [data-inverted][data-position="right center"][data-tooltip]::before {
background: #1B1C1D; background: #1B1C1D;
-webkit-box-shadow: -1px 1px 0 0 #bababc; -webkit-box-shadow: -1px 1px 0 0 #bababc;
box-shadow: -1px 1px 0 0 #bababc; box-shadow: -1px 1px 0 0 #bababc;
} }
[data-inverted][data-position~="top"][data-tooltip]:before { [data-inverted][data-position~="top"][data-tooltip]::before {
background: #1B1C1D; background: #1B1C1D;
} }
[data-position~="bottom"][data-tooltip]:before { [data-position~="bottom"][data-tooltip]::before {
-webkit-transform-origin: center bottom; -webkit-transform-origin: center bottom;
transform-origin: center bottom; transform-origin: center bottom;
} }
[data-position~="bottom"][data-tooltip]:after { [data-position~="bottom"][data-tooltip]::after {
-webkit-transform-origin: center top; -webkit-transform-origin: center top;
transform-origin: center top; transform-origin: center top;
} }
[data-position="left center"][data-tooltip]:before { [data-position="bottom center"][data-tooltip]::before {
-webkit-transform-origin: center top;
transform-origin: center top;
}
[data-position="left center"][data-tooltip]::before {
-webkit-transform-origin: top center; -webkit-transform-origin: top center;
transform-origin: top center; transform-origin: top center;
} }
[data-position="left center"][data-tooltip]:after { [data-position="left center"][data-tooltip]::after {
-webkit-transform-origin: right center; -webkit-transform-origin: right center;
transform-origin: right center; transform-origin: right center;
} }
[data-position="right center"][data-tooltip]:before { [data-position="right center"][data-tooltip]::before {
-webkit-transform-origin: right center; -webkit-transform-origin: right center;
transform-origin: right center; transform-origin: right center;
} }
[data-position="right center"][data-tooltip]:after { [data-position="right center"][data-tooltip]::after {
-webkit-transform-origin: left center; -webkit-transform-origin: left center;
transform-origin: left center; transform-origin: left center;
} }
@ -449,7 +447,7 @@
Basic Basic
---------------*/ ---------------*/
[data-tooltip][data-variation~="basic"]:before { [data-tooltip][data-variation~="basic"]::before {
display: none; display: none;
} }
@ -463,7 +461,7 @@
/* Extending from Top */ /* Extending from Top */
.ui.top.popup { .ui.top.popup {
margin: 0 0 0.83333333em; margin: 0 0 0.71428571em;
} }
.ui.top.left.popup { .ui.top.left.popup {
-webkit-transform-origin: left bottom; -webkit-transform-origin: left bottom;
@ -480,19 +478,19 @@
/* Extending from Vertical Center */ /* Extending from Vertical Center */
.ui.left.center.popup { .ui.left.center.popup {
margin: 0 0.83333333em 0 0; margin: 0 0.71428571em 0 0;
-webkit-transform-origin: right 50%; -webkit-transform-origin: right 50%;
transform-origin: right 50%; transform-origin: right 50%;
} }
.ui.right.center.popup { .ui.right.center.popup {
margin: 0 0 0 0.83333333em; margin: 0 0 0 0.71428571em;
-webkit-transform-origin: left 50%; -webkit-transform-origin: left 50%;
transform-origin: left 50%; transform-origin: left 50%;
} }
/* Extending from Bottom */ /* Extending from Bottom */
.ui.bottom.popup { .ui.bottom.popup {
margin: 0.83333333em 0 0; margin: 0.71428571em 0 0;
} }
.ui.bottom.left.popup { .ui.bottom.left.popup {
-webkit-transform-origin: left top; -webkit-transform-origin: left top;
@ -514,9 +512,9 @@
/*--- Below ---*/ /*--- Below ---*/
.ui.bottom.center.popup:before { .ui.bottom.center.popup::before {
margin-left: -0.36666667em; margin-left: -0.30714286em;
top: -0.36666667em; top: -0.30714286em;
left: 50%; left: 50%;
right: auto; right: auto;
bottom: auto; bottom: auto;
@ -527,8 +525,8 @@
margin-left: 0; margin-left: 0;
} }
/*rtl:rename*/ /*rtl:rename*/
.ui.bottom.left.popup:before { .ui.bottom.left.popup::before {
top: -0.36666667em; top: -0.30714286em;
left: 1em; left: 1em;
right: auto; right: auto;
bottom: auto; bottom: auto;
@ -540,8 +538,8 @@
margin-right: 0; margin-right: 0;
} }
/*rtl:rename*/ /*rtl:rename*/
.ui.bottom.right.popup:before { .ui.bottom.right.popup::before {
top: -0.36666667em; top: -0.30714286em;
right: 1em; right: 1em;
bottom: auto; bottom: auto;
left: auto; left: auto;
@ -552,19 +550,19 @@
/*--- Above ---*/ /*--- Above ---*/
.ui.top.center.popup:before { .ui.top.center.popup::before {
top: auto; top: auto;
right: auto; right: auto;
bottom: -0.36666667em; bottom: -0.30714286em;
left: 50%; left: 50%;
margin-left: -0.36666667em; margin-left: -0.30714286em;
} }
.ui.top.left.popup { .ui.top.left.popup {
margin-left: 0; margin-left: 0;
} }
/*rtl:rename*/ /*rtl:rename*/
.ui.top.left.popup:before { .ui.top.left.popup::before {
bottom: -0.36666667em; bottom: -0.30714286em;
left: 1em; left: 1em;
top: auto; top: auto;
right: auto; right: auto;
@ -574,8 +572,8 @@
margin-right: 0; margin-right: 0;
} }
/*rtl:rename*/ /*rtl:rename*/
.ui.top.right.popup:before { .ui.top.right.popup::before {
bottom: -0.36666667em; bottom: -0.30714286em;
right: 1em; right: 1em;
top: auto; top: auto;
left: auto; left: auto;
@ -585,12 +583,12 @@
/*--- Left Center ---*/ /*--- Left Center ---*/
/*rtl:rename*/ /*rtl:rename*/
.ui.left.center.popup:before { .ui.left.center.popup::before {
top: 50%; top: 50%;
right: -0.36666667em; right: -0.30714286em;
bottom: auto; bottom: auto;
left: auto; left: auto;
margin-top: -0.36666667em; margin-top: -0.30714286em;
-webkit-box-shadow: 1px -1px 0 0 #bababc; -webkit-box-shadow: 1px -1px 0 0 #bababc;
box-shadow: 1px -1px 0 0 #bababc; box-shadow: 1px -1px 0 0 #bababc;
} }
@ -598,37 +596,37 @@
/*--- Right Center ---*/ /*--- Right Center ---*/
/*rtl:rename*/ /*rtl:rename*/
.ui.right.center.popup:before { .ui.right.center.popup::before {
top: 50%; top: 50%;
left: -0.36666667em; left: -0.30714286em;
bottom: auto; bottom: auto;
right: auto; right: auto;
margin-top: -0.36666667em; margin-top: -0.30714286em;
-webkit-box-shadow: -1px 1px 0 0 #bababc; -webkit-box-shadow: -1px 1px 0 0 #bababc;
box-shadow: -1px 1px 0 0 #bababc; box-shadow: -1px 1px 0 0 #bababc;
} }
.ui.right.center.popup:before, .ui.right.center.popup::before,
.ui.left.center.popup:before { .ui.left.center.popup::before {
background: #FFFFFF; background: #FFFFFF;
} }
/* Arrow Color By Location */ /* Arrow Color By Location */
.ui.bottom.popup:before { .ui.bottom.popup::before {
background: #FFFFFF; background: #FFFFFF;
} }
.ui.top.popup:before { .ui.top.popup::before {
background: #FFFFFF; background: #FFFFFF;
} }
/* Inverted Arrow Color */ /* Inverted Arrow Color */
.ui.inverted.bottom.popup:before { .ui.inverted.bottom.popup::before {
background: #1B1C1D; background: #1B1C1D;
} }
.ui.inverted.right.center.popup:before, .ui.inverted.right.center.popup::before,
.ui.inverted.left.center.popup:before { .ui.inverted.left.center.popup::before {
background: #1B1C1D; background: #1B1C1D;
} }
.ui.inverted.top.popup:before { .ui.inverted.top.popup::before {
background: #1B1C1D; background: #1B1C1D;
} }
@ -675,7 +673,7 @@
Basic Basic
---------------*/ ---------------*/
.ui.basic.popup:before { .ui.basic.popup::before {
display: none; display: none;
} }
.ui.fixed.popup { .ui.fixed.popup {
@ -735,7 +733,7 @@
background-color: none; background-color: none;
color: #FFFFFF; color: #FFFFFF;
} }
.ui.inverted.popup:before { .ui.inverted.popup::before {
background-color: #1B1C1D; background-color: #1B1C1D;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
@ -757,53 +755,53 @@
font-size: 1rem; font-size: 1rem;
} }
.ui.mini.popup { .ui.mini.popup {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
[data-tooltip][data-variation~="mini"]:before, [data-tooltip][data-variation~="mini"]::before,
[data-tooltip][data-variation~="mini"]:after { [data-tooltip][data-variation~="mini"]::after {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.popup { .ui.tiny.popup {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
[data-tooltip][data-variation~="tiny"]:before, [data-tooltip][data-variation~="tiny"]::before,
[data-tooltip][data-variation~="tiny"]:after { [data-tooltip][data-variation~="tiny"]::after {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.popup { .ui.small.popup {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
[data-tooltip][data-variation~="small"]:before, [data-tooltip][data-variation~="small"]::before,
[data-tooltip][data-variation~="small"]:after { [data-tooltip][data-variation~="small"]::after {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.popup { .ui.large.popup {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
[data-tooltip][data-variation~="large"]:before, [data-tooltip][data-variation~="large"]::before,
[data-tooltip][data-variation~="large"]:after { [data-tooltip][data-variation~="large"]::after {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.popup { .ui.big.popup {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
[data-tooltip][data-variation~="big"]:before, [data-tooltip][data-variation~="big"]::before,
[data-tooltip][data-variation~="big"]:after { [data-tooltip][data-variation~="big"]::after {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.popup { .ui.huge.popup {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
[data-tooltip][data-variation~="huge"]:before, [data-tooltip][data-variation~="huge"]::before,
[data-tooltip][data-variation~="huge"]:after { [data-tooltip][data-variation~="huge"]::after {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.popup { .ui.massive.popup {
font-size: 1.75rem; font-size: 1.71428571rem;
} }
[data-tooltip][data-variation~="massive"]:before, [data-tooltip][data-variation~="massive"]::before,
[data-tooltip][data-variation~="massive"]:after { [data-tooltip][data-variation~="massive"]::after {
font-size: 1.75rem; font-size: 1.71428571rem;
} }

20
semantic/dist/components/popup.js vendored
View file

@ -62,11 +62,11 @@ $.fn.popup = function(parameters) {
moduleNamespace = 'module-' + namespace, moduleNamespace = 'module-' + namespace,
$module = $(this), $module = $(this),
$context = $(settings.context), $context = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context),
$scrollContext = $(settings.scrollContext), $scrollContext = [window,document].indexOf(settings.scrollContext) < 0 ? $(document).find(settings.scrollContext) : $(settings.scrollContext),
$boundary = $(settings.boundary), $boundary = [window,document].indexOf(settings.boundary) < 0 ? $(document).find(settings.boundary) : $(settings.boundary),
$target = (settings.target) $target = (settings.target)
? $(settings.target) ? ([window,document].indexOf(settings.target) < 0 ? $(document).find(settings.target) : $(settings.target))
: $module, : $module,
$popup, $popup,
@ -121,8 +121,8 @@ $.fn.popup = function(parameters) {
}, },
refresh: function() { refresh: function() {
if(settings.popup) { if(settings.popup && typeof settings.popup === 'string') {
$popup = $(settings.popup).eq(0); $popup = $(document).find(settings.popup).eq(0);
} }
else { else {
if(settings.inline) { if(settings.inline) {
@ -286,8 +286,8 @@ $.fn.popup = function(parameters) {
} }
settings.onCreate.call($popup, element); settings.onCreate.call($popup, element);
} }
else if(settings.popup) { else if(settings.popup && typeof settings.popup === 'string') {
$(settings.popup).data(metadata.activator, $module); $(document).find(settings.popup).data(metadata.activator, $module);
module.verbose('Used popup specified in settings'); module.verbose('Used popup specified in settings');
module.refresh(); module.refresh();
if(settings.hoverable) { if(settings.hoverable) {
@ -309,7 +309,7 @@ $.fn.popup = function(parameters) {
}, },
createID: function() { createID: function() {
id = (Math.random().toString(16) + '000000000').substr(2, 8); id = (Math.random().toString(16) + '000000000').slice(2, 10);
elementNamespace = '.' + id; elementNamespace = '.' + id;
module.verbose('Creating unique id for element', id); module.verbose('Creating unique id for element', id);
}, },
@ -368,7 +368,7 @@ $.fn.popup = function(parameters) {
}, },
hideAll: function() { hideAll: function() {
$(selector.popup) $(document).find(selector.popup)
.filter('.' + className.popupVisible) .filter('.' + className.popupVisible)
.each(function() { .each(function() {
$(this) $(this)

2
semantic/dist/components/popup.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/popup.min.js vendored
View file

File diff suppressed because one or more lines are too long

30
semantic/dist/components/progress.css vendored
View file

@ -25,7 +25,7 @@
box-shadow: none; box-shadow: none;
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
padding: 0; padding: 0;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
.ui.progress:first-child { .ui.progress:first-child {
margin: 0 0 2.5em; margin: 0 0 2.5em;
@ -48,7 +48,7 @@
width: 0; width: 0;
min-width: 2em; min-width: 2em;
background: #888888; background: #888888;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-transition: width 0.1s ease, background-color 0.1s ease; -webkit-transition: width 0.1s ease, background-color 0.1s ease;
transition: width 0.1s ease, background-color 0.1s ease; transition: width 0.1s ease, background-color 0.1s ease;
overflow: hidden; overflow: hidden;
@ -69,7 +69,7 @@
white-space: nowrap; white-space: nowrap;
position: absolute; position: absolute;
width: auto; width: auto;
font-size: 0.91666667em; font-size: 0.92857143em;
top: 50%; top: 50%;
right: 0.5em; right: 0.5em;
left: auto; left: auto;
@ -328,7 +328,7 @@
right: 0; right: 0;
bottom: 0; bottom: 0;
background: #FFFFFF; background: #FFFFFF;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-animation: progress-active 2s ease infinite; -webkit-animation: progress-active 2s ease infinite;
animation: progress-active 2s ease infinite; animation: progress-active 2s ease infinite;
-webkit-transform-origin: left; -webkit-transform-origin: left;
@ -426,7 +426,7 @@
height: 0.2rem; height: 0.2rem;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
.ui.progress.attached .bar { .ui.progress.attached .bar {
border-radius: 0; border-radius: 0;
@ -436,7 +436,7 @@
.ui.progress.top.attached, .ui.progress.top.attached,
.ui.progress.top.attached .bar { .ui.progress.top.attached .bar {
top: 0; top: 0;
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui.progress.top.attached .bar { .ui.progress.top.attached .bar {
border-radius: 0; border-radius: 0;
@ -464,7 +464,7 @@
.ui.indeterminate.primary.progress .bar::before, .ui.indeterminate.primary.progress .bar::before,
.ui.primary.progress .bar, .ui.primary.progress .bar,
.ui.progress .primary.bar { .ui.progress .primary.bar {
background-color: #6435C9; background-color: #2185D0;
} }
.ui.inverted.indeterminate.primary.progress .bar::before, .ui.inverted.indeterminate.primary.progress .bar::before,
.ui.primary.inverted.progress .bar, .ui.primary.inverted.progress .bar,
@ -623,43 +623,43 @@
height: 1.75em; height: 1.75em;
} }
.ui.mini.progress { .ui.mini.progress {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.mini.progress .bar { .ui.mini.progress .bar {
height: 0.3em; height: 0.3em;
} }
.ui.tiny.progress { .ui.tiny.progress {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.tiny.progress .bar { .ui.tiny.progress .bar {
height: 0.5em; height: 0.5em;
} }
.ui.small.progress { .ui.small.progress {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.small.progress .bar { .ui.small.progress .bar {
height: 1em; height: 1em;
} }
.ui.large.progress { .ui.large.progress {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.large.progress .bar { .ui.large.progress .bar {
height: 2.5em; height: 2.5em;
} }
.ui.big.progress { .ui.big.progress {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.big.progress .bar { .ui.big.progress .bar {
height: 3.5em; height: 3.5em;
} }
.ui.huge.progress { .ui.huge.progress {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.huge.progress .bar { .ui.huge.progress .bar {
height: 4em; height: 4em;
} }
.ui.massive.progress { .ui.massive.progress {
font-size: 1.75rem; font-size: 1.71428571rem;
} }
.ui.massive.progress .bar { .ui.massive.progress .bar {
height: 5em; height: 5em;
@ -683,7 +683,7 @@
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0; bottom: 0;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
-webkit-animation: progress-pulsating 2s ease infinite; -webkit-animation: progress-pulsating 2s ease infinite;
animation: progress-pulsating 2s ease infinite; animation: progress-pulsating 2s ease infinite;
-webkit-transform-origin: center; -webkit-transform-origin: center;

7
semantic/dist/components/progress.js vendored
View file

@ -93,7 +93,7 @@ $.fn.progress = function(parameters) {
* *
* @param min A minimum value within multiple values * @param min A minimum value within multiple values
* @param total A total amount of multiple values * @param total A total amount of multiple values
* @returns {number} A precison. Could be 1, 10, 100, ... 1e+10. * @returns {number} A precision. Could be 1, 10, 100, ... 1e+10.
*/ */
derivePrecision: function(min, total) { derivePrecision: function(min, total) {
var precisionPower = 0 var precisionPower = 0
@ -607,6 +607,9 @@ $.fn.progress = function(parameters) {
} }
else { else {
module.remove.active(); module.remove.active();
module.remove.warning();
module.remove.error();
module.remove.success();
module.set.label(settings.text.active); module.set.label(settings.text.active);
} }
}, },
@ -991,7 +994,7 @@ $.fn.progress.settings = {
nonNumeric : 'Progress value is non numeric', nonNumeric : 'Progress value is non numeric',
tooHigh : 'Value specified is above 100%', tooHigh : 'Value specified is above 100%',
tooLow : 'Value specified is below 0%', tooLow : 'Value specified is below 0%',
sumExceedsTotal : 'Sum of multple values exceed total', sumExceedsTotal : 'Sum of multiple values exceed total',
}, },
regExp: { regExp: {

2
semantic/dist/components/progress.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/progress.min.js vendored
View file

File diff suppressed because one or more lines are too long

4
semantic/dist/components/reset.css vendored
View file

@ -16,8 +16,8 @@
/* Border-Box */ /* Border-Box */
*, *,
*:before, *::before,
*:after { *::after {
-webkit-box-sizing: inherit; -webkit-box-sizing: inherit;
box-sizing: inherit; box-sizing: inherit;
} }

2
semantic/dist/components/reset.min.css vendored
View file

@ -6,4 +6,4 @@
* Released under the MIT license * Released under the MIT license
* http://opensource.org/licenses/MIT * http://opensource.org/licenses/MIT
* *
*/*,:after,:before{-webkit-box-sizing:inherit;box-sizing:inherit}html{-webkit-box-sizing:border-box;box-sizing:border-box}input[type=email],input[type=password],input[type=search],input[type=text]{-webkit-appearance:none;-moz-appearance:none}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none} */*,::after,::before{-webkit-box-sizing:inherit;box-sizing:inherit}html{-webkit-box-sizing:border-box;box-sizing:border-box}input[type=email],input[type=password],input[type=search],input[type=text]{-webkit-appearance:none;-moz-appearance:none}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

190
semantic/dist/components/segment.css vendored
View file

@ -20,7 +20,7 @@
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
margin: 1rem 0; margin: 1rem 0;
padding: 1em 1em; padding: 1em 1em;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
} }
.ui.segment:first-child { .ui.segment:first-child {
@ -40,10 +40,10 @@
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
border: none; border: none;
border-bottom: 1px solid rgba(34, 36, 38, 0.15); border-top: 1px solid rgba(34, 36, 38, 0.15);
} }
.ui.vertical.segment:last-child { .ui.vertical.segment:first-child {
border-bottom: none; border-top: none;
} }
/*------------------- /*-------------------
@ -86,7 +86,7 @@
} }
.ui.grid.segment { .ui.grid.segment {
margin: 1rem 0; margin: 1rem 0;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
/* Table */ /* Table */
@ -175,7 +175,7 @@
.ui.placeholder.segment > .inline > .button { .ui.placeholder.segment > .inline > .button {
display: inline-block; display: inline-block;
width: auto; width: auto;
margin: 0 0.41666667rem 0 0; margin: 0 0.35714286rem 0 0;
} }
.ui.placeholder.segment > .inline > .button:last-child { .ui.placeholder.segment > .inline > .button:last-child {
margin-right: 0; margin-right: 0;
@ -198,10 +198,10 @@
.ui.piled.segment:last-child { .ui.piled.segment:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.ui.piled.segments:after, .ui.piled.segments::after,
.ui.piled.segments:before, .ui.piled.segments::before,
.ui.piled.segment:after, .ui.piled.segment::after,
.ui.piled.segment:before { .ui.piled.segment::before {
background-color: #FFFFFF; background-color: #FFFFFF;
visibility: visible; visibility: visible;
content: ''; content: '';
@ -214,15 +214,15 @@
-webkit-box-shadow: ''; -webkit-box-shadow: '';
box-shadow: ''; box-shadow: '';
} }
.ui.piled.segments:before, .ui.piled.segments::before,
.ui.piled.segment:before { .ui.piled.segment::before {
-webkit-transform: rotate(-1.2deg); -webkit-transform: rotate(-1.2deg);
transform: rotate(-1.2deg); transform: rotate(-1.2deg);
top: 0; top: 0;
z-index: -2; z-index: -2;
} }
.ui.piled.segments:after, .ui.piled.segments::after,
.ui.piled.segment:after { .ui.piled.segment::after {
-webkit-transform: rotate(1.2deg); -webkit-transform: rotate(1.2deg);
transform: rotate(1.2deg); transform: rotate(1.2deg);
top: 0; top: 0;
@ -252,10 +252,10 @@
.ui.stacked.segment { .ui.stacked.segment {
padding-bottom: 1.4em; padding-bottom: 1.4em;
} }
.ui.stacked.segments:before, .ui.stacked.segments::before,
.ui.stacked.segments:after, .ui.stacked.segments::after,
.ui.stacked.segment:before, .ui.stacked.segment::before,
.ui.stacked.segment:after { .ui.stacked.segment::after {
content: ''; content: '';
position: absolute; position: absolute;
bottom: -3px; bottom: -3px;
@ -266,23 +266,23 @@
height: 6px; height: 6px;
visibility: visible; visibility: visible;
} }
.ui.stacked.segments:before, .ui.stacked.segments::before,
.ui.stacked.segment:before { .ui.stacked.segment::before {
display: none; display: none;
} }
/* Add additional page */ /* Add additional page */
.ui.tall.stacked.segments:before, .ui.tall.stacked.segments::before,
.ui.tall.stacked.segment:before { .ui.tall.stacked.segment::before {
display: block; display: block;
bottom: 0; bottom: 0;
} }
/* Inverted */ /* Inverted */
.ui.stacked.inverted.segments:before, .ui.stacked.inverted.segments::before,
.ui.stacked.inverted.segments:after, .ui.stacked.inverted.segments::after,
.ui.stacked.inverted.segment:before, .ui.stacked.inverted.segment::before,
.ui.stacked.inverted.segment:after { .ui.stacked.inverted.segment::after {
background-color: rgba(0, 0, 0, 0.03); background-color: rgba(0, 0, 0, 0.03);
border-top: 1px solid rgba(34, 36, 38, 0.35); border-top: 1px solid rgba(34, 36, 38, 0.35);
} }
@ -366,7 +366,7 @@
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
-webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
.ui.segments:first-child { .ui.segments:first-child {
margin-top: 0; margin-top: 0;
@ -393,7 +393,7 @@
border-top: none; border-top: none;
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
/* Bottom */ /* Bottom */
@ -404,12 +404,12 @@
margin-bottom: 0; margin-bottom: 0;
-webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none;
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none;
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
/* Only */ /* Only */
.ui.segments:not(.horizontal) > .segment:only-child { .ui.segments:not(.horizontal) > .segment:only-child {
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
} }
/* Nested Group */ /* Nested Group */
@ -438,7 +438,7 @@
-webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
margin: 1rem 0; margin: 1rem 0;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
border: 1px solid rgba(34, 36, 38, 0.15); border: 1px solid rgba(34, 36, 38, 0.15);
} }
.ui.stackable.horizontal.segments { .ui.stackable.horizontal.segments {
@ -483,10 +483,10 @@
border-left: none; border-left: none;
} }
.ui.horizontal.segments > .segment:first-child { .ui.horizontal.segments > .segment:first-child {
border-radius: 0.33333333rem 0 0 0.33333333rem; border-radius: 0.28571429rem 0 0 0.28571429rem;
} }
.ui.horizontal.segments > .segment:last-child { .ui.horizontal.segments > .segment:last-child {
border-radius: 0 0.33333333rem 0.33333333rem 0; border-radius: 0 0.28571429rem 0.28571429rem 0;
} }
/* Equal Width */ /* Equal Width */
@ -531,8 +531,8 @@
-webkit-transition: all 0s linear; -webkit-transition: all 0s linear;
transition: all 0s linear; transition: all 0s linear;
} }
.ui.loading.segments:before, .ui.loading.segments::before,
.ui.loading.segment:before { .ui.loading.segment::before {
position: absolute; position: absolute;
content: ''; content: '';
top: 0; top: 0;
@ -540,11 +540,11 @@
background: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.8);
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
z-index: 100; z-index: 100;
} }
.ui.loading.segments:after, .ui.loading.segments::after,
.ui.loading.segment:after { .ui.loading.segment::after {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
@ -586,7 +586,7 @@
Clearing Clearing
--------------------*/ --------------------*/
.ui.clearing.segment:after { .ui.clearing.segment::after {
content: ""; content: "";
display: block; display: block;
clear: both; clear: both;
@ -743,7 +743,7 @@
} }
/* Attached */ /* Attached */
.ui.inverted.attached.segment { .ui.ui.inverted.attached.segment {
border-color: #555555; border-color: #555555;
} }
@ -752,8 +752,8 @@
.ui.inverted.loading.segment { .ui.inverted.loading.segment {
color: #FFFFFF; color: #FFFFFF;
} }
.ui.inverted.loading.segments:before, .ui.inverted.loading.segments::before,
.ui.inverted.loading.segment:before { .ui.inverted.loading.segment::before {
background: rgba(0, 0, 0, 0.85); background: rgba(0, 0, 0, 0.85);
} }
@ -801,23 +801,28 @@
max-width: calc(100% + 2px); max-width: calc(100% + 2px);
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
}
.ui.attached.segment:not(.basic) {
border: 1px solid #D4D4D5; border: 1px solid #D4D4D5;
} }
.ui.attached:not(.message) + .ui.attached.segment:not(.top) { .ui.attached:not(.message):not(.text) + .ui.attached.segment:not(.top) {
border-top: none; border-top: none;
} }
/* Top */ /* Top */
.ui[class*="top attached"].segment { .ui.segment[class*="top attached"] {
bottom: 0; bottom: 0;
margin-bottom: 0; margin-bottom: 0;
top: 0; top: 0;
margin-top: 1rem; margin-top: 1rem;
border-radius: 0.33333333rem 0.33333333rem 0 0; border-radius: 0.28571429rem 0.28571429rem 0 0;
} }
.ui.segment[class*="top attached"]:first-child { .ui.segment[class*="top attached"]:first-child {
margin-top: 0; margin-top: 0;
} }
.ui.tab.segment[class*="top attached"]:first-child {
margin-top: 1rem;
}
/* Bottom */ /* Bottom */
.ui.segment[class*="bottom attached"] { .ui.segment[class*="bottom attached"] {
@ -827,9 +832,12 @@
margin-bottom: 1rem; margin-bottom: 1rem;
-webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; -webkit-box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none;
box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none; box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15), none;
border-radius: 0 0 0.33333333rem 0.33333333rem; border-radius: 0 0 0.28571429rem 0.28571429rem;
} }
.ui.segment[class*="bottom attached"]:last-child { .ui.segment[class*="bottom attached"]:last-child {
margin-bottom: 0;
}
.ui.tab.segment[class*="bottom attached"]:last-child {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
@ -846,6 +854,82 @@
padding-right: 0; padding-right: 0;
} }
/*--------------
Scrolling
---------------*/
.ui.scrolling.segment {
overflow: auto;
}
@media only screen and (max-width: 767.98px) {
.ui.scrolling.segment.short {
max-height: 11.25em;
}
.ui.scrolling.segment[class*="very short"] {
max-height: 7.5em;
}
.ui.scrolling.segment {
max-height: 15em;
}
.ui.scrolling.segment.long {
max-height: 30em;
}
.ui.scrolling.segment[class*="very long"] {
max-height: 45em;
}
}
@media only screen and (min-width: 768px) {
.ui.scrolling.segment.short {
max-height: 13.5em;
}
.ui.scrolling.segment[class*="very short"] {
max-height: 9em;
}
.ui.scrolling.segment {
max-height: 18em;
}
.ui.scrolling.segment.long {
max-height: 36em;
}
.ui.scrolling.segment[class*="very long"] {
max-height: 54em;
}
}
@media only screen and (min-width: 992px) {
.ui.scrolling.segment.short {
max-height: 18em;
}
.ui.scrolling.segment[class*="very short"] {
max-height: 12em;
}
.ui.scrolling.segment {
max-height: 24em;
}
.ui.scrolling.segment.long {
max-height: 48em;
}
.ui.scrolling.segment[class*="very long"] {
max-height: 72em;
}
}
@media only screen and (min-width: 1920px) {
.ui.scrolling.segment.short {
max-height: 22.5em;
}
.ui.scrolling.segment[class*="very short"] {
max-height: 15em;
}
.ui.scrolling.segment {
max-height: 30em;
}
.ui.scrolling.segment.long {
max-height: 60em;
}
.ui.scrolling.segment[class*="very long"] {
max-height: 90em;
}
}
/*------------------- /*-------------------
Size Size
--------------------*/ --------------------*/
@ -856,31 +940,31 @@
} }
.ui.mini.segments .segment, .ui.mini.segments .segment,
.ui.mini.segment { .ui.mini.segment {
font-size: 0.75rem; font-size: 0.78571429rem;
} }
.ui.tiny.segments .segment, .ui.tiny.segments .segment,
.ui.tiny.segment { .ui.tiny.segment {
font-size: 0.83333333rem; font-size: 0.85714286rem;
} }
.ui.small.segments .segment, .ui.small.segments .segment,
.ui.small.segment { .ui.small.segment {
font-size: 0.91666667rem; font-size: 0.92857143rem;
} }
.ui.large.segments .segment, .ui.large.segments .segment,
.ui.large.segment { .ui.large.segment {
font-size: 1.16666667rem; font-size: 1.14285714rem;
} }
.ui.big.segments .segment, .ui.big.segments .segment,
.ui.big.segment { .ui.big.segment {
font-size: 1.25rem; font-size: 1.28571429rem;
} }
.ui.huge.segments .segment, .ui.huge.segments .segment,
.ui.huge.segment { .ui.huge.segment {
font-size: 1.41666667rem; font-size: 1.42857143rem;
} }
.ui.massive.segments .segment, .ui.massive.segments .segment,
.ui.massive.segment { .ui.massive.segment {
font-size: 1.75rem; font-size: 1.71428571rem;
} }

2
semantic/dist/components/segment.min.css vendored
View file

File diff suppressed because one or more lines are too long

12
semantic/dist/components/sidebar.css vendored
View file

@ -102,7 +102,7 @@ body.pushable.dimmed {
} }
.pushable:not(body) > .ui.sidebar, .pushable:not(body) > .ui.sidebar,
.pushable:not(body) > .fixed, .pushable:not(body) > .fixed,
.pushable:not(body) > .pusher:after { .pushable:not(body) > .pusher::after {
position: absolute; position: absolute;
} }
@ -130,7 +130,6 @@ body.pushable.dimmed {
position: relative; position: relative;
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden;
backface-visibility: hidden; backface-visibility: hidden;
overflow: hidden;
min-height: 100%; min-height: 100%;
-webkit-transition: -webkit-transform 500ms ease; -webkit-transition: -webkit-transform 500ms ease;
transition: -webkit-transform 500ms ease; transition: -webkit-transform 500ms ease;
@ -141,15 +140,18 @@ body.pushable.dimmed {
/* Pusher should inherit background from context */ /* Pusher should inherit background from context */
background: inherit; background: inherit;
} }
.pushable > .pusher:not(.overflowing) {
overflow: hidden;
}
body.pushable > .pusher { body.pushable > .pusher {
background: #F4F4F4; background: #FFFFFF;
} }
/*-------------- /*--------------
Dimmer Dimmer
---------------*/ ---------------*/
.pushable > .pusher:after { .pushable > .pusher::after {
position: fixed; position: fixed;
top: 0; top: 0;
right: 0; right: 0;
@ -181,7 +183,7 @@ body.pushable > .pusher {
Dimmed Dimmed
---------------*/ ---------------*/
.pushable > .pusher.dimmed:after { .pushable > .pusher.dimmed::after {
width: 100% !important; width: 100% !important;
height: 100% !important; height: 100% !important;
opacity: 1 !important; opacity: 1 !important;

24
semantic/dist/components/sidebar.js vendored
View file

@ -66,7 +66,7 @@ $.fn.sidebar = function(parameters) {
moduleNamespace = 'module-' + namespace, moduleNamespace = 'module-' + namespace,
$module = $(this), $module = $(this),
$context = $(settings.context), $context = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context),
$sidebars = $module.children(selector.sidebar), $sidebars = $module.children(selector.sidebar),
$fixed = $context.children(selector.fixed), $fixed = $context.children(selector.fixed),
@ -118,7 +118,7 @@ $.fn.sidebar = function(parameters) {
create: { create: {
id: function() { id: function() {
id = (Math.random().toString(16) + '000000000').substr(2,8); id = (Math.random().toString(16) + '000000000').slice(2, 10);
elementNamespace = '.' + id; elementNamespace = '.' + id;
module.verbose('Creating unique id for element', id); module.verbose('Creating unique id for element', id);
} }
@ -261,7 +261,7 @@ $.fn.sidebar = function(parameters) {
if(direction === 'left' || direction === 'right') { if(direction === 'left' || direction === 'right') {
module.debug('Adding CSS rules for animation distance', width); module.debug('Adding CSS rules for animation distance', width);
style += '' style += ''
+ ' body.pushable > .ui.visible.' + direction + '.sidebar ~ .pusher:after {' + ' body.pushable > .ui.visible.' + direction + '.sidebar ~ .pusher::after {'
+ ' -webkit-transform: translate3d('+ distance[direction] + 'px, 0, 0);' + ' -webkit-transform: translate3d('+ distance[direction] + 'px, 0, 0);'
+ ' transform: translate3d('+ distance[direction] + 'px, 0, 0);' + ' transform: translate3d('+ distance[direction] + 'px, 0, 0);'
+ ' }' + ' }'
@ -269,7 +269,7 @@ $.fn.sidebar = function(parameters) {
} }
else if(direction === 'top' || direction == 'bottom') { else if(direction === 'top' || direction == 'bottom') {
style += '' style += ''
+ ' body.pushable > .ui.visible.' + direction + '.sidebar ~ .pusher:after {' + ' body.pushable > .ui.visible.' + direction + '.sidebar ~ .pusher::after {'
+ ' -webkit-transform: translate3d(0, ' + distance[direction] + 'px, 0);' + ' -webkit-transform: translate3d(0, ' + distance[direction] + 'px, 0);'
+ ' transform: translate3d(0, ' + distance[direction] + 'px, 0);' + ' transform: translate3d(0, ' + distance[direction] + 'px, 0);'
+ ' }' + ' }'
@ -277,8 +277,8 @@ $.fn.sidebar = function(parameters) {
} }
/* opposite sides visible forces content overlay */ /* opposite sides visible forces content overlay */
style += '' style += ''
+ ' body.pushable > .ui.visible.left.sidebar ~ .ui.visible.right.sidebar ~ .pusher:after,' + ' body.pushable > .ui.visible.left.sidebar ~ .ui.visible.right.sidebar ~ .pusher::after,'
+ ' body.pushable > .ui.visible.right.sidebar ~ .ui.visible.left.sidebar ~ .pusher:after {' + ' body.pushable > .ui.visible.right.sidebar ~ .ui.visible.left.sidebar ~ .pusher::after {'
+ ' -webkit-transform: translate3d(0, 0, 0);' + ' -webkit-transform: translate3d(0, 0, 0);'
+ ' transform: translate3d(0, 0, 0);' + ' transform: translate3d(0, 0, 0);'
+ ' }' + ' }'
@ -294,7 +294,7 @@ $.fn.sidebar = function(parameters) {
refresh: function() { refresh: function() {
module.verbose('Refreshing selector cache'); module.verbose('Refreshing selector cache');
$context = $(settings.context); $context = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context);
$sidebars = $context.children(selector.sidebar); $sidebars = $context.children(selector.sidebar);
$pusher = $context.children(selector.pusher); $pusher = $context.children(selector.pusher);
$fixed = $context.children(selector.fixed); $fixed = $context.children(selector.fixed);
@ -371,6 +371,10 @@ $.fn.sidebar = function(parameters) {
: function(){} : function(){}
; ;
if(module.is.hidden()) { if(module.is.hidden()) {
if(settings.onShow.call(element) === false) {
module.verbose('Show callback returned false cancelling show');
return;
}
module.refreshSidebars(); module.refreshSidebars();
if(settings.overlay) { if(settings.overlay) {
module.error(error.overlay); module.error(error.overlay);
@ -395,10 +399,9 @@ $.fn.sidebar = function(parameters) {
} }
module.pushPage(function() { module.pushPage(function() {
callback.call(element); callback.call(element);
settings.onShow.call(element); settings.onVisible.call(element);
}); });
settings.onChange.call(element); settings.onChange.call(element);
settings.onVisible.call(element);
} }
else { else {
module.debug('Sidebar is already visible'); module.debug('Sidebar is already visible');
@ -410,7 +413,7 @@ $.fn.sidebar = function(parameters) {
? callback ? callback
: function(){} : function(){}
; ;
if(module.is.visible() || module.is.animating()) { if((module.is.visible() || module.is.animating()) && settings.onHide.call(element) !== false) {
module.debug('Hiding sidebar', callback); module.debug('Hiding sidebar', callback);
module.refreshSidebars(); module.refreshSidebars();
module.pullPage(function() { module.pullPage(function() {
@ -418,7 +421,6 @@ $.fn.sidebar = function(parameters) {
settings.onHidden.call(element); settings.onHidden.call(element);
}); });
settings.onChange.call(element); settings.onChange.call(element);
settings.onHide.call(element);
} }
}, },

2
semantic/dist/components/sidebar.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/sidebar.min.js vendored
View file

File diff suppressed because one or more lines are too long

187
semantic/dist/components/site.css vendored
View file

@ -13,22 +13,93 @@
Page Page
*******************************/ *******************************/
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,400%3B0,700%3B1,400%3B1,700&subset=latin&display=swap'); @font-face {
font-family: 'Raleway';
src: url("./../themes/default/assets/fonts/LatoLatin-Regular.woff2") format('woff2') , url("./../themes/default/assets/fonts/LatoLatin-Regular.woff") format('woff');
font-style: normal;
font-weight: normal;
font-display: swap;
text-rendering: optimizeLegibility;
unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-017F, U+0192, U+0218-021B, U+0237, U+02C6-02C7, U+02C9, U+02D8-02DD, U+0394, U+03A9, U+03BC, U+03C0, U+1E80-1E85, U+2010, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20A3-20A4, U+20A7, U+20AC, U+2113, U+2122, U+2126, U+212E, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+2219-221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+F8FF, U+FB00-FB04;
}
@font-face {
font-family: 'Raleway';
src: url("./../themes/default/assets/fonts/LatoLatin-Bold.woff2") format('woff2') , url("./../themes/default/assets/fonts/LatoLatin-Bold.woff") format('woff');
font-style: normal;
font-weight: bold;
font-display: swap;
text-rendering: optimizeLegibility;
unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-017F, U+0192, U+0218-021B, U+0237, U+02C6-02C7, U+02C9, U+02D8-02DD, U+0394, U+03A9, U+03BC, U+03C0, U+1E80-1E85, U+2010, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20A3-20A4, U+20A7, U+20AC, U+2113, U+2122, U+2126, U+212E, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+2219-221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+F8FF, U+FB00-FB04;
}
@font-face {
font-family: 'Raleway';
src: url("./../themes/default/assets/fonts/LatoLatin-Italic.woff2") format('woff2') , url("./../themes/default/assets/fonts/LatoLatin-Italic.woff") format('woff');
font-style: italic;
font-weight: normal;
font-display: swap;
text-rendering: optimizeLegibility;
unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-017F, U+0192, U+0218-021B, U+0237, U+02C6-02C7, U+02C9, U+02D8-02DD, U+0394, U+03A9, U+03BC, U+03C0, U+1E80-1E85, U+2010, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20A3-20A4, U+20A7, U+20AC, U+2113, U+2122, U+2126, U+212E, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+2219-221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+F8FF, U+FB00-FB04;
}
@font-face {
font-family: 'Raleway';
src: url("./../themes/default/assets/fonts/LatoLatin-BoldItalic.woff2") format('woff2') , url("./../themes/default/assets/fonts/LatoLatin-BoldItalic.woff") format('woff');
font-style: italic;
font-weight: bold;
font-display: swap;
text-rendering: optimizeLegibility;
unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-017F, U+0192, U+0218-021B, U+0237, U+02C6-02C7, U+02C9, U+02D8-02DD, U+0394, U+03A9, U+03BC, U+03C0, U+1E80-1E85, U+2010, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20A3-20A4, U+20A7, U+20AC, U+2113, U+2122, U+2126, U+212E, U+2202, U+2206, U+220F, U+2211-2212, U+2215, U+2219-221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+F8FF, U+FB00-FB04;
}
@font-face {
font-family: 'Raleway';
src: url("./../themes/default/assets/fonts/Lato-Regular.woff2") format('woff2') , url("./../themes/default/assets/fonts/Lato-Regular.woff") format('woff');
font-style: normal;
font-weight: normal;
font-display: swap;
text-rendering: optimizeLegibility;
unicode-range: U+0180-0191, U+0193-0217, U+021C-0236, U+0238-02C5, U+02C8, U+02CA-02D7, U+02DE-036F, U+0374-0375, U+037A-037E, U+0384-038A, U+038C, U+038E-0393, U+0395-03A1, U+03A3-03A8, U+03AA-03BB, U+03BD-03BF, U+03C1-03CE, U+03D0-0486, U+0488-0513, U+1D00-1DCA, U+1DFE-1E7F, U+1E86-1E9B, U+1E9E, U+1EA0-1EF9, U+1F00-1F15, U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF, U+1FF2-1FF4, U+1FF6-1FFE, U+2000-200F, U+2012, U+2015-2017, U+201B, U+201F, U+202F, U+2034, U+203C-203E, U+205E-205F, U+2070-2071, U+2074-2094, U+20A0-20A2, U+20A5-20A6, U+20A8-20AB, U+20AD-20B5, U+20B8-20BA, U+20DD, U+2105, U+2116-2117, U+2120, U+2132, U+214D-214E, U+2153-215F, U+2183-2184, U+2190-2199, U+21A8, U+221F, U+2229, U+2261, U+2302, U+2310, U+2320-2321, U+2460-2473, U+24EA-24F4, U+24FF-2500, U+2502, U+250C, U+2510, U+2514, U+2518, U+2C60-2C6C, U+2C74-2C77;
}
@font-face {
font-family: 'Raleway';
src: url("./../themes/default/assets/fonts/Lato-Bold.woff2") format('woff2') , url("./../themes/default/assets/fonts/Lato-Bold.woff") format('woff');
font-style: normal;
font-weight: bold;
font-display: swap;
text-rendering: optimizeLegibility;
unicode-range: U+0180-0191, U+0193-0217, U+021C-0236, U+0238-02C5, U+02C8, U+02CA-02D7, U+02DE-036F, U+0374-0375, U+037A-037E, U+0384-038A, U+038C, U+038E-0393, U+0395-03A1, U+03A3-03A8, U+03AA-03BB, U+03BD-03BF, U+03C1-03CE, U+03D0-0486, U+0488-0513, U+1D00-1DCA, U+1DFE-1E7F, U+1E86-1E9B, U+1E9E, U+1EA0-1EF9, U+1F00-1F15, U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF, U+1FF2-1FF4, U+1FF6-1FFE, U+2000-200F, U+2012, U+2015-2017, U+201B, U+201F, U+202F, U+2034, U+203C-203E, U+205E-205F, U+2070-2071, U+2074-2094, U+20A0-20A2, U+20A5-20A6, U+20A8-20AB, U+20AD-20B5, U+20B8-20BA, U+20DD, U+2105, U+2116-2117, U+2120, U+2132, U+214D-214E, U+2153-215F, U+2183-2184, U+2190-2199, U+21A8, U+221F, U+2229, U+2261, U+2302, U+2310, U+2320-2321, U+2460-2473, U+24EA-24F4, U+24FF-2500, U+2502, U+250C, U+2510, U+2514, U+2518, U+2C60-2C6C, U+2C74-2C77;
}
@font-face {
font-family: 'Raleway';
src: url("./../themes/default/assets/fonts/Lato-Italic.woff2") format('woff2') , url("./../themes/default/assets/fonts/Lato-Italic.woff") format('woff');
font-style: italic;
font-weight: normal;
font-display: swap;
text-rendering: optimizeLegibility;
unicode-range: U+0180-0191, U+0193-0217, U+021C-0236, U+0238-02C5, U+02C8, U+02CA-02D7, U+02DE-036F, U+0374-0375, U+037A-037E, U+0384-038A, U+038C, U+038E-0393, U+0395-03A1, U+03A3-03A8, U+03AA-03BB, U+03BD-03BF, U+03C1-03CE, U+03D0-0486, U+0488-0513, U+1D00-1DCA, U+1DFE-1E7F, U+1E86-1E9B, U+1E9E, U+1EA0-1EF9, U+1F00-1F15, U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF, U+1FF2-1FF4, U+1FF6-1FFE, U+2000-200F, U+2012, U+2015-2017, U+201B, U+201F, U+202F, U+2034, U+203C-203E, U+205E-205F, U+2070-2071, U+2074-2094, U+20A0-20A2, U+20A5-20A6, U+20A8-20AB, U+20AD-20B5, U+20B8-20BA, U+20DD, U+2105, U+2116-2117, U+2120, U+2132, U+214D-214E, U+2153-215F, U+2183-2184, U+2190-2199, U+21A8, U+221F, U+2229, U+2261, U+2302, U+2310, U+2320-2321, U+2460-2473, U+24EA-24F4, U+24FF-2500, U+2502, U+250C, U+2510, U+2514, U+2518, U+2C60-2C6C, U+2C74-2C77;
}
@font-face {
font-family: 'Raleway';
src: url("./../themes/default/assets/fonts/Lato-BoldItalic.woff2") format('woff2') , url("./../themes/default/assets/fonts/Lato-BoldItalic.woff") format('woff');
font-style: italic;
font-weight: bold;
font-display: swap;
text-rendering: optimizeLegibility;
unicode-range: U+0180-0191, U+0193-0217, U+021C-0236, U+0238-02C5, U+02C8, U+02CA-02D7, U+02DE-036F, U+0374-0375, U+037A-037E, U+0384-038A, U+038C, U+038E-0393, U+0395-03A1, U+03A3-03A8, U+03AA-03BB, U+03BD-03BF, U+03C1-03CE, U+03D0-0486, U+0488-0513, U+1D00-1DCA, U+1DFE-1E7F, U+1E86-1E9B, U+1E9E, U+1EA0-1EF9, U+1F00-1F15, U+1F18-1F1D, U+1F20-1F45, U+1F48-1F4D, U+1F50-1F57, U+1F59, U+1F5B, U+1F5D, U+1F5F-1F7D, U+1F80-1FB4, U+1FB6-1FC4, U+1FC6-1FD3, U+1FD6-1FDB, U+1FDD-1FEF, U+1FF2-1FF4, U+1FF6-1FFE, U+2000-200F, U+2012, U+2015-2017, U+201B, U+201F, U+202F, U+2034, U+203C-203E, U+205E-205F, U+2070-2071, U+2074-2094, U+20A0-20A2, U+20A5-20A6, U+20A8-20AB, U+20AD-20B5, U+20B8-20BA, U+20DD, U+2105, U+2116-2117, U+2120, U+2132, U+214D-214E, U+2153-215F, U+2183-2184, U+2190-2199, U+21A8, U+221F, U+2229, U+2261, U+2302, U+2310, U+2320-2321, U+2460-2473, U+24EA-24F4, U+24FF-2500, U+2502, U+250C, U+2510, U+2514, U+2518, U+2C60-2C6C, U+2C74-2C77;
}
html, html,
body { body {
height: 100%; height: 100%;
} }
html { html {
font-size: 12pt; font-size: 14pt;
} }
body { body {
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow-x: hidden; overflow-x: hidden;
min-width: 320px; min-width: 320px;
background: #F4F4F4; background: #FFFFFF;
font-family: 'Raleway', sans-serif; font-family: 'Raleway', sans-serif;
font-size: 12pt; font-size: 14pt;
line-height: 1.4285em; line-height: 1.4285em;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
} }
@ -101,11 +172,11 @@ p:last-child {
--------------------*/ --------------------*/
a { a {
color: #6435C9; color: #4183C4;
text-decoration: none; text-decoration: none;
} }
a:hover { a:hover {
color: #4d17c0; color: #1e70bf;
text-decoration: none; text-decoration: none;
} }
@ -115,47 +186,6 @@ a:hover {
*******************************/ *******************************/
/*******************************
Highlighting
*******************************/
/* Site */
::-webkit-selection {
background-color: #dfd6f4;
color: rgba(0, 0, 0, 0.87);
}
::-moz-selection {
background-color: #dfd6f4;
color: rgba(0, 0, 0, 0.87);
}
::selection {
background-color: #dfd6f4;
color: rgba(0, 0, 0, 0.87);
}
/* Form */
textarea::-webkit-selection,
input::-webkit-selection {
background-color: rgba(100, 100, 100, 0.4);
color: rgba(0, 0, 0, 0.87);
}
textarea::-moz-selection,
input::-moz-selection {
background-color: rgba(100, 100, 100, 0.4);
color: rgba(0, 0, 0, 0.87);
}
textarea::-moz-selection, input::-moz-selection {
background-color: rgba(100, 100, 100, 0.4);
color: rgba(0, 0, 0, 0.87);
}
textarea::selection,
input::selection {
background-color: rgba(100, 100, 100, 0.4);
color: rgba(0, 0, 0, 0.87);
}
/* Force Simple Scrollbars */ /* Force Simple Scrollbars */
body ::-webkit-scrollbar { body ::-webkit-scrollbar {
-webkit-appearance: none; -webkit-appearance: none;
@ -179,7 +209,18 @@ body ::-webkit-scrollbar-thumb:window-inactive {
body ::-webkit-scrollbar-thumb:hover { body ::-webkit-scrollbar-thumb:hover {
background: rgba(128, 135, 139, 0.8); background: rgba(128, 135, 139, 0.8);
} }
body .ui {
/* IE11 */
scrollbar-face-color: #bfbfbf;
scrollbar-shadow-color: #bfbfbf;
scrollbar-track-color: #e6e6e6;
scrollbar-arrow-color: #e6e6e6;
/* firefox : first color thumb, second track*/
scrollbar-color: rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.1);
scrollbar-width: thin;
}
/* Inverted UI */ /* Inverted UI */
body .ui.inverted:not(.dimmer)::-webkit-scrollbar-track { body .ui.inverted:not(.dimmer)::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1);
@ -193,6 +234,58 @@ body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:window-inactive {
body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover { body .ui.inverted:not(.dimmer)::-webkit-scrollbar-thumb:hover {
background: rgba(255, 255, 255, 0.35); background: rgba(255, 255, 255, 0.35);
} }
body .ui.inverted:not(.dimmer) {
/* IE11 */
scrollbar-face-color: #656565;
scrollbar-shadow-color: #656565;
scrollbar-track-color: #323232;
scrollbar-arrow-color: #323232;
/* firefox : first color thumb, second track */
scrollbar-color: rgba(255, 255, 255, 0.25) rgba(255, 255, 255, 0.1);
}
/*******************************
Highlighting
*******************************/
/* Site */
::-webkit-selection {
background-color: #CCE2FF;
color: rgba(0, 0, 0, 0.87);
}
::-moz-selection {
background-color: #CCE2FF;
color: rgba(0, 0, 0, 0.87);
}
::selection {
background-color: #CCE2FF;
color: rgba(0, 0, 0, 0.87);
}
/* Form */
textarea::-webkit-selection,
input::-webkit-selection {
background-color: rgba(100, 100, 100, 0.4);
color: rgba(0, 0, 0, 0.87);
}
textarea::-moz-selection,
input::-moz-selection {
background-color: rgba(100, 100, 100, 0.4);
color: rgba(0, 0, 0, 0.87);
}
textarea::-moz-selection, input::-moz-selection {
background-color: rgba(100, 100, 100, 0.4);
color: rgba(0, 0, 0, 0.87);
}
textarea::selection,
input::selection {
background-color: rgba(100, 100, 100, 0.4);
color: rgba(0, 0, 0, 0.87);
}
/******************************* /*******************************

2
semantic/dist/components/site.min.css vendored
View file

File diff suppressed because one or more lines are too long

4
semantic/dist/components/statistic.css vendored
View file

@ -75,7 +75,7 @@
} }
/* Clearing */ /* Clearing */
.ui.statistics:after { .ui.statistics::after {
display: block; display: block;
content: ' '; content: ' ';
height: 0; height: 0;
@ -330,7 +330,7 @@
.ui.primary.statistics .statistic > .value, .ui.primary.statistics .statistic > .value,
.ui.statistics .primary.statistic > .value, .ui.statistics .primary.statistic > .value,
.ui.primary.statistic > .value { .ui.primary.statistic > .value {
color: #6435C9; color: #2185D0;
} }
.ui.inverted.primary.statistics .statistic > .value, .ui.inverted.primary.statistics .statistic > .value,
.ui.statistics .inverted.primary.statistic > .value, .ui.statistics .inverted.primary.statistic > .value,

2
semantic/dist/components/statistic.min.css vendored
View file

File diff suppressed because one or more lines are too long

134
semantic/dist/components/step.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/step.min.css vendored
View file

File diff suppressed because one or more lines are too long

8
semantic/dist/components/tab.css vendored
View file

@ -46,8 +46,8 @@
position: relative !important; position: relative !important;
left: -10000px !important; left: -10000px !important;
} }
.ui.tab.loading:before, .ui.tab.loading::before,
.ui.tab.loading.segment:before { .ui.tab.loading.segment::before {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;
@ -58,8 +58,8 @@
border-radius: 500rem; border-radius: 500rem;
border: 0.2em solid rgba(0, 0, 0, 0.1); border: 0.2em solid rgba(0, 0, 0, 0.1);
} }
.ui.tab.loading:after, .ui.tab.loading::after,
.ui.tab.loading.segment:after { .ui.tab.loading.segment::after {
position: absolute; position: absolute;
content: ''; content: '';
top: 50%; top: 50%;

28
semantic/dist/components/tab.js vendored
View file

@ -100,10 +100,18 @@ $.fn.tab = function(parameters) {
initializedHistory = true; initializedHistory = true;
} }
if(settings.autoTabActivation && instance === undefined && module.determine.activeTab() == null) { var activeTab = module.determine.activeTab();
module.debug('No active tab detected, setting first tab active', module.get.initialPath()); if(settings.autoTabActivation && instance === undefined && activeTab == null) {
module.changeTab(settings.autoTabActivation === true ? module.get.initialPath() : settings.autoTabActivation); activeTab = settings.autoTabActivation === true ? module.get.initialPath() : settings.autoTabActivation;
}; module.debug('No active tab detected, setting tab active', activeTab);
module.changeTab(activeTab);
}
if(activeTab != null && settings.history) {
var autoUpdate = $.address.autoUpdate();
$.address.autoUpdate(false);
$.address.value(activeTab);
$.address.autoUpdate(autoUpdate);
}
module.instantiate(); module.instantiate();
}, },
@ -154,7 +162,7 @@ $.fn.tab = function(parameters) {
module.verbose('Determined parent element for creating context', $context); module.verbose('Determined parent element for creating context', $context);
} }
else if(settings.context) { else if(settings.context) {
$context = $(settings.context); $context = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context);
module.verbose('Using selector for tab context', settings.context, $context); module.verbose('Using selector for tab context', settings.context, $context);
} }
else { else {
@ -203,6 +211,7 @@ $.fn.tab = function(parameters) {
.history(true) .history(true)
.state(settings.path) .state(settings.path)
; ;
$(window).trigger('popstate');
} }
else { else {
module.error(error.path); module.error(error.path);
@ -370,6 +379,10 @@ $.fn.tab = function(parameters) {
module.verbose('Tab parameters found', nextPathArray); module.verbose('Tab parameters found', nextPathArray);
} }
} }
if (settings.onBeforeChange.call(element, currentPath) === false) {
module.debug('onBeforeChange returned false, cancelling tab change', $tab);
return false;
}
if(isLastTab && remoteContent) { if(isLastTab && remoteContent) {
if(!shouldIgnoreLoad) { if(!shouldIgnoreLoad) {
module.activate.navigation(currentPath); module.activate.navigation(currentPath);
@ -406,6 +419,10 @@ $.fn.tab = function(parameters) {
// if anchor exists use parent tab // if anchor exists use parent tab
if($anchor && $anchor.length > 0 && currentPath) { if($anchor && $anchor.length > 0 && currentPath) {
module.debug('Anchor link used, opening parent tab', $tab, $anchor); module.debug('Anchor link used, opening parent tab', $tab, $anchor);
if (settings.onBeforeChange.call(element, currentPath) === false) {
module.debug('onBeforeChange returned false, cancelling tab change', $tab);
return false;
}
if( !$tab.hasClass(className.active) ) { if( !$tab.hasClass(className.active) ) {
setTimeout(function() { setTimeout(function() {
module.scrollTo($anchor); module.scrollTo($anchor);
@ -959,6 +976,7 @@ $.fn.tab.settings = {
onLoad : function(tabPath, parameterArray, historyEvent) {}, // called on every load onLoad : function(tabPath, parameterArray, historyEvent) {}, // called on every load
onVisible : function(tabPath, parameterArray, historyEvent) {}, // called every time tab visible onVisible : function(tabPath, parameterArray, historyEvent) {}, // called every time tab visible
onRequest : function(tabPath, parameterArray, historyEvent) {}, // called ever time a tab beings loading remote content onRequest : function(tabPath, parameterArray, historyEvent) {}, // called ever time a tab beings loading remote content
onBeforeChange: function(tabPath) {}, // called before a tab is about to be changed. Returning false will cancel the tab change
templates : { templates : {
determineTitle: function(tabArray) {} // returns page title for path determineTitle: function(tabArray) {} // returns page title for path

2
semantic/dist/components/tab.min.css vendored
View file

@ -6,4 +6,4 @@
* Released under the MIT license * Released under the MIT license
* http://opensource.org/licenses/MIT * http://opensource.org/licenses/MIT
* *
*/.ui.tab{display:none}.ui.tab.active,.ui.tab.open{display:block}.ui.tab.loading{position:relative;overflow:hidden;display:block;min-height:250px}.ui.tab.loading *{position:relative!important;left:-10000px!important}.ui.tab.loading.segment:before,.ui.tab.loading:before{position:absolute;content:'';top:50%;left:50%;margin:-1.25em 0 0 -1.25em;width:2.5em;height:2.5em;border-radius:500rem;border:.2em solid rgba(0,0,0,.1)}.ui.tab.loading.segment:after,.ui.tab.loading:after{position:absolute;content:'';top:50%;left:50%;margin:-1.25em 0 0 -1.25em;width:2.5em;height:2.5em;-webkit-animation:loader .6s infinite linear;animation:loader .6s infinite linear;border:.2em solid #767676;border-radius:500rem;-webkit-box-shadow:0 0 0 1px transparent;box-shadow:0 0 0 1px transparent} */.ui.tab{display:none}.ui.tab.active,.ui.tab.open{display:block}.ui.tab.loading{position:relative;overflow:hidden;display:block;min-height:250px}.ui.tab.loading *{position:relative!important;left:-10000px!important}.ui.tab.loading.segment::before,.ui.tab.loading::before{position:absolute;content:'';top:50%;left:50%;margin:-1.25em 0 0 -1.25em;width:2.5em;height:2.5em;border-radius:500rem;border:.2em solid rgba(0,0,0,.1)}.ui.tab.loading.segment::after,.ui.tab.loading::after{position:absolute;content:'';top:50%;left:50%;margin:-1.25em 0 0 -1.25em;width:2.5em;height:2.5em;-webkit-animation:loader .6s infinite linear;animation:loader .6s infinite linear;border:.2em solid #767676;border-radius:500rem;-webkit-box-shadow:0 0 0 1px transparent;box-shadow:0 0 0 1px transparent}

2
semantic/dist/components/tab.min.js vendored
View file

File diff suppressed because one or more lines are too long

2620
semantic/dist/components/table.css vendored
View file

File diff suppressed because it is too large Load diff

2
semantic/dist/components/table.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/text.css vendored
View file

@ -17,7 +17,7 @@ span.ui.text {
line-height: 1; line-height: 1;
} }
span.ui.primary.text { span.ui.primary.text {
color: #6435C9; color: #2185D0;
} }
span.ui.inverted.primary.text { span.ui.inverted.primary.text {
color: #54C8FF; color: #54C8FF;

2
semantic/dist/components/text.min.css vendored
View file

@ -6,4 +6,4 @@
* Released under the MIT license * Released under the MIT license
* https://github.com/fomantic/Fomantic-UI/blob/master/LICENSE.md * https://github.com/fomantic/Fomantic-UI/blob/master/LICENSE.md
* *
*/span.ui.text{line-height:1}span.ui.primary.text{color:#6435c9}span.ui.inverted.primary.text{color:#54c8ff}span.ui.secondary.text{color:#1b1c1d}span.ui.inverted.secondary.text{color:#545454}span.ui.red.text{color:#db2828}span.ui.inverted.red.text{color:#ff695e}span.ui.orange.text{color:#f2711c}span.ui.inverted.orange.text{color:#ff851b}span.ui.yellow.text{color:#fbbd08}span.ui.inverted.yellow.text{color:#ffe21f}span.ui.olive.text{color:#b5cc18}span.ui.inverted.olive.text{color:#d9e778}span.ui.green.text{color:#21ba45}span.ui.inverted.green.text{color:#2ecc40}span.ui.teal.text{color:#00b5ad}span.ui.inverted.teal.text{color:#6dffff}span.ui.blue.text{color:#2185d0}span.ui.inverted.blue.text{color:#54c8ff}span.ui.violet.text{color:#6435c9}span.ui.inverted.violet.text{color:#a291fb}span.ui.purple.text{color:#a333c8}span.ui.inverted.purple.text{color:#dc73ff}span.ui.pink.text{color:#e03997}span.ui.inverted.pink.text{color:#ff8edf}span.ui.brown.text{color:#a5673f}span.ui.inverted.brown.text{color:#d67c1c}span.ui.grey.text{color:#767676}span.ui.inverted.grey.text{color:#dcddde}span.ui.black.text{color:#1b1c1d}span.ui.inverted.black.text{color:#545454}span.ui.error.text{color:#db2828}span.ui.info.text{color:#31ccec}span.ui.success.text{color:#21ba45}span.ui.warning.text{color:#f2c037}span.ui.disabled.text{opacity:.45}span.ui.medium.text{font-size:1em}span.ui.mini.text{font-size:.4em}span.ui.tiny.text{font-size:.5em}span.ui.small.text{font-size:.75em}span.ui.large.text{font-size:1.5em}span.ui.big.text{font-size:2em}span.ui.huge.text{font-size:4em}span.ui.massive.text{font-size:8em} */span.ui.text{line-height:1}span.ui.primary.text{color:#2185d0}span.ui.inverted.primary.text{color:#54c8ff}span.ui.secondary.text{color:#1b1c1d}span.ui.inverted.secondary.text{color:#545454}span.ui.red.text{color:#db2828}span.ui.inverted.red.text{color:#ff695e}span.ui.orange.text{color:#f2711c}span.ui.inverted.orange.text{color:#ff851b}span.ui.yellow.text{color:#fbbd08}span.ui.inverted.yellow.text{color:#ffe21f}span.ui.olive.text{color:#b5cc18}span.ui.inverted.olive.text{color:#d9e778}span.ui.green.text{color:#21ba45}span.ui.inverted.green.text{color:#2ecc40}span.ui.teal.text{color:#00b5ad}span.ui.inverted.teal.text{color:#6dffff}span.ui.blue.text{color:#2185d0}span.ui.inverted.blue.text{color:#54c8ff}span.ui.violet.text{color:#6435c9}span.ui.inverted.violet.text{color:#a291fb}span.ui.purple.text{color:#a333c8}span.ui.inverted.purple.text{color:#dc73ff}span.ui.pink.text{color:#e03997}span.ui.inverted.pink.text{color:#ff8edf}span.ui.brown.text{color:#a5673f}span.ui.inverted.brown.text{color:#d67c1c}span.ui.grey.text{color:#767676}span.ui.inverted.grey.text{color:#dcddde}span.ui.black.text{color:#1b1c1d}span.ui.inverted.black.text{color:#545454}span.ui.error.text{color:#db2828}span.ui.info.text{color:#31ccec}span.ui.success.text{color:#21ba45}span.ui.warning.text{color:#f2c037}span.ui.disabled.text{opacity:.45}span.ui.medium.text{font-size:1em}span.ui.mini.text{font-size:.4em}span.ui.tiny.text{font-size:.5em}span.ui.small.text{font-size:.75em}span.ui.large.text{font-size:1.5em}span.ui.big.text{font-size:2em}span.ui.huge.text{font-size:4em}span.ui.massive.text{font-size:8em}

113
semantic/dist/components/toast.css vendored
View file

@ -17,6 +17,9 @@
position: fixed; position: fixed;
z-index: 9999; z-index: 9999;
} }
.ui.toast-container.absolute {
position: absolute;
}
.ui.toast-container.ui.attached { .ui.toast-container.ui.attached {
width: 100%; width: 100%;
left: 0; left: 0;
@ -64,36 +67,42 @@
bottom: 0; bottom: 0;
} }
.ui.toast-container.top.right { .ui.toast-container.top.right {
top: 1em; top: 0.85714286em;
right: 1em; right: 0.85714286em;
margin-left: 1em; margin-left: 0.85714286em;
} }
.ui.toast-container.top.left { .ui.toast-container.top.left {
top: 1em; top: 0.85714286em;
left: 1em; left: 0.85714286em;
margin-right: 1em; margin-right: 0.85714286em;
} }
.ui.toast-container.top.center { .ui.toast-container.top.center {
left: 50%; left: 50%;
-webkit-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0); transform: translate(-50%, 0);
top: 1em; top: 0.85714286em;
} }
.ui.toast-container.bottom.right { .ui.toast-container.bottom.right {
bottom: 1em; bottom: 0.85714286em;
right: 1em; right: 0.85714286em;
margin-left: 1em; margin-left: 0.85714286em;
} }
.ui.toast-container.bottom.left { .ui.toast-container.bottom.left {
bottom: 1em; bottom: 0.85714286em;
left: 1em; left: 0.85714286em;
margin-right: 1em; margin-right: 0.85714286em;
} }
.ui.toast-container.bottom.center { .ui.toast-container.bottom.center {
left: 50%; left: 50%;
-webkit-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0); transform: translate(-50%, 0);
bottom: 1em; bottom: 0.85714286em;
}
.ui.toast-container.centered {
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
} }
.ui.toast-container .visible.toast-box, .ui.toast-container .visible.toast-box,
.ui.toast-container .animating.toast-box, .ui.toast-container .animating.toast-box,
@ -114,7 +123,7 @@
} }
.ui.toast-container .toast-box { .ui.toast-container .toast-box {
margin-bottom: 0.5em; margin-bottom: 0.5em;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
cursor: default; cursor: default;
} }
.ui.toast-container .toast-box:hover { .ui.toast-container .toast-box:hover {
@ -351,8 +360,8 @@
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.ui.vertical.attached:not(.left).actions { .ui.vertical.attached:not(.left).actions {
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
border-bottom-right-radius: 0.33333333rem; border-bottom-right-radius: 0.28571429rem;
} }
.ui.vertical.attached:not(.left).actions .button:first-child, .ui.vertical.attached:not(.left).actions .button:first-child,
.ui.vertical.attached:not(.left).actions .button:last-child { .ui.vertical.attached:not(.left).actions .button:last-child {
@ -361,7 +370,7 @@
} }
.ui.vertical.attached:not(.left).message { .ui.vertical.attached:not(.left).message {
border-top-right-radius: 0; border-top-right-radius: 0;
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
} }
.ui.vertical.attached.left.card > .image > img { .ui.vertical.attached.left.card > .image > img {
border-top-left-radius: 0; border-top-left-radius: 0;
@ -376,8 +385,8 @@
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
} }
.ui.vertical.attached.left.actions { .ui.vertical.attached.left.actions {
border-top-left-radius: 0.33333333rem; border-top-left-radius: 0.28571429rem;
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
} }
.ui.vertical.attached.left.actions .button:first-child, .ui.vertical.attached.left.actions .button:first-child,
.ui.vertical.attached.left.actions .button:last-child { .ui.vertical.attached.left.actions .button:last-child {
@ -385,28 +394,28 @@
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.ui.vertical.attached.left.message.message.message { .ui.vertical.attached.left.message.message.message {
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
border-bottom-right-radius: 0.33333333rem; border-bottom-right-radius: 0.28571429rem;
} }
.ui.attached:not(.vertical):not(.top).actions { .ui.attached:not(.vertical):not(.top).actions {
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
border-bottom-right-radius: 0.33333333rem; border-bottom-right-radius: 0.28571429rem;
} }
.ui.attached:not(.vertical):not(.top).actions .button:first-child { .ui.attached:not(.vertical):not(.top).actions .button:first-child {
border-bottom-left-radius: 0.33333333rem; border-bottom-left-radius: 0.28571429rem;
} }
.ui.attached:not(.vertical):not(.top).actions .button:last-child { .ui.attached:not(.vertical):not(.top).actions .button:last-child {
border-bottom-right-radius: 0.33333333rem; border-bottom-right-radius: 0.28571429rem;
} }
.ui.attached:not(.vertical).top.actions { .ui.attached:not(.vertical).top.actions {
border-top-left-radius: 0.33333333rem; border-top-left-radius: 0.28571429rem;
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
} }
.ui.attached:not(.vertical).top.actions .button:first-child { .ui.attached:not(.vertical).top.actions .button:first-child {
border-top-left-radius: 0.33333333rem; border-top-left-radius: 0.28571429rem;
} }
.ui.attached:not(.vertical).top.actions .button:last-child { .ui.attached:not(.vertical).top.actions .button:last-child {
border-top-right-radius: 0.33333333rem; border-top-right-radius: 0.28571429rem;
} }
@ -416,8 +425,8 @@
.ui.toast { .ui.toast {
display: none; display: none;
border-radius: 0.33333333rem; border-radius: 0.28571429rem;
padding: 0.91666667em 1.16666667em; padding: 0.78571429em 1em;
margin: 0 -1px -0.01em; margin: 0 -1px -0.01em;
color: rgba(0, 0, 0, 0.87); color: rgba(0, 0, 0, 0.87);
background-color: #FFFFFF; background-color: #FFFFFF;
@ -490,6 +499,16 @@
.ui.toast:not(.vertical).actions > .centered.icon { .ui.toast:not(.vertical).actions > .centered.icon {
top: calc(50% - 1.2em); top: calc(50% - 1.2em);
} }
.ui.toast.vertical > .content {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.ui.toast.vertical.attached {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.ui.toast.vertical > .close.icon + .content { .ui.toast.vertical > .close.icon + .content {
padding-left: 1em; padding-left: 1em;
} }
@ -518,6 +537,28 @@
border-bottom-left-radius: 0; border-bottom-left-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.ui.toast.ui.ui.ui.image {
padding: 0;
}
.ui.toast.ui.ui.ui.image > .content {
padding-top: 0.78571429em;
padding-bottom: 0.78571429em;
padding-right: 1em;
}
.ui.toast.ui.ui.ui.image > .actions {
margin: 0;
}
.ui.toast.ui.ui.ui.image > .ui.image {
border-top-left-radius: 0.28571429rem;
border-bottom-left-radius: 0.28571429rem;
}
.ui.toast.ui.ui.ui.image > .ui.image.mini {
min-width: calc(0.7857142857142857em + 35px);
}
.ui.toast.ui.ui.ui.image > .ui.image.mini + .content {
min-height: calc(0.7857142857142857em + 35px);
padding-left: 4.4em;
}
.ui.hoverfloating.message:hover { .ui.hoverfloating.message:hover {
-webkit-box-shadow: 0 0 0 1px inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); -webkit-box-shadow: 0 0 0 1px inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
box-shadow: 0 0 0 1px inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); box-shadow: 0 0 0 1px inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
@ -567,7 +608,7 @@
-------------- */ -------------- */
.ui.primary.toast { .ui.primary.toast {
background-color: #6435C9; background-color: #2185D0;
color: rgba(255, 255, 255, 0.9); color: rgba(255, 255, 255, 0.9);
} }
.ui.inverted.primary.toast, .ui.inverted.primary.toast,
@ -774,3 +815,9 @@
opacity: 0; opacity: 0;
} }
} }
/*******************************
Theme Overrides
*******************************/

92
semantic/dist/components/toast.js vendored
View file

@ -61,7 +61,7 @@ $.fn.toast = function(parameters) {
$animationObject, $animationObject,
$close, $close,
$context = (settings.context) $context = (settings.context)
? $(settings.context) ? ([window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context))
: $('body'), : $('body'),
isToastComponent = $module.hasClass('toast') || $module.hasClass('message') || $module.hasClass('card'), isToastComponent = $module.hasClass('toast') || $module.hasClass('message') || $module.hasClass('card'),
@ -69,12 +69,14 @@ $.fn.toast = function(parameters) {
element = this, element = this,
instance = isToastComponent ? $module.data(moduleNamespace) : undefined, instance = isToastComponent ? $module.data(moduleNamespace) : undefined,
id,
module module
; ;
module = { module = {
initialize: function() { initialize: function() {
module.verbose('Initializing element'); module.verbose('Initializing element');
module.create.id();
if (!module.has.container()) { if (!module.has.container()) {
module.create.container(); module.create.container();
} }
@ -124,17 +126,22 @@ $.fn.toast = function(parameters) {
}, },
show: function(callback) { show: function(callback) {
callback = callback || function(){};
module.debug('Showing toast');
if(settings.onShow.call($toastBox, element) === false) { if(settings.onShow.call($toastBox, element) === false) {
module.debug('onShow callback returned false, cancelling toast animation'); module.debug('onShow callback returned false, cancelling toast animation');
return; return;
} }
callback = callback || function(){};
module.debug('Showing toast');
module.animate.show(callback); module.animate.show(callback);
}, },
close: function(callback) { close: function(callback) {
if(settings.onHide.call($toastBox, element) === false) {
module.debug('onHide callback returned false, cancelling toast animation');
return;
}
callback = callback || function(){}; callback = callback || function(){};
module.debug('Closing toast');
module.remove.visible(); module.remove.visible();
module.unbind.events(); module.unbind.events();
module.animate.close(callback); module.animate.close(callback);
@ -144,14 +151,18 @@ $.fn.toast = function(parameters) {
create: { create: {
container: function() { container: function() {
module.verbose('Creating container'); module.verbose('Creating container');
$context.append($('<div/>',{class: settings.position + ' ' + className.container + ' ' +(settings.horizontal ? className.horizontal : '')})); $context.append($('<div/>',{class: settings.position + ' ' + className.container + ' ' +(settings.horizontal ? className.horizontal : '') + ' ' + (settings.context && settings.context !== 'body' ? className.absolute : '')}));
},
id: function() {
id = (Math.random().toString(16) + '000000000').slice(2, 10);
module.verbose('Creating unique id for element', id);
}, },
toast: function() { toast: function() {
$toastBox = $('<div/>', {class: className.box}); $toastBox = $('<div/>', {class: className.box});
var iconClass = module.get.iconClass(); var iconClass = module.get.iconClass();
if (!isToastComponent) { if (!isToastComponent) {
module.verbose('Creating toast'); module.verbose('Creating toast');
$toast = $('<div/>'); $toast = $('<div/>', {role: 'alert'});
var $content = $('<div/>', {class: className.content}); var $content = $('<div/>', {class: className.content});
if (iconClass !== '') { if (iconClass !== '') {
$toast.append($('<i/>', {class: iconClass + ' ' + className.icon})); $toast.append($('<i/>', {class: iconClass + ' ' + className.icon}));
@ -164,13 +175,21 @@ $.fn.toast = function(parameters) {
})); }));
} }
if (settings.title !== '') { if (settings.title !== '') {
var titleId = '_' + module.get.id() + 'title';
$toast.attr('aria-labelledby', titleId);
$content.append($('<div/>', { $content.append($('<div/>', {
class: className.title, class: className.title,
text: settings.title id: titleId,
html: module.helpers.escape(settings.title, settings.preserveHTML)
})); }));
} }
var descId = '_' + module.get.id() + 'desc';
$content.append($('<div/>', {class: className.message, html: module.helpers.escape(settings.message, settings.preserveHTML)})); $toast.attr('aria-describedby', descId);
$content.append($('<div/>', {
class: className.message,
id: descId,
html: module.helpers.escape(settings.message, settings.preserveHTML)
}));
$toast $toast
.addClass(settings.class + ' ' + className.toast) .addClass(settings.class + ' ' + className.toast)
@ -178,7 +197,7 @@ $.fn.toast = function(parameters) {
; ;
$toast.css('opacity', settings.opacity); $toast.css('opacity', settings.opacity);
if (settings.closeIcon) { if (settings.closeIcon) {
$close = $('<i/>', {class: className.close + ' ' + (typeof settings.closeIcon === 'string' ? settings.closeIcon : '')}); $close = $('<i/>', {class: className.close + ' ' + (typeof settings.closeIcon === 'string' ? settings.closeIcon : ''), role: 'button', tabindex: 0, 'aria-label': settings.text.close});
if($close.hasClass(className.left)) { if($close.hasClass(className.left)) {
$toast.prepend($close); $toast.prepend($close);
} else { } else {
@ -221,15 +240,17 @@ $.fn.toast = function(parameters) {
} }
} }
settings.actions.forEach(function (el) { settings.actions.forEach(function (el) {
var icon = el[fields.icon] ? '<i class="' + module.helpers.deQuote(el[fields.icon]) + ' icon"></i>' : '', var icon = el[fields.icon] ? '<i '+(el[fields.text] ? 'aria-hidden="true"' : '')+' class="' + module.helpers.deQuote(el[fields.icon]) + ' icon"></i>' : '',
text = module.helpers.escape(el[fields.text] || '', settings.preserveHTML), text = module.helpers.escape(el[fields.text] || '', settings.preserveHTML),
cls = module.helpers.deQuote(el[fields.class] || ''), cls = module.helpers.deQuote(el[fields.class] || ''),
click = el[fields.click] && $.isFunction(el[fields.click]) ? el[fields.click] : function () {}; click = el[fields.click] && $.isFunction(el[fields.click]) ? el[fields.click] : function () {};
$actions.append($('<button/>', { $actions.append($('<button/>', {
html: icon + text, html: icon + text,
'aria-label': (el[fields.text] || el[fields.icon] || '').replace(/<[^>]+(>|$)/g,''),
class: className.button + ' ' + cls, class: className.button + ' ' + cls,
click: function () { click: function () {
if (click.call(element, $module) === false) { var button = $(this);
if (button.is(selector.approve) || button.is(selector.deny) || click.call(element, $module) === false) {
return; return;
} }
module.close(); module.close();
@ -329,13 +350,12 @@ $.fn.toast = function(parameters) {
bind: { bind: {
events: function() { events: function() {
module.debug('Binding events to toast'); module.debug('Binding events to toast');
if(settings.closeOnClick || settings.closeIcon) { if(settings.closeIcon) {
(settings.closeIcon ? $close : $toast) $close.on('click' + eventNamespace, module.event.close);
.on('click' + eventNamespace, module.event.click)
;
} }
$toast.on('click' + eventNamespace, module.event.click);
if($animationObject) { if($animationObject) {
$animationObject.on('animationend' + eventNamespace, module.close); $animationObject.on('animationend' + eventNamespace, module.event.close);
} }
$toastBox $toastBox
.on('click' + eventNamespace, selector.approve, module.event.approve) .on('click' + eventNamespace, selector.approve, module.event.approve)
@ -347,11 +367,10 @@ $.fn.toast = function(parameters) {
unbind: { unbind: {
events: function() { events: function() {
module.debug('Unbinding events to toast'); module.debug('Unbinding events to toast');
if(settings.closeOnClick || settings.closeIcon) { if(settings.closeIcon) {
(settings.closeIcon ? $close : $toast) $close.off('click' + eventNamespace);
.off('click' + eventNamespace)
;
} }
$toast.off('click' + eventNamespace);
if($animationObject) { if($animationObject) {
$animationObject.off('animationend' + eventNamespace); $animationObject.off('animationend' + eventNamespace);
} }
@ -383,11 +402,6 @@ $.fn.toast = function(parameters) {
}, },
close: function(callback) { close: function(callback) {
callback = $.isFunction(callback) ? callback : function(){}; callback = $.isFunction(callback) ? callback : function(){};
module.debug('Closing toast');
if(settings.onHide.call($toastBox, element) === false) {
module.debug('onHide callback returned false, cancelling toast animation');
return;
}
if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) { if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) {
$toastBox $toastBox
.transition({ .transition({
@ -443,7 +457,7 @@ $.fn.toast = function(parameters) {
has: { has: {
container: function() { container: function() {
module.verbose('Determining if there is already a container'); module.verbose('Determining if there is already a container');
return ($context.find(module.helpers.toClass(settings.position) + selector.container + (settings.horizontal ? module.helpers.toClass(className.horizontal) : '')).length > 0); return module.get.containers().length > 0;
}, },
toast: function(){ toast: function(){
return !!module.get.toast(); return !!module.get.toast();
@ -457,8 +471,14 @@ $.fn.toast = function(parameters) {
}, },
get: { get: {
id: function() {
return id;
},
containers: function() {
return $context.children(module.helpers.toClass(settings.position) + selector.container + (settings.horizontal ? module.helpers.toClass(className.horizontal) : ':not('+module.helpers.toClass(className.horizontal)+')') + (settings.context && settings.context !== 'body' ? module.helpers.toClass(className.absolute) : ':not('+module.helpers.toClass(className.absolute)+')'));
},
container: function() { container: function() {
return ($context.find(module.helpers.toClass(settings.position) + selector.container)[0]); return module.get.containers()[0];
}, },
toastBox: function() { toastBox: function() {
return $toastBox || null; return $toastBox || null;
@ -490,9 +510,15 @@ $.fn.toast = function(parameters) {
}, },
event: { event: {
close: function(){
module.close();
},
click: function(event) { click: function(event) {
if($(event.target).closest('a').length === 0) { if($(event.target).closest(selector.clickable).length === 0) {
settings.onClick.call($toastBox, element); if(settings.onClick.call($toastBox, element) === false || !settings.closeOnClick) {
module.verbose('Click callback returned false or close denied by setting cancelling close');
return;
}
module.close(); module.close();
} }
}, },
@ -515,7 +541,7 @@ $.fn.toast = function(parameters) {
helpers: { helpers: {
toClass: function(selector) { toClass: function(selector) {
var var
classes = selector.split(' '), classes = selector.trim().split(/\s+/),
result = '' result = ''
; ;
@ -805,6 +831,7 @@ $.fn.toast.settings = {
className : { className : {
container : 'ui toast-container', container : 'ui toast-container',
absolute : 'absolute',
box : 'floating toast-box', box : 'floating toast-box',
progress : 'ui attached active progress', progress : 'ui attached active progress',
toast : 'ui toast', toast : 'ui toast',
@ -833,6 +860,10 @@ $.fn.toast.settings = {
unclickable : 'unclickable' unclickable : 'unclickable'
}, },
text: {
close : 'Close'
},
icons : { icons : {
info : 'info', info : 'info',
success : 'checkmark', success : 'checkmark',
@ -849,6 +880,7 @@ $.fn.toast.settings = {
image : '> img.image, > .image > img', image : '> img.image, > .image > img',
icon : '> i.icon', icon : '> i.icon',
input : 'input:not([type="hidden"]), textarea, select, button, .ui.button, ui.dropdown', input : 'input:not([type="hidden"]), textarea, select, button, .ui.button, ui.dropdown',
clickable : 'a, details, .ui.accordion',
approve : '.actions .positive, .actions .approve, .actions .ok', approve : '.actions .positive, .actions .approve, .actions .ok',
deny : '.actions .negative, .actions .deny, .actions .cancel' deny : '.actions .negative, .actions .deny, .actions .cancel'
}, },

2
semantic/dist/components/toast.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/components/toast.min.js vendored
View file

File diff suppressed because one or more lines are too long

31
semantic/dist/components/transition.js vendored
View file

@ -771,6 +771,10 @@ $.fn.transition = function() {
}, },
hide: function() { hide: function() {
if(settings.onHide.call(element) === false) {
module.verbose('Hide callback returned false cancelling hide');
return false;
}
module.verbose('Hiding element'); module.verbose('Hiding element');
if( module.is.animating() ) { if( module.is.animating() ) {
module.reset(); module.reset();
@ -778,33 +782,30 @@ $.fn.transition = function() {
element.blur(); // IE will trigger focus change if element is not blurred before hiding element.blur(); // IE will trigger focus change if element is not blurred before hiding
module.remove.display(); module.remove.display();
module.remove.visible(); module.remove.visible();
if($.isFunction(settings.onBeforeHide)){ settings.onBeforeHide.call(element, module.hideNow);
settings.onBeforeHide.call(element,function(){
module.hideNow();
});
} else {
module.hideNow();
}
}, },
hideNow: function() { hideNow: function() {
module.set.hidden(); module.set.hidden();
module.force.hidden(); module.force.hidden();
settings.onHide.call(element); settings.onHidden.call(element);
settings.onComplete.call(element); settings.onComplete.call(element);
// module.repaint(); // module.repaint();
}, },
show: function(display) { show: function(display) {
if(module.force.visible() && settings.onShow.call(element) !== false) {
module.verbose('Showing element', display); module.verbose('Showing element', display);
if(module.force.visible()) {
module.remove.hidden(); module.remove.hidden();
settings.onBeforeShow.call(element, module.showNow);
}
},
showNow: function(){
module.set.visible(); module.set.visible();
settings.onShow.call(element); settings.onVisible.call(element);
settings.onComplete.call(element); settings.onComplete.call(element);
// module.repaint(); // module.repaint();
}
}, },
toggle: function() { toggle: function() {
@ -1055,7 +1056,11 @@ $.fn.transition.settings = {
onStart : function() {}, onStart : function() {},
onComplete : function() {}, onComplete : function() {},
onShow : function() {}, onShow : function() {},
onBeforeShow : function(callback) {callback.call(this)},
onVisible : function() {},
onHide : function() {}, onHide : function() {},
onHidden : function() {},
onBeforeHide : function(callback) {callback.call(this)},
// whether timeout should be used to ensure callback fires in cases animationend does not // whether timeout should be used to ensure callback fires in cases animationend does not
useFailSafe : true, useFailSafe : true,
@ -1097,7 +1102,7 @@ $.fn.transition.settings = {
// possible errors // possible errors
error: { error: {
noAnimation : 'Element is no longer attached to DOM. Unable to animate. Use silent setting to surpress this warning in production.', noAnimation : 'Element is no longer attached to DOM. Unable to animate. Use silent setting to suppress this warning in production.',
repeated : 'That animation is already occurring, cancelling repeated animation', repeated : 'That animation is already occurring, cancelling repeated animation',
method : 'The method you called is not defined', method : 'The method you called is not defined',
support : 'This browser does not support CSS animations' support : 'This browser does not support CSS animations'

2
semantic/dist/components/transition.min.js vendored
View file

File diff suppressed because one or more lines are too long

13976
semantic/dist/semantic.css vendored
View file

File diff suppressed because one or more lines are too long

1115
semantic/dist/semantic.js vendored
View file

File diff suppressed because it is too large Load diff

2
semantic/dist/semantic.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
semantic/dist/semantic.min.js vendored
View file

File diff suppressed because one or more lines are too long

BIN
semantic/dist/themes/default/assets/fonts/Lato-Bold.woff vendored Normal file
View file

Binary file not shown.

BIN
semantic/dist/themes/default/assets/fonts/Lato-Bold.woff2 vendored Normal file
View file

Binary file not shown.

BIN
semantic/dist/themes/default/assets/fonts/Lato-BoldItalic.woff vendored Normal file
View file

Binary file not shown.

BIN
semantic/dist/themes/default/assets/fonts/Lato-BoldItalic.woff2 vendored Normal file
View file

Binary file not shown.

Some files were not shown because too many files have changed in this diff Show more