fomantic-ui 2.9.4-beta.10 → 2.9.4-beta.100
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.all-contributorsrc +29 -1
- package/.eslintrc.js +17 -0
- package/.github/FUNDING.yml +1 -1
- package/.github/workflows/ci.yml +8 -8
- package/.github/workflows/depsreview.yml +14 -0
- package/.github/workflows/nightly.yml +1 -1
- package/.github/workflows/release.yml +1 -1
- package/CONTRIBUTORS.md +5 -0
- package/README.md +2 -12
- package/dist/components/accordion.css +1 -1
- package/dist/components/accordion.js +4 -2
- package/dist/components/accordion.min.css +1 -1
- package/dist/components/accordion.min.js +2 -2
- package/dist/components/ad.css +1 -1
- package/dist/components/ad.min.css +1 -1
- package/dist/components/api.js +7 -3
- package/dist/components/api.min.js +2 -2
- package/dist/components/breadcrumb.css +1 -1
- package/dist/components/breadcrumb.min.css +1 -1
- package/dist/components/button.css +21 -3
- package/dist/components/button.min.css +2 -2
- package/dist/components/calendar.css +1 -1
- package/dist/components/calendar.js +47 -12
- package/dist/components/calendar.min.css +1 -1
- package/dist/components/calendar.min.js +3 -3
- package/dist/components/card.css +1 -1
- package/dist/components/card.min.css +1 -1
- package/dist/components/checkbox.css +1 -1
- package/dist/components/checkbox.js +10 -4
- package/dist/components/checkbox.min.css +1 -1
- package/dist/components/checkbox.min.js +3 -3
- package/dist/components/comment.css +1 -1
- package/dist/components/comment.min.css +1 -1
- package/dist/components/container.css +1 -1
- package/dist/components/container.min.css +1 -1
- package/dist/components/dimmer.css +7 -3
- package/dist/components/dimmer.js +4 -2
- package/dist/components/dimmer.min.css +2 -2
- package/dist/components/dimmer.min.js +2 -2
- package/dist/components/divider.css +1 -1
- package/dist/components/divider.min.css +1 -1
- package/dist/components/dropdown.css +46 -38
- package/dist/components/dropdown.js +109 -34
- package/dist/components/dropdown.min.css +2 -2
- package/dist/components/dropdown.min.js +3 -3
- package/dist/components/embed.css +1 -1
- package/dist/components/embed.js +17 -7
- package/dist/components/embed.min.css +1 -1
- package/dist/components/embed.min.js +3 -3
- package/dist/components/emoji.css +4309 -3713
- package/dist/components/emoji.min.css +2 -2
- package/dist/components/feed.css +12 -1
- package/dist/components/feed.min.css +2 -2
- package/dist/components/flag.css +3 -1
- package/dist/components/flag.min.css +2 -2
- package/dist/components/flyout.css +3 -3
- package/dist/components/flyout.js +4 -2
- package/dist/components/flyout.min.css +1 -1
- package/dist/components/flyout.min.js +2 -2
- package/dist/components/form.css +15 -3
- package/dist/components/form.js +66 -23
- package/dist/components/form.min.css +2 -2
- package/dist/components/form.min.js +3 -3
- package/dist/components/grid.css +5 -5
- package/dist/components/grid.min.css +2 -2
- package/dist/components/header.css +1 -1
- package/dist/components/header.min.css +1 -1
- package/dist/components/icon.css +1 -1
- package/dist/components/icon.min.css +1 -1
- package/dist/components/image.css +1 -1
- package/dist/components/image.min.css +1 -1
- package/dist/components/input.css +1 -1
- package/dist/components/input.min.css +1 -1
- package/dist/components/item.css +1 -1
- package/dist/components/item.min.css +1 -1
- package/dist/components/label.css +7 -1
- package/dist/components/label.min.css +2 -2
- package/dist/components/list.css +1 -1
- package/dist/components/list.min.css +1 -1
- package/dist/components/loader.css +1 -1
- package/dist/components/loader.min.css +1 -1
- package/dist/components/menu.css +1 -1
- package/dist/components/menu.min.css +1 -1
- package/dist/components/message.css +2 -1
- package/dist/components/message.min.css +2 -2
- package/dist/components/modal.css +3 -3
- package/dist/components/modal.js +7 -3
- package/dist/components/modal.min.css +1 -1
- package/dist/components/modal.min.js +2 -2
- package/dist/components/nag.css +1 -1
- package/dist/components/nag.js +11 -5
- package/dist/components/nag.min.css +1 -1
- package/dist/components/nag.min.js +3 -3
- package/dist/components/placeholder.css +1 -1
- package/dist/components/placeholder.min.css +1 -1
- package/dist/components/popup.css +1 -1
- package/dist/components/popup.js +10 -4
- package/dist/components/popup.min.css +1 -1
- package/dist/components/popup.min.js +2 -2
- package/dist/components/progress.css +15 -6
- package/dist/components/progress.js +4 -2
- package/dist/components/progress.min.css +2 -2
- package/dist/components/progress.min.js +2 -2
- package/dist/components/rail.css +1 -1
- package/dist/components/rail.min.css +1 -1
- package/dist/components/rating.css +1 -1
- package/dist/components/rating.js +4 -2
- package/dist/components/rating.min.css +1 -1
- package/dist/components/rating.min.js +2 -2
- package/dist/components/reset.css +1 -1
- package/dist/components/reset.min.css +1 -1
- package/dist/components/reveal.css +1 -1
- package/dist/components/reveal.min.css +1 -1
- package/dist/components/search.css +34 -23
- package/dist/components/search.js +78 -14
- package/dist/components/search.min.css +2 -2
- package/dist/components/search.min.js +3 -3
- package/dist/components/segment.css +1 -1
- package/dist/components/segment.min.css +1 -1
- package/dist/components/shape.css +1 -1
- package/dist/components/shape.js +7 -5
- package/dist/components/shape.min.css +1 -1
- package/dist/components/shape.min.js +3 -3
- package/dist/components/sidebar.css +1 -1
- package/dist/components/sidebar.js +4 -2
- package/dist/components/sidebar.min.css +1 -1
- package/dist/components/sidebar.min.js +2 -2
- package/dist/components/site.css +14 -6
- package/dist/components/site.js +4 -2
- package/dist/components/site.min.css +2 -2
- package/dist/components/site.min.js +2 -2
- package/dist/components/slider.css +152 -2
- package/dist/components/slider.js +142 -44
- package/dist/components/slider.min.css +2 -2
- package/dist/components/slider.min.js +3 -3
- package/dist/components/state.js +4 -2
- package/dist/components/state.min.js +2 -2
- package/dist/components/statistic.css +1 -1
- package/dist/components/statistic.min.css +1 -1
- package/dist/components/step.css +992 -86
- package/dist/components/step.min.css +2 -2
- package/dist/components/sticky.css +1 -1
- package/dist/components/sticky.js +4 -2
- package/dist/components/sticky.min.css +1 -1
- package/dist/components/sticky.min.js +2 -2
- package/dist/components/tab.css +1 -1
- package/dist/components/tab.js +4 -2
- package/dist/components/tab.min.css +1 -1
- package/dist/components/tab.min.js +2 -2
- package/dist/components/table.css +32 -21
- package/dist/components/table.min.css +2 -2
- package/dist/components/text.css +1 -1
- package/dist/components/text.min.css +1 -1
- package/dist/components/toast.css +1 -1
- package/dist/components/toast.js +7 -3
- package/dist/components/toast.min.css +1 -1
- package/dist/components/toast.min.js +3 -3
- package/dist/components/transition.css +1 -1
- package/dist/components/transition.js +7 -3
- package/dist/components/transition.min.css +1 -1
- package/dist/components/transition.min.js +2 -2
- package/dist/components/visibility.js +4 -2
- package/dist/components/visibility.min.js +2 -2
- package/dist/semantic.css +6179 -3968
- package/dist/semantic.js +571 -188
- package/dist/semantic.min.css +3 -3
- package/dist/semantic.min.js +3 -3
- package/dist/themes/basic/assets/fonts/LICENSE.txt +91 -0
- package/dist/themes/default/assets/fonts/LICENSE_Lato.txt +94 -0
- package/dist/themes/default/assets/fonts/LICENSE_icons.txt +165 -0
- package/dist/themes/github/assets/fonts/LICENSE.txt +94 -0
- package/dist/themes/material/assets/fonts/LICENSE.txt +202 -0
- package/package.json +14 -14
- package/semantic.json.example +1 -1
- package/src/definitions/behaviors/api.js +6 -2
- package/src/definitions/behaviors/form.js +65 -22
- package/src/definitions/behaviors/state.js +3 -1
- package/src/definitions/behaviors/visibility.js +3 -1
- package/src/definitions/collections/form.less +43 -23
- package/src/definitions/collections/grid.less +85 -70
- package/src/definitions/collections/menu.less +38 -27
- package/src/definitions/collections/message.less +1 -0
- package/src/definitions/collections/table.less +183 -157
- package/src/definitions/elements/button.less +61 -25
- package/src/definitions/elements/container.less +6 -4
- package/src/definitions/elements/divider.less +4 -1
- package/src/definitions/elements/emoji.less +3 -1
- package/src/definitions/elements/header.less +7 -4
- package/src/definitions/elements/icon.less +35 -28
- package/src/definitions/elements/input.less +21 -13
- package/src/definitions/elements/label.less +19 -8
- package/src/definitions/elements/list.less +28 -21
- package/src/definitions/elements/loader.less +17 -12
- package/src/definitions/elements/segment.less +12 -7
- package/src/definitions/elements/step.less +405 -87
- package/src/definitions/globals/site.js +3 -1
- package/src/definitions/globals/site.less +17 -12
- package/src/definitions/modules/accordion.js +3 -1
- package/src/definitions/modules/accordion.less +15 -13
- package/src/definitions/modules/calendar.js +46 -11
- package/src/definitions/modules/calendar.less +6 -4
- package/src/definitions/modules/checkbox.js +9 -3
- package/src/definitions/modules/checkbox.less +12 -6
- package/src/definitions/modules/dimmer.js +3 -1
- package/src/definitions/modules/dimmer.less +16 -10
- package/src/definitions/modules/dropdown.js +108 -33
- package/src/definitions/modules/dropdown.less +109 -78
- package/src/definitions/modules/embed.js +16 -6
- package/src/definitions/modules/flyout.js +3 -1
- package/src/definitions/modules/flyout.less +51 -45
- package/src/definitions/modules/modal.js +6 -2
- package/src/definitions/modules/modal.less +109 -82
- package/src/definitions/modules/nag.js +10 -4
- package/src/definitions/modules/nag.less +8 -4
- package/src/definitions/modules/popup.js +9 -3
- package/src/definitions/modules/popup.less +3 -1
- package/src/definitions/modules/progress.js +3 -1
- package/src/definitions/modules/progress.less +24 -6
- package/src/definitions/modules/rating.js +3 -1
- package/src/definitions/modules/search.js +77 -13
- package/src/definitions/modules/search.less +41 -25
- package/src/definitions/modules/shape.js +6 -4
- package/src/definitions/modules/sidebar.js +3 -1
- package/src/definitions/modules/slider.js +141 -43
- package/src/definitions/modules/slider.less +129 -27
- package/src/definitions/modules/sticky.js +3 -1
- package/src/definitions/modules/tab.js +3 -1
- package/src/definitions/modules/toast.js +6 -2
- package/src/definitions/modules/toast.less +35 -24
- package/src/definitions/modules/transition.js +6 -2
- package/src/definitions/views/card.less +7 -5
- package/src/definitions/views/feed.less +14 -1
- package/src/definitions/views/item.less +7 -5
- package/src/themes/basic/assets/fonts/LICENSE.txt +91 -0
- package/src/themes/default/assets/fonts/LICENSE_Lato.txt +94 -0
- package/src/themes/default/assets/fonts/LICENSE_icons.txt +165 -0
- package/src/themes/default/elements/button.variables +3 -0
- package/src/themes/default/elements/emoji.variables +172 -23
- package/src/themes/default/elements/flag.variables +3 -3
- package/src/themes/default/elements/step.variables +33 -0
- package/src/themes/default/globals/site.variables +3 -0
- package/src/themes/default/globals/variation.variables +23 -2
- package/src/themes/default/modules/dropdown.variables +3 -0
- package/src/themes/default/modules/progress.variables +1 -1
- package/src/themes/default/modules/search.variables +15 -12
- package/src/themes/default/modules/slider.variables +10 -0
- package/src/themes/default/views/feed.variables +3 -0
- package/src/themes/github/assets/fonts/LICENSE.txt +94 -0
- package/src/themes/joypixels/elements/emoji.variables +183 -22
- package/src/themes/material/assets/fonts/LICENSE.txt +202 -0
- package/tasks/admin/components/create.js +4 -4
- package/tasks/admin/components/init.js +2 -2
- package/tasks/admin/components/update.js +3 -3
- package/tasks/admin/distributions/create.js +3 -3
- package/tasks/admin/distributions/init.js +2 -2
- package/tasks/admin/distributions/update.js +4 -4
- package/tasks/build/assets.js +1 -1
- package/tasks/build/css.js +19 -10
- package/tasks/build/javascript.js +12 -5
- package/tasks/check-install.js +1 -1
- package/tasks/config/defaults.js +4 -0
- package/tasks/config/project/release.js +19 -1
- package/tasks/config/tasks.js +7 -7
- package/tasks/docs/build.js +3 -3
- package/tasks/docs/metadata.js +1 -1
- package/tasks/docs/serve.js +3 -1
- package/tasks/install.js +2 -2
- package/tasks/watch.js +1 -1
- package/types/fomantic-ui-accordion.d.ts +1 -1
- package/types/fomantic-ui-api.d.ts +9 -3
- package/types/fomantic-ui-calendar.d.ts +114 -13
- package/types/fomantic-ui-checkbox.d.ts +14 -4
- package/types/fomantic-ui-dimmer.d.ts +1 -1
- package/types/fomantic-ui-dropdown.d.ts +82 -44
- package/types/fomantic-ui-embed.d.ts +19 -2
- package/types/fomantic-ui-flyout.d.ts +25 -11
- package/types/fomantic-ui-form.d.ts +123 -15
- package/types/fomantic-ui-modal.d.ts +101 -5
- package/types/fomantic-ui-nag.d.ts +4 -4
- package/types/fomantic-ui-popup.d.ts +38 -12
- package/types/fomantic-ui-progress.d.ts +12 -6
- package/types/fomantic-ui-rating.d.ts +1 -1
- package/types/fomantic-ui-search.d.ts +138 -22
- package/types/fomantic-ui-shape.d.ts +2 -2
- package/types/fomantic-ui-sidebar.d.ts +4 -4
- package/types/fomantic-ui-slider.d.ts +56 -4
- package/types/fomantic-ui-sticky.d.ts +1 -1
- package/types/fomantic-ui-tab.d.ts +6 -6
- package/types/fomantic-ui-toast.d.ts +14 -2
- package/types/fomantic-ui-transition.d.ts +41 -7
- package/types/fomantic-ui-visibility.d.ts +3 -3
- package/types/index.d.ts +25 -25
- package/types/tests.ts +188 -0
- package/types/tsconfig.json +1 -1
- package/types/fomantic-ui-tests.ts +0 -25
@@ -17,6 +17,10 @@
|
|
17
17
|
|
18
18
|
@import (multiple) "../../theme.config";
|
19
19
|
|
20
|
+
@notFullscreen: if(@variationFlyoutFullscreen, e(":not(.fullscreen)"));
|
21
|
+
|
22
|
+
@notFluid: if(@variationButtonFluid, e(":not(.fluid)"));
|
23
|
+
|
20
24
|
/*******************************
|
21
25
|
Flyout
|
22
26
|
*******************************/
|
@@ -46,30 +50,31 @@
|
|
46
50
|
.ui.flyout > * {
|
47
51
|
backface-visibility: hidden;
|
48
52
|
}
|
53
|
+
& when (@variationFlyoutClose) {
|
54
|
+
/* --------------
|
55
|
+
Close
|
56
|
+
--------------- */
|
49
57
|
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
.ui.flyout > .close:hover {
|
71
|
-
opacity: 1;
|
72
|
-
outline: none;
|
58
|
+
.ui.flyout > .close {
|
59
|
+
cursor: pointer;
|
60
|
+
position: absolute;
|
61
|
+
top: @closeTop;
|
62
|
+
right: @closeRight;
|
63
|
+
z-index: 1;
|
64
|
+
opacity: @closeOpacity;
|
65
|
+
font-size: @closeSize;
|
66
|
+
color: @closeColor;
|
67
|
+
width: @closeHitbox;
|
68
|
+
height: @closeHitbox;
|
69
|
+
padding: @closePadding;
|
70
|
+
margin: @closeMargin;
|
71
|
+
text-align: right;
|
72
|
+
}
|
73
|
+
.ui.flyout > .close:focus,
|
74
|
+
.ui.flyout > .close:hover {
|
75
|
+
opacity: 1;
|
76
|
+
outline: none;
|
77
|
+
}
|
73
78
|
}
|
74
79
|
|
75
80
|
/* --------------
|
@@ -134,7 +139,7 @@
|
|
134
139
|
border-top: @actionBorder;
|
135
140
|
text-align: @actionAlign;
|
136
141
|
}
|
137
|
-
.ui.flyout .actions > .button
|
142
|
+
.ui.flyout .actions > .button@{notFluid} {
|
138
143
|
margin-left: @buttonDistance;
|
139
144
|
}
|
140
145
|
& when (@variationFlyoutBasic) {
|
@@ -145,7 +150,7 @@
|
|
145
150
|
& when (@variationFlyoutLeftActions) {
|
146
151
|
.ui.flyout > .left.actions {
|
147
152
|
text-align: left;
|
148
|
-
& > .button
|
153
|
+
& > .button@{notFluid} {
|
149
154
|
margin-left: @buttonLeftDistance;
|
150
155
|
margin-right: @buttonLeftDistance;
|
151
156
|
}
|
@@ -156,7 +161,7 @@
|
|
156
161
|
.ui.flyout > .centered,
|
157
162
|
.ui.flyout > .center.aligned {
|
158
163
|
text-align: center;
|
159
|
-
&.actions > .button
|
164
|
+
&.actions > .button@{notFluid} when (@variationFlyoutActions) {
|
160
165
|
margin-left: @buttonCenteredDistance;
|
161
166
|
margin-right: @buttonCenteredDistance;
|
162
167
|
}
|
@@ -402,9 +407,10 @@ body.pushable > .pusher {
|
|
402
407
|
.ui.flyout.inverted {
|
403
408
|
background: @invertedBackground;
|
404
409
|
}
|
405
|
-
|
406
|
-
|
407
|
-
|
410
|
+
& when (@variationFlyoutClose) {
|
411
|
+
.ui.flyout.inverted > .close {
|
412
|
+
color: @invertedCloseColor;
|
413
|
+
}
|
408
414
|
}
|
409
415
|
|
410
416
|
.ui.flyout.inverted > .header,
|
@@ -525,67 +531,67 @@ body.pushable > .pusher {
|
|
525
531
|
& when (@variationFlyoutColumnWidth) {
|
526
532
|
/* Sizing Combinations */
|
527
533
|
|
528
|
-
.ui[class*="one wide"].flyout
|
534
|
+
.ui[class*="one wide"].flyout@{notFullscreen} {
|
529
535
|
width: @oneWide;
|
530
536
|
}
|
531
537
|
|
532
|
-
.ui[class*="two wide"].flyout
|
538
|
+
.ui[class*="two wide"].flyout@{notFullscreen} {
|
533
539
|
width: @twoWide;
|
534
540
|
}
|
535
541
|
|
536
|
-
.ui[class*="three wide"].flyout
|
542
|
+
.ui[class*="three wide"].flyout@{notFullscreen} {
|
537
543
|
width: @threeWide;
|
538
544
|
}
|
539
545
|
|
540
|
-
.ui[class*="four wide"].flyout
|
546
|
+
.ui[class*="four wide"].flyout@{notFullscreen} {
|
541
547
|
width: @fourWide;
|
542
548
|
}
|
543
549
|
|
544
|
-
.ui[class*="five wide"].flyout
|
550
|
+
.ui[class*="five wide"].flyout@{notFullscreen} {
|
545
551
|
width: @fiveWide;
|
546
552
|
}
|
547
553
|
|
548
|
-
.ui[class*="six wide"].flyout
|
554
|
+
.ui[class*="six wide"].flyout@{notFullscreen} {
|
549
555
|
width: @sixWide;
|
550
556
|
}
|
551
557
|
|
552
|
-
.ui[class*="seven wide"].flyout
|
558
|
+
.ui[class*="seven wide"].flyout@{notFullscreen} {
|
553
559
|
width: @sevenWide;
|
554
560
|
}
|
555
561
|
|
556
|
-
.ui[class*="eight wide"].flyout
|
562
|
+
.ui[class*="eight wide"].flyout@{notFullscreen} {
|
557
563
|
width: @eightWide;
|
558
564
|
}
|
559
565
|
|
560
|
-
.ui[class*="nine wide"].flyout
|
566
|
+
.ui[class*="nine wide"].flyout@{notFullscreen} {
|
561
567
|
width: @nineWide;
|
562
568
|
}
|
563
569
|
|
564
|
-
.ui[class*="ten wide"].flyout
|
570
|
+
.ui[class*="ten wide"].flyout@{notFullscreen} {
|
565
571
|
width: @tenWide;
|
566
572
|
}
|
567
573
|
|
568
|
-
.ui[class*="eleven wide"].flyout
|
574
|
+
.ui[class*="eleven wide"].flyout@{notFullscreen} {
|
569
575
|
width: @elevenWide;
|
570
576
|
}
|
571
577
|
|
572
|
-
.ui[class*="twelve wide"].flyout
|
578
|
+
.ui[class*="twelve wide"].flyout@{notFullscreen} {
|
573
579
|
width: @twelveWide;
|
574
580
|
}
|
575
581
|
|
576
|
-
.ui[class*="thirteen wide"].flyout
|
582
|
+
.ui[class*="thirteen wide"].flyout@{notFullscreen} {
|
577
583
|
width: @thirteenWide;
|
578
584
|
}
|
579
585
|
|
580
|
-
.ui[class*="fourteen wide"].flyout
|
586
|
+
.ui[class*="fourteen wide"].flyout@{notFullscreen} {
|
581
587
|
width: @fourteenWide;
|
582
588
|
}
|
583
589
|
|
584
|
-
.ui[class*="fifteen wide"].flyout
|
590
|
+
.ui[class*="fifteen wide"].flyout@{notFullscreen} {
|
585
591
|
width: @fifteenWide;
|
586
592
|
}
|
587
593
|
|
588
|
-
.ui[class*="sixteen wide"].flyout
|
594
|
+
.ui[class*="sixteen wide"].flyout@{notFullscreen} {
|
589
595
|
width: @sixteenWide;
|
590
596
|
}
|
591
597
|
}
|
@@ -527,7 +527,9 @@
|
|
527
527
|
},
|
528
528
|
debounce: function (method, delay) {
|
529
529
|
clearTimeout(module.timer);
|
530
|
-
module.timer = setTimeout(function () {
|
530
|
+
module.timer = setTimeout(function () {
|
531
|
+
method();
|
532
|
+
}, delay);
|
531
533
|
},
|
532
534
|
keyboard: function (event) {
|
533
535
|
var
|
@@ -1273,7 +1275,9 @@
|
|
1273
1275
|
});
|
1274
1276
|
}
|
1275
1277
|
clearTimeout(module.performance.timer);
|
1276
|
-
module.performance.timer = setTimeout(function () {
|
1278
|
+
module.performance.timer = setTimeout(function () {
|
1279
|
+
module.performance.display();
|
1280
|
+
}, 500);
|
1277
1281
|
},
|
1278
1282
|
display: function () {
|
1279
1283
|
var
|
@@ -17,6 +17,13 @@
|
|
17
17
|
|
18
18
|
@import (multiple) "../../theme.config";
|
19
19
|
|
20
|
+
@notFullscreen: if(@variationModalFullscreen, e(":not(.fullscreen)"));
|
21
|
+
@notInside: if(@variationModalCloseInside, e(":not(.inside)"));
|
22
|
+
@notAligned: if(@variationModalAligned, e(":not(.aligned)"));
|
23
|
+
@notClose: if(@variationModalClose, e(":not(.close)"));
|
24
|
+
|
25
|
+
@notFluid: if(@variationButtonFluid, e(":not(.fluid)"));
|
26
|
+
|
20
27
|
/*******************************
|
21
28
|
Modal
|
22
29
|
*******************************/
|
@@ -37,9 +44,9 @@
|
|
37
44
|
outline: none;
|
38
45
|
}
|
39
46
|
|
40
|
-
.ui.modal > :first-child:not(.
|
47
|
+
.ui.modal > :first-child@{notClose}:not(.dimmer),
|
41
48
|
.ui.modal > i.icon:first-child + *,
|
42
|
-
.ui.modal > .dimmer:first-child +
|
49
|
+
.ui.modal > .dimmer:first-child + *@{notClose},
|
43
50
|
.ui.modal > .dimmer:first-child + i.icon + * {
|
44
51
|
border-top-left-radius: @borderRadius;
|
45
52
|
border-top-right-radius: @borderRadius;
|
@@ -58,27 +65,29 @@
|
|
58
65
|
Content
|
59
66
|
*******************************/
|
60
67
|
|
61
|
-
|
62
|
-
|
63
|
-
|
68
|
+
& when (@variationModalClose) {
|
69
|
+
/* --------------
|
70
|
+
Close
|
71
|
+
--------------- */
|
64
72
|
|
65
|
-
.ui.modal > .close {
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
}
|
78
|
-
.ui.modal > .close:focus,
|
79
|
-
.ui.modal > .close:hover {
|
80
|
-
|
81
|
-
|
73
|
+
.ui.modal > .close {
|
74
|
+
cursor: pointer;
|
75
|
+
position: absolute;
|
76
|
+
top: @closeTop;
|
77
|
+
right: @closeRight;
|
78
|
+
z-index: 1;
|
79
|
+
opacity: @closeOpacity;
|
80
|
+
font-size: @closeSize;
|
81
|
+
color: @closeColor;
|
82
|
+
width: @closeHitbox;
|
83
|
+
height: @closeHitbox;
|
84
|
+
padding: @closePadding;
|
85
|
+
}
|
86
|
+
.ui.modal > .close:focus,
|
87
|
+
.ui.modal > .close:hover {
|
88
|
+
opacity: 1;
|
89
|
+
outline: none;
|
90
|
+
}
|
82
91
|
}
|
83
92
|
|
84
93
|
/* --------------
|
@@ -172,7 +181,7 @@
|
|
172
181
|
border-top: @actionBorder;
|
173
182
|
text-align: @actionAlign;
|
174
183
|
}
|
175
|
-
.ui.modal .actions > .button
|
184
|
+
.ui.modal .actions > .button@{notFluid} {
|
176
185
|
margin-left: @buttonDistance;
|
177
186
|
}
|
178
187
|
.ui.ui.modal > .basic.actions,
|
@@ -182,7 +191,7 @@
|
|
182
191
|
& when (@variationModalLeftActions) {
|
183
192
|
.ui.modal > .left.actions {
|
184
193
|
text-align: left;
|
185
|
-
& > .button
|
194
|
+
& > .button@{notFluid} {
|
186
195
|
margin-left: @buttonLeftDistance;
|
187
196
|
margin-right: @buttonLeftDistance;
|
188
197
|
}
|
@@ -194,7 +203,7 @@
|
|
194
203
|
.ui.modal > .centered,
|
195
204
|
.ui.modal > .center.aligned {
|
196
205
|
text-align: center;
|
197
|
-
&.actions > .button
|
206
|
+
&.actions > .button@{notFluid} when (@variationModalActions) {
|
198
207
|
margin-left: @buttonCenteredDistance;
|
199
208
|
margin-right: @buttonCenteredDistance;
|
200
209
|
}
|
@@ -207,55 +216,62 @@
|
|
207
216
|
|
208
217
|
/* Modal Width */
|
209
218
|
@media only screen and (max-width: @largestMobileScreen) {
|
210
|
-
.ui.modal
|
219
|
+
.ui.modal@{notFullscreen} {
|
211
220
|
width: @mobileWidth;
|
212
221
|
margin: @mobileMargin;
|
213
222
|
}
|
214
223
|
}
|
215
224
|
@media only screen and (min-width: @tabletBreakpoint) {
|
216
|
-
.ui.modal
|
225
|
+
.ui.modal@{notFullscreen} {
|
217
226
|
width: @tabletWidth;
|
218
227
|
margin: @tabletMargin;
|
219
228
|
}
|
220
229
|
}
|
221
230
|
@media only screen and (min-width: @computerBreakpoint) {
|
222
|
-
.ui.modal
|
231
|
+
.ui.modal@{notFullscreen} {
|
223
232
|
width: @computerWidth;
|
224
233
|
margin: @computerMargin;
|
225
|
-
& > .active.dimmer + .close
|
234
|
+
& > .active.dimmer + .close@{notInside} when (@variationModalClose) {
|
226
235
|
pointer-events: none;
|
227
236
|
opacity: @closeOpacityDimmed;
|
228
237
|
}
|
229
238
|
}
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
|
239
|
+
& when (@variationModalClose) {
|
240
|
+
.ui.dimmer > .ui.modal@{notFullscreen} > .close@{notInside} {
|
241
|
+
text-shadow: @closeShadow;
|
242
|
+
}
|
243
|
+
& when (@variationDimmerInverted) {
|
244
|
+
.ui.inverted.dimmer > .ui.modal@{notFullscreen} > .close@{notInside} {
|
245
|
+
text-shadow: @invertedCloseShadow;
|
246
|
+
}
|
247
|
+
}
|
235
248
|
}
|
236
249
|
}
|
237
250
|
@media only screen and (min-width: @largeMonitorBreakpoint) {
|
238
|
-
.ui.modal
|
251
|
+
.ui.modal@{notFullscreen} {
|
239
252
|
width: @largeMonitorWidth;
|
240
253
|
margin: @largeMonitorMargin;
|
241
254
|
}
|
242
255
|
}
|
243
256
|
@media only screen and (min-width: @widescreenMonitorBreakpoint) {
|
244
|
-
.ui.modal
|
257
|
+
.ui.modal@{notFullscreen} {
|
245
258
|
width: @widescreenMonitorWidth;
|
246
259
|
margin: @widescreenMonitorMargin;
|
247
260
|
}
|
248
261
|
}
|
249
262
|
|
250
|
-
|
251
|
-
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
258
|
-
|
263
|
+
& when (@variationModalClose) {
|
264
|
+
/* Tablet and Mobile */
|
265
|
+
@media only screen and (max-width: @largestTabletScreen) {
|
266
|
+
.ui.modal > .close + .header {
|
267
|
+
padding-right: @closeHitbox;
|
268
|
+
}
|
269
|
+
|
270
|
+
.ui.modal > .close {
|
271
|
+
top: @innerCloseTop;
|
272
|
+
right: @innerCloseRight;
|
273
|
+
color: @innerCloseColor;
|
274
|
+
}
|
259
275
|
}
|
260
276
|
}
|
261
277
|
|
@@ -264,8 +280,10 @@
|
|
264
280
|
.ui.modal > .header {
|
265
281
|
padding: @mobileHeaderPadding;
|
266
282
|
}
|
267
|
-
|
268
|
-
|
283
|
+
& when (@variationModalClose) {
|
284
|
+
.ui.modal > .close + .header {
|
285
|
+
padding-right: @closeHitbox;
|
286
|
+
}
|
269
287
|
}
|
270
288
|
.ui.overlay.fullscreen.modal > .content.content.content {
|
271
289
|
min-height: @overlayFullscreenScrollingContentMaxHeightMobile;
|
@@ -277,9 +295,11 @@
|
|
277
295
|
display: block;
|
278
296
|
padding: @mobileContentPadding !important;
|
279
297
|
}
|
280
|
-
|
281
|
-
|
282
|
-
|
298
|
+
& when (@variationModalClose) {
|
299
|
+
.ui.modal > .close {
|
300
|
+
top: @mobileCloseTop !important;
|
301
|
+
right: @mobileCloseRight !important;
|
302
|
+
}
|
283
303
|
}
|
284
304
|
|
285
305
|
/* rtl:ignore */
|
@@ -351,10 +371,12 @@
|
|
351
371
|
color: @basicModalHeaderColor;
|
352
372
|
border-bottom: none;
|
353
373
|
}
|
354
|
-
|
355
|
-
|
356
|
-
|
357
|
-
|
374
|
+
& when (@variationModalClose) {
|
375
|
+
.ui.basic.modal > .close {
|
376
|
+
top: @basicModalCloseTop;
|
377
|
+
right: @basicModalCloseRight;
|
378
|
+
color: @basicInnerCloseColor;
|
379
|
+
}
|
358
380
|
}
|
359
381
|
.ui.inverted.dimmer > .basic.modal {
|
360
382
|
color: @basicInvertedModalColor;
|
@@ -370,14 +392,14 @@
|
|
370
392
|
.ui.legacy.legacy.page.dimmer > .ui.modal {
|
371
393
|
left: 50% !important;
|
372
394
|
}
|
373
|
-
.ui.legacy.legacy.modal
|
374
|
-
.ui.legacy.legacy.page.dimmer > .ui.modal
|
395
|
+
.ui.legacy.legacy.modal@{notAligned},
|
396
|
+
.ui.legacy.legacy.page.dimmer > .ui.modal@{notAligned} {
|
375
397
|
top: 50%;
|
376
398
|
}
|
377
|
-
.ui.legacy.legacy.page.dimmer > .ui.scrolling.modal
|
378
|
-
.ui.page.dimmer > .ui.scrolling.legacy.legacy.modal
|
379
|
-
.ui.top.aligned.legacy.legacy.page.dimmer > .ui.modal
|
380
|
-
.ui.top.aligned.dimmer > .ui.legacy.legacy.modal
|
399
|
+
.ui.legacy.legacy.page.dimmer > .ui.scrolling.modal@{notAligned},
|
400
|
+
.ui.page.dimmer > .ui.scrolling.legacy.legacy.modal@{notAligned},
|
401
|
+
.ui.top.aligned.legacy.legacy.page.dimmer > .ui.modal@{notAligned},
|
402
|
+
.ui.top.aligned.dimmer > .ui.legacy.legacy.modal@{notAligned} {
|
381
403
|
top: auto;
|
382
404
|
}
|
383
405
|
& when (@variationModalOverlay) {
|
@@ -450,7 +472,7 @@
|
|
450
472
|
.modals.dimmer .ui.scrolling.modal.fullscreen {
|
451
473
|
top: 0;
|
452
474
|
}
|
453
|
-
.modals.dimmer .ui.scrolling.modal
|
475
|
+
.modals.dimmer .ui.scrolling.modal@{notFullscreen} {
|
454
476
|
margin: @scrollingMargin auto;
|
455
477
|
top: @scrollingTop;
|
456
478
|
}
|
@@ -470,7 +492,7 @@
|
|
470
492
|
.scrolling.undetached.dimmable.dimmed > .dimmer {
|
471
493
|
overflow: hidden;
|
472
494
|
}
|
473
|
-
.scrolling.undetached.dimmable .ui.scrolling.modal
|
495
|
+
.scrolling.undetached.dimmable .ui.scrolling.modal@{notFullscreen} {
|
474
496
|
position: absolute;
|
475
497
|
left: 50%;
|
476
498
|
}
|
@@ -517,19 +539,21 @@
|
|
517
539
|
border-radius: 0;
|
518
540
|
}
|
519
541
|
}
|
520
|
-
|
521
|
-
|
522
|
-
|
523
|
-
|
524
|
-
|
525
|
-
|
526
|
-
|
527
|
-
|
528
|
-
|
529
|
-
|
530
|
-
|
531
|
-
|
532
|
-
|
542
|
+
& when (@variationModalClose) {
|
543
|
+
.ui.modal > .close.inside + .header:not(.centered):not(.center):not(.icon),
|
544
|
+
.ui.fullscreen.modal > .close + .header:not(.centered):not(.center):not(.icon) {
|
545
|
+
padding-right: @closeHitbox;
|
546
|
+
}
|
547
|
+
.ui.modal > .close.inside,
|
548
|
+
.ui.fullscreen.modal > .close {
|
549
|
+
top: @innerCloseTop;
|
550
|
+
right: @innerCloseRight;
|
551
|
+
color: @innerCloseColor;
|
552
|
+
}
|
553
|
+
& when (@variationModalBasic) {
|
554
|
+
.ui.basic.fullscreen.modal > .close {
|
555
|
+
color: @basicInnerCloseColor;
|
556
|
+
}
|
533
557
|
}
|
534
558
|
}
|
535
559
|
}
|
@@ -611,14 +635,17 @@
|
|
611
635
|
color: @invertedActionColor;
|
612
636
|
}
|
613
637
|
}
|
638
|
+
& when (@variationModalClose) {
|
639
|
+
& when (@variationDimmerInverted) {
|
640
|
+
.ui.inverted.dimmer > .modal > .close {
|
641
|
+
color: @invertedDimmerCloseColor;
|
642
|
+
}
|
643
|
+
}
|
614
644
|
|
615
|
-
|
616
|
-
|
617
|
-
|
618
|
-
|
619
|
-
@media only screen and (max-width: @largestTabletScreen) {
|
620
|
-
.ui.dimmer .inverted.modal > .close {
|
621
|
-
color: @invertedCloseColor;
|
645
|
+
@media only screen and (max-width: @largestTabletScreen) {
|
646
|
+
.ui.dimmer .inverted.modal > .close {
|
647
|
+
color: @invertedCloseColor;
|
648
|
+
}
|
622
649
|
}
|
623
650
|
}
|
624
651
|
& when (@variationModalFullscreen) or (@variationModalCloseInside) {
|
@@ -88,7 +88,9 @@
|
|
88
88
|
}
|
89
89
|
|
90
90
|
if (settings.displayTime > 0) {
|
91
|
-
setTimeout(function () {
|
91
|
+
setTimeout(function () {
|
92
|
+
module.hide();
|
93
|
+
}, settings.displayTime);
|
92
94
|
}
|
93
95
|
module.show();
|
94
96
|
},
|
@@ -144,8 +146,10 @@
|
|
144
146
|
module.debug('Dismissing nag', settings.storageMethod, settings.key, settings.value, settings.expires);
|
145
147
|
module.storage.set(settings.key, settings.value);
|
146
148
|
}
|
147
|
-
event
|
148
|
-
|
149
|
+
if (event) {
|
150
|
+
event.stopImmediatePropagation();
|
151
|
+
event.preventDefault();
|
152
|
+
}
|
149
153
|
},
|
150
154
|
|
151
155
|
should: {
|
@@ -377,7 +381,9 @@
|
|
377
381
|
});
|
378
382
|
}
|
379
383
|
clearTimeout(module.performance.timer);
|
380
|
-
module.performance.timer = setTimeout(function () {
|
384
|
+
module.performance.timer = setTimeout(function () {
|
385
|
+
module.performance.display();
|
386
|
+
}, 500);
|
381
387
|
},
|
382
388
|
display: function () {
|
383
389
|
var
|
@@ -17,6 +17,10 @@
|
|
17
17
|
|
18
18
|
@import (multiple) "../../theme.config";
|
19
19
|
|
20
|
+
@notBottom: if(@variationNagBottom, e(":not(.bottom)"));
|
21
|
+
@notFixed: if(@variationNagFixed, e(":not(.fixed)"));
|
22
|
+
@notOverlay: if(@variationNagOverlay, e(":not(.overlay)"));
|
23
|
+
|
20
24
|
/*******************************
|
21
25
|
Nag
|
22
26
|
*******************************/
|
@@ -63,7 +67,7 @@ a.ui.nag {
|
|
63
67
|
transition: @closeTransition;
|
64
68
|
}
|
65
69
|
|
66
|
-
.ui.nag
|
70
|
+
.ui.nag@{notOverlay}@{notFixed} {
|
67
71
|
border-radius: @borderRadius;
|
68
72
|
}
|
69
73
|
|
@@ -192,7 +196,7 @@ a.ui.nag {
|
|
192
196
|
.ui.ui.nags .nag {
|
193
197
|
border-radius: @groupedBorderRadius;
|
194
198
|
}
|
195
|
-
.ui.nags
|
199
|
+
.ui.nags@{notBottom} .nag:last-child {
|
196
200
|
border-radius: @topBorderRadius;
|
197
201
|
}
|
198
202
|
& when(@variationNagBottom) {
|
@@ -200,10 +204,10 @@ a.ui.nag {
|
|
200
204
|
border-radius: @bottomBorderRadius;
|
201
205
|
}
|
202
206
|
}
|
203
|
-
.ui.nags
|
207
|
+
.ui.nags@{notFixed}@{notOverlay} .nag:first-child {
|
204
208
|
border-radius: @bottomBorderRadius;
|
205
209
|
}
|
206
|
-
.ui.nags
|
210
|
+
.ui.nags@{notFixed}@{notOverlay} .nag:only-child {
|
207
211
|
border-radius: @borderRadius;
|
208
212
|
}
|
209
213
|
}
|
@@ -194,7 +194,9 @@
|
|
194
194
|
;
|
195
195
|
clearTimeout(module.hideTimer);
|
196
196
|
if (!openedWithTouch || (openedWithTouch && settings.addTouchEvents)) {
|
197
|
-
module.showTimer = setTimeout(function () {
|
197
|
+
module.showTimer = setTimeout(function () {
|
198
|
+
module.show();
|
199
|
+
}, delay);
|
198
200
|
}
|
199
201
|
},
|
200
202
|
end: function () {
|
@@ -204,7 +206,9 @@
|
|
204
206
|
: settings.delay
|
205
207
|
;
|
206
208
|
clearTimeout(module.showTimer);
|
207
|
-
module.hideTimer = setTimeout(function () {
|
209
|
+
module.hideTimer = setTimeout(function () {
|
210
|
+
module.hide();
|
211
|
+
}, delay);
|
208
212
|
},
|
209
213
|
touchstart: function (event) {
|
210
214
|
openedWithTouch = true;
|
@@ -1244,7 +1248,9 @@
|
|
1244
1248
|
});
|
1245
1249
|
}
|
1246
1250
|
clearTimeout(module.performance.timer);
|
1247
|
-
module.performance.timer = setTimeout(function () {
|
1251
|
+
module.performance.timer = setTimeout(function () {
|
1252
|
+
module.performance.display();
|
1253
|
+
}, 500);
|
1248
1254
|
},
|
1249
1255
|
display: function () {
|
1250
1256
|
var
|
@@ -17,6 +17,8 @@
|
|
17
17
|
|
18
18
|
@import (multiple) "../../theme.config";
|
19
19
|
|
20
|
+
@notPadded: if(@variationGridPadded, e(":not(.padded)"));
|
21
|
+
|
20
22
|
/*******************************
|
21
23
|
Popup
|
22
24
|
*******************************/
|
@@ -696,7 +698,7 @@
|
|
696
698
|
*******************************/
|
697
699
|
|
698
700
|
/* Immediate Nested Grid */
|
699
|
-
.ui.ui.ui.popup > .ui.grid
|
701
|
+
.ui.ui.ui.popup > .ui.grid@{notPadded} {
|
700
702
|
width: @nestedGridWidth;
|
701
703
|
margin: @nestedGridMargin;
|
702
704
|
}
|
@@ -791,7 +791,9 @@
|
|
791
791
|
});
|
792
792
|
}
|
793
793
|
clearTimeout(module.performance.timer);
|
794
|
-
module.performance.timer = setTimeout(function () {
|
794
|
+
module.performance.timer = setTimeout(function () {
|
795
|
+
module.performance.display();
|
796
|
+
}, 500);
|
795
797
|
},
|
796
798
|
display: function () {
|
797
799
|
var
|