@skyux/theme 11.6.0 → 11.8.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.
- package/css/sky.css +37 -1
- package/css/themes/modern/styles.css +364 -138
- package/documentation.json +102 -102
- package/package.json +2 -2
package/css/sky.css
CHANGED
|
@@ -947,7 +947,7 @@ textarea.ng-invalid.ng-touched {
|
|
|
947
947
|
}
|
|
948
948
|
|
|
949
949
|
.sky-control-help-container:not(:empty) {
|
|
950
|
-
margin-left: var(--sky-override-help-inline-margin-left, var(--sky-space-
|
|
950
|
+
margin-left: var(--sky-override-help-inline-margin-left, var(--sky-space-gap-text_action-xs));
|
|
951
951
|
}
|
|
952
952
|
|
|
953
953
|
fieldset {
|
|
@@ -1022,6 +1022,21 @@ select::-ms-expand {
|
|
|
1022
1022
|
.sky-layout-host-blocks, .sky-layout-host-list, .sky-layout-host-tabs {
|
|
1023
1023
|
display: block;
|
|
1024
1024
|
}
|
|
1025
|
+
.sky-layout-host-blocks:has(> sky-page-content):has(> sky-page-links), .sky-layout-host-list:has(> sky-page-content):has(> sky-page-links), .sky-layout-host-tabs:has(> sky-page-content):has(> sky-page-links) {
|
|
1026
|
+
--sky-layout-host-links-spacing: 10px;
|
|
1027
|
+
display: grid;
|
|
1028
|
+
grid-template: "header" "content" "links";
|
|
1029
|
+
grid-template-columns: 1fr;
|
|
1030
|
+
}
|
|
1031
|
+
.sky-layout-host-blocks:has(> sky-page-content):has(> sky-page-links) > sky-page-header, .sky-layout-host-list:has(> sky-page-content):has(> sky-page-links) > sky-page-header, .sky-layout-host-tabs:has(> sky-page-content):has(> sky-page-links) > sky-page-header {
|
|
1032
|
+
grid-area: header;
|
|
1033
|
+
}
|
|
1034
|
+
.sky-layout-host-blocks:has(> sky-page-content):has(> sky-page-links) > sky-page-content, .sky-layout-host-list:has(> sky-page-content):has(> sky-page-links) > sky-page-content, .sky-layout-host-tabs:has(> sky-page-content):has(> sky-page-links) > sky-page-content {
|
|
1035
|
+
grid-area: content;
|
|
1036
|
+
}
|
|
1037
|
+
.sky-layout-host-blocks:has(> sky-page-content):has(> sky-page-links) > sky-page-links, .sky-layout-host-list:has(> sky-page-content):has(> sky-page-links) > sky-page-links, .sky-layout-host-tabs:has(> sky-page-content):has(> sky-page-links) > sky-page-links {
|
|
1038
|
+
grid-area: links;
|
|
1039
|
+
}
|
|
1025
1040
|
.sky-layout-host-fit, .sky-layout-host-for-child-fit {
|
|
1026
1041
|
position: absolute;
|
|
1027
1042
|
top: var(--sky-viewport-top);
|
|
@@ -1034,6 +1049,7 @@ select::-ms-expand {
|
|
|
1034
1049
|
--sky-layout-host-content-flex-grow: 1;
|
|
1035
1050
|
--sky-layout-host-content-overflow: auto;
|
|
1036
1051
|
--sky-layout-host-content-position: relative;
|
|
1052
|
+
--sky-layout-host-links-display: none;
|
|
1037
1053
|
}
|
|
1038
1054
|
.sky-layout-host-blocks, .sky-layout-host-list, .sky-layout-host-fit, .sky-layout-host-tabs {
|
|
1039
1055
|
--sky-layout-host-header-spacing: 20px 10px;
|
|
@@ -1050,6 +1066,11 @@ select::-ms-expand {
|
|
|
1050
1066
|
}
|
|
1051
1067
|
|
|
1052
1068
|
@media (min-width: 768px) {
|
|
1069
|
+
.sky-layout-host-blocks:has(> sky-page-content):has(> sky-page-links), .sky-layout-host-list:has(> sky-page-content):has(> sky-page-links), .sky-layout-host-tabs:has(> sky-page-content):has(> sky-page-links) {
|
|
1070
|
+
--sky-layout-host-links-spacing: 20px;
|
|
1071
|
+
grid-template: "header header" "content links";
|
|
1072
|
+
grid-template-columns: 3fr 1fr;
|
|
1073
|
+
}
|
|
1053
1074
|
.sky-layout-host-blocks {
|
|
1054
1075
|
--sky-layout-host-header-spacing: 20px 20px 0 20px;
|
|
1055
1076
|
--sky-layout-host-content-spacing: 20px;
|
|
@@ -1063,6 +1084,17 @@ select::-ms-expand {
|
|
|
1063
1084
|
--sky-layout-host-tab-content-spacing: 20px;
|
|
1064
1085
|
}
|
|
1065
1086
|
}
|
|
1087
|
+
.sky-responsive-container-sm .sky-layout-host-blocks:has(> sky-page-content):has(> sky-page-links), .sky-responsive-container-sm .sky-layout-host-list:has(> sky-page-content):has(> sky-page-links), .sky-responsive-container-sm .sky-layout-host-tabs:has(> sky-page-content):has(> sky-page-links),
|
|
1088
|
+
.sky-responsive-container-md .sky-layout-host-blocks:has(> sky-page-content):has(> sky-page-links),
|
|
1089
|
+
.sky-responsive-container-md .sky-layout-host-list:has(> sky-page-content):has(> sky-page-links),
|
|
1090
|
+
.sky-responsive-container-md .sky-layout-host-tabs:has(> sky-page-content):has(> sky-page-links),
|
|
1091
|
+
.sky-responsive-container-lg .sky-layout-host-blocks:has(> sky-page-content):has(> sky-page-links),
|
|
1092
|
+
.sky-responsive-container-lg .sky-layout-host-list:has(> sky-page-content):has(> sky-page-links),
|
|
1093
|
+
.sky-responsive-container-lg .sky-layout-host-tabs:has(> sky-page-content):has(> sky-page-links) {
|
|
1094
|
+
--sky-layout-host-links-spacing: 20px;
|
|
1095
|
+
grid-template: "header header" "content links";
|
|
1096
|
+
grid-template-columns: 3fr 1fr;
|
|
1097
|
+
}
|
|
1066
1098
|
.sky-responsive-container-sm .sky-layout-host-blocks,
|
|
1067
1099
|
.sky-responsive-container-md .sky-layout-host-blocks,
|
|
1068
1100
|
.sky-responsive-container-lg .sky-layout-host-blocks {
|
|
@@ -1088,9 +1120,11 @@ select::-ms-expand {
|
|
|
1088
1120
|
.sky-theme-modern .sky-layout-host-blocks {
|
|
1089
1121
|
--sky-layout-host-header-spacing: 30px 30px 0 30px;
|
|
1090
1122
|
--sky-layout-host-content-spacing: 30px;
|
|
1123
|
+
--sky-layout-host-links-spacing: 30px 30px 30px 0;
|
|
1091
1124
|
}
|
|
1092
1125
|
.sky-theme-modern .sky-layout-host-fit, .sky-theme-modern .sky-layout-host-list, .sky-theme-modern .sky-layout-host-tabs {
|
|
1093
1126
|
--sky-layout-host-header-spacing: 30px 30px 20px 30px;
|
|
1127
|
+
--sky-layout-host-links-spacing: 30px;
|
|
1094
1128
|
}
|
|
1095
1129
|
.sky-theme-modern .sky-layout-host-fit, .sky-theme-modern .sky-layout-host-list {
|
|
1096
1130
|
--sky-layout-host-content-spacing: 0 30px;
|
|
@@ -1104,6 +1138,7 @@ select::-ms-expand {
|
|
|
1104
1138
|
.sky-theme-modern .sky-responsive-container-lg .sky-layout-host-blocks {
|
|
1105
1139
|
--sky-layout-host-header-spacing: 30px 30px 0 30px;
|
|
1106
1140
|
--sky-layout-host-content-spacing: 30px;
|
|
1141
|
+
--sky-layout-host-links-spacing: 30px 30px 30px 0;
|
|
1107
1142
|
}
|
|
1108
1143
|
.sky-theme-modern .sky-responsive-container-sm .sky-layout-host-fit, .sky-theme-modern .sky-responsive-container-sm .sky-layout-host-list, .sky-theme-modern .sky-responsive-container-sm .sky-layout-host-tabs,
|
|
1109
1144
|
.sky-theme-modern .sky-responsive-container-md .sky-layout-host-fit,
|
|
@@ -1113,6 +1148,7 @@ select::-ms-expand {
|
|
|
1113
1148
|
.sky-theme-modern .sky-responsive-container-lg .sky-layout-host-list,
|
|
1114
1149
|
.sky-theme-modern .sky-responsive-container-lg .sky-layout-host-tabs {
|
|
1115
1150
|
--sky-layout-host-header-spacing: 30px 30px 20px 30px;
|
|
1151
|
+
--sky-layout-host-links-spacing: 30px;
|
|
1116
1152
|
}
|
|
1117
1153
|
.sky-theme-modern .sky-responsive-container-sm .sky-layout-host-fit, .sky-theme-modern .sky-responsive-container-sm .sky-layout-host-list,
|
|
1118
1154
|
.sky-theme-modern .sky-responsive-container-md .sky-layout-host-fit,
|