yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

storybook

Browse Source
This commit is contained in:
Lone Iversen
2022-11-18 11:22:12 +01:00
parent cdc40829f9
commit c35af65973
4 changed files with 41 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/Umbraco.Web.UI.Client/src/backoffice/dashboards/examine-management/dashboard-examine-management.stories.ts
View File

@@ -4,12 +4,27 @@ import { html } from 'lit-html';
import type { UmbDashboardExamineManagementElement } from './dashboard-examine-management.element';
import './dashboard-examine-management.element';
import type { UmbDashboardExamineOverviewElement } from './views/section-view-examine-overview';
import './views/section-view-examine-overview';
import type { UmbDashboardExamineIndexElement } from './views/section-view-examine-indexers';
import './views/section-view-examine-indexers';
import type { UmbDashboardExamineSearcherElement } from './views/section-view-examine-searchers';
import './views/section-view-examine-searchers';
export default {
title: 'Dashboards/Examine Management',
component: 'umb-dashboard-examine-management',
id: 'umb-dashboard-examine-management',
} as Meta;
export const AAAOverview: Story<UmbDashboardExamineManagementElement> = () =>
html` <umb-dashboard-examine-management></umb-dashboard-examine-management>`;
export const AAAOverview: Story<UmbDashboardExamineOverviewElement> = () =>
html` <umb-dashboard-examine-overview></umb-dashboard-examine-overview>`;
AAAOverview.storyName = 'Overview';
export const Index: Story<UmbDashboardExamineIndexElement> = () =>
html` <umb-dashboard-examine-index indexName="InternalIndex"></umb-dashboard-examine-index>`;
export const Searcher: Story<UmbDashboardExamineSearcherElement> = () =>
html` <umb-dashboard-examine-searcher searcherName="InternalSearcher"></umb-dashboard-examine-searcher>`;

11
src/Umbraco.Web.UI.Client/src/backoffice/dashboards/examine-management/views/section-view-examine-searchers.ts
View File

@@ -8,14 +8,7 @@ import { UmbNotificationDefaultData } from '../../../../core/services/notificati
import { UmbContextConsumerMixin } from '@umbraco-cms/context-api';
import {
ApiError,
ProblemDetails,
SearchResult,
SearchResource,
Field,
PagedSearchResult,
} from '@umbraco-cms/backend-api';
import { ApiError, ProblemDetails, SearchResult, SearchResource, Field } from '@umbraco-cms/backend-api';
import '../../../../core/services/modal/layouts/fields-viewer/fields-viewer.element';
import '../../../../core/services/modal/layouts/fields-viewer/fields-settings.element';
@@ -81,7 +74,7 @@ export class UmbDashboardExamineSearcherElement extends UmbContextConsumerMixin(
.table-container uui-scroll-container {
padding-bottom: var(--uui-size-space-4);
max-width: calc(-336px + 100vw);
max-width: 100%;
overflow-x: scroll;
flex: 1;
}

5
src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/fields-viewer/fields-settings.element.ts
View File

@@ -29,13 +29,12 @@ export class UmbModalLayoutFieldsSettingsElement extends UmbModalLayoutElement<U
}
uui-scroll-container {
line-height: 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(40px, auto));
overflow-y: scroll;
max-height: 100%;
min-height: 0;
flex: 1;
}
div {
margin-top: var(--uui-size-space-5);
display: flex;

34
src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/fields-viewer/fields-viewer.element.ts
View File

@@ -22,10 +22,14 @@ export class UmbModalLayoutFieldsViewerElement extends UmbModalLayoutElement<Sea
padding: var(--uui-size-space-5);
box-sizing: border-box;
}
span {
display: block;
padding-right: var(--uui-size-space-5);
}
uui-scroll-container {
line-height: 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(40px, auto));
overflow-y: scroll;
max-height: 100%;
min-height: 0;
@@ -47,18 +51,20 @@ export class UmbModalLayoutFieldsViewerElement extends UmbModalLayoutElement<Sea
return html`
<uui-dialog-layout class="uui-text" headline="${this.data.name}">
<uui-scroll-container id="field-viewer">
<uui-table>
<uui-table-head>
<uui-table-head-cell> Field </uui-table-head-cell>
<uui-table-head-cell> Value </uui-table-head-cell>
</uui-table-head>
${Object.values(this.data.fields).map((cell) => {
return html`<uui-table-row>
<uui-table-cell> ${cell.name} </uui-table-cell>
<uui-table-cell> ${cell.values.join(', ')} </uui-table-cell>
</uui-table-row>`;
})}
</uui-table>
<span>
<uui-table>
<uui-table-head>
<uui-table-head-cell> Field </uui-table-head-cell>
<uui-table-head-cell> Value </uui-table-head-cell>
</uui-table-head>
${Object.values(this.data.fields).map((cell) => {
return html`<uui-table-row>
<uui-table-cell> ${cell.name} </uui-table-cell>
<uui-table-cell> ${cell.values.join(', ')} </uui-table-cell>
</uui-table-row>`;
})}
</uui-table>
</span>
</uui-scroll-container>
<div>
<uui-button look="primary" @click="${this._handleClose}">Close</uui-button>