blue-web 1.17.3 → 1.17.4
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/dist/js/actions.bundle.js +1 -1
- package/dist/js/actions.js +4 -15
- package/dist/merged.scss +59 -18
- package/dist/style.css +46 -18
- package/dist/style.css.map +1 -1
- package/dist/style.min.css +3 -3
- package/dist/style.scss +1 -1
- package/dist/styles/{_actions.css → _actions.scss} +12 -0
- package/dist/styles/_layout.scss +46 -17
- package/package.json +2 -2
package/dist/style.scss
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
.BLUE-actions {
|
|
2
2
|
display: flex;
|
|
3
3
|
white-space: nowrap;
|
|
4
|
+
// overflow-x: auto;
|
|
5
|
+
// overflow-y: visible;
|
|
4
6
|
}
|
|
5
7
|
|
|
6
8
|
.BLUE-actions-menu {
|
|
@@ -23,3 +25,13 @@
|
|
|
23
25
|
.BLUE-actions-collapse-menu:popover-open {
|
|
24
26
|
display: var(--display);
|
|
25
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
|
+
}
|
package/dist/styles/_layout.scss
CHANGED
|
@@ -23,11 +23,34 @@
|
|
|
23
23
|
height: 100dvh;
|
|
24
24
|
position: relative;
|
|
25
25
|
display: grid;
|
|
26
|
-
|
|
26
|
+
|
|
27
27
|
grid-template-rows: var(--toggler-size) auto;
|
|
28
|
+
grid-template-areas: "header" "main";
|
|
29
|
+
|
|
30
|
+
color: var(--blue-sidebar-color);
|
|
31
|
+
background-color: var(--blue-sidebar-bg);
|
|
32
|
+
|
|
33
|
+
&:has(> .blue-layout-toggle) {
|
|
34
|
+
grid-template-columns: 0 0 var(--toggler-size) calc(var(--side-width) - var(--toggler-size)) 1fr;
|
|
35
|
+
grid-template-rows: var(--toggler-size) auto;
|
|
36
|
+
grid-template-areas:
|
|
37
|
+
"state . toggle header header"
|
|
38
|
+
". side main main main";
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
@media (width >= 64rem) {
|
|
43
|
+
.blue-layout {
|
|
44
|
+
&:has(> .blue-layout-state-expand:checked) {
|
|
45
|
+
grid-template-areas:
|
|
46
|
+
"state . toggle header header"
|
|
47
|
+
". side side side main";
|
|
48
|
+
}
|
|
49
|
+
}
|
|
28
50
|
}
|
|
29
51
|
|
|
30
52
|
.blue-layout-state {
|
|
53
|
+
grid-area: state;
|
|
31
54
|
position: absolute;
|
|
32
55
|
--size: 0;
|
|
33
56
|
height: var(--size);
|
|
@@ -37,7 +60,7 @@
|
|
|
37
60
|
}
|
|
38
61
|
|
|
39
62
|
.blue-layout-toggle {
|
|
40
|
-
grid-
|
|
63
|
+
grid-area: toggle;
|
|
41
64
|
color: var(--blue-sidebar-color);
|
|
42
65
|
background-color: var(--blue-sidebar-bg);
|
|
43
66
|
}
|
|
@@ -62,11 +85,17 @@
|
|
|
62
85
|
}
|
|
63
86
|
|
|
64
87
|
.blue-layout-header {
|
|
65
|
-
grid-
|
|
66
|
-
|
|
88
|
+
grid-area: header;
|
|
89
|
+
|
|
90
|
+
display: flex;
|
|
91
|
+
justify-content: space-between;
|
|
92
|
+
position: relative;
|
|
93
|
+
z-index: var(--blue-layout-header-z-index, 4);
|
|
94
|
+
--blue-menu-item-dropdown-bg: var(--blue-sidebar-bg);
|
|
67
95
|
}
|
|
68
96
|
|
|
69
97
|
.blue-layout-side {
|
|
98
|
+
grid-area: side;
|
|
70
99
|
overflow: auto;
|
|
71
100
|
}
|
|
72
101
|
|
|
@@ -88,23 +117,23 @@
|
|
|
88
117
|
}
|
|
89
118
|
}
|
|
90
119
|
|
|
91
|
-
@media (width >= 64rem) {
|
|
92
|
-
.blue-layout-state-expand:checked ~ .blue-layout-side {
|
|
93
|
-
grid-column-start: 2;
|
|
94
|
-
grid-column-end: 4;
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
|
|
98
120
|
.blue-layout-main {
|
|
99
121
|
overflow: auto;
|
|
100
|
-
grid-
|
|
101
|
-
grid-column-
|
|
122
|
+
grid-area: main;
|
|
123
|
+
// grid-column-start: 2;
|
|
102
124
|
}
|
|
103
125
|
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
126
|
+
.blue-layout-body {
|
|
127
|
+
--spacing: 0.25rem;
|
|
128
|
+
width: calc(100% - var(--spacing) * 2);
|
|
129
|
+
height: calc(100% - var(--spacing));
|
|
130
|
+
margin-left: auto;
|
|
131
|
+
margin-right: auto;
|
|
132
|
+
overflow: auto;
|
|
133
|
+
background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity, 1));
|
|
134
|
+
box-shadow: var(--bs-box-shadow-sm);
|
|
135
|
+
border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
|
|
136
|
+
border-radius: var(--bs-border-radius-lg);
|
|
108
137
|
}
|
|
109
138
|
|
|
110
139
|
.blue-layout-overlay {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "blue-web",
|
|
3
|
-
"version": "1.17.
|
|
3
|
+
"version": "1.17.4",
|
|
4
4
|
"description": "UI components built on top of Bootstrap 5",
|
|
5
5
|
"license": "LGPL-3.0-or-later",
|
|
6
6
|
"type": "module",
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
"astro": "^5.13.5",
|
|
50
50
|
"autoprefixer": "^10.3.6",
|
|
51
51
|
"babel-loader": "^8.4.1",
|
|
52
|
-
"blue-react": "
|
|
52
|
+
"blue-react": "file:../blue-react/blue-react-10.1.300003.tgz",
|
|
53
53
|
"colorjs.io": "^0.5.2",
|
|
54
54
|
"gh-pages": "^3.1.0",
|
|
55
55
|
"license-report": "^6.2.0",
|