[develop | DONE | ADDED ] Customization add custom css

This commit is contained in:
argirok 2024-08-30 13:09:03 +03:00
parent 31e217dc7f
commit ee100b2583
2 changed files with 20 additions and 0 deletions

View File

@ -171,6 +171,20 @@
" draftCustomizationOptions.identity.secondaryColor= $event; updateBackgroundsBasedOnIdentity(); updateButtonsBasedOnIdentity()" " draftCustomizationOptions.identity.secondaryColor= $event; updateBackgroundsBasedOnIdentity(); updateButtonsBasedOnIdentity()"
label="Secondary"></color> label="Secondary"></color>
</div> </div>
<div *ngIf="draftCustomizationOptions.identityIsCustom" class=" uk-margin-large-top uk-margin-medium-bottom">
<div class=" uk-margin-xsmall-bottom uk-text-uppercase uk-text-meta uk-text-bold uk-flex uk-flex-middle">
Custom css
<a *ngIf="hasChanges(publishedCustomizationOptions.identity.customCss, draftCustomizationOptions.identity.customCss) &&
draftCustomizationOptions.identityIsCustom" class="uk-margin-small-left uk-button-link"
uk-tooltip="title:<div class='uk-width-large'>Reset to previously saved options</div>"
(click)="resetCustomCssTo(publishedCustomizationOptions.identity.customCss);">
<icon name="settings_backup_restore" flex="true"></icon>
</a>
</div>
<textarea [ngModel]="this.draftCustomizationOptions.identity.customCss" type="textarea"
[rows]="5" style="resize: vertical; font-size: 12px; width: calc(100% - 7px);" placeholder="Add custom css here."
(ngModelChange)="this.draftCustomizationOptions.identity.customCss =$event"></textarea>
</div>
</div> </div>
</ng-template> </ng-template>
<ng-template #backgroundOptions> <ng-template #backgroundOptions>

View File

@ -69,6 +69,9 @@ declare var UIkit;
.menu_section.uk-overflow-auto:hover { .menu_section.uk-overflow-auto:hover {
overflow-y: scroll; overflow-y: scroll;
} }
:host >>>.input-wrapper > .input-box{
padding:0 !important;
}
`] `]
}) })
@ -302,6 +305,9 @@ sidebarItems = [{name:"Identity", id : "identity", icon: "desktop_windows" },
this.updateBackgroundsBasedOnIdentity(); this.updateBackgroundsBasedOnIdentity();
} }
resetCustomCssTo(cutomCss:string) {
this.draftCustomizationOptions.identity.customCss = cutomCss;
}
updateButtonsBasedOnIdentity(){ updateButtonsBasedOnIdentity(){
let tmp = new CustomizationOptions(this.draftCustomizationOptions.identity.mainColor, this.draftCustomizationOptions.identity.secondaryColor); let tmp = new CustomizationOptions(this.draftCustomizationOptions.identity.mainColor, this.draftCustomizationOptions.identity.secondaryColor);
if(!this.draftCustomizationOptions.buttonsIsCustom) { if(!this.draftCustomizationOptions.buttonsIsCustom) {