egroupware/kdots/assets/styles/framework.css

321 lines
8.6 KiB
CSS
Raw Normal View History

2024-06-27 17:29:14 +02:00
html,
body {
width: 100vw;
height: 100vh;
overflow: clip;
padding: 0px;
margin: 0px;
2024-07-09 19:43:45 +02:00
/** Messages **/
/** end messages **/
}
html .sl-toast-stack,
body .sl-toast-stack {
top: auto;
bottom: 0px;
}
html .sl-toast-stack sl-alert et2-checkbox,
body .sl-toast-stack sl-alert et2-checkbox {
padding-top: var(--sl-spacing-large);
}
html #egw_message,
body #egw_message {
display: none;
2024-06-27 17:29:14 +02:00
}
.egw_menu::part(popup) {
z-index: var(--sl-z-index-dropdown);
}
egw-framework#egw_fw_basecontainer {
--icon-size: 32px;
--sl-tooltip-arrow-size: 0;
/* Internals */
/* Content slotted inside */
}
egw-framework#egw_fw_basecontainer::part(status-split) {
/* This limits the max size of the status panel */
--max: 32px;
}
egw-framework#egw_fw_basecontainer::part(header) {
--icon-size: 32px;
--tab-icon-size: var(--icon-size);
--tab-icon-size-active: 40px;
color: var(--primary-background-color);
2024-06-27 17:29:14 +02:00
gap: var(--sl-spacing-medium);
font-size: var(--icon-size);
}
egw-framework#egw_fw_basecontainer [slot="logo"] img {
max-width: 220px;
max-height: var(--icon-size);
display: block;
text-align: center;
}
egw-framework#egw_fw_basecontainer sl-icon-button[slot="header"],
egw-framework#egw_fw_basecontainer et2-image[slot="header"] {
font-size: var(--icon-size);
color: inherit;
}
egw-framework#egw_fw_basecontainer div#egw_fw_toggler {
position: initial;
display: none;
}
egw-framework#egw_fw_basecontainer #egw_fw_topmenu_info_items {
position: relative;
order: 99;
margin-left: auto;
display: flex;
}
egw-framework#egw_fw_basecontainer #egw_fw_topmenu_info_items .topmenu_info_item {
min-width: 1em;
min-height: 1em;
}
egw-framework#egw_fw_basecontainer div#egw_fw_sidebar_r {
position: initial;
top: initial;
}
egw-framework#egw_fw_basecontainer div#egw_fw_sidebar_r et2-avatar,
egw-framework#egw_fw_basecontainer div#egw_fw_sidebar_r et2-lavatar {
--size: 26px;
}
egw-framework#egw_fw_basecontainer .egw_fw_ui_sidemenu_entry_header {
display: flex;
gap: var(--sl-spacing-medium);
padding-left: 1em;
}
/*** HEADER ***/
#egw_fw_topmenu_info_items {
display: flex;
flex-direction: row-reverse;
}
#egw_fw_topmenu_info_items > * {
border: none;
background: transparent;
}
#egw_fw_topmenu_info_items et2-avatar {
--size: var(--icon-size);
}
#egw_fw_topmenu_info_items et2-avatar::part(base) {
vertical-align: initial;
}
#egw_fw_topmenu_info_items .topmenu_info_item {
height: var(--icon-size);
width: var(--icon-size);
display: inline-block;
padding-left: 0px;
background-size: 20px;
background-position: center center;
background-repeat: no-repeat;
cursor: pointer;
}
#egw_fw_topmenu_info_items .topmenu_info_item:hover {
background-color: var(--sl-input-background-color-hover);
}
#egw_fw_topmenu_info_items #topmenu_info_timer {
order: 1;
position: relative;
display: flex;
align-items: center;
padding: 0px;
}
#egw_fw_topmenu_info_items #topmenu_info_timer #topmenu_timer {
display: block;
width: 100%;
}
#egw_fw_topmenu_info_items #topmenu_info_timer:hover {
cursor: pointer;
}
#egw_fw_topmenu_info_items #topmenu_info_timer:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(../../../timesheet/templates/default/images/navbar.svg);
background-repeat: no-repeat;
background-size: 32px;
background-position: center center;
filter: opacity(0.3);
}
2024-07-05 21:30:49 +02:00
#egw_fw_topmenu_info_items #topmenu_info_quick_add {
position: relative;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add {
display: block;
background-image: url(../../../api/templates/default/images/add.svg);
background-repeat: no-repeat;
background-size: 24px;
background-position: center;
width: 100%;
height: 100%;
padding-right: 3px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:before {
content: " ";
font-size: 2em;
line-height: 0.6em;
background-color: white;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add #quick_add_selectbox {
height: 0px;
display: inline-block;
text-align: initial;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add #quick_add_selectbox sl-option {
white-space: nowrap;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add #quick_add_selectbox::part(emptyLabel) {
/* do NOT show empty label, required for clearing value */
display: none;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add #quick_add_selectbox::part(form-control-input),
#egw_fw_topmenu_info_items #topmenu_info_quick_add #timer_selectbox::part(form-control-input) {
border: none !important;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add #quick_add_selectbox::part(form-control),
#egw_fw_topmenu_info_items #topmenu_info_quick_add #timer_selectbox::part(form-control) {
margin-left: -3em;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add #quick_add_selectbox::part(listbox),
#egw_fw_topmenu_info_items #topmenu_info_quick_add #timer_selectbox::part(menu) {
max-height: 60vh;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add #quick_add_selectbox {
height: 0px;
overflow: hidden;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add #quick_add_selectbox::part(combobox) {
visibility: hidden;
}
2024-06-27 17:29:14 +02:00
#egw_fw_topmenu_info_items #topmenu_info_user_avatar sl-menu-item et2-image {
width: 1em;
}
#egw_fw_topmenu_info_items button#topmenu_info_search {
background-image: url(../../../api/templates/default/images/topmenu_items/search.svg);
}
#topmenu_info_print_title {
background-image: url(../../../api/templates/default/images/print.svg);
}
#topmenu_info_print_title span {
width: 45px;
height: 45px;
display: inline-block;
}
/*** END HEADER ***/
/*** APPLICATION ***/
egw-app::part(name) {
display: flex;
align-items: center;
text-wrap: nowrap;
}
egw-app::part(content) {
flex-direction: column;
overflow-y: hidden;
}
egw-app > div[id] > div {
height: 100%;
}
/* Individual application colors, should go in each app's CSS */
body,
:root {
--addressbook-color: #003366;
--admin-color: #333333;
--bookmarks-color: #CC6633;
--calendar-color: #CC0033;
--filemanager-color: #ff9933;
--infolog-color: #660033;
--mail-color: #006699;
--projectmanager-color: #669999;
--resources-color: #003333;
--timesheet-color: #330066;
--tracker-color: #009966;
--wiki-color: #797979;
--ranking-color: #404040;
--default-color: #797979;
--kanban-color: #4663c8;
}
body egw-app[name="addressbook"],
:root egw-app[name="addressbook"] {
--application-color: var(--addressbook-color);
}
body egw-app[name="admin"],
:root egw-app[name="admin"] {
--application-color: var(--admin-color);
}
body egw-app[name="bookmarks"],
:root egw-app[name="bookmarks"] {
--application-color: var(--bookmarks-color);
}
body egw-app[name="calendar"],
:root egw-app[name="calendar"] {
--application-color: var(--calendar-color);
}
body egw-app[name="filemanager"],
:root egw-app[name="filemanager"] {
--application-color: var(--filemanager-color);
}
body egw-app[name="infolog"],
:root egw-app[name="infolog"] {
--application-color: var(--infolog-color);
}
body egw-app[name="mail"],
:root egw-app[name="mail"] {
--application-color: var(--mail-color);
}
body egw-app[name="projectmanager"],
:root egw-app[name="projectmanager"] {
--application-color: var(--projectmanager-color);
}
body egw-app[name="resources"],
:root egw-app[name="resources"] {
--application-color: var(--resources-color);
}
body egw-app[name="timesheet"],
:root egw-app[name="timesheet"] {
--application-color: var(--timesheet-color);
}
body egw-app[name="tracker"],
:root egw-app[name="tracker"] {
--application-color: var(--tracker-color);
}
body egw-app[name="wiki"],
:root egw-app[name="wiki"] {
--application-color: var(--wiki-color);
}
body egw-app[name="ranking"],
:root egw-app[name="ranking"] {
--application-color: var(--ranking-color);
}
2024-06-27 17:29:14 +02:00
/*** END APPLICATION ***/
/*** WIDGETS ***/
/* This should mostly go away with webcomponents */
/* Get nextmatch sizing more nicely without messing with dynheight */
div.et2_nextmatch {
display: flex;
flex-direction: column;
align-items: stretch;
height: 100%;
width: 100%;
overflow: hidden;
}
div.et2_nextmatch > div:not(:first-child) {
flex: 1 1 100%;
max-height: 100%;
}
div.et2_nextmatch .egwGridView_outer {
height: 100%;
}
div.et2_nextmatch .egwGridView_outer thead tr th.optcol span.selectcols {
height: 9px;
padding: 4px 14px 0 2px;
margin-top: 4px;
background-image: url(../../../api/templates/default/images/selectcols.svg);
background-repeat: no-repeat;
background-size: 10px 10px;
display: inline-block;
background-position: top;
}
.egwGridView_scrollarea {
overflow-x: hidden;
overflow-y: auto;
}
/*** END WIDGETS ***/