extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-10-05 09:42:30 +02:00
Code Issues Packages Projects Releases Wiki Activity

WIP of better UI

Browse Source
This commit is contained in:
Hadi Nategh 2022-08-30 07:50:43 +02:00
parent d521d2aa24
commit e1a87caf6c
11 changed files with 39 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
api/js/etemplate/Et2Button/ButtonMixin.ts
View File

@ -83,7 +83,7 @@ export const ButtonMixin = <T extends Constructor>(superclass : T) => class exte
}
/* Make hover border match other widgets (select) */
.button--standard.button--default:hover:not(.button--disabled) {
background-color: var(--sl-input-background-color-hover);
background-color: var(--sl-color-gray-100);
border-color: var(--sl-input-border-color-hover);
color: var(--sl-input-color-hover);
}

2
api/js/etemplate/Et2Favorites/Et2Favorites.ts
View File

@ -57,7 +57,7 @@ export class Et2Favorites extends Et2DropdownButton implements et2_INextmatchHea
et2-image {
height: 2ex;
padding: 0px;
margin-top: -5px;
margin-top: -13px;
vertical-align: middle;
}
et2-image[src="trash"] {

2
api/js/etemplate/Layout/Et2Tabs/Et2Tab.ts
View File

@ -14,6 +14,8 @@ export class Et2Tab extends Et2Widget(SlTab)
.tab {
font-size: var(--sl-size-x-small);
}
.tab.tab--active:not(.tab--disabled) {color:var(--sl-color-gray-800)}
.tab:hover:not(.tab--disabled) {color:var(--sl-color-gray-800)}
`
];
}

6
api/js/etemplate/Styles/shoelace.ts
View File

@ -39,10 +39,10 @@ export default [sl_css, css`
:root,
:host,
.sl-theme-light {
--sl-font-size-medium: 11px;
--sl-font-size-medium: 12px;
--sl-input-height-small: 18px;
--sl-input-height-medium: 24px;
--sl-input-height-small: 24px;
--sl-input-height-medium: 32px;
--sl-spacing-small: 0.1rem;
--sl-spacing-medium: 0.5rem;

19
api/templates/default/etemplate2.css
View File

@ -2194,7 +2194,6 @@ lion-validation-feedback[type] {
.nextmatch_header .header_count {
padding: 0px 10px;
height: 22px;
border: 1px solid rgb(212, 212, 216); /* --sl-input-border-color */
text-align: center;
border-radius: 3px;
@ -2205,7 +2204,7 @@ lion-validation-feedback[type] {
.nextmatch_header .header_count span {
position: relative;
top: 4px;
top: 8px;
font-size: 11px;
color: gray;
}
@ -2536,7 +2535,6 @@ div.et2_progress {
background-color: white;
width: 30px;
padding: 1px;
margin: 2px;
text-align: left;
}
@ -2810,7 +2808,7 @@ div.et2_toolbar.ui-widget-header {
.et2_toolbar_more summary.ui-toolbar-menulistHeader.list_header-short {
background-image: url(images/dots.svg);
background-size: 16px;
height: 24px;
height: 32px;
width: 20px;
margin-top: 0px;
background-repeat: no-repeat;
@ -2821,7 +2819,7 @@ div.et2_toolbar.ui-widget-header {
.et2_toolbar_more summary.ui-toolbar-menulistHeader.list_header-short {
padding: 0px !important;
width: 40px;
height: 24px;
height: 32px;
margin-top: 0px;
}
@ -2889,7 +2887,7 @@ div.et2_toolbar.ui-widget-header {
.et2_toolbar .et2_toolbar_actionlist et2-button,
.et2_toolbar .et2_toolbar_actionlist et2-switch {
margin-right: 1ex;
min-width: 24px;
min-width: 32px;
}
.et2_toolbar .ui-toolbar-menulist > *:hover{
outline: none;
@ -2935,8 +2933,6 @@ et2-button.transparent-button::part(container) {
.nextmatch_header_row button,
.et2_toolbar div.et2_progress,
.nextmatch_header_row div.et2_progress {
margin: 1px 4px 1px 0;
height: 24px;
border-radius: 3px;
background-color: #fafafa;
border: 1px solid silver;
@ -2944,13 +2940,10 @@ et2-button.transparent-button::part(container) {
.et2_toolbar div.et2_progress, .nextmatch_header_row div.et2_progress {
padding: 0;
height: 22px;
}
.et2_toolbar .et2_progress > div, .nextmatch_header_row .et2_progress > div {
margin: 2px;
border-radius: 3px;
height: 18px;
}
/**
@ -3198,7 +3191,6 @@ div.et2_toolbar_more h.ui-accordion-header {
.et2_toolbar_actionlist {
float: left;
height: 24px;
white-space: nowrap;
display: flex;
}
@ -3741,9 +3733,10 @@ td.avatar {
/*Dialog headers styling*/
.popupMainDiv table.et2_grid > tbody > tr > td,
tr.dialogHeader td, tr.dialogHeader2 td, tr.dialogHeader3 td, tr.dialogHeader4 td,
tr.dialogOperators td, .dialogFooterToolbar {
padding: 5px 0 5px 3px;
padding: 5px 0 5px 0px;
vertical-align: middle;
}
.dialogFooterToolbar td {

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

@ -214,7 +214,7 @@ div.calendar_conflicts {
/* Toolbar */
#calendar-toolbar {
height: 30px;
height: 3.6em;
margin-top: 0.3em;
}
#calendar-toolbar > div {
@ -1566,7 +1566,6 @@ img.calendar_print_button, img.calendar_print_appicon {
#calendar-toolbar_toolbar et2-switch {
height: var(--height);
display: inline-flex;
width: var(--width);
}
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch,
@ -1576,7 +1575,6 @@ img.calendar_print_button, img.calendar_print_appicon {
background-repeat: no-repeat;
background-position: center;
filter: grayscale(1) contrast(0.9999) opacity(0.7);
width: 24px;
}
et2-switch#calendar-toolbar_toolbar-weekend {
background-image: none !important;
@ -1597,7 +1595,7 @@ et2-switch#calendar-toolbar_toolbar-weekend {
visibility: hidden;
}
#calendar-toolbar_toolbar et2-switch {
height: 24px;
height: 32px;
display: inline-block;
vertical-align: top;
border: 1px solid silver;

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

@ -226,7 +226,8 @@ div.calendar_conflicts {
}
/* Toolbar */
#calendar-toolbar {
height: 30px;
height: 3.6em;
margin-top: 0.3em;
}
#calendar-toolbar > div {
display: flex;
@ -1533,7 +1534,6 @@ img.calendar_print_appicon {
#calendar-toolbar_toolbar et2-switch {
height: var(--height);
display: inline-flex;
width: var(--width);
}
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch,
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"],
@ -1542,14 +1542,15 @@ img.calendar_print_appicon {
background-repeat: no-repeat;
background-position: center;
filter: grayscale(1) contrast(0.9999) opacity(0.7);
width: 24px;
}
et2-switch#calendar-toolbar_toolbar-weekend {
background-image: none !important;
}
#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-video_toggle"][checked] {
filter: none;
box-shadow: inset 1px 1px 1px 1px gray !important;
width: var(--width);
}
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch span.label,
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-video_toggle"] span.label,
@ -1561,7 +1562,7 @@ img.calendar_print_appicon {
visibility: hidden;
}
#calendar-toolbar_toolbar et2-switch {
height: 24px;
height: 32px;
display: inline-block;
vertical-align: top;
border: 1px solid silver;
@ -1669,6 +1670,10 @@ img.calendar_print_appicon {
#calendar-list_nm .nextmatch_header .search {
display: none;
}
#calendar-edit_description {
height: 70%;
margin-bottom: 2em;
}
/*generell*/
.egw_fw_content_browser_iframe img[src$="svg"] {
background-color: #828282 !important;
@ -2845,7 +2850,7 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
background-size: 18px 18px;
background-repeat: no-repeat;
background-position: center;
height: 21px;
height: 28px;
top: 0;
filter: invert(1);
}
@ -2853,7 +2858,7 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
background-size: 18px 18px;
background-repeat: no-repeat;
background-position: center;
height: 21px;
height: 28px;
top: 0;
}
#calendar-toolbar_toolbar et2-switch .label span {
@ -3001,3 +3006,4 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
color: #707070;
}
}
/*# sourceMappingURL=app.css.map */

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

@ -214,7 +214,7 @@ div.calendar_conflicts {
}
/* Toolbar */
#calendar-toolbar {
height: 30px;
height: 3.6em;
margin-top: 0.3em;
}
#calendar-toolbar > div {
@ -1522,7 +1522,6 @@ img.calendar_print_appicon {
#calendar-toolbar_toolbar et2-switch {
height: var(--height);
display: inline-flex;
width: var(--width);
}
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch,
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"],
@ -1531,7 +1530,6 @@ img.calendar_print_appicon {
background-repeat: no-repeat;
background-position: center;
filter: grayscale(1) contrast(0.9999) opacity(0.7);
width: 24px;
}
et2-switch#calendar-toolbar_toolbar-weekend {
background-image: none !important;
@ -1552,7 +1550,7 @@ et2-switch#calendar-toolbar_toolbar-weekend {
visibility: hidden;
}
#calendar-toolbar_toolbar et2-switch {
height: 24px;
height: 32px;
display: inline-block;
vertical-align: top;
border: 1px solid silver;
@ -2840,7 +2838,7 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
background-size: 18px 18px;
background-repeat: no-repeat;
background-position: center;
height: 21px;
height: 28px;
top: 0;
filter: invert(1);
}
@ -2848,7 +2846,7 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
background-size: 18px 18px;
background-repeat: no-repeat;
background-position: center;
height: 21px;
height: 28px;
top: 0;
}
#calendar-toolbar_toolbar et2-switch .label span {

4
calendar/templates/pixelegg/app.less
View File

@ -1221,7 +1221,7 @@ div#calendar-container {
background-size: 18px 18px;
background-repeat: no-repeat;
background-position: center;
height: 21px;
height: 28px;
top:0;
filter: invert(1);
}
@ -1229,7 +1229,7 @@ div#calendar-container {
background-size: 18px 18px;
background-repeat: no-repeat;
background-position: center;
height: 21px;
height: 28px;
top:0;
}
span {color:transparent !important;}

4
pixelegg/css/pixelegg.css
View File

@ -3288,7 +3288,7 @@ table.dialog-main-view {
/********** Header Part ********************/
.dialogHeader {
color: #000000;
border-bottom: 3px solid #696969;
border-bottom: 2px solid #696969;
}
.dialogHeader input[type="radio"],
.dialogHeader input.et2_radiobox {
@ -3461,7 +3461,7 @@ div#etemplate\.tab_widget {
/*##############################################*/
.dialogFooterToolbar {
background-color: transparent;
border-top: 3px solid #696969;
border-top: 2px solid #696969;
/*.et2_selectbox {height: 32px; top: 0px; font-size: 1em;}*/
}
.dialogFooterToolbar td {

4
pixelegg/less/layout_dialog.less
View File

@ -152,7 +152,7 @@ table.dialog-main-view {width: 100%;}
/********** Header Part ********************/
.dialogHeader {
.color_100_gray;
border-bottom: 3px solid @gray_60;
border-bottom: 2px solid @gray_60;
// radio button
input[type="radio"],
@ -335,7 +335,7 @@ div#etemplate\.tab_widget {
.dialogFooterToolbar{
background-color: transparent;
border-top: 3px solid #696969;
border-top: 2px solid #696969;
td {
padding: 5px 5px 0px 0px;
}