diff --git a/web_src/css/base.css b/web_src/css/base.css
index 58a5723cb56..df9028b50aa 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -680,10 +680,6 @@ input:-webkit-autofill:active,
box-shadow: 0 6px 18px var(--color-shadow) !important;
}
-.ui.dimmer {
- background: var(--color-overlay-backdrop);
-}
-
.ui.dropdown .menu > .header {
font-size: 0.8em;
}
diff --git a/web_src/css/index.css b/web_src/css/index.css
index edd6cdca8bd..817f6997da2 100644
--- a/web_src/css/index.css
+++ b/web_src/css/index.css
@@ -16,6 +16,7 @@
@import "./modules/table.css";
@import "./modules/card.css";
@import "./modules/checkbox.css";
+@import "./modules/dimmer.css";
@import "./modules/modal.css";
@import "./modules/select.css";
diff --git a/web_src/css/modules/dimmer.css b/web_src/css/modules/dimmer.css
new file mode 100644
index 00000000000..a552d103e53
--- /dev/null
+++ b/web_src/css/modules/dimmer.css
@@ -0,0 +1,30 @@
+/* These are the remnants of the fomantic dimmer module */
+
+.ui.dimmer {
+ position: fixed;
+ display: none;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: var(--color-overlay-backdrop);
+ opacity: 0;
+ z-index: 1000;
+ overflow-y: auto;
+ justify-content: center;
+ padding: 8px 0;
+ animation-name: fadein;
+ animation-duration: .2s;
+ user-select: none;
+}
+
+.ui.active.dimmer {
+ display: flex;
+ opacity: 1;
+}
+
+.ui.dimmer > * {
+ position: static;
+ margin-top: auto !important;
+ margin-bottom: auto !important;
+}
diff --git a/web_src/fomantic/build/semantic.css b/web_src/fomantic/build/semantic.css
index 7c404bdb30a..aef7a6bdbee 100644
--- a/web_src/fomantic/build/semantic.css
+++ b/web_src/fomantic/build/semantic.css
@@ -8,363 +8,6 @@
* http://opensource.org/licenses/MIT
*
*/
-/*!
- * # Fomantic-UI - Dimmer
- * http://github.com/fomantic/Fomantic-UI/
- *
- *
- * Released under the MIT license
- * http://opensource.org/licenses/MIT
- *
- */
-
-/*******************************
- Dimmer
-*******************************/
-
-.dimmable:not(body) {
- position: relative;
-}
-
-.ui.dimmer {
- display: none;
- position: absolute;
- top: 0 !important;
- left: 0 !important;
- width: 100%;
- height: 100%;
- text-align: center;
- vertical-align: middle;
- padding: 1em;
- background: rgba(0, 0, 0, 0.85);
- opacity: 0;
- line-height: 1;
- animation-fill-mode: both;
- animation-duration: 0.5s;
- transition: background-color 0.5s linear;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- -webkit-user-select: none;
- -moz-user-select: none;
- user-select: none;
- will-change: opacity;
- z-index: 1000;
-}
-
-/* Dimmer Content */
-
-.ui.dimmer > .content {
- -webkit-user-select: text;
- -moz-user-select: text;
- user-select: text;
- color: #FFFFFF;
-}
-
-/* Loose Coupling */
-
-.ui.segment > .ui.dimmer:not(.page) {
- border-radius: inherit;
-}
-
-/* Scrollbars */
-
-/*******************************
- States
-*******************************/
-
-/* Animating */
-
-.animating.dimmable:not(body),
-.dimmed.dimmable:not(body) {
- overflow: hidden;
-}
-
-/* Animating / Active / Visible */
-
-.dimmed.dimmable > .ui.animating.dimmer,
-.dimmed.dimmable > .ui.visible.dimmer,
-.ui.active.dimmer {
- display: flex;
- opacity: 1;
-}
-
-/* Disabled */
-
-.ui.disabled.dimmer {
- width: 0 !important;
- height: 0 !important;
-}
-
-/*******************************
- Variations
-*******************************/
-
-/*--------------
- Legacy
- ---------------*/
-
-/* Animating / Active / Visible */
-
-.dimmed.dimmable > .ui.animating.legacy.dimmer,
-.dimmed.dimmable > .ui.visible.legacy.dimmer,
-.ui.active.legacy.dimmer {
- display: block;
-}
-
-/*--------------
- Alignment
- ---------------*/
-
-.ui[class*="top aligned"].dimmer {
- justify-content: flex-start;
-}
-
-.ui[class*="bottom aligned"].dimmer {
- justify-content: flex-end;
-}
-
-/*--------------
- Page
- ---------------*/
-
-.ui.page.dimmer {
- position: fixed;
- transform-style: '';
- perspective: 2000px;
- transform-origin: center center;
-}
-
-.ui.page.dimmer.modals {
- -moz-perspective: none;
-}
-
-body.animating.in.dimmable,
-body.dimmed.dimmable {
- overflow: hidden;
-}
-
-body.dimmable > .dimmer {
- position: fixed;
-}
-
-/*--------------
- Blurring
- ---------------*/
-
-.blurring.dimmable > :not(.dimmer) {
- filter: initial;
- transition: 800ms filter ease;
-}
-
-.blurring.dimmed.dimmable > :not(.dimmer):not(.popup) {
- filter: blur(5px) grayscale(0.7);
-}
-
-/* Dimmer Color */
-
-.blurring.dimmable > .dimmer {
- background: rgba(0, 0, 0, 0.6);
-}
-
-.blurring.dimmable > .inverted.dimmer {
- background: rgba(255, 255, 255, 0.6);
-}
-
-/*--------------
- Aligned
- ---------------*/
-
-.ui.dimmer > .top.aligned.content > * {
- vertical-align: top;
-}
-
-.ui.dimmer > .bottom.aligned.content > * {
- vertical-align: bottom;
-}
-
-/*--------------
- Shades
- ---------------*/
-
-.medium.medium.medium.medium.medium.dimmer {
- background: rgba(0, 0, 0, 0.65);
-}
-
-.light.light.light.light.light.dimmer {
- background: rgba(0, 0, 0, 0.45);
-}
-
-.very.light.light.light.light.dimmer {
- background: rgba(0, 0, 0, 0.25);
-}
-
-/*--------------
- Simple
- ---------------*/
-
-/* Displays without javascript */
-
-.ui.simple.dimmer {
- display: block;
- overflow: hidden;
- opacity: 0;
- width: 0;
- height: 0;
- z-index: -100;
- background: rgba(0, 0, 0, 0);
-}
-
-.dimmed.dimmable > .ui.simple.dimmer {
- overflow: visible;
- opacity: 1;
- width: 100%;
- height: 100%;
- background: rgba(0, 0, 0, 0.85);
- z-index: 1;
-}
-
-.ui.simple.inverted.dimmer {
- background: rgba(255, 255, 255, 0);
-}
-
-.dimmed.dimmable > .ui.simple.inverted.dimmer {
- background: rgba(255, 255, 255, 0.85);
-}
-
-/*--------------
- Partially
- ----------------*/
-
-.ui[class*="top dimmer"],
-.ui[class*="center dimmer"],
-.ui[class*="bottom dimmer"] {
- height: auto;
-}
-
-.ui[class*="bottom dimmer"] {
- top: auto !important;
- bottom: 0;
-}
-
-.ui[class*="center dimmer"] {
- top: 50% !important;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - 0.5px));
-}
-
-.ui.segment > .ui.ui[class*="top dimmer"] {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
-}
-
-.ui.segment > .ui.ui[class*="center dimmer"] {
- border-radius: 0;
-}
-
-.ui.segment > .ui.ui[class*="bottom dimmer"] {
- border-top-left-radius: 0;
- border-top-right-radius: 0;
-}
-
-.ui[class*="center dimmer"].transition[class*="fade up"].in {
- animation-name: fadeInUpCenter;
-}
-
-.ui[class*="center dimmer"].transition[class*="fade down"].in {
- animation-name: fadeInDownCenter;
-}
-
-.ui[class*="center dimmer"].transition[class*="fade up"].out {
- animation-name: fadeOutUpCenter;
-}
-
-.ui[class*="center dimmer"].transition[class*="fade down"].out {
- animation-name: fadeOutDownCenter;
-}
-
-.ui[class*="center dimmer"].bounce.transition {
- animation-name: bounceCenter;
-}
-
-@keyframes fadeInUpCenter {
- 0% {
- opacity: 0;
- transform: translateY(-40%);
- -webkit-transform: translateY(calc(-40% - 0.5px));
- }
-
- 100% {
- opacity: 1;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - 0.5px));
- }
-}
-
-@keyframes fadeInDownCenter {
- 0% {
- opacity: 0;
- transform: translateY(-60%);
- -webkit-transform: translateY(calc(-60% - 0.5px));
- }
-
- 100% {
- opacity: 1;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - 0.5px));
- }
-}
-
-@keyframes fadeOutUpCenter {
- 0% {
- opacity: 1;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - 0.5px));
- }
-
- 100% {
- opacity: 0;
- transform: translateY(-45%);
- -webkit-transform: translateY(calc(-45% - 0.5px));
- }
-}
-
-@keyframes fadeOutDownCenter {
- 0% {
- opacity: 1;
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - 0.5px));
- }
-
- 100% {
- opacity: 0;
- transform: translateY(-55%);
- -webkit-transform: translateY(calc(-55% - 0.5px));
- }
-}
-
-@keyframes bounceCenter {
- 0%, 20%, 50%, 80%, 100% {
- transform: translateY(-50%);
- -webkit-transform: translateY(calc(-50% - 0.5px));
- }
-
- 40% {
- transform: translateY(calc(-50% - 30px));
- }
-
- 60% {
- transform: translateY(calc(-50% - 15px));
- }
-}
-
-/*******************************
- Theme Overrides
-*******************************/
-
-/*******************************
- User Overrides
-*******************************/
/*!
* # Fomantic-UI - Dropdown
* http://github.com/fomantic/Fomantic-UI/
diff --git a/web_src/fomantic/build/semantic.js b/web_src/fomantic/build/semantic.js
index c150c8d9dbf..1297216a311 100644
--- a/web_src/fomantic/build/semantic.js
+++ b/web_src/fomantic/build/semantic.js
@@ -1184,760 +1184,6 @@ $.api.settings = {
-})( jQuery, window, document );
-
-/*!
- * # Fomantic-UI - Dimmer
- * http://github.com/fomantic/Fomantic-UI/
- *
- *
- * Released under the MIT license
- * http://opensource.org/licenses/MIT
- *
- */
-
-;(function ($, window, document, undefined) {
-
-'use strict';
-
-$.isFunction = $.isFunction || function(obj) {
- return typeof obj === "function" && typeof obj.nodeType !== "number";
-};
-
-window = (typeof window != 'undefined' && window.Math == Math)
- ? window
- : (typeof self != 'undefined' && self.Math == Math)
- ? self
- : Function('return this')()
-;
-
-$.fn.dimmer = function(parameters) {
- var
- $allModules = $(this),
-
- time = new Date().getTime(),
- performance = [],
-
- query = arguments[0],
- methodInvoked = (typeof query == 'string'),
- queryArguments = [].slice.call(arguments, 1),
-
- returnedValue
- ;
-
- $allModules
- .each(function() {
- var
- settings = ( $.isPlainObject(parameters) )
- ? $.extend(true, {}, $.fn.dimmer.settings, parameters)
- : $.extend({}, $.fn.dimmer.settings),
-
- selector = settings.selector,
- namespace = settings.namespace,
- className = settings.className,
- error = settings.error,
-
- eventNamespace = '.' + namespace,
- moduleNamespace = 'module-' + namespace,
- moduleSelector = $allModules.selector || '',
-
- clickEvent = "click", unstableClickEvent = ('ontouchstart' in document.documentElement)
- ? 'touchstart'
- : 'click',
-
- $module = $(this),
- $dimmer,
- $dimmable,
-
- element = this,
- instance = $module.data(moduleNamespace),
- module
- ;
-
- module = {
-
- preinitialize: function() {
- if( module.is.dimmer() ) {
-
- $dimmable = $module.parent();
- $dimmer = $module;
- }
- else {
- $dimmable = $module;
- if( module.has.dimmer() ) {
- if(settings.dimmerName) {
- $dimmer = $dimmable.find(selector.dimmer).filter('.' + settings.dimmerName);
- }
- else {
- $dimmer = $dimmable.find(selector.dimmer);
- }
- }
- else {
- $dimmer = module.create();
- }
- }
- },
-
- initialize: function() {
- module.debug('Initializing dimmer', settings);
-
- module.bind.events();
- module.set.dimmable();
- module.instantiate();
- },
-
- instantiate: function() {
- module.verbose('Storing instance of module', module);
- instance = module;
- $module
- .data(moduleNamespace, instance)
- ;
- },
-
- destroy: function() {
- module.verbose('Destroying previous module', $dimmer);
- module.unbind.events();
- module.remove.variation();
- $dimmable
- .off(eventNamespace)
- ;
- },
-
- bind: {
- events: function() {
- if(settings.on == 'hover') {
- $dimmable
- .on('mouseenter' + eventNamespace, module.show)
- .on('mouseleave' + eventNamespace, module.hide)
- ;
- }
- else if(settings.on == 'click') {
- $dimmable
- .on(clickEvent + eventNamespace, module.toggle)
- ;
- }
- if( module.is.page() ) {
- module.debug('Setting as a page dimmer', $dimmable);
- module.set.pageDimmer();
- }
-
- if( module.is.closable() ) {
- module.verbose('Adding dimmer close event', $dimmer);
- $dimmable
- .on(clickEvent + eventNamespace, selector.dimmer, module.event.click)
- ;
- }
- }
- },
-
- unbind: {
- events: function() {
- $module
- .removeData(moduleNamespace)
- ;
- $dimmable
- .off(eventNamespace)
- ;
- }
- },
-
- event: {
- click: function(event) {
- module.verbose('Determining if event occured on dimmer', event);
- if( $dimmer.find(event.target).length === 0 || $(event.target).is(selector.content) ) {
- module.hide();
- event.stopImmediatePropagation();
- }
- }
- },
-
- addContent: function(element) {
- var
- $content = $(element)
- ;
- module.debug('Add content to dimmer', $content);
- if($content.parent()[0] !== $dimmer[0]) {
- $content.detach().appendTo($dimmer);
- }
- },
-
- create: function() {
- var
- $element = $( settings.template.dimmer(settings) )
- ;
- if(settings.dimmerName) {
- module.debug('Creating named dimmer', settings.dimmerName);
- $element.addClass(settings.dimmerName);
- }
- $element
- .appendTo($dimmable)
- ;
- return $element;
- },
-
- show: function(callback) {
- callback = $.isFunction(callback)
- ? callback
- : function(){}
- ;
- module.debug('Showing dimmer', $dimmer, settings);
- module.set.variation();
- if( (!module.is.dimmed() || module.is.animating()) && module.is.enabled() ) {
- module.animate.show(callback);
- settings.onShow.call(element);
- settings.onChange.call(element);
- }
- else {
- module.debug('Dimmer is already shown or disabled');
- }
- },
-
- hide: function(callback) {
- callback = $.isFunction(callback)
- ? callback
- : function(){}
- ;
- if( module.is.dimmed() || module.is.animating() ) {
- module.debug('Hiding dimmer', $dimmer);
- module.animate.hide(callback);
- settings.onHide.call(element);
- settings.onChange.call(element);
- }
- else {
- module.debug('Dimmer is not visible');
- }
- },
-
- toggle: function() {
- module.verbose('Toggling dimmer visibility', $dimmer);
- if( !module.is.dimmed() ) {
- module.show();
- }
- else {
- if ( module.is.closable() ) {
- module.hide();
- }
- }
- },
-
- animate: {
- show: function(callback) {
- callback = $.isFunction(callback)
- ? callback
- : function(){}
- ;
- if(settings.useCSS && $.fn.transition !== undefined && $dimmer.transition('is supported')) {
- if(settings.useFlex) {
- module.debug('Using flex dimmer');
- module.remove.legacy();
- }
- else {
- module.debug('Using legacy non-flex dimmer');
- module.set.legacy();
- }
- if(settings.opacity !== 'auto') {
- module.set.opacity();
- }
- $dimmer
- .transition({
- displayType : settings.useFlex
- ? 'flex'
- : 'block',
- animation : settings.transition + ' in',
- queue : false,
- duration : module.get.duration(),
- useFailSafe : true,
- onStart : function() {
- module.set.dimmed();
- },
- onComplete : function() {
- module.set.active();
- callback();
- }
- })
- ;
- }
- else {
- module.verbose('Showing dimmer animation with javascript');
- module.set.dimmed();
- if(settings.opacity == 'auto') {
- settings.opacity = 0.8;
- }
- $dimmer
- .stop()
- .css({
- opacity : 0,
- width : '100%',
- height : '100%'
- })
- .fadeTo(module.get.duration(), settings.opacity, function() {
- $dimmer.removeAttr('style');
- module.set.active();
- callback();
- })
- ;
- }
- },
- hide: function(callback) {
- callback = $.isFunction(callback)
- ? callback
- : function(){}
- ;
- if(settings.useCSS && $.fn.transition !== undefined && $dimmer.transition('is supported')) {
- module.verbose('Hiding dimmer with css');
- $dimmer
- .transition({
- displayType : settings.useFlex
- ? 'flex'
- : 'block',
- animation : settings.transition + ' out',
- queue : false,
- duration : module.get.duration(),
- useFailSafe : true,
- onComplete : function() {
- module.remove.dimmed();
- module.remove.variation();
- module.remove.active();
- callback();
- }
- })
- ;
- }
- else {
- module.verbose('Hiding dimmer with javascript');
- $dimmer
- .stop()
- .fadeOut(module.get.duration(), function() {
- module.remove.dimmed();
- module.remove.active();
- $dimmer.removeAttr('style');
- callback();
- })
- ;
- }
- }
- },
-
- get: {
- dimmer: function() {
- return $dimmer;
- },
- duration: function() {
- if(typeof settings.duration == 'object') {
- if( module.is.active() ) {
- return settings.duration.hide;
- }
- else {
- return settings.duration.show;
- }
- }
- return settings.duration;
- }
- },
-
- has: {
- dimmer: function() {
- if(settings.dimmerName) {
- return ($module.find(selector.dimmer).filter('.' + settings.dimmerName).length > 0);
- }
- else {
- return ( $module.find(selector.dimmer).length > 0 );
- }
- }
- },
-
- is: {
- active: function() {
- return $dimmer.hasClass(className.active);
- },
- animating: function() {
- return ( $dimmer.is(':animated') || $dimmer.hasClass(className.animating) );
- },
- closable: function() {
- if(settings.closable == 'auto') {
- if(settings.on == 'hover') {
- return false;
- }
- return true;
- }
- return settings.closable;
- },
- dimmer: function() {
- return $module.hasClass(className.dimmer);
- },
- dimmable: function() {
- return $module.hasClass(className.dimmable);
- },
- dimmed: function() {
- return $dimmable.hasClass(className.dimmed);
- },
- disabled: function() {
- return $dimmable.hasClass(className.disabled);
- },
- enabled: function() {
- return !module.is.disabled();
- },
- page: function () {
- return $dimmable.is('body');
- },
- pageDimmer: function() {
- return $dimmer.hasClass(className.pageDimmer);
- }
- },
-
- can: {
- show: function() {
- return !$dimmer.hasClass(className.disabled);
- }
- },
-
- set: {
- opacity: function(opacity) {
- var
- color = $dimmer.css('background-color'),
- colorArray = color.split(','),
- isRGB = (colorArray && colorArray.length >= 3)
- ;
- opacity = settings.opacity === 0 ? 0 : settings.opacity || opacity;
- if(isRGB) {
- colorArray[2] = colorArray[2].replace(')','');
- colorArray[3] = opacity + ')';
- color = colorArray.join(',');
- }
- else {
- color = 'rgba(0, 0, 0, ' + opacity + ')';
- }
- module.debug('Setting opacity to', opacity);
- $dimmer.css('background-color', color);
- },
- legacy: function() {
- $dimmer.addClass(className.legacy);
- },
- active: function() {
- $dimmer.addClass(className.active);
- },
- dimmable: function() {
- $dimmable.addClass(className.dimmable);
- },
- dimmed: function() {
- $dimmable.addClass(className.dimmed);
- },
- pageDimmer: function() {
- $dimmer.addClass(className.pageDimmer);
- },
- disabled: function() {
- $dimmer.addClass(className.disabled);
- },
- variation: function(variation) {
- variation = variation || settings.variation;
- if(variation) {
- $dimmer.addClass(variation);
- }
- }
- },
-
- remove: {
- active: function() {
- $dimmer
- .removeClass(className.active)
- ;
- },
- legacy: function() {
- $dimmer.removeClass(className.legacy);
- },
- dimmed: function() {
- $dimmable.removeClass(className.dimmed);
- },
- disabled: function() {
- $dimmer.removeClass(className.disabled);
- },
- variation: function(variation) {
- variation = variation || settings.variation;
- if(variation) {
- $dimmer.removeClass(variation);
- }
- }
- },
-
- setting: function(name, value) {
- module.debug('Changing setting', name, value);
- if( $.isPlainObject(name) ) {
- $.extend(true, settings, name);
- }
- else if(value !== undefined) {
- if($.isPlainObject(settings[name])) {
- $.extend(true, settings[name], value);
- }
- else {
- settings[name] = value;
- }
- }
- else {
- return settings[name];
- }
- },
- internal: function(name, value) {
- if( $.isPlainObject(name) ) {
- $.extend(true, module, name);
- }
- else if(value !== undefined) {
- module[name] = value;
- }
- else {
- return module[name];
- }
- },
- debug: function() {
- if(!settings.silent && settings.debug) {
- if(settings.performance) {
- module.performance.log(arguments);
- }
- else {
- module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
- module.debug.apply(console, arguments);
- }
- }
- },
- verbose: function() {
- if(!settings.silent && settings.verbose && settings.debug) {
- if(settings.performance) {
- module.performance.log(arguments);
- }
- else {
- module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
- module.verbose.apply(console, arguments);
- }
- }
- },
- error: function() {
- if(!settings.silent) {
- module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
- module.error.apply(console, arguments);
- }
- },
- performance: {
- log: function(message) {
- var
- currentTime,
- executionTime,
- previousTime
- ;
- if(settings.performance) {
- currentTime = new Date().getTime();
- previousTime = time || currentTime;
- executionTime = currentTime - previousTime;
- time = currentTime;
- performance.push({
- 'Name' : message[0],
- 'Arguments' : [].slice.call(message, 1) || '',
- 'Element' : element,
- 'Execution Time' : executionTime
- });
- }
- clearTimeout(module.performance.timer);
- module.performance.timer = setTimeout(module.performance.display, 500);
- },
- display: function() {
- var
- title = settings.name + ':',
- totalTime = 0
- ;
- time = false;
- clearTimeout(module.performance.timer);
- $.each(performance, function(index, data) {
- totalTime += data['Execution Time'];
- });
- title += ' ' + totalTime + 'ms';
- if(moduleSelector) {
- title += ' \'' + moduleSelector + '\'';
- }
- if($allModules.length > 1) {
- title += ' ' + '(' + $allModules.length + ')';
- }
- if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
- console.groupCollapsed(title);
- if(console.table) {
- console.table(performance);
- }
- else {
- $.each(performance, function(index, data) {
- console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
- });
- }
- console.groupEnd();
- }
- performance = [];
- }
- },
- invoke: function(query, passedArguments, context) {
- var
- object = instance,
- maxDepth,
- found,
- response
- ;
- passedArguments = passedArguments || queryArguments;
- context = element || context;
- if(typeof query == 'string' && object !== undefined) {
- query = query.split(/[\. ]/);
- maxDepth = query.length - 1;
- $.each(query, function(depth, value) {
- var camelCaseValue = (depth != maxDepth)
- ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
- : query
- ;
- if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) {
- object = object[camelCaseValue];
- }
- else if( object[camelCaseValue] !== undefined ) {
- found = object[camelCaseValue];
- return false;
- }
- else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) {
- object = object[value];
- }
- else if( object[value] !== undefined ) {
- found = object[value];
- return false;
- }
- else {
- module.error(error.method, query);
- return false;
- }
- });
- }
- if ( $.isFunction( found ) ) {
- response = found.apply(context, passedArguments);
- }
- else if(found !== undefined) {
- response = found;
- }
- if(Array.isArray(returnedValue)) {
- returnedValue.push(response);
- }
- else if(returnedValue !== undefined) {
- returnedValue = [returnedValue, response];
- }
- else if(response !== undefined) {
- returnedValue = response;
- }
- return found;
- }
- };
-
- module.preinitialize();
-
- if(methodInvoked) {
- if(instance === undefined) {
- module.initialize();
- }
- module.invoke(query);
- }
- else {
- if(instance !== undefined) {
- instance.invoke('destroy');
- }
- module.initialize();
- }
- })
- ;
-
- return (returnedValue !== undefined)
- ? returnedValue
- : this
- ;
-};
-
-$.fn.dimmer.settings = {
-
- name : 'Dimmer',
- namespace : 'dimmer',
-
- silent : false,
- debug : false,
- verbose : false,
- performance : true,
-
- // whether should use flex layout
- useFlex : true,
-
- // name to distinguish between multiple dimmers in context
- dimmerName : false,
-
- // whether to add a variation type
- variation : false,
-
- // whether to bind close events
- closable : 'auto',
-
- // whether to use css animations
- useCSS : true,
-
- // css animation to use
- transition : 'fade',
-
- // event to bind to
- on : false,
-
- // overriding opacity value
- opacity : 'auto',
-
- // transition durations
- duration : {
- show : 500,
- hide : 500
- },
-// whether the dynamically created dimmer should have a loader
- displayLoader: false,
- loaderText : false,
- loaderVariation : '',
-
- onChange : function(){},
- onShow : function(){},
- onHide : function(){},
-
- error : {
- method : 'The method you called is not defined.'
- },
-
- className : {
- active : 'active',
- animating : 'animating',
- dimmable : 'dimmable',
- dimmed : 'dimmed',
- dimmer : 'dimmer',
- disabled : 'disabled',
- hide : 'hide',
- legacy : 'legacy',
- pageDimmer : 'page',
- show : 'show',
- loader : 'ui loader'
- },
-
- selector: {
- dimmer : '> .ui.dimmer',
- content : '.ui.dimmer > .content, .ui.dimmer > .content > .center'
- },
-
- template: {
- dimmer: function(settings) {
- var d = $('').addClass('ui dimmer'),l;
- if(settings.displayLoader) {
- l = $('')
- .addClass(settings.className.loader)
- .addClass(settings.loaderVariation);
- if(!!settings.loaderText){
- l.text(settings.loaderText);
- l.addClass('text');
- }
- d.append(l);
- }
- return d;
- }
- }
-
-};
-
})( jQuery, window, document );
/*!
diff --git a/web_src/fomantic/semantic.json b/web_src/fomantic/semantic.json
index 489ca7b9b79..63d0b30218f 100644
--- a/web_src/fomantic/semantic.json
+++ b/web_src/fomantic/semantic.json
@@ -22,7 +22,6 @@
"admin": false,
"components": [
"api",
- "dimmer",
"dropdown",
"form",
"modal",
diff --git a/web_src/js/modules/fomantic.js b/web_src/js/modules/fomantic.js
index c04bc6e8636..06e4e97c485 100644
--- a/web_src/js/modules/fomantic.js
+++ b/web_src/js/modules/fomantic.js
@@ -5,6 +5,7 @@ import {initAriaFormFieldPatch} from './fomantic/form.js';
import {initAriaDropdownPatch} from './fomantic/dropdown.js';
import {initAriaModalPatch} from './fomantic/modal.js';
import {initFomanticTransition} from './fomantic/transition.js';
+import {initFomanticDimmer} from './fomantic/dimmer.js';
import {svg} from '../svg.js';
export const fomanticMobileScreen = window.matchMedia('only screen and (max-width: 767.98px)');
@@ -24,6 +25,7 @@ export function initGiteaFomantic() {
};
initFomanticTransition();
+ initFomanticDimmer();
initFomanticApiPatch();
// Use the patches to improve accessibility, these patches are designed to be as independent as possible, make it easy to modify or remove in the future.
diff --git a/web_src/js/modules/fomantic/dimmer.js b/web_src/js/modules/fomantic/dimmer.js
new file mode 100644
index 00000000000..f434e1ca59b
--- /dev/null
+++ b/web_src/js/modules/fomantic/dimmer.js
@@ -0,0 +1,29 @@
+import $ from 'jquery';
+import {queryElemChildren} from '../../utils/dom.js';
+
+export function initFomanticDimmer() {
+ // stand-in for removed dimmer module
+ $.fn.dimmer = function (arg0, $el) {
+ if (arg0 === 'add content') {
+ const existingDimmer = document.querySelector('body > .ui.dimmer');
+ if (existingDimmer) {
+ queryElemChildren(existingDimmer, '*', (el) => el.remove());
+ this._dimmer = existingDimmer;
+ } else {
+ this._dimmer = document.createElement('div');
+ this._dimmer.classList.add('ui', 'dimmer');
+ document.body.append(this._dimmer);
+ }
+ this._dimmer.append($el[0]);
+ } else if (arg0 === 'get dimmer') {
+ return $(this._dimmer);
+ } else if (arg0 === 'show') {
+ this._dimmer.classList.add('active');
+ document.body.classList.add('tw-overflow-hidden');
+ } else if (arg0 === 'hide') {
+ this._dimmer.classList.remove('active');
+ document.body.classList.remove('tw-overflow-hidden');
+ }
+ return this;
+ };
+}