extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-10-04 17:21:59 +02:00
Code Issues Packages Projects Releases Wiki Activity

Kdots header

Browse Source 
- Move refresh & print out of app 3-dots menu into header bar
This commit is contained in:
nathan 2024-07-04 16:56:06 -06:00
parent 63722dcd9c
commit ee2be9702a
2 changed files with 58 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
kdots/js/EgwFrameworkApp.styles.ts
View File

@ -26,7 +26,9 @@ export default css`
}
.egw_fw_app__name h2 {
margin: 0;
margin-inline-start: var(--sl-spacing-medium);
font-size: 1em;
}
.egw_fw_app__header {
@ -38,6 +40,33 @@ export default css`
background-color: var(--application-color, --primary-background-color);
color: var(--application-header-text-color, white);
font-size: 1.8em;
}
.egw_fw_app__header sl-icon-button::part(base), .egw_fw_app__header et2-button-icon {
font-size: inherit;
color: var(--application-header-text-color, white);
}
.egw_fw_app__header et2-button-icon {
margin: 0 var(--sl-spacing-medium);
}
.egw_fw_app__header sl-icon-button::part(base):hover, .egw_fw_app__header et2-button-icon::part(base):hover {
color: var(--application-header-text-color, white);
filter: brightness(70%);
}
.egw_fw_app__menu > div {
margin-left: var(--sl-spacing-medium);
margin-right: var(--sl-spacing-medium);
display: flex;
align-items: center;
}
.egw_fw_app__menu > div > sl-icon-button {
margin-left: var(--sl-spacing-medium);
margin-right: var(--sl-spacing-medium);
}
.egw_fw_app__outerSplit {

60
kdots/js/EgwFrameworkApp.ts
View File

@ -577,43 +577,41 @@ export class EgwFrameworkApp extends LitElement
protected _rightHeaderTemplate()
{
return html`
<sl-tooltip content=${this.egw.lang("Application menu")}>
<sl-dropdown>
<sl-icon slot="trigger" name="three-dots-vertical"></sl-icon>
<sl-menu>
<et2-button-icon nosubmit name="arrow-clockwise"
label=${this.egw.lang("Reload %1", this.egw.lang(this.name))}
statustext=${this.egw.lang("Reload %1", this.egw.lang(this.name))}
@click=${(e) =>
{
this.egw.refresh("", this.name);
/* Could also be this.load(false); this.load(this.url) */
}}
></et2-button-icon>
<et2-button-icon nosubmit name="printer"
label=${this.egw.lang("Print")}
statustext=${this.egw.lang("Print")}
@click=${(e) => this.framework.print()}
></et2-button-icon>
<sl-dropdown class="egw_fw_app__menu">
<div slot="trigger">${this.egw.lang("Menu")}
<sl-icon-button name="chevron-double-down"></sl-icon-button>
</div>
<sl-menu>
${this.egw.user('apps')['admin'] !== undefined ? html`
<sl-menu-item
@click=${(e) =>
{
this.egw.refresh("", this.name);
/* Could also be this.load(false); this.load(this.url) */
// @ts-ignore
egw_link_handler(`/egroupware/index.php?menuaction=admin.admin_ui.index&load=admin.uiconfig.index&appname=${this.name}&ajax=true`, 'admin');
}}
>
<sl-icon slot="prefix" name="arrow-clockwise"></sl-icon>
${this.egw.lang("Reload %1", this.egw.lang(this.name))}
<sl-icon slot="prefix" name="gear-wide"></sl-icon>
${this.egw.lang("App configuration")}
</sl-menu-item>
<sl-menu-item
@click=${(e) => this.framework.print()}
>
<sl-icon slot="prefix" name="printer"></sl-icon>
${this.egw.lang("Print")}
</sl-menu-item>
${this.egw.user('apps')['admin'] !== undefined ? html`
<sl-menu-item
@click=${(e) =>
{
// @ts-ignore
egw_link_handler(`/egroupware/index.php?menuaction=admin.admin_ui.index&load=admin.uiconfig.index&appname=${this.name}&ajax=true`, 'admin');
}}
>
<sl-icon slot="prefix" name="gear-wide"></sl-icon>
${this.egw.lang("App configuration")}
</sl-menu-item>
<sl-divider></sl-divider>
` : nothing}
${this._threeDotsMenuTemplate()}
</sl-menu>
</sl-dropdown>
</sl-tooltip>
<sl-divider></sl-divider>
` : nothing}
${this._threeDotsMenuTemplate()}
</sl-menu>
</sl-dropdown>
`;
}