holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make weekend toggle better responsive to content size preference

Browse Source
This commit is contained in:
nathan 2022-11-11 11:32:06 -07:00
parent bd584e468c
commit e0617394fb
4 changed files with 22 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
api/js/etemplate/Et2Switch/Et2Switch.ts
View File

@ -9,7 +9,7 @@
*/ */
import {css, html, PropertyValues, SlotMixin} from "@lion/core"; import {css, html, SlotMixin} from "@lion/core";
import {Et2InputWidget} from "../Et2InputWidget/Et2InputWidget"; import {Et2InputWidget} from "../Et2InputWidget/Et2InputWidget";
import '../Et2Image/Et2Image'; import '../Et2Image/Et2Image';
import {SlSwitch} from "@shoelace-style/shoelace"; import {SlSwitch} from "@shoelace-style/shoelace";
@ -50,6 +50,7 @@ export class Et2Switch extends Et2InputWidget(SlotMixin(SlSwitch))
{ {
width: var(--width); width: var(--width);
display: inline-flex; display: inline-flex;
align-items: center;
height: var(--height); height: var(--height);
} }
`, `,

8
calendar/templates/default/app.css
View File

@ -1482,16 +1482,18 @@ img.calendar_print_button, img.calendar_print_appicon {
et2-switch#calendar-toolbar_toolbar-weekend { et2-switch#calendar-toolbar_toolbar-weekend {
background-image: none !important; background-image: none !important;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend::part(base){width: 100%} #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend::part(base){width: 100%; height: 100%;}
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label span { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label span {
background-size: 20px; background-size: contain;
height: 75%;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label {
width: 100%; width: 100%;
height: 100%;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend {min-width: 60px;} #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend {min-width: 60px;}
et2-switch#calendar-toolbar_toolbar-weekend::part(control) {width: 100%;} et2-switch#calendar-toolbar_toolbar-weekend::part(control) {width: 100%;}
et2-switch#calendar-toolbar_toolbar-weekend::part(label) {width: 100%;} et2-switch#calendar-toolbar_toolbar-weekend::part(label) {width: 100%; height: 100%;}
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch[checked], #calendar-toolbar_toolbar span[data-group="integration"] > et2-switch[checked],
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"][checked] , #toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"][checked] ,

12
calendar/templates/mobile/app.css
View File

@ -92,7 +92,7 @@
position: relative; position: relative;
} }
#calendar-sidebox_cat_id { #calendar-sidebox_cat_id {
margin-bottom: 10px; margin-bottom: 5px;
} }
#calendar-sidebox_cat_id ~ * { #calendar-sidebox_cat_id ~ * {
vertical-align: top; vertical-align: top;
@ -1451,12 +1451,15 @@ et2-switch#calendar-toolbar_toolbar-weekend {
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend::part(base) { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend::part(base) {
width: 100%; width: 100%;
height: 100%;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label span { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label span {
background-size: 20px; background-size: contain;
height: 75%;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label {
width: 100%; width: 100%;
height: 100%;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend {
min-width: 60px; min-width: 60px;
@ -1466,6 +1469,7 @@ et2-switch#calendar-toolbar_toolbar-weekend::part(control) {
} }
et2-switch#calendar-toolbar_toolbar-weekend::part(label) { et2-switch#calendar-toolbar_toolbar-weekend::part(label) {
width: 100%; width: 100%;
height: 100%;
} }
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch[checked], #calendar-toolbar_toolbar span[data-group="integration"] > et2-switch[checked],
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"][checked], #toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"][checked],
@ -1595,6 +1599,10 @@ et2-switch#calendar-toolbar_toolbar-weekend::part(label) {
height: 70%; height: 70%;
margin-bottom: 2em; margin-bottom: 2em;
} }
et2-button#calendar-toolbar_toolbar-today::part(label) {
font-weight: bold;
color: dimgrey;
}
/*generell*/ /*generell*/
.egw_fw_content_browser_iframe img[src$="svg"] { .egw_fw_content_browser_iframe img[src$="svg"] {
background-color: #828282 !important; background-color: #828282 !important;

6
calendar/templates/pixelegg/app.css
View File

@ -1439,12 +1439,15 @@ et2-switch#calendar-toolbar_toolbar-weekend {
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend::part(base) { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend::part(base) {
width: 100%; width: 100%;
height: 100%;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label span { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label span {
background-size: 20px; background-size: contain;
height: 75%;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend .label {
width: 100%; width: 100%;
height: 100%;
} }
#calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend { #calendar-toolbar_toolbar et2-switch#calendar-toolbar_toolbar-weekend {
min-width: 60px; min-width: 60px;
@ -1454,6 +1457,7 @@ et2-switch#calendar-toolbar_toolbar-weekend::part(control) {
} }
et2-switch#calendar-toolbar_toolbar-weekend::part(label) { et2-switch#calendar-toolbar_toolbar-weekend::part(label) {
width: 100%; width: 100%;
height: 100%;
} }
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch[checked], #calendar-toolbar_toolbar span[data-group="integration"] > et2-switch[checked],
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"][checked], #toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"][checked],