superdesk-ui-framework 3.0.42 → 3.0.43
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/app/styles/_accessibility.scss +349 -310
- package/app/styles/_alerts.scss +102 -71
- package/app/styles/_animations.scss +29 -16
- package/app/styles/_avatar.scss +159 -140
- package/app/styles/_badge.scss +11 -5
- package/app/styles/_big-icon-font.scss +21 -9
- package/app/styles/_boxed-list.scss +72 -47
- package/app/styles/_buttons.scss +266 -177
- package/app/styles/_carousel.scss +58 -45
- package/app/styles/_content-divider.scss +28 -2
- package/app/styles/_drag-drop.scss +3 -0
- package/app/styles/_empty-states.scss +21 -13
- package/app/styles/_hamburger.scss +142 -144
- package/app/styles/_helpers.scss +297 -93
- package/app/styles/_icon-font.scss +75 -43
- package/app/styles/_icon-labels.scss +11 -1
- package/app/styles/_labels.scss +27 -14
- package/app/styles/_loaders.scss +2 -1
- package/app/styles/_master-desk.scss +67 -31
- package/app/styles/_mixins.scss +40 -20
- package/app/styles/_modals.scss +112 -56
- package/app/styles/_panel-info.scss +38 -34
- package/app/styles/_popover.scss +0 -1
- package/app/styles/_publisher-styles.scss +132 -122
- package/app/styles/_sd-tag-input.scss +104 -24
- package/app/styles/_simple-list.scss +89 -66
- package/app/styles/_spinner.scss +24 -17
- package/app/styles/_table-list.scss +114 -80
- package/app/styles/_tables.scss +14 -2
- package/app/styles/_tabs-vertical.scss +46 -43
- package/app/styles/_tabs.scss +97 -87
- package/app/styles/_tag-labels.scss +26 -11
- package/app/styles/_thumb-carousel.scss +37 -11
- package/app/styles/_toggle-box.scss +27 -7
- package/app/styles/_toggle-button.scss +5 -1
- package/app/styles/_tooltips.scss +284 -272
- package/app/styles/components/_card-item.scss +268 -192
- package/app/styles/components/_list-item.scss +261 -175
- package/app/styles/components/_sd-circular-progress.scss +109 -79
- package/app/styles/components/_sd-collapse-box.scss +45 -33
- package/app/styles/components/_sd-comment-box.scss +17 -12
- package/app/styles/components/_sd-dropzone.scss +32 -15
- package/app/styles/components/_sd-editor-popup.scss +29 -15
- package/app/styles/components/_sd-grid-item.scss +349 -237
- package/app/styles/components/_sd-loader.scss +1 -2
- package/app/styles/components/_sd-media-carousel.scss +119 -78
- package/app/styles/components/_sd-notification-panel.scss +2 -1
- package/app/styles/components/_sd-pagination.scss +27 -19
- package/app/styles/components/_sd-photo-preview.scss +82 -41
- package/app/styles/components/_sd-searchbar.scss +79 -51
- package/app/styles/components/_sd-toaster.scss +52 -30
- package/app/styles/components/_subnav.scss +230 -135
- package/app/styles/components/_theme-selector.scss +78 -53
- package/app/styles/components/sd-slider.scss +11 -7
- package/app/styles/design-tokens/_design-tokens-general.scss +31 -27
- package/app/styles/design-tokens/_new-colors.scss +3 -1
- package/app/styles/dropdowns/_basic-dropdown.scss +164 -86
- package/app/styles/dropdowns/_input-dropdown.scss +5 -2
- package/app/styles/dropdowns/_navigation_dropdown.scss +18 -4
- package/app/styles/dropdowns/_nested-dropdown.scss +11 -2
- package/app/styles/dropdowns/_other_dropdown.scss +9 -3
- package/app/styles/editor/_editor-buttons.scss +10 -6
- package/app/styles/editor/_editor-themes.scss +401 -350
- package/app/styles/form-elements/_autocomplete.scss +7 -1
- package/app/styles/form-elements/_checkbox.scss +230 -159
- package/app/styles/form-elements/_forms-general.scss +345 -285
- package/app/styles/form-elements/_input-preview.scss +15 -9
- package/app/styles/form-elements/_input-wrap.scss +77 -71
- package/app/styles/form-elements/_inputs.scss +668 -489
- package/app/styles/form-elements/_radio.scss +10 -5
- package/app/styles/form-elements/_switch.scss +27 -16
- package/app/styles/grids/_basic-grid.scss +83 -64
- package/app/styles/grids/_grid-layout.scss +301 -165
- package/app/styles/grids/_layout-grid.scss +85 -59
- package/app/styles/grids/_sd-kanban-list.scss +14 -4
- package/app/styles/interface-elements/_side-panel.scss +279 -200
- package/app/styles/layout/_basic-layout.scss +36 -34
- package/app/styles/layout/_container.scss +38 -31
- package/app/styles/layout/_editor.scss +57 -17
- package/app/styles/layout/_general.scss +81 -67
- package/app/styles/menus/_sd-bottom-tabs.scss +21 -12
- package/app/styles/menus/_sd-content-navigation.scss +20 -16
- package/app/styles/menus/_sd-left-navigation.scss +62 -49
- package/app/styles/menus/_sd-sidebar-menu.scss +365 -323
- package/app/styles/menus/_sd-top-menu.scss +16 -7
- package/app/styles/primereact/_pr-autocomplete.scss +2 -0
- package/app/styles/primereact/_pr-datepicker.scss +13 -2
- package/app/styles/primereact/_pr-dialog.scss +55 -47
- package/app/styles/primereact/_pr-dropdown.scss +27 -22
- package/app/styles/primereact/_pr-general.scss +3 -0
- package/app/styles/primereact/_pr-menu.scss +2 -1
- package/app/styles/primereact/_pr-skeleton.scss +1 -0
- package/app/styles/primereact/_pr-tag-input.scss +1 -0
- package/app/styles/variables/_colors.scss +168 -170
- package/app/styles/variables/_typography.scss +1 -2
- package/app-typescript/components/Form/InputWrapper.tsx +1 -1
- package/app-typescript/components/Menu.tsx +1 -1
- package/dist/examples.bundle.css +18 -16
- package/dist/examples.bundle.js +5 -7
- package/dist/superdesk-ui.bundle.css +4265 -3552
- package/dist/superdesk-ui.bundle.js +4 -6
- package/package.json +2 -2
- package/react/components/Form/InputWrapper.d.ts +1 -1
- package/react/components/Menu.js +1 -1
|
@@ -12,18 +12,22 @@
|
|
|
12
12
|
position: relative;
|
|
13
13
|
z-index: 2;
|
|
14
14
|
background: transparent;
|
|
15
|
+
|
|
15
16
|
&:hover {
|
|
16
17
|
background: rgba(255,255,255,0);
|
|
17
18
|
}
|
|
19
|
+
|
|
18
20
|
&.condensed {
|
|
19
21
|
padding: 0 14px;
|
|
20
22
|
}
|
|
21
23
|
}
|
|
24
|
+
|
|
22
25
|
&.open {
|
|
23
26
|
& > .dropdown__toggle {
|
|
24
27
|
background-color: var(--color-dropdown-menu-Bg);
|
|
25
28
|
color: $sd-colour-interactive;
|
|
26
29
|
z-index: 3;
|
|
30
|
+
|
|
27
31
|
&.sd-create-btn {
|
|
28
32
|
.circle {
|
|
29
33
|
width: 32px;
|
|
@@ -47,9 +51,11 @@
|
|
|
47
51
|
min-width: 200px;
|
|
48
52
|
box-shadow: $shadow__dropdown--default;
|
|
49
53
|
padding: 10px 0;
|
|
54
|
+
|
|
50
55
|
&:before {
|
|
51
56
|
display: none;
|
|
52
57
|
}
|
|
58
|
+
|
|
53
59
|
li {
|
|
54
60
|
> a, > button, > span {
|
|
55
61
|
margin: 0;
|
|
@@ -57,15 +63,19 @@
|
|
|
57
63
|
padding: 6px 16px;
|
|
58
64
|
line-height: 19px;
|
|
59
65
|
}
|
|
66
|
+
|
|
60
67
|
> span {
|
|
61
68
|
display: block;
|
|
69
|
+
|
|
62
70
|
&:hover {
|
|
63
71
|
background: none;
|
|
64
72
|
}
|
|
65
73
|
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
74
|
+
|
|
75
|
+
> .dropdown__menu-label {
|
|
76
|
+
min-width: 205px;
|
|
77
|
+
}
|
|
78
|
+
|
|
69
79
|
button {
|
|
70
80
|
&.full {
|
|
71
81
|
width: 100%;
|
|
@@ -74,15 +84,18 @@
|
|
|
74
84
|
padding: 10px 10px;
|
|
75
85
|
border-top: 1px solid #e0e0e0;
|
|
76
86
|
border-radius: 0px;
|
|
87
|
+
|
|
77
88
|
i {
|
|
78
89
|
margin-right: 10px;
|
|
79
90
|
}
|
|
91
|
+
|
|
80
92
|
&:hover {
|
|
81
93
|
background: $sd-colour-interactive;
|
|
82
94
|
color: #fff;
|
|
83
95
|
}
|
|
84
96
|
}
|
|
85
97
|
}
|
|
98
|
+
|
|
86
99
|
&:active {
|
|
87
100
|
> button {
|
|
88
101
|
background: $sd-colour-interactive;
|
|
@@ -90,6 +103,7 @@
|
|
|
90
103
|
}
|
|
91
104
|
}
|
|
92
105
|
}
|
|
106
|
+
|
|
93
107
|
.fieldset {
|
|
94
108
|
button {
|
|
95
109
|
display: inline-block;
|
|
@@ -106,4 +120,4 @@
|
|
|
106
120
|
|
|
107
121
|
.navbtn.dropdown {
|
|
108
122
|
padding: 0;
|
|
109
|
-
}
|
|
123
|
+
}
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
// Nested dropdowns
|
|
2
|
-
|
|
2
|
+
|
|
3
3
|
.dropdown {
|
|
4
4
|
&.open {
|
|
5
5
|
li .dropdown {
|
|
6
6
|
display: block;
|
|
7
7
|
float: none;
|
|
8
|
+
|
|
8
9
|
.dropdown__toggle {
|
|
9
10
|
padding-inline-end: 2.4rem;
|
|
11
|
+
|
|
10
12
|
&::after {
|
|
11
13
|
position: absolute;
|
|
12
14
|
inset-inline-end: 0.8rem;
|
|
@@ -25,32 +27,39 @@
|
|
|
25
27
|
opacity: .4;
|
|
26
28
|
}
|
|
27
29
|
}
|
|
30
|
+
|
|
28
31
|
&:not(.open) .dropdown__menu {
|
|
29
32
|
display: none;
|
|
30
33
|
}
|
|
34
|
+
|
|
31
35
|
> .dropdown__menu {
|
|
32
36
|
inset-inline-start: 100%;
|
|
33
37
|
inset-inline-end: auto;
|
|
34
38
|
inset-block-start: 0;
|
|
35
39
|
min-width: 160px;
|
|
36
40
|
z-index: 10;
|
|
41
|
+
|
|
37
42
|
&.dropdown__menu--submenu-left {
|
|
38
43
|
inset-inline-start: auto;
|
|
39
44
|
inset-inline-end: 100%;
|
|
40
45
|
}
|
|
46
|
+
|
|
41
47
|
&.upward {
|
|
42
48
|
inset-block-start: auto;
|
|
43
49
|
inset-block-end: -16px;
|
|
44
50
|
}
|
|
51
|
+
|
|
45
52
|
&.dropdown--align-right {
|
|
46
53
|
inset-inline-start: auto;
|
|
47
54
|
inset-inline-end: 100%;
|
|
48
55
|
}
|
|
49
56
|
}
|
|
57
|
+
|
|
50
58
|
&.dropdown--dropup > .dropdown__menu {
|
|
51
59
|
inset-block-start: auto;
|
|
52
60
|
inset-block-end: 0;
|
|
53
61
|
}
|
|
62
|
+
|
|
54
63
|
&:hover {
|
|
55
64
|
> .dropdown__menu {
|
|
56
65
|
display: block;
|
|
@@ -83,4 +92,4 @@
|
|
|
83
92
|
}
|
|
84
93
|
}
|
|
85
94
|
}
|
|
86
|
-
}
|
|
95
|
+
}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
.sd-widget.metadata {
|
|
3
3
|
.dropdown {
|
|
4
4
|
margin-right: -5px;
|
|
5
|
+
|
|
5
6
|
.dropdown__toggle {
|
|
6
7
|
display: inline-block;
|
|
7
8
|
max-width: 100%;
|
|
@@ -14,19 +15,23 @@
|
|
|
14
15
|
padding: 4px 10px;
|
|
15
16
|
overflow: hidden;
|
|
16
17
|
text-overflow: ellipsis;
|
|
18
|
+
|
|
17
19
|
&:hover {
|
|
18
20
|
cursor: pointer;
|
|
19
21
|
}
|
|
20
22
|
}
|
|
23
|
+
|
|
21
24
|
.dropdown__menu {
|
|
22
|
-
&:before {
|
|
23
|
-
display: none;
|
|
24
|
-
}
|
|
25
25
|
margin: 0;
|
|
26
26
|
margin-top: -5px;
|
|
27
27
|
box-sizing: border-box;
|
|
28
28
|
border-radius:0;
|
|
29
29
|
max-width: $tabpane-width - 40px;
|
|
30
|
+
|
|
31
|
+
&:before {
|
|
32
|
+
display: none;
|
|
33
|
+
}
|
|
34
|
+
|
|
30
35
|
button {
|
|
31
36
|
overflow: hidden;
|
|
32
37
|
text-overflow: ellipsis;
|
|
@@ -38,6 +43,7 @@
|
|
|
38
43
|
.dropdown__toggle {
|
|
39
44
|
width: 40px;
|
|
40
45
|
}
|
|
46
|
+
|
|
41
47
|
.dropdown__menu {
|
|
42
48
|
width: 70px;
|
|
43
49
|
min-width: 0;
|
|
@@ -7,12 +7,7 @@ $editor-styleButton-color: var(--sd-editor-colour__txt);
|
|
|
7
7
|
$editor-styleButton-active-color: var(--sd-editor-colour__button-txt--active);
|
|
8
8
|
$editor-styleButton-size: 3rem;
|
|
9
9
|
|
|
10
|
-
|
|
11
10
|
.Editor3-styleButton {
|
|
12
|
-
&--short {
|
|
13
|
-
padding-right: 0.2rem;
|
|
14
|
-
margin-right: -1rem;
|
|
15
|
-
}
|
|
16
11
|
color: $editor-styleButton-color;
|
|
17
12
|
cursor: pointer;
|
|
18
13
|
margin: 0.4rem 0.2rem;
|
|
@@ -23,17 +18,20 @@ $editor-styleButton-size: 3rem;
|
|
|
23
18
|
border-radius: $editor-styleButton-size / 2;
|
|
24
19
|
text-align: center;
|
|
25
20
|
line-height: 1.6rem;
|
|
21
|
+
|
|
26
22
|
[class*="icon-"] {
|
|
27
23
|
color: inherit;
|
|
28
24
|
opacity: 0.5;
|
|
29
25
|
vertical-align: middle;
|
|
30
26
|
}
|
|
27
|
+
|
|
31
28
|
&:hover {
|
|
32
29
|
[class*="icon-"] {
|
|
33
30
|
color: inherit;
|
|
34
31
|
opacity: 0.9;
|
|
35
32
|
}
|
|
36
33
|
}
|
|
34
|
+
|
|
37
35
|
.inactive {
|
|
38
36
|
[class*="icon-"] {
|
|
39
37
|
opacity: 0.2;
|
|
@@ -44,6 +42,7 @@ $editor-styleButton-size: 3rem;
|
|
|
44
42
|
}
|
|
45
43
|
}
|
|
46
44
|
}
|
|
45
|
+
|
|
47
46
|
&.Editor3-activeButton, &.Editor3-activeButton:hover {
|
|
48
47
|
color: $editor-styleButton-active-color;
|
|
49
48
|
background-color: rgba(0, 0, 0, 0.075);
|
|
@@ -51,4 +50,9 @@ $editor-styleButton-size: 3rem;
|
|
|
51
50
|
opacity: 1;
|
|
52
51
|
}
|
|
53
52
|
}
|
|
54
|
-
}
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.Editor3-styleButton--short {
|
|
56
|
+
padding-right: 0.2rem;
|
|
57
|
+
margin-right: -1rem;
|
|
58
|
+
}
|