honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update workbench customizer web part to support full-width

This commit is contained in:
Joel Rodrigues 2020-06-03 23:43:27 +01:00
parent e0fa5f1b25
commit ebdc458c83
7 changed files with 7319 additions and 6100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13382
samples/js-workbench-customizer/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

1
samples/js-workbench-customizer/src/webparts/workbenchCustomizer/WorkbenchCustomizerWebPart.manifest.json
View File

@ -23,6 +23,7 @@
"properties": {
"requiresPageRefresh": false,
"customWorkbenchStyles": true,
"customWorkbenchStylesFullWidth": false,
"previewMode": true
}
}]

9
samples/js-workbench-customizer/src/webparts/workbenchCustomizer/WorkbenchCustomizerWebPart.ts
View File

@ -8,6 +8,7 @@ import * as strings from 'WorkbenchCustomizerWebPartStrings';
export interface IWorkbenchCustomizerWebPartProps {
requiresPageRefresh: boolean;
customWorkbenchStyles: boolean;
customWorkbenchStylesFullWidth: boolean;
previewMode: boolean;
}
@ -26,6 +27,10 @@ export default class WorkbenchCustomizerWebPart extends BaseClientSideWebPart<IW
await import('./styles/customWorkbenchStyles.module.scss');
}
if (this.properties.customWorkbenchStyles && this.properties.customWorkbenchStylesFullWidth) {
await import('./styles/customWorkbenchStylesFullWidth.module.scss');
}
if (this.properties.previewMode) {
const previewBtn = document.getElementsByName("Preview")[0];
previewBtn.click();
@ -68,6 +73,10 @@ export default class WorkbenchCustomizerWebPart extends BaseClientSideWebPart<IW
PropertyPaneToggle('customWorkbenchStyles', {
label: strings.CustomWorkbenchStylesFieldLabel
}),
PropertyPaneToggle('customWorkbenchStylesFullWidth', {
label: strings.customWorkbenchStylesFullWidthFieldLabel,
disabled: !this.properties.customWorkbenchStyles
}),
PropertyPaneToggle('previewMode', {
label: strings.PreviewModeFieldLabel
})

1
samples/js-workbench-customizer/src/webparts/workbenchCustomizer/loc/en-us.js
View File

@ -3,6 +3,7 @@ define([], function() {
"PropertyPaneDescription": "Description",
"BasicGroupName": "Configuration",
"CustomWorkbenchStylesFieldLabel": "Enable custom styles for Workbench",
"customWorkbenchStylesFullWidthFieldLabel": "Enable custom styles for full-width",
"PreviewModeFieldLabel": "Enable Preview mode by default",
}
});

1
samples/js-workbench-customizer/src/webparts/workbenchCustomizer/loc/mystrings.d.ts vendored
View File

@ -2,6 +2,7 @@ declare interface IWorkbenchCustomizerWebPartStrings {
PropertyPaneDescription: string;
BasicGroupName: string;
CustomWorkbenchStylesFieldLabel: string;
customWorkbenchStylesFullWidthFieldLabel: string;
PreviewModeFieldLabel: string;
}

1
samples/js-workbench-customizer/src/webparts/workbenchCustomizer/styles/customWorkbenchStyles.module.scss
View File

@ -1,5 +1,4 @@
:global #workbenchPageContent {
// max-width: 1316px;
max-width: 100%;
left: 0;
right: 0;

24
samples/js-workbench-customizer/src/webparts/workbenchCustomizer/styles/customWorkbenchStylesFullWidth.module.scss Normal file
View File

@ -0,0 +1,24 @@
:global #workbenchPageContent {
& > div {
& > div {
& > div {
.CanvasComponent {
.CanvasZone {
max-width: 100%;
padding-left: 0;
padding-right: 0;
.CanvasSection {
padding-left: 0;
padding-right: 0;
.ControlZone {
padding: 0;
}
}
}
}
}
}
}
}