blue-react 9.9.3 → 9.10.0

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.
Files changed (39) hide show
  1. package/dist/components/HeaderTitle.js +2 -5
  2. package/dist/components/Layout.js +4 -4
  3. package/dist/components/MenuItem.js +1 -8
  4. package/dist/components/Search.js +2 -3
  5. package/dist/components/Utilities.js +23 -146
  6. package/dist/style.css +17 -7
  7. package/dist/style.min.css +6 -3
  8. package/dist/style.scss +2 -54
  9. package/dist/types/components/Utilities.d.ts +11 -16
  10. package/package.json +4 -4
  11. package/dist/components/DocumentView.js +0 -83
  12. package/dist/neu.css +0 -156
  13. package/dist/neu.min.css +0 -2
  14. package/dist/neu.scss +0 -90
  15. package/dist/styles/_action-menu.scss +0 -69
  16. package/dist/styles/_bootstrap-mixins_overwritten.scss +0 -106
  17. package/dist/styles/_bootstrap-variables.scss +0 -18
  18. package/dist/styles/_bootstrap.scss +0 -58
  19. package/dist/styles/_buttons.scss +0 -110
  20. package/dist/styles/_caret.scss +0 -50
  21. package/dist/styles/_general.scss +0 -142
  22. package/dist/styles/_hover.scss +0 -44
  23. package/dist/styles/_keyframes.scss +0 -73
  24. package/dist/styles/_layout.scss +0 -378
  25. package/dist/styles/_mixins.scss +0 -7
  26. package/dist/styles/_router.scss +0 -19
  27. package/dist/styles/_search.scss +0 -62
  28. package/dist/styles/_sidebar.scss +0 -36
  29. package/dist/styles/_status.scss +0 -147
  30. package/dist/styles/_tooltips.scss +0 -196
  31. package/dist/styles/_variables.scss +0 -123
  32. package/dist/styles/mixins/_action-menu.scss +0 -67
  33. package/dist/styles/mixins/_custom-property.scss +0 -10
  34. package/dist/styles/mixins/_menu-item.scss +0 -23
  35. package/dist/styles/mixins/_misc.scss +0 -49
  36. package/dist/styles/mixins/_scroll-shadow.scss +0 -9
  37. package/dist/styles/mixins/_sidebar.scss +0 -201
  38. package/dist/styles/mixins/_switch.scss +0 -85
  39. package/dist/types/components/DocumentView.d.ts +0 -24
@@ -1,49 +0,0 @@
1
- /**
2
- @deprecated Will be removed in a future version. Please use `blue-custom-scrollbar` instead!
3
- */
4
- @mixin custom-scrollbar($thumb-color, $bg-color, $track-border-radius: 0) {
5
- @include blue-custom-scrollbar(
6
- $bg-color,
7
- rgba($thumb-color, 0.5),
8
- rgba($thumb-color, 0.6),
9
- rgba($thumb-color, 0.7),
10
- $track-border-radius
11
- );
12
- }
13
-
14
- @mixin blue-custom-scrollbar(
15
- $bg-color,
16
- $thumb-color,
17
- $thumb-color-hover: $thumb-color,
18
- $thumb-color-focus: $thumb-color,
19
- $track-border-radius: 0
20
- ) {
21
- ::-webkit-scrollbar-thumb {
22
- background-color: $thumb-color;
23
- box-shadow: inset 1px 1px 0 rgba(white, 0.2), inset 0 -1px 0 rgba(white, 0.17);
24
- }
25
- ::-webkit-scrollbar-thumb:hover {
26
- background-color: $thumb-color-hover;
27
- }
28
- ::-webkit-scrollbar-thumb:active {
29
- background-color: $thumb-color-focus;
30
- }
31
-
32
- ::-webkit-scrollbar-track {
33
- background-color: $bg-color;
34
- border-radius: $track-border-radius;
35
- }
36
- }
37
-
38
- @mixin slide-transition() {
39
- $slide-transition: width 0.5s;
40
- transition: $slide-transition;
41
- }
42
-
43
- @mixin header-bg() {
44
- background-image: linear-gradient(
45
- var(--blue-header-bg, $header-bg),
46
- rgba(var(--blue-header-bg-rgb, var(--bs-theme-rgb)), var(--blue-shimmering, $shimmering))
47
- );
48
- backdrop-filter: blur(3px) saturate(125%);
49
- }
@@ -1,9 +0,0 @@
1
- @mixin scroll-shadow($bg, $light-base: white) {
2
- background: linear-gradient($bg 30%, rgba($light-base, 0)),
3
- linear-gradient(rgba($light-base, 0) 10px, $bg 70%) bottom,
4
- radial-gradient(at top, rgba(0, 0, 0, 0.2), transparent 70%),
5
- radial-gradient(at bottom, rgba(0, 0, 0, 0.2), transparent 70%) bottom;
6
- background-repeat: no-repeat;
7
- background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
8
- background-attachment: local, local, scroll, scroll;
9
- }
@@ -1,201 +0,0 @@
1
- @mixin openSidebarMenu() {
2
- .blue-sidebar-hidden-on-open,
3
- .blue-sidebar-before-hidden-on-open::before,
4
- .blue-sidebar-after-hidden-on-open::after,
5
- .blue-sidebar-pseudo-hidden-on-open::before,
6
- .blue-sidebar-pseudo-hidden-on-open::after {
7
- display: none !important;
8
- }
9
-
10
- .blue-sidebar-visible-on-open {
11
- animation: fade-in 1s;
12
- display: flex !important;
13
- }
14
-
15
- .blue-menu-item-label {
16
- display: inline-block;
17
- }
18
- .blue-sidebar {
19
- z-index: 42;
20
- box-shadow: 0.6rem 6rem 6rem rgba(0, 0, 0, 0.4);
21
- // background-color: darken($theme, 30%);
22
- }
23
-
24
- --blue-sidebar-width: #{$bla-sidebar-width};
25
-
26
- .blue-sidebar,
27
- .blue-sidebar .blue-menu-item {
28
- width: $bla-sidebar-width;
29
- }
30
-
31
- .blue-sidebar .blue-menu-item {
32
- & > * {
33
- width: auto;
34
- }
35
- }
36
-
37
- .blue-sub-sidebar {
38
- left: $bla-sidebar-width;
39
- }
40
-
41
- .blue-menu-item-dropdown-caret.blue-caret {
42
- display: flex;
43
- }
44
-
45
- .blue-menu-item-dropdown {
46
- .blue-menu-item {
47
- width: 100%;
48
- }
49
- }
50
-
51
- /* search */
52
- .blue-search:not(.blue-search-body) {
53
- background-color: $sidebar-search-bg;
54
- }
55
-
56
- .blue-search-btn {
57
- display: none;
58
- }
59
-
60
- .blue-search-input-group {
61
- display: flex;
62
- align-items: center;
63
- }
64
-
65
- .blue-header-title.sidebar {
66
- transform: translateX(0);
67
- }
68
-
69
- .blue-sidebar-menu-horizontal-on-open {
70
- .blue-menu-item {
71
- &.active::after {
72
- @include blue-menu-item-indicator-horizontal();
73
- }
74
- }
75
- }
76
-
77
- .blue-sidebar-menu-vertical-on-open {
78
- .blue-menu-item {
79
- &.active::after {
80
- @include blue-menu-item-indicator();
81
- }
82
- }
83
- }
84
- }
85
-
86
- @mixin blue-sidebar($width) {
87
- .blue-menu-item {
88
- color: inherit;
89
- width: $normal-size;
90
- height: $normal-size;
91
- padding: 0.25rem 0.75rem;
92
- font-size: $bla-btn-font-size;
93
- display: flex;
94
- align-items: center;
95
- border-color: transparent;
96
- @include slide-transition();
97
-
98
- &::before {
99
- content: "";
100
- position: absolute;
101
- top: 0.25rem;
102
- right: 0.25rem;
103
- bottom: 0.25rem;
104
- left: 0.25rem;
105
- background-color: currentColor;
106
- border-radius: $border-radius;
107
- transform: scale(0.9);
108
- opacity: 0;
109
- transition: all 0.2s;
110
- }
111
-
112
- &[draggable] {
113
- cursor: move;
114
-
115
- &:active {
116
- box-shadow: inset 0 0 0.25rem;
117
- }
118
- }
119
-
120
- &:hover,
121
- &:active,
122
- &.highlighted {
123
- color: inherit;
124
- border-color: transparent;
125
-
126
- &::before {
127
- transform: scale(1);
128
- opacity: 0.25;
129
- }
130
- }
131
-
132
- &.highlighted {
133
- &::before {
134
- opacity: 0.16;
135
- }
136
- }
137
-
138
- &:hover,
139
- &:active {
140
- &::before {
141
- opacity: 0.25;
142
- }
143
- }
144
-
145
- &.active::after {
146
- @include blue-menu-item-indicator();
147
- }
148
-
149
- & > * + .blue-menu-item-label {
150
- margin-left: 0.5rem;
151
- }
152
- }
153
-
154
- :root {
155
- --blue-sidebar-width: #{$width};
156
- }
157
-
158
- .blue-sidebar {
159
- width: $width;
160
- color: var(--blue-sidebar-color);
161
- background: var(--blue-sidebar-bg);
162
- position: fixed;
163
- left: 0;
164
- top: $normal-size;
165
- bottom: 0;
166
- z-index: 3;
167
- display: flex;
168
- flex-direction: column;
169
- @include slide-transition();
170
-
171
- .blue-menu {
172
- overflow-y: auto;
173
- flex: 1;
174
- @include scroll-shadow(var(--blue-sidebar-bg), $sidebar-bg);
175
- }
176
-
177
- .blue-menu-item {
178
- & > * {
179
- width: 100%;
180
- }
181
- }
182
- }
183
- }
184
-
185
- @keyframes blue-menu-item-indicator-in-from-side {
186
- from {
187
- transform: translateX(-100%);
188
- }
189
- to {
190
- transform: translateX(1);
191
- }
192
- }
193
-
194
- @keyframes blue-menu-item-indicator-in-from-below {
195
- from {
196
- transform: translateY(100%);
197
- }
198
- to {
199
- transform: translateY(1);
200
- }
201
- }
@@ -1,85 +0,0 @@
1
- @mixin switch(
2
- $width: 35px,
3
- $height: 20px,
4
- $padding: 3px,
5
- $color: $body-color,
6
- $color-active: $success
7
- ) {
8
- $slider-size: $height - ($padding * 2);
9
-
10
- & {
11
- position: relative;
12
- display: inline-block;
13
- width: $width;
14
- height: $height;
15
-
16
- input {
17
- display: none;
18
- }
19
-
20
- &.disabled {
21
- opacity: 0.8;
22
- }
23
-
24
- &:not(.disabled) {
25
- .slider {
26
- cursor: pointer;
27
- }
28
- }
29
-
30
- .slider {
31
- position: absolute;
32
- top: 0;
33
- left: 0;
34
- right: 0;
35
- bottom: 0;
36
- background-color: $input-group-addon-bg;
37
- transition: 0.4s;
38
- box-shadow: inset 0 0 0 1px rgba($color, 0.5);
39
-
40
- &::before {
41
- content: "";
42
- position: absolute;
43
- height: $slider-size;
44
- width: $slider-size;
45
- left: $padding;
46
- bottom: $padding;
47
- background-color: $color;
48
- transition: 0.4s;
49
- }
50
-
51
- &::after {
52
- content: attr(data-label);
53
- position: absolute;
54
- top: 50%;
55
- left: 50%;
56
- transform: translate(-50%, -50%);
57
- margin-left: ($slider-size * 0.5);
58
- transition: margin-left 0.4s;
59
- color: $color;
60
- }
61
- }
62
-
63
- input:checked {
64
- & + .slider {
65
- background-color: $color-active;
66
- box-shadow: inset 0 0 12px rgba(255, 255, 255, 0.3);
67
-
68
- &::before {
69
- transform: translateX(
70
- $width - $slider-size - ($padding * 2)
71
- );
72
- background-color: white;
73
- }
74
-
75
- &::after {
76
- color: white;
77
- margin-left: ($slider-size * 0.5) * -1;
78
- }
79
- }
80
- }
81
- input:focus + .slider {
82
- box-shadow: 0 0 1px $color-active;
83
- }
84
- }
85
- }
@@ -1,24 +0,0 @@
1
- /// <reference types="react" />
2
- export interface DocumentViewProps {
3
- /**
4
- * Source of the content (URL)
5
- */
6
- src?: string;
7
- /**
8
- * Instead of a source, you can also set the content directly (HTML)
9
- */
10
- content?: string;
11
- /**
12
- * MIME type of the content (e.g. "application/pdf")
13
- */
14
- mimeType: string;
15
- /**
16
- * Label for the button to display
17
- */
18
- showDocumentLabel: string;
19
- }
20
- /**
21
- * @deprecated Only used by one project (Florence). Component will be moved to that project instead.
22
- * Tries to display content in an iframe. When the content can't displayed in an iframe, it will show a download button instead.
23
- */
24
- export default function DocumentView({ content, mimeType, src, showDocumentLabel }: DocumentViewProps): JSX.Element;