blue-web 1.21.1 → 1.21.7

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 (73) hide show
  1. package/LICENSE +164 -164
  2. package/README.md +74 -74
  3. package/dist/js/actions.d.ts +6 -6
  4. package/dist/js/color-mode.d.ts +4 -4
  5. package/dist/js/dialog.d.ts +18 -18
  6. package/dist/js/edit-view.d.ts +14 -14
  7. package/dist/js/edit-view.js +2 -2
  8. package/dist/js/input-splitted.d.ts +19 -19
  9. package/dist/js/odometer.d.ts +30 -30
  10. package/dist/js/odometer.js +8 -8
  11. package/dist/js/progress.d.ts +2 -2
  12. package/dist/js/read-view.d.ts +35 -35
  13. package/dist/js/read-view.js +18 -18
  14. package/dist/js/select-list.d.ts +46 -46
  15. package/dist/js/select-list.js +17 -17
  16. package/dist/js/shared.d.ts +14 -14
  17. package/dist/js/side-layout.d.ts +7 -7
  18. package/dist/js/utils.d.ts +18 -18
  19. package/dist/js/utils.js +6 -6
  20. package/dist/merged.scss +2170 -2170
  21. package/dist/neu.scss +92 -92
  22. package/dist/style.css +1 -1
  23. package/dist/style.min.css +1 -1
  24. package/dist/style.scss +62 -62
  25. package/dist/styles/_action-menu.scss +57 -57
  26. package/dist/styles/_actions.scss +37 -37
  27. package/dist/styles/_anchor.scss +42 -42
  28. package/dist/styles/_bootstrap-mixins_overwritten.scss +106 -106
  29. package/dist/styles/_bootstrap-variables.scss +46 -46
  30. package/dist/styles/_bootstrap.scss +64 -64
  31. package/dist/styles/_button-icon-wrapper.scss +28 -28
  32. package/dist/styles/_buttons.scss +120 -120
  33. package/dist/styles/_collapse.scss +72 -72
  34. package/dist/styles/_container-grid.scss +52 -52
  35. package/dist/styles/_devexpress.scss +104 -104
  36. package/dist/styles/_general.scss +55 -55
  37. package/dist/styles/_hover.scss +37 -37
  38. package/dist/styles/_input-group.scss +29 -29
  39. package/dist/styles/_inter.scss +19 -19
  40. package/dist/styles/_intro.scss +22 -22
  41. package/dist/styles/_keyframes.scss +73 -73
  42. package/dist/styles/_layout.scss +175 -175
  43. package/dist/styles/_menu-item.scss +86 -86
  44. package/dist/styles/_mixins.scss +6 -6
  45. package/dist/styles/_modal.scss +118 -118
  46. package/dist/styles/_page-header.scss +14 -14
  47. package/dist/styles/_scrollspy.scss +78 -78
  48. package/dist/styles/_status.scss +131 -131
  49. package/dist/styles/_text-icons.scss +15 -15
  50. package/dist/styles/_tooltips.scss +150 -150
  51. package/dist/styles/_utils.scss +20 -20
  52. package/dist/styles/_variables.scss +128 -128
  53. package/dist/styles/mixins/_action-menu.scss +64 -64
  54. package/dist/styles/mixins/_custom-property.scss +10 -10
  55. package/dist/styles/mixins/_menu-item.scss +136 -136
  56. package/dist/styles/mixins/_misc.scss +7 -7
  57. package/dist/styles/mixins/_scroll-shadow.scss +9 -9
  58. package/dist/styles/mixins/_switch.scss +91 -91
  59. package/package.json +87 -88
  60. package/dist/container-grid.css +0 -196
  61. package/dist/js/auto-theme.bundle.js +0 -1
  62. package/dist/js/auto-theme.d.ts +0 -26
  63. package/dist/js/auto-theme.js +0 -169
  64. package/dist/js/button.bundle.js +0 -1
  65. package/dist/js/button.d.ts +0 -6
  66. package/dist/js/button.js +0 -16
  67. package/dist/js/dialog.bundle.js.LICENSE.txt +0 -5
  68. package/dist/js/dxf-viewer.js +0 -129
  69. package/dist/js/searchbox.bundle.js +0 -2
  70. package/dist/js/searchbox.bundle.js.LICENSE.txt +0 -11
  71. package/dist/js/searchbox.d.ts +0 -16
  72. package/dist/js/searchbox.js +0 -158
  73. package/dist/tailwind-main.css +0 -737
package/dist/neu.scss CHANGED
@@ -1,92 +1,92 @@
1
- /* Neumorphism effects */
2
-
3
- $theme: #e5dff4 !default;
4
-
5
- @function neu-shadow($multiplicate: 1, $inset: false, $switch: false) {
6
- $preset: "";
7
- $bg-suffix: "";
8
-
9
- @if $inset {
10
- $preset: "inset";
11
- $bg-suffix: "-inset";
12
- }
13
-
14
- @if $switch {
15
- @return $preset calc(var(--neu-distance) * #{$multiplicate}) calc(var(--neu-distance) * #{$multiplicate})
16
- calc(var(--neu-blur) * #{$multiplicate}) var(--neu-shadow-high#{$bg-suffix}),
17
- $preset calc(var(--neu-distance) * -#{$multiplicate}) calc(var(--neu-distance) * -#{$multiplicate})
18
- calc(var(--neu-blur) * #{$multiplicate}) var(--neu-shadow-low#{$bg-suffix});
19
- }
20
-
21
- @return $preset calc(var(--neu-distance) * -#{$multiplicate}) calc(var(--neu-distance) * -#{$multiplicate})
22
- calc(var(--neu-blur) * #{$multiplicate}) var(--neu-shadow-high#{$bg-suffix}),
23
- $preset calc(var(--neu-distance) * #{$multiplicate}) calc(var(--neu-distance) * #{$multiplicate})
24
- calc(var(--neu-blur) * #{$multiplicate}) var(--neu-shadow-low#{$bg-suffix});
25
- }
26
-
27
- $neu-steps: (
28
- 1: 0.25,
29
- 2: 0.5,
30
- 3: 1,
31
- 4: 1.5,
32
- 5: 3
33
- );
34
-
35
- @mixin neu($bg: $theme, $bg-inset: $theme) {
36
- --neu-bg: #{$bg};
37
- --neu-bg-inset: #{$bg-inset};
38
-
39
- --neu-shadow-high: #{lighten($bg, 3%)};
40
- --neu-shadow-low: #{darken($bg, 4%)};
41
- --neu-shadow-high-inset: #{lighten($bg-inset, 4%)};
42
- --neu-shadow-low-inset: #{darken($bg-inset, 4%)};
43
-
44
- --neu-distance: 0.37rem;
45
- --neu-blur: 0.7rem;
46
-
47
- @each $unit, $value in $neu-steps {
48
- --neu-shadow-#{$unit}: #{neu-shadow($value)};
49
- --neu-shadow-inset-#{$unit}: #{neu-shadow($value, true)};
50
-
51
- --neu-shadow-switch-#{$unit}: #{neu-shadow($value, false, true)};
52
- --neu-shadow-inset-switch-#{$unit}: #{neu-shadow($value, true, true)};
53
- }
54
- }
55
-
56
- @mixin neu-define-utility-classes() {
57
- @each $unit, $value in $neu-steps {
58
- .neu-shadow-#{$unit} {
59
- box-shadow: #{neu-shadow($value, $inset: false, $switch: false)} !important;
60
-
61
- @each $unit, $value in $neu-steps {
62
- &.neu-shadow-inset-#{$unit} {
63
- box-shadow: #{neu-shadow($value, $inset: false, $switch: false)},
64
- #{neu-shadow($value, $inset: true, $switch: false)} !important;
65
- }
66
-
67
- &.neu-shadow-inset-switch-#{$unit} {
68
- box-shadow: #{neu-shadow($value, $inset: false, $switch: false)},
69
- #{neu-shadow($value, $inset: true, $switch: true)} !important;
70
- }
71
- }
72
- }
73
- .neu-shadow-inset-#{$unit} {
74
- box-shadow: #{neu-shadow($value, $inset: true, $switch: false)} !important;
75
- }
76
-
77
- // Uncommented to reduce CSS size.
78
- // I don't see that `.neu-shadow-switch-#{$unit}` should be used in practice.
79
- // .neu-shadow-switch-#{$unit} {
80
- // box-shadow: #{neu-shadow($value, $inset: false, $switch: true)} !important;
81
- // }
82
- .neu-shadow-inset-switch-#{$unit} {
83
- box-shadow: #{neu-shadow($value, $inset: true, $switch: true)} !important;
84
- }
85
- }
86
- }
87
-
88
- :root {
89
- @include neu();
90
- }
91
-
92
- @include neu-define-utility-classes();
1
+ /* Neumorphism effects */
2
+
3
+ $theme: #e5dff4 !default;
4
+
5
+ @function neu-shadow($multiplicate: 1, $inset: false, $switch: false) {
6
+ $preset: "";
7
+ $bg-suffix: "";
8
+
9
+ @if $inset {
10
+ $preset: "inset";
11
+ $bg-suffix: "-inset";
12
+ }
13
+
14
+ @if $switch {
15
+ @return $preset calc(var(--neu-distance) * #{$multiplicate}) calc(var(--neu-distance) * #{$multiplicate})
16
+ calc(var(--neu-blur) * #{$multiplicate}) var(--neu-shadow-high#{$bg-suffix}),
17
+ $preset calc(var(--neu-distance) * -#{$multiplicate}) calc(var(--neu-distance) * -#{$multiplicate})
18
+ calc(var(--neu-blur) * #{$multiplicate}) var(--neu-shadow-low#{$bg-suffix});
19
+ }
20
+
21
+ @return $preset calc(var(--neu-distance) * -#{$multiplicate}) calc(var(--neu-distance) * -#{$multiplicate})
22
+ calc(var(--neu-blur) * #{$multiplicate}) var(--neu-shadow-high#{$bg-suffix}),
23
+ $preset calc(var(--neu-distance) * #{$multiplicate}) calc(var(--neu-distance) * #{$multiplicate})
24
+ calc(var(--neu-blur) * #{$multiplicate}) var(--neu-shadow-low#{$bg-suffix});
25
+ }
26
+
27
+ $neu-steps: (
28
+ 1: 0.25,
29
+ 2: 0.5,
30
+ 3: 1,
31
+ 4: 1.5,
32
+ 5: 3
33
+ );
34
+
35
+ @mixin neu($bg: $theme, $bg-inset: $theme) {
36
+ --neu-bg: #{$bg};
37
+ --neu-bg-inset: #{$bg-inset};
38
+
39
+ --neu-shadow-high: #{lighten($bg, 3%)};
40
+ --neu-shadow-low: #{darken($bg, 4%)};
41
+ --neu-shadow-high-inset: #{lighten($bg-inset, 4%)};
42
+ --neu-shadow-low-inset: #{darken($bg-inset, 4%)};
43
+
44
+ --neu-distance: 0.37rem;
45
+ --neu-blur: 0.7rem;
46
+
47
+ @each $unit, $value in $neu-steps {
48
+ --neu-shadow-#{$unit}: #{neu-shadow($value)};
49
+ --neu-shadow-inset-#{$unit}: #{neu-shadow($value, true)};
50
+
51
+ --neu-shadow-switch-#{$unit}: #{neu-shadow($value, false, true)};
52
+ --neu-shadow-inset-switch-#{$unit}: #{neu-shadow($value, true, true)};
53
+ }
54
+ }
55
+
56
+ @mixin neu-define-utility-classes() {
57
+ @each $unit, $value in $neu-steps {
58
+ .neu-shadow-#{$unit} {
59
+ box-shadow: #{neu-shadow($value, $inset: false, $switch: false)} !important;
60
+
61
+ @each $unit, $value in $neu-steps {
62
+ &.neu-shadow-inset-#{$unit} {
63
+ box-shadow: #{neu-shadow($value, $inset: false, $switch: false)},
64
+ #{neu-shadow($value, $inset: true, $switch: false)} !important;
65
+ }
66
+
67
+ &.neu-shadow-inset-switch-#{$unit} {
68
+ box-shadow: #{neu-shadow($value, $inset: false, $switch: false)},
69
+ #{neu-shadow($value, $inset: true, $switch: true)} !important;
70
+ }
71
+ }
72
+ }
73
+ .neu-shadow-inset-#{$unit} {
74
+ box-shadow: #{neu-shadow($value, $inset: true, $switch: false)} !important;
75
+ }
76
+
77
+ // Uncommented to reduce CSS size.
78
+ // I don't see that `.neu-shadow-switch-#{$unit}` should be used in practice.
79
+ // .neu-shadow-switch-#{$unit} {
80
+ // box-shadow: #{neu-shadow($value, $inset: false, $switch: true)} !important;
81
+ // }
82
+ .neu-shadow-inset-switch-#{$unit} {
83
+ box-shadow: #{neu-shadow($value, $inset: true, $switch: true)} !important;
84
+ }
85
+ }
86
+ }
87
+
88
+ :root {
89
+ @include neu();
90
+ }
91
+
92
+ @include neu-define-utility-classes();
package/dist/style.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @charset "UTF-8";
2
2
  /*!
3
- * Blue Web v1.21.1 (https://bruegmann.github.io/blue-web)
3
+ * Blue Web v1.21.7 (https://bruegmann.github.io/blue-web)
4
4
  * Licensed under GNU General Public License v3.0 (https://github.com/bruegmann/blue-web/blob/master/LICENSE).
5
5
  */
6
6
  :root {
@@ -1,5 +1,5 @@
1
1
  @charset "UTF-8";/*!
2
- * Blue Web v1.21.1 (https://bruegmann.github.io/blue-web)
2
+ * Blue Web v1.21.7 (https://bruegmann.github.io/blue-web)
3
3
  * Licensed under GNU General Public License v3.0 (https://github.com/bruegmann/blue-web/blob/master/LICENSE).
4
4
  */:root{--blue-app-bg:hsl(217,10%,94%);--blue-scrollbar-thumb-color-rgb:255,255,255;--blue-sidebar-width:16.563rem;--blue-sidebar-color:hsl(217,11%,15%);--blue-theme:var(--theme,hsl(217,10%,94%));--blue-shimmering:0.9;--blue-sidebar-bg:hsl(217,10%,94%);--blue-header-bg:hsl(217,10%,94%);--blue-header-height:3.429rem;--blue-header-color:hsl(217,11%,15%);--blue-action-link-bg-color:var(--blue-theme);--blue-menu-item-indicator-bg:hsl(221,97%,53%);--blue-menu-item-height:calc(var(--bs-btn-border-width,1px) + var(--bs-btn-padding-y,0.375rem) + var(--bs-btn-font-size,1rem) * var(--bs-btn-line-height,1.5) + var(--bs-btn-padding-y,0.375rem) + var(--bs-btn-border-width,1px));--blue-corner-shape:round}[data-bs-theme=dark]{--blue-app-bg:hsl(217,10%,8%);--blue-sidebar-color:#fff;--blue-sidebar-bg:hsl(217,10%,8%);--blue-header-bg:hsl(217,10%,8%);--blue-header-color:#fff;--blue-menu-item-indicator-bg:#fff}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes blAppearUp{from{margin-top:2.5rem}to{margin-top:0}}@keyframes blue-menu-item-dropdown{from{transform:translateY(-50%);opacity:0}}@keyframes enabledBlueAppPage{from{transform:scale(0.98);opacity:0}to{opacity:1}}@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}@keyframes alert-in{from{transform:scale(0,0);opacity:0.2;transition:0s}}@keyframes circlebounce{0%,100%{transform:scale(0)}50%{transform:scale(1)}}@keyframes scrolling{from{transform:translateX(-100%)}to{transform:translateX(100%)}}/*!
5
5
  * Bootstrap v5.3.8 (https://getbootstrap.com/)
package/dist/style.scss CHANGED
@@ -1,62 +1,62 @@
1
- /*!
2
- * Blue Web v1.21.1 (https://bruegmann.github.io/blue-web)
3
- * Licensed under GNU General Public License v3.0 (https://github.com/bruegmann/blue-web/blob/master/LICENSE).
4
- */
5
-
6
- @import "./styles/bootstrap-variables";
7
-
8
- @import "node_modules/bootstrap/scss/functions";
9
- @import "node_modules/bootstrap/scss/variables";
10
- @import "node_modules/bootstrap/scss/mixins";
11
- @import "./styles/variables";
12
-
13
- @import "./styles/mixins";
14
- @import "./styles/keyframes";
15
-
16
- @import "./styles/bootstrap";
17
-
18
- // Make it overridable via CSS variables, as it is not yet possible in Bootstrap.
19
- // Check with a newer Bootstrap version to see if it is still necessary.
20
- .form-check-input:checked {
21
- background-color: var(--bs-primary, #{$form-check-input-checked-bg-color});
22
- border-color: var(--bs-primary, #{$form-check-input-checked-border-color});
23
- }
24
-
25
- // Resets cursor from Bootstrap' _reboot.scss based on option.
26
- @if ($enable-button-pointers: false) {
27
- summary,
28
- [role="button"] {
29
- cursor: unset;
30
- }
31
- }
32
-
33
- @import "./styles/text-icons";
34
- @import "./styles/general";
35
- @import "./styles/utils";
36
- @import "./styles/status";
37
- @import "./styles/menu-item";
38
- @import "./styles/page-header";
39
- @import "./styles/input-group";
40
- @import "./styles/action-menu";
41
- @import "./styles/tooltips";
42
- @import "./styles/hover";
43
- @import "./styles/button-icon-wrapper";
44
- @import "./styles/buttons";
45
- @import "./styles/container-grid";
46
- @import "./styles/tabs";
47
- @import "./styles/modal";
48
- @import "./styles/layout";
49
- @import "./styles/collapse";
50
- @import "./styles/actions";
51
- @import "./styles/anchor";
52
- @import "./styles/scrollspy";
53
- @import "./styles/intro";
54
-
55
- @import "./styles/devexpress";
56
- @import "./styles/inter";
57
-
58
- *,
59
- *:before,
60
- *:after {
61
- corner-shape: var(--blue-corner-shape);
62
- }
1
+ /*!
2
+ * Blue Web v1.21.7 (https://bruegmann.github.io/blue-web)
3
+ * Licensed under GNU General Public License v3.0 (https://github.com/bruegmann/blue-web/blob/master/LICENSE).
4
+ */
5
+
6
+ @import "./styles/bootstrap-variables";
7
+
8
+ @import "node_modules/bootstrap/scss/functions";
9
+ @import "node_modules/bootstrap/scss/variables";
10
+ @import "node_modules/bootstrap/scss/mixins";
11
+ @import "./styles/variables";
12
+
13
+ @import "./styles/mixins";
14
+ @import "./styles/keyframes";
15
+
16
+ @import "./styles/bootstrap";
17
+
18
+ // Make it overridable via CSS variables, as it is not yet possible in Bootstrap.
19
+ // Check with a newer Bootstrap version to see if it is still necessary.
20
+ .form-check-input:checked {
21
+ background-color: var(--bs-primary, #{$form-check-input-checked-bg-color});
22
+ border-color: var(--bs-primary, #{$form-check-input-checked-border-color});
23
+ }
24
+
25
+ // Resets cursor from Bootstrap' _reboot.scss based on option.
26
+ @if ($enable-button-pointers: false) {
27
+ summary,
28
+ [role="button"] {
29
+ cursor: unset;
30
+ }
31
+ }
32
+
33
+ @import "./styles/text-icons";
34
+ @import "./styles/general";
35
+ @import "./styles/utils";
36
+ @import "./styles/status";
37
+ @import "./styles/menu-item";
38
+ @import "./styles/page-header";
39
+ @import "./styles/input-group";
40
+ @import "./styles/action-menu";
41
+ @import "./styles/tooltips";
42
+ @import "./styles/hover";
43
+ @import "./styles/button-icon-wrapper";
44
+ @import "./styles/buttons";
45
+ @import "./styles/container-grid";
46
+ @import "./styles/tabs";
47
+ @import "./styles/modal";
48
+ @import "./styles/layout";
49
+ @import "./styles/collapse";
50
+ @import "./styles/actions";
51
+ @import "./styles/anchor";
52
+ @import "./styles/scrollspy";
53
+ @import "./styles/intro";
54
+
55
+ @import "./styles/devexpress";
56
+ @import "./styles/inter";
57
+
58
+ *,
59
+ *:before,
60
+ *:after {
61
+ corner-shape: var(--blue-corner-shape);
62
+ }
@@ -1,57 +1,57 @@
1
- .blue-actions {
2
- --max-width: calc(
3
- var(--bs-btn-border-width, 1px) + var(--bs-btn-padding-x, 0.75rem) + var(--bs-btn-font-size, 1rem) +
4
- var(--bs-btn-padding-x, 0.75rem) + var(--bs-btn-border-width, 1px)
5
- );
6
-
7
- max-height: var(--blue-header-height);
8
- overflow: hidden;
9
-
10
- .blue-actions-menu {
11
- max-width: var(--max-width);
12
- & > .blue-menu-item-wrapper {
13
- display: block;
14
- position: relative;
15
- }
16
- }
17
-
18
- &.open {
19
- left: 0;
20
- right: 0;
21
- top: 0;
22
- background-color: var(--blue-menu-item-dropdown-bg);
23
- }
24
-
25
- &.none {
26
- @include actions(0px);
27
- }
28
-
29
- &.sm {
30
- @include actions(768px);
31
- }
32
-
33
- &.md {
34
- @include actions(992px);
35
- }
36
-
37
- &.lg {
38
- @include actions(1200px);
39
- }
40
-
41
- // Support for MenuItems
42
- .blue-menu-item {
43
- width: auto;
44
-
45
- &.active::after {
46
- @include blue-menu-item-indicator-horizontal();
47
- }
48
- }
49
-
50
- .blue-menu-item-dropdown-toggle .blue-menu-item-label {
51
- margin-right: 0.5rem;
52
- }
53
-
54
- .blue-menu-item-label {
55
- display: initial;
56
- }
57
- }
1
+ .blue-actions {
2
+ --max-width: calc(
3
+ var(--bs-btn-border-width, 1px) + var(--bs-btn-padding-x, 0.75rem) + var(--bs-btn-font-size, 1rem) +
4
+ var(--bs-btn-padding-x, 0.75rem) + var(--bs-btn-border-width, 1px)
5
+ );
6
+
7
+ max-height: var(--blue-header-height);
8
+ overflow: hidden;
9
+
10
+ .blue-actions-menu {
11
+ max-width: var(--max-width);
12
+ & > .blue-menu-item-wrapper {
13
+ display: block;
14
+ position: relative;
15
+ }
16
+ }
17
+
18
+ &.open {
19
+ left: 0;
20
+ right: 0;
21
+ top: 0;
22
+ background-color: var(--blue-menu-item-dropdown-bg);
23
+ }
24
+
25
+ &.none {
26
+ @include actions(0px);
27
+ }
28
+
29
+ &.sm {
30
+ @include actions(768px);
31
+ }
32
+
33
+ &.md {
34
+ @include actions(992px);
35
+ }
36
+
37
+ &.lg {
38
+ @include actions(1200px);
39
+ }
40
+
41
+ // Support for MenuItems
42
+ .blue-menu-item {
43
+ width: auto;
44
+
45
+ &.active::after {
46
+ @include blue-menu-item-indicator-horizontal();
47
+ }
48
+ }
49
+
50
+ .blue-menu-item-dropdown-toggle .blue-menu-item-label {
51
+ margin-right: 0.5rem;
52
+ }
53
+
54
+ .blue-menu-item-label {
55
+ display: initial;
56
+ }
57
+ }
@@ -1,37 +1,37 @@
1
- .BLUE-actions {
2
- display: flex;
3
- white-space: nowrap;
4
- // overflow-x: auto;
5
- // overflow-y: visible;
6
- }
7
-
8
- .BLUE-actions-menu {
9
- display: flex;
10
- max-width: 100%;
11
- }
12
-
13
- .BLUE-actions-collapse {
14
- position: relative;
15
- }
16
-
17
- .BLUE-actions-collapse:not(:has(.BLUE-actions-collapse-visible)) {
18
- display: none;
19
- }
20
-
21
- .BLUE-actions-collapse-menu {
22
- position: absolute;
23
- }
24
-
25
- .BLUE-actions-collapse-menu:popover-open {
26
- display: var(--display);
27
- }
28
-
29
- // Compatibility with MenuItems having dropdowns
30
- .BLUE-actions-menu > .blue-menu-item-wrapper:has(> .blue-menu-item-dropdown) {
31
- display: block;
32
- position: relative;
33
- }
34
-
35
- .BLUE-actions-menu > .blue-menu-item-wrapper > .blue-menu-item-dropdown {
36
- position: absolute;
37
- }
1
+ .BLUE-actions {
2
+ display: flex;
3
+ white-space: nowrap;
4
+ // overflow-x: auto;
5
+ // overflow-y: visible;
6
+ }
7
+
8
+ .BLUE-actions-menu {
9
+ display: flex;
10
+ max-width: 100%;
11
+ }
12
+
13
+ .BLUE-actions-collapse {
14
+ position: relative;
15
+ }
16
+
17
+ .BLUE-actions-collapse:not(:has(.BLUE-actions-collapse-visible)) {
18
+ display: none;
19
+ }
20
+
21
+ .BLUE-actions-collapse-menu {
22
+ position: absolute;
23
+ }
24
+
25
+ .BLUE-actions-collapse-menu:popover-open {
26
+ display: var(--display);
27
+ }
28
+
29
+ // Compatibility with MenuItems having dropdowns
30
+ .BLUE-actions-menu > .blue-menu-item-wrapper:has(> .blue-menu-item-dropdown) {
31
+ display: block;
32
+ position: relative;
33
+ }
34
+
35
+ .BLUE-actions-menu > .blue-menu-item-wrapper > .blue-menu-item-dropdown {
36
+ position: absolute;
37
+ }
@@ -1,42 +1,42 @@
1
- .blue-anchored {
2
- position-try: flip-inline;
3
- position-area: bottom span-right;
4
- position: fixed;
5
-
6
- // Normalize popover
7
- &[popover] {
8
- margin: 0;
9
- padding: 0;
10
- border: 0;
11
- }
12
- }
13
-
14
- .blue-anchored-start {
15
- position-area: bottom span-right;
16
- }
17
-
18
- .blue-anchored-end {
19
- position-area: bottom span-left;
20
- }
21
-
22
- @supports not (anchor-name: --anchor-1) {
23
- .blue-anchored-fallback {
24
- left: 50%;
25
- top: 50%;
26
- translate: -50% -50%;
27
-
28
- &::backdrop {
29
- --bs-backdrop-bg: #000;
30
- --bs-backdrop-opacity: 0.5;
31
- background-color: var(--bs-backdrop-bg);
32
- transition: opacity 0.2s;
33
- opacity: var(--bs-backdrop-opacity);
34
- }
35
- }
36
- }
37
-
38
- .btn:has(+ :popover-open):not(:focus-visible):not(.blue-menu-item) {
39
- --bs-focus-ring-color: rgba(var(--bs-secondary-rgb), 0.25);
40
- box-shadow: var(--bs-focus-ring-x, 0) var(--bs-focus-ring-y, 0) var(--bs-focus-ring-blur, 0)
41
- var(--bs-focus-ring-width) var(--bs-focus-ring-color);
42
- }
1
+ .blue-anchored {
2
+ position-try: flip-inline;
3
+ position-area: bottom span-right;
4
+ position: fixed;
5
+
6
+ // Normalize popover
7
+ &[popover] {
8
+ margin: 0;
9
+ padding: 0;
10
+ border: 0;
11
+ }
12
+ }
13
+
14
+ .blue-anchored-start {
15
+ position-area: bottom span-right;
16
+ }
17
+
18
+ .blue-anchored-end {
19
+ position-area: bottom span-left;
20
+ }
21
+
22
+ @supports not (anchor-name: --anchor-1) {
23
+ .blue-anchored-fallback {
24
+ left: 50%;
25
+ top: 50%;
26
+ translate: -50% -50%;
27
+
28
+ &::backdrop {
29
+ --bs-backdrop-bg: #000;
30
+ --bs-backdrop-opacity: 0.5;
31
+ background-color: var(--bs-backdrop-bg);
32
+ transition: opacity 0.2s;
33
+ opacity: var(--bs-backdrop-opacity);
34
+ }
35
+ }
36
+ }
37
+
38
+ .btn:has(+ :popover-open):not(:focus-visible):not(.blue-menu-item) {
39
+ --bs-focus-ring-color: rgba(var(--bs-secondary-rgb), 0.25);
40
+ box-shadow: var(--bs-focus-ring-x, 0) var(--bs-focus-ring-y, 0) var(--bs-focus-ring-blur, 0)
41
+ var(--bs-focus-ring-width) var(--bs-focus-ring-color);
42
+ }