@skyux/layout 4.7.0 → 4.7.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/CHANGELOG.md +17 -0
- package/bundles/skyux-layout.umd.js +17 -9
- package/bundles/skyux-layout.umd.js.map +1 -1
- package/bundles/skyux-layout.umd.min.js +2 -2
- package/bundles/skyux-layout.umd.min.js.map +1 -1
- package/esm2015/modules/action-button/action-button-header.component.js +1 -1
- package/esm2015/modules/action-button/action-button-icon.component.js +1 -1
- package/esm2015/modules/description-list/description-list.component.js +1 -1
- package/esm2015/modules/fluid-grid/fluid-grid.component.js +5 -1
- package/esm2015/modules/fluid-grid/row.component.js +6 -2
- package/esm2015/modules/toolbar/toolbar-item.component.js +1 -1
- package/esm2015/modules/toolbar/toolbar-section.component.js +1 -1
- package/esm2015/modules/toolbar/toolbar-view-actions.component.js +1 -1
- package/esm2015/modules/toolbar/toolbar.component.js +1 -1
- package/esm2015/plugin-resources/layout-resources-provider.js +2 -2
- package/esm5/modules/action-button/action-button-header.component.js +1 -1
- package/esm5/modules/action-button/action-button-icon.component.js +1 -1
- package/esm5/modules/description-list/description-list.component.js +1 -1
- package/esm5/modules/fluid-grid/fluid-grid.component.js +5 -1
- package/esm5/modules/fluid-grid/row.component.js +6 -2
- package/esm5/modules/toolbar/toolbar-item.component.js +1 -1
- package/esm5/modules/toolbar/toolbar-section.component.js +1 -1
- package/esm5/modules/toolbar/toolbar-view-actions.component.js +1 -1
- package/esm5/modules/toolbar/toolbar.component.js +1 -1
- package/esm5/plugin-resources/layout-resources-provider.js +2 -2
- package/fesm2015/skyux-layout.js +17 -9
- package/fesm2015/skyux-layout.js.map +1 -1
- package/fesm5/skyux-layout.js +17 -9
- package/fesm5/skyux-layout.js.map +1 -1
- package/modules/fluid-grid/fluid-grid.component.d.ts +4 -0
- package/modules/fluid-grid/row.component.d.ts +4 -0
- package/package.json +2 -1
- package/skyux-layout.metadata.json +1 -1
- package/src/assets/locales/resources_en_US.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,23 @@
|
|
|
1
|
+
# 4.7.4 (2022-01-28)
|
|
2
|
+
|
|
3
|
+
- Added punctuation to the empty state text for the definition list and description list components. [#276](https://github.com/blackbaud/skyux-layout/pull/276)
|
|
4
|
+
|
|
5
|
+
# 4.7.3 (2021-08-25)
|
|
6
|
+
|
|
7
|
+
- Fixed the peer dependencies to include `@skyux/router` to support the `skyHref` directive. [#239](https://github.com/blackbaud/skyux-layout/pull/239)
|
|
8
|
+
|
|
9
|
+
# 4.7.2 (2021-08-06)
|
|
10
|
+
|
|
11
|
+
- Fixed the toolbar component to no longer have horizontal padding in modern theme. [#235](https://github.com/blackbaud/skyux-layout/pull/235)
|
|
12
|
+
|
|
13
|
+
# 4.7.1 (2021-06-18)
|
|
14
|
+
|
|
15
|
+
- Fixed the toolbar component to show the proper border color in modern theme. [#223](https://github.com/blackbaud/skyux-layout/pull/223)
|
|
16
|
+
|
|
1
17
|
# 4.7.0 (2021-06-10)
|
|
2
18
|
|
|
3
19
|
- Added `skyHref` support to the action button component. [#221](https://github.com/blackbaud/skyux-layout/pull/221)
|
|
20
|
+
- Fixed the back to top directive to hide the back to top button if the `buttonHidden` option is enabled after the button renders. [#219](https://github.com/blackbaud/skyux-layout/pull/219)
|
|
4
21
|
|
|
5
22
|
# 4.6.2 (2021-04-28)
|
|
6
23
|
|
|
@@ -469,7 +469,7 @@
|
|
|
469
469
|
core.Component({
|
|
470
470
|
selector: 'sky-action-button-header',
|
|
471
471
|
template: "<div\n class=\"sky-action-button-header\"\n [skyThemeClass]=\"{\n 'sky-headline' : 'modern',\n 'sky-section-heading' : 'default'\n }\"\n>\n <ng-content></ng-content>\n</div>\n",
|
|
472
|
-
styles: [":host .sky-action-button-header{margin:0 5px}:host-context(.sky-responsive-container-lg) .sky-action-button-header,:host-context(.sky-responsive-container-md) .sky-action-button-header,:host-context(.sky-responsive-container-sm) .sky-action-button-header,:host-context(.sky-responsive-container-xs) .sky-action-button-header{margin:0 5px}@media (min-width:768px){:host .sky-action-button-header{margin:0 0 20px}}:host-context(.sky-responsive-container-lg) .sky-action-button-header,:host-context(.sky-responsive-container-md) .sky-action-button-header,:host-context(.sky-responsive-container-sm) .sky-action-button-header{margin:0 0 20px}.sky-theme-modern .sky-action-button-header
|
|
472
|
+
styles: [":host .sky-action-button-header{margin:0 5px}:host-context(.sky-responsive-container-lg) .sky-action-button-header,:host-context(.sky-responsive-container-md) .sky-action-button-header,:host-context(.sky-responsive-container-sm) .sky-action-button-header,:host-context(.sky-responsive-container-xs) .sky-action-button-header{margin:0 5px}@media (min-width:768px){:host .sky-action-button-header{margin:0 0 20px}}:host-context(.sky-responsive-container-lg) .sky-action-button-header,:host-context(.sky-responsive-container-md) .sky-action-button-header,:host-context(.sky-responsive-container-sm) .sky-action-button-header{margin:0 0 20px}:host-context(.sky-theme-modern) .sky-action-button-header{margin:0 0 10px}.sky-theme-modern .sky-action-button-header{margin:0 0 10px}"]
|
|
473
473
|
})
|
|
474
474
|
], SkyActionButtonHeaderComponent);
|
|
475
475
|
return SkyActionButtonHeaderComponent;
|
|
@@ -511,7 +511,7 @@
|
|
|
511
511
|
core.Component({
|
|
512
512
|
selector: 'sky-action-button-icon',
|
|
513
513
|
template: "<div\n aria-hidden=\"true\"\n class=\"sky-action-button-icon-container\"\n>\n <sky-icon\n class=\"sky-action-button-icon\"\n [icon]=\"iconType\"\n [size]=\"fontSizeClass\"\n ></sky-icon>\n</div>\n",
|
|
514
|
-
styles: [":host .sky-action-button-icon-container{margin:0 5px}:host-context(.sky-responsive-container-lg) .sky-action-button-icon-container,:host-context(.sky-responsive-container-md) .sky-action-button-icon-container,:host-context(.sky-responsive-container-sm) .sky-action-button-icon-container,:host-context(.sky-responsive-container-xs) .sky-action-button-icon-container{margin:0 5px}@media (min-width:768px){:host .sky-action-button-icon-container{margin:0 0 20px}}:host-context(.sky-responsive-container-lg) .sky-action-button-icon-container,:host-context(.sky-responsive-container-md) .sky-action-button-icon-container,:host-context(.sky-responsive-container-sm) .sky-action-button-icon-container{margin:0 0 20px}.sky-action-button-icon{color:#0974a1}
|
|
514
|
+
styles: [":host .sky-action-button-icon-container{margin:0 5px}:host-context(.sky-responsive-container-lg) .sky-action-button-icon-container,:host-context(.sky-responsive-container-md) .sky-action-button-icon-container,:host-context(.sky-responsive-container-sm) .sky-action-button-icon-container,:host-context(.sky-responsive-container-xs) .sky-action-button-icon-container{margin:0 5px}@media (min-width:768px){:host .sky-action-button-icon-container{margin:0 0 20px}}:host-context(.sky-responsive-container-lg) .sky-action-button-icon-container,:host-context(.sky-responsive-container-md) .sky-action-button-icon-container,:host-context(.sky-responsive-container-sm) .sky-action-button-icon-container{margin:0 0 20px}.sky-action-button-icon{color:#0974a1}:host-context(.sky-theme-modern) .sky-action-button-icon-container{color:#0974a1;background:#e8f8ff;margin:0 20px 0 0;border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}:host-context(.sky-theme-modern) .sky-action-button-icon-container ::ng-deep .sky-icon{font-size:24px!important}.sky-theme-modern .sky-action-button-icon-container{color:#0974a1;background:#e8f8ff;margin:0 20px 0 0;border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.sky-theme-modern .sky-action-button-icon-container ::ng-deep .sky-icon{font-size:24px!important}"]
|
|
515
515
|
})
|
|
516
516
|
], SkyActionButtonIconComponent);
|
|
517
517
|
return SkyActionButtonIconComponent;
|
|
@@ -556,7 +556,7 @@
|
|
|
556
556
|
|
|
557
557
|
var SkyLayoutResourcesProvider = /** @class */ (function () {
|
|
558
558
|
function SkyLayoutResourcesProvider() {
|
|
559
|
-
this.resources = { "EN-US": { "skyux_back_to_top": "Back to top", "skyux_card_checkbox_label": "Select card", "skyux_definition_list_none_found": "None found", "skyux_description_list_none_found": "None found", "skyux_inline_delete_assistive_text": "Are you sure you want to delete this item?", "skyux_inline_delete_cancel": "Cancel", "skyux_inline_delete_confirm_deletion": "Confirm deletion", "skyux_inline_delete_delete": "Delete", "skyux_text_expand_close_text": "Close", "skyux_text_expand_modal_title": "Expanded view", "skyux_text_expand_see_less": "See less", "skyux_text_expand_see_more": "See more" } };
|
|
559
|
+
this.resources = { "EN-US": { "skyux_back_to_top": "Back to top", "skyux_card_checkbox_label": "Select card", "skyux_definition_list_none_found": "None found.", "skyux_description_list_none_found": "None found.", "skyux_inline_delete_assistive_text": "Are you sure you want to delete this item?", "skyux_inline_delete_cancel": "Cancel", "skyux_inline_delete_confirm_deletion": "Confirm deletion", "skyux_inline_delete_delete": "Delete", "skyux_text_expand_close_text": "Close", "skyux_text_expand_modal_title": "Expanded view", "skyux_text_expand_see_less": "See less", "skyux_text_expand_see_more": "See more" } };
|
|
560
560
|
}
|
|
561
561
|
SkyLayoutResourcesProvider.prototype.getString = function (localeInfo, name) {
|
|
562
562
|
return i18n.getStringForLocale(this.resources, localeInfo.locale, name);
|
|
@@ -1749,7 +1749,7 @@
|
|
|
1749
1749
|
template: "<dl\n class=\"sky-description-list\"\n [ngClass]=\"{\n 'sky-description-list-long-description-mode' : mode == 'longDescription',\n 'sky-description-list-vertical-mode' : mode == 'vertical',\n 'sky-description-list-horizontal-mode' : mode == 'horizontal'\n }\"\n #descriptionListElement\n>\n <!--\n Wrapping div is for horizontal flexing. Also injecting children's templateRef directly\n to avoid adding non-semantic HTML tags to DOM\n -->\n <div *ngFor=\"let contentComponent of contentComponents\"\n class=\"sky-description-list-content\"\n [style.width]=\"mode === 'horizontal' ? listItemWidth : ''\"\n >\n <dt *ngFor=\"let termComponent of contentComponent?.termComponents\">\n <ng-container *ngTemplateOutlet=\"termComponent.templateRef\"></ng-container>\n </dt>\n <dd *ngFor=\"let descriptionComponent of contentComponent?.descriptionComponents\">\n <ng-container *ngTemplateOutlet=\"descriptionComponent.templateRef\"></ng-container>\n </dd>\n </div>\n</dl>\n",
|
|
1750
1750
|
providers: [SkyDescriptionListService],
|
|
1751
1751
|
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
1752
|
-
styles: [".sky-description-list{margin:0;padding:0}.sky-description-list dt{color:#686c73;font-size:14px;font-weight:400;margin:0 0 3px;padding:0}.sky-description-list dd{margin:0;padding:0}.sky-description-list.sky-description-list-vertical-mode .sky-description-list-content{margin:0 0 15px;width:auto}.sky-description-list.sky-description-list-horizontal-mode{display:flex;flex-wrap:wrap}.sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 15px;padding:0 60px 0 0;min-width:100px;width:auto}.sky-description-list.sky-description-list-horizontal-mode.sky-responsive-container-sm .sky-description-list-content,.sky-description-list.sky-description-list-horizontal-mode.sky-responsive-container-xs .sky-description-list-content{width:50%}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content{display:flex}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content:not(:last-child){margin:0 0 10px}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content dt{color:#212327;font-size:16px;font-weight:600;margin:0 20px 0 0;width:25%;word-break:break-word}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content dd{flex:1}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content{flex-direction:column}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content dt{margin:0 0 3px;width:100%}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content dd{margin:0 0 10px}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode .sky-description-list-content
|
|
1752
|
+
styles: [".sky-description-list{margin:0;padding:0}.sky-description-list dt{color:#686c73;font-size:14px;font-weight:400;margin:0 0 3px;padding:0}.sky-description-list dd{margin:0;padding:0}.sky-description-list.sky-description-list-vertical-mode .sky-description-list-content{margin:0 0 15px;width:auto}.sky-description-list.sky-description-list-horizontal-mode{display:flex;flex-wrap:wrap}.sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 15px;padding:0 60px 0 0;min-width:100px;width:auto}.sky-description-list.sky-description-list-horizontal-mode.sky-responsive-container-sm .sky-description-list-content,.sky-description-list.sky-description-list-horizontal-mode.sky-responsive-container-xs .sky-description-list-content{width:50%}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content{display:flex}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content:not(:last-child){margin:0 0 10px}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content dt{color:#212327;font-size:16px;font-weight:600;margin:0 20px 0 0;width:25%;word-break:break-word}.sky-description-list.sky-description-list-long-description-mode .sky-description-list-content dd{flex:1}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content{flex-direction:column}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content dt{margin:0 0 3px;width:100%}.sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs .sky-description-list-content dd{margin:0 0 10px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode .sky-description-list-content{margin:0 0 20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode dt{color:#686c73;font-size:14px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-vertical-mode dd{font-size:16px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-horizontal-mode{margin:0 0 -20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 20px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode dt{color:inherit;font-weight:700;font-size:inherit}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode dd{font-size:16px;font-weight:400}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dt{margin:0 0 5px}:host-context(.sky-theme-modern) .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dd{margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode .sky-description-list-content{margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode dt{color:#686c73;font-size:14px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-vertical-mode dd{font-size:16px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-horizontal-mode{margin:0 0 -20px}.sky-theme-modern .sky-description-list.sky-description-list-horizontal-mode .sky-description-list-content{margin:0 0 20px}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode dt{color:inherit;font-weight:700;font-size:inherit}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode dd{font-size:16px;font-weight:400}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dt{margin:0 0 5px}.sky-theme-modern .sky-description-list.sky-description-list-long-description-mode.sky-responsive-container-xs dd{margin:0 0 20px}"]
|
|
1753
1753
|
})
|
|
1754
1754
|
], SkyDescriptionListComponent);
|
|
1755
1755
|
return SkyDescriptionListComponent;
|
|
@@ -1803,6 +1803,10 @@
|
|
|
1803
1803
|
SkyFluidGridGutterSize[SkyFluidGridGutterSize["Large"] = 2] = "Large";
|
|
1804
1804
|
})(exports.SkyFluidGridGutterSize || (exports.SkyFluidGridGutterSize = {}));
|
|
1805
1805
|
|
|
1806
|
+
/**
|
|
1807
|
+
* Displays a row within the `sky-fluid-grid` wrapper. Previously, you could display a row
|
|
1808
|
+
* without a wrapper, but we no longer officially support that option.
|
|
1809
|
+
*/
|
|
1806
1810
|
var SkyRowComponent = /** @class */ (function () {
|
|
1807
1811
|
function SkyRowComponent() {
|
|
1808
1812
|
/**
|
|
@@ -1818,7 +1822,7 @@
|
|
|
1818
1822
|
core.Component({
|
|
1819
1823
|
selector: 'sky-row',
|
|
1820
1824
|
template: "<div class=\"sky-row\" \n [ngClass]=\"{ 'sky-row-reverse': reverseColumnOrder }\">\n <ng-content></ng-content>\n</div>\n",
|
|
1821
|
-
styles: [".sky-row{display:flex;flex-direction:row;flex-wrap:wrap;margin-left:-15px;margin-right:-15px}:host-context(.sky-fluid-grid-gutter-size-small) .sky-row{margin-left:-5px;margin-right:-5px}:host-context(.sky-fluid-grid-gutter-size-small.sky-fluid-grid-no-margin) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-fluid-grid-gutter-size-medium) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-fluid-grid-gutter-size-medium.sky-fluid-grid-no-margin) .sky-row{margin-left:-20px;margin-right:-20px}:host-context(.sky-fluid-grid-gutter-size-large) .sky-row{margin-left:-15px;margin-right:-15px}:host-context(.sky-fluid-grid-gutter-size-large.sky-fluid-grid-no-margin) .sky-row{margin-left:-30px;margin-right:-30px}\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-small) .sky-row {\n margin-left: -10px;\n margin-right: -10px;\n}\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-small.sky-fluid-grid-no-margin) .sky-row {\n margin-left: -20px;\n margin-right: -20px;\n}\n\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-medium) .sky-row {\n margin-left: -15px;\n margin-right: -15px;\n}\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-medium.sky-fluid-grid-no-margin) .sky-row {\n margin-left: -30px;\n margin-right: -30px;\n}\n\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-large) .sky-row {\n margin-left: -30px;\n margin-right: -30px;\n}\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-large.sky-fluid-grid-no-margin) .sky-row {\n margin-left: -60px;\n margin-right: -60px;\n}\n\n:host .sky-row.sky-row-reverse{flex-direction:row}:host-context(.sky-responsive-container-lg) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-md) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-sm) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-xs) .sky-row.sky-row-reverse{flex-direction:row}@media (min-width:768px){:host .sky-row.sky-row-reverse{flex-direction:row-reverse}}:host-context(.sky-responsive-container-lg) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-md) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-sm) .sky-row.sky-row-reverse{flex-direction:row-reverse}.sky-theme-modern .sky-row
|
|
1825
|
+
styles: [".sky-row{display:flex;flex-direction:row;flex-wrap:wrap;margin-left:-15px;margin-right:-15px}:host-context(.sky-fluid-grid-gutter-size-small) .sky-row{margin-left:-5px;margin-right:-5px}:host-context(.sky-fluid-grid-gutter-size-small.sky-fluid-grid-no-margin) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-fluid-grid-gutter-size-medium) .sky-row{margin-left:-10px;margin-right:-10px}:host-context(.sky-fluid-grid-gutter-size-medium.sky-fluid-grid-no-margin) .sky-row{margin-left:-20px;margin-right:-20px}:host-context(.sky-fluid-grid-gutter-size-large) .sky-row{margin-left:-15px;margin-right:-15px}:host-context(.sky-fluid-grid-gutter-size-large.sky-fluid-grid-no-margin) .sky-row{margin-left:-30px;margin-right:-30px}\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-small) .sky-row {\n margin-left: -10px;\n margin-right: -10px;\n}\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-small.sky-fluid-grid-no-margin) .sky-row {\n margin-left: -20px;\n margin-right: -20px;\n}\n\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-medium) .sky-row {\n margin-left: -15px;\n margin-right: -15px;\n}\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-medium.sky-fluid-grid-no-margin) .sky-row {\n margin-left: -30px;\n margin-right: -30px;\n}\n\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-large) .sky-row {\n margin-left: -30px;\n margin-right: -30px;\n}\n\n:host-context(.sky-theme-modern .sky-fluid-grid-gutter-size-large.sky-fluid-grid-no-margin) .sky-row {\n margin-left: -60px;\n margin-right: -60px;\n}\n\n:host .sky-row.sky-row-reverse{flex-direction:row}:host-context(.sky-responsive-container-lg) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-md) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-sm) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-xs) .sky-row.sky-row-reverse{flex-direction:row}@media (min-width:768px){:host .sky-row.sky-row-reverse{flex-direction:row-reverse}}:host-context(.sky-responsive-container-lg) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-md) .sky-row.sky-row-reverse,:host-context(.sky-responsive-container-sm) .sky-row.sky-row-reverse{flex-direction:row-reverse}:host-context(.sky-theme-modern) .sky-row{margin-left:-30px;margin-right:-30px}.sky-theme-modern .sky-row{margin-left:-30px;margin-right:-30px}"]
|
|
1822
1826
|
})
|
|
1823
1827
|
], SkyRowComponent);
|
|
1824
1828
|
return SkyRowComponent;
|
|
@@ -1879,6 +1883,10 @@
|
|
|
1879
1883
|
return SkyColumnComponent;
|
|
1880
1884
|
}());
|
|
1881
1885
|
|
|
1886
|
+
/**
|
|
1887
|
+
* Wraps the fluid grid to ensure proper spacing. Without the wrapper, the
|
|
1888
|
+
* alignment, padding, and margins do not behave as expected.
|
|
1889
|
+
*/
|
|
1882
1890
|
var SkyFluidGridComponent = /** @class */ (function () {
|
|
1883
1891
|
function SkyFluidGridComponent() {
|
|
1884
1892
|
/**
|
|
@@ -2958,7 +2966,7 @@
|
|
|
2958
2966
|
core.Component({
|
|
2959
2967
|
selector: 'sky-toolbar-section',
|
|
2960
2968
|
template: "<div class=\"sky-toolbar-section\">\n <div class=\"sky-toolbar-section-items\">\n <ng-content></ng-content>\n </div>\n <ng-content select=\"sky-toolbar-view-actions\"></ng-content>\n</div>\n",
|
|
2961
|
-
styles: [".sky-toolbar-section{display:flex;flex-wrap:nowrap;padding:5px 10px 0;min-height:49px;align-items:center;position:relative;overflow-x:auto}.sky-toolbar-section-items{display:flex;flex-wrap:wrap;align-items:center}.sky-theme-modern .sky-toolbar-section
|
|
2969
|
+
styles: [".sky-toolbar-section{display:flex;flex-wrap:nowrap;padding:5px 10px 0;min-height:49px;align-items:center;position:relative;overflow-x:auto}.sky-toolbar-section-items{display:flex;flex-wrap:wrap;align-items:center}:host-context(.sky-theme-modern) .sky-toolbar-section{padding:10px 0}.sky-theme-modern .sky-toolbar-section{padding:10px 0}"]
|
|
2962
2970
|
})
|
|
2963
2971
|
], SkyToolbarSectionComponent);
|
|
2964
2972
|
return SkyToolbarSectionComponent;
|
|
@@ -2981,7 +2989,7 @@
|
|
|
2981
2989
|
core.Component({
|
|
2982
2990
|
selector: 'sky-toolbar',
|
|
2983
2991
|
template: "<div\n class=\"sky-toolbar-container\"\n [ngClass]=\"{ 'sky-toolbar-sectioned': hasSections }\"\n>\n <ng-content select=\"sky-toolbar-section\"></ng-content>\n <div class=\"sky-toolbar-items\">\n <ng-content></ng-content>\n </div>\n <ng-content select=\"sky-toolbar-view-actions\"></ng-content>\n</div>\n",
|
|
2984
|
-
styles: [".sky-toolbar-container{min-height:49px;background-color:#fff;padding:5px 10px 0;border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;display:flex;flex-wrap:wrap;align-items:center;position:relative}.sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #cdcfd2}.sky-toolbar-container:not(.sky-toolbar-sectioned){flex-wrap:nowrap}.sky-toolbar-sectioned{display:block;padding:0}.sky-toolbar-items{display:flex;flex-wrap:wrap;align-items:center}\n:host-context(.sky-theme-modern .sky-viewkeeper-fixed) .sky-toolbar-container {\n background-color: #fcfcfc;\n}\n\n:host-context(.sky-theme-modern.sky-theme-mode-dark .sky-viewkeeper-fixed) .sky-toolbar-container {\n background-color: #121212;\n}\n\n
|
|
2992
|
+
styles: [".sky-toolbar-container{min-height:49px;background-color:#fff;padding:5px 10px 0;border-top:1px solid #cdcfd2;border-bottom:1px solid #cdcfd2;display:flex;flex-wrap:wrap;align-items:center;position:relative}.sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #cdcfd2}.sky-toolbar-container:not(.sky-toolbar-sectioned){flex-wrap:nowrap}.sky-toolbar-sectioned{display:block;padding:0}.sky-toolbar-items{display:flex;flex-wrap:wrap;align-items:center}\n:host-context(.sky-theme-modern .sky-viewkeeper-fixed) .sky-toolbar-container {\n background-color: #fcfcfc;\n}\n\n:host-context(.sky-theme-modern.sky-theme-mode-dark .sky-viewkeeper-fixed) .sky-toolbar-container {\n background-color: #121212;\n}\n\n:host-context(.sky-theme-modern) .sky-toolbar-container{background-color:transparent;border:none;padding:10px 0}:host-context(.sky-theme-modern) .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#fcfcfc}:host-context(.sky-theme-modern) .sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #d2d2d2}:host-context(.sky-theme-modern) .sky-toolbar-sectioned{padding:0}.sky-theme-modern .sky-toolbar-container{background-color:transparent;border:none;padding:10px 0}.sky-theme-modern .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#fcfcfc}.sky-theme-modern .sky-toolbar-container ::ng-deep sky-toolbar-section:not(:first-child) .sky-toolbar-section{border-top:1px solid #d2d2d2}.sky-theme-modern .sky-toolbar-sectioned{padding:0}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#121212}.sky-theme-modern.sky-theme-mode-dark .sky-toolbar-container.sky-viewkeeper-fixed{background-color:#121212}"]
|
|
2985
2993
|
})
|
|
2986
2994
|
], SkyToolbarComponent);
|
|
2987
2995
|
return SkyToolbarComponent;
|
|
@@ -2997,7 +3005,7 @@
|
|
|
2997
3005
|
core.Component({
|
|
2998
3006
|
selector: 'sky-toolbar-item',
|
|
2999
3007
|
template: "<div class=\"sky-toolbar-item\">\n <ng-content></ng-content>\n</div>\n",
|
|
3000
|
-
styles: [".sky-toolbar-item{margin-right:5px;margin-bottom:5px}
|
|
3008
|
+
styles: [".sky-toolbar-item{margin-right:5px;margin-bottom:5px}:host-context(.sky-theme-modern) .sky-toolbar-item{margin-top:5px;margin-bottom:5px;margin-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn{padding-left:10px;padding-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default{background-color:transparent;border:none}:host-context(.sky-theme-modern) .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}.sky-theme-modern .sky-toolbar-item{margin-top:5px;margin-bottom:5px;margin-right:10px}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn{padding-left:10px;padding-right:10px}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default{background-color:transparent;border:none}.sky-theme-modern .sky-toolbar-item ::ng-deep .sky-btn.sky-btn-default:not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}"]
|
|
3001
3009
|
})
|
|
3002
3010
|
], SkyToolbarItemComponent);
|
|
3003
3011
|
return SkyToolbarItemComponent;
|
|
@@ -3015,7 +3023,7 @@
|
|
|
3015
3023
|
selector: 'sky-toolbar-view-actions',
|
|
3016
3024
|
template: "<div\n class=\"sky-toolbar-view-actions\"\n>\n <ng-content></ng-content>\n</div>\n",
|
|
3017
3025
|
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
3018
|
-
styles: [":host{margin-left:auto}.sky-toolbar-view-actions{display:flex;align-items:center;margin-bottom:5px}.sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-right:5px}
|
|
3026
|
+
styles: [":host{margin-left:auto}.sky-toolbar-view-actions{display:flex;align-items:center;margin-bottom:5px}.sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-right:5px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions{margin-bottom:0}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-top:5px;margin-bottom:5px;margin-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep .sky-btn{background-color:transparent;border:none;padding-left:10px;padding-right:10px}:host-context(.sky-theme-modern) .sky-toolbar-view-actions ::ng-deep .sky-btn:not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}.sky-theme-modern .sky-toolbar-view-actions{margin-bottom:0}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep>:not(:last-child){margin-top:5px;margin-bottom:5px;margin-right:10px}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep .sky-btn{background-color:transparent;border:none;padding-left:10px;padding-right:10px}.sky-theme-modern .sky-toolbar-view-actions ::ng-deep .sky-btn:not(:hover):not(:active):not(:focus){box-shadow:inset 0 0 0 1px transparent}"]
|
|
3019
3027
|
})
|
|
3020
3028
|
], SkyToolbarViewActionsComponent);
|
|
3021
3029
|
return SkyToolbarViewActionsComponent;
|