mirror of
https://github.com/nextcloud/server.git
synced 2026-05-28 04:32:30 -04:00
Compile assets
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>
This commit is contained in:
nextcloud-command
parent
3ad4e82195
commit
bff4c86154
8 changed files with 16 additions and 602 deletions
|
|
@ -36,16 +36,12 @@
|
|||
*/
|
||||
/* prevent ugly selection effect on accidental selection */
|
||||
#header,
|
||||
#navigation,
|
||||
#expanddiv {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
#header a:not(.button):focus-visible, #header button:not(.button-vue):focus-visible, #header div[role=button]:focus-visible,
|
||||
#navigation a:not(.button):focus-visible,
|
||||
#navigation button:not(.button-vue):focus-visible,
|
||||
#navigation div[role=button]:focus-visible,
|
||||
#expanddiv a:not(.button):focus-visible,
|
||||
#expanddiv button:not(.button-vue):focus-visible,
|
||||
#expanddiv div[role=button]:focus-visible {
|
||||
|
|
@ -90,10 +86,8 @@
|
|||
|
||||
#header {
|
||||
/* Header menu */
|
||||
/* show caret indicator next to logo to make clear it is tappable */
|
||||
/* Right header standard */
|
||||
}
|
||||
#header .header-left > nav > .menu,
|
||||
#header .header-right > div > .menu {
|
||||
background-color: var(--color-main-background);
|
||||
filter: drop-shadow(0 1px 5px var(--color-box-shadow));
|
||||
|
|
@ -108,13 +102,11 @@
|
|||
top: 50px;
|
||||
margin: 0;
|
||||
/* Dropdown arrow */
|
||||
/* Use by the apps menu and the settings right menu */
|
||||
/* Use by the settings right menu */
|
||||
}
|
||||
#header .header-left > nav > .menu:not(.popovermenu),
|
||||
#header .header-right > div > .menu:not(.popovermenu) {
|
||||
display: none;
|
||||
}
|
||||
#header .header-left > nav > .menu:after,
|
||||
#header .header-right > div > .menu:after {
|
||||
border: 10px solid transparent;
|
||||
border-bottom-color: var(--color-main-background);
|
||||
|
|
@ -126,17 +118,12 @@
|
|||
pointer-events: none;
|
||||
right: 10px;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul, #header .header-left > nav > .menu > div, #header .header-left > nav > .menu > ul,
|
||||
#header .header-right > div > .menu #apps > ul,
|
||||
#header .header-right > div > .menu > div,
|
||||
#header .header-right > div > .menu > ul {
|
||||
#header .header-right > div > .menu > div, #header .header-right > div > .menu > ul {
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
min-height: 66px;
|
||||
max-height: calc(100vh - 50px * 4);
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a, #header .header-left > nav > .menu.settings-menu > ul li a,
|
||||
#header .header-right > div > .menu #apps > ul li a,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
|
@ -148,28 +135,16 @@
|
|||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a:hover, #header .header-left > nav > .menu #apps > ul li a:focus, #header .header-left > nav > .menu.settings-menu > ul li a:hover, #header .header-left > nav > .menu.settings-menu > ul li a:focus,
|
||||
#header .header-right > div > .menu #apps > ul li a:hover,
|
||||
#header .header-right > div > .menu #apps > ul li a:focus,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:hover,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:focus {
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:hover, #header .header-right > div > .menu.settings-menu > ul li a:focus {
|
||||
background-color: var(--color-background-hover);
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a:active, #header .header-left > nav > .menu #apps > ul li a.active, #header .header-left > nav > .menu.settings-menu > ul li a:active, #header .header-left > nav > .menu.settings-menu > ul li a.active,
|
||||
#header .header-right > div > .menu #apps > ul li a:active,
|
||||
#header .header-right > div > .menu #apps > ul li a.active,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:active,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a.active {
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:active, #header .header-right > div > .menu.settings-menu > ul li a.active {
|
||||
background-color: var(--color-primary-light);
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a:focus-visible, #header .header-left > nav > .menu.settings-menu > ul li a:focus-visible,
|
||||
#header .header-right > div > .menu #apps > ul li a:focus-visible,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:focus-visible {
|
||||
box-shadow: inset 0 0 0 2px var(--color-primary);
|
||||
outline: none;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a span, #header .header-left > nav > .menu.settings-menu > ul li a span,
|
||||
#header .header-right > div > .menu #apps > ul li a span,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a span {
|
||||
display: inline-block;
|
||||
padding-bottom: 0;
|
||||
|
|
@ -179,17 +154,10 @@
|
|||
text-overflow: ellipsis;
|
||||
max-width: 110px;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a .icon-loading-small, #header .header-left > nav > .menu.settings-menu > ul li a .icon-loading-small,
|
||||
#header .header-right > div > .menu #apps > ul li a .icon-loading-small,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a .icon-loading-small {
|
||||
margin-right: 10px;
|
||||
background-size: 16px 16px;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a img,
|
||||
#header .header-left > nav > .menu #apps > ul li a svg, #header .header-left > nav > .menu.settings-menu > ul li a img,
|
||||
#header .header-left > nav > .menu.settings-menu > ul li a svg,
|
||||
#header .header-right > div > .menu #apps > ul li a img,
|
||||
#header .header-right > div > .menu #apps > ul li a svg,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a img,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a svg {
|
||||
opacity: 0.7;
|
||||
|
|
@ -216,15 +184,6 @@
|
|||
padding-right: 10px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
#header .icon-caret {
|
||||
display: inline-block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
margin: 0;
|
||||
margin-top: -21px;
|
||||
padding: 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
#header #header-left, #header .header-left,
|
||||
#header #header-right, #header .header-right {
|
||||
display: inline-flex;
|
||||
|
|
@ -270,19 +229,6 @@
|
|||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.menutoggle .icon-caret {
|
||||
opacity: 0.75;
|
||||
}
|
||||
.menutoggle:hover .header-appname, .menutoggle:hover .icon-caret {
|
||||
opacity: 1;
|
||||
}
|
||||
.menutoggle:focus .header-appname, .menutoggle:focus .icon-caret {
|
||||
opacity: 1;
|
||||
}
|
||||
.menutoggle.active .header-appname, .menutoggle.active .icon-caret {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* TODO: move into minimal css file for public shared template */
|
||||
/* only used for public share pages now as we have the app icons when logged in */
|
||||
.header-appname {
|
||||
|
|
@ -307,60 +253,6 @@
|
|||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
/* do not show menu toggle on public share links as there is no menu */
|
||||
#body-public #header .icon-caret {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* NAVIGATION --------------------------------------------------------------- */
|
||||
nav[role=navigation] {
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-left: -50px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#header .header-left > nav > #navigation {
|
||||
position: relative;
|
||||
left: 25px;
|
||||
/* half the togglemenu */
|
||||
transform: translateX(-50%);
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
#header .header-left > nav > #navigation,
|
||||
.ui-datepicker,
|
||||
.ui-timepicker.ui-widget {
|
||||
background-color: var(--color-main-background);
|
||||
filter: drop-shadow(0 1px 10px var(--color-box-shadow));
|
||||
}
|
||||
#header .header-left > nav > #navigation:after,
|
||||
.ui-datepicker:after,
|
||||
.ui-timepicker.ui-widget:after {
|
||||
/* position of dropdown arrow */
|
||||
left: 50%;
|
||||
bottom: 100%;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
border-bottom-color: var(--color-main-background);
|
||||
border-width: 10px;
|
||||
margin-left: -10px;
|
||||
/* border width */
|
||||
}
|
||||
|
||||
#navigation {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
#navigation .in-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* USER MENU -----------------------------------------------------------------*/
|
||||
#settings {
|
||||
display: inline-block;
|
||||
|
|
@ -432,191 +324,6 @@ nav[role=navigation] {
|
|||
right: 22px;
|
||||
}
|
||||
|
||||
/* Apps menu */
|
||||
#appmenu {
|
||||
display: inline-flex;
|
||||
min-width: 50px;
|
||||
z-index: 2;
|
||||
/* Show all app titles on hovering app menu area */
|
||||
/* Also show app title on focusing single entry (showing all on focus is only possible with CSS4 and parent selectors) */
|
||||
/* show triangle below active app */
|
||||
/* triangle focus feedback */
|
||||
}
|
||||
#appmenu li {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
padding: 0 2px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
/* focused app visual feedback */
|
||||
/* hidden apps menu */
|
||||
/* App title */
|
||||
/* Set up transitions for showing app titles on hover */
|
||||
/* App icon */
|
||||
/* Triangle */
|
||||
}
|
||||
#appmenu li a {
|
||||
position: relative;
|
||||
display: flex;
|
||||
margin: 0;
|
||||
height: 44px;
|
||||
width: 50px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
opacity: 0.85;
|
||||
letter-spacing: -0.5px;
|
||||
font-size: 12px;
|
||||
margin: 2px;
|
||||
}
|
||||
#appmenu li:hover a,
|
||||
#appmenu li a:focus,
|
||||
#appmenu li a.active {
|
||||
opacity: 1;
|
||||
font-weight: bold;
|
||||
}
|
||||
#appmenu li:hover a,
|
||||
#appmenu li a:focus {
|
||||
font-size: 14px;
|
||||
}
|
||||
#appmenu li:hover a + span,
|
||||
#appmenu li a:focus + span, #appmenu li:hover span, #appmenu li:focus span,
|
||||
#appmenu li a:focus span,
|
||||
#appmenu li a.active span {
|
||||
display: inline-block;
|
||||
text-overflow: initial;
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
padding: 0 5px;
|
||||
z-index: 2;
|
||||
}
|
||||
#appmenu li img,
|
||||
#appmenu li .icon-more-white {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
#appmenu li .icon-more-white {
|
||||
background-image: url("../img/actions/more-white.svg?v=1");
|
||||
}
|
||||
#appmenu li span {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
color: var(--color-primary-text);
|
||||
bottom: 2px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
transition: all var(--animation-quick) ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
#appmenu li svg,
|
||||
#appmenu li .icon-more-white {
|
||||
transition: transform var(--animation-quick) ease;
|
||||
filter: var(--primary-invert-if-bright);
|
||||
}
|
||||
#appmenu li a::before {
|
||||
transition: border var(--animation-quick) ease;
|
||||
}
|
||||
#appmenu:hover li {
|
||||
/* Move up app icon */
|
||||
/* Show app title */
|
||||
/* Prominent app title for current and hovered/focused app */
|
||||
/* Smaller triangle because of limited space */
|
||||
}
|
||||
#appmenu:hover li svg,
|
||||
#appmenu:hover li .icon-more,
|
||||
#appmenu:hover li .icon-more-white,
|
||||
#appmenu:hover li .icon-loading-small,
|
||||
#appmenu:hover li .icon-loading-small-dark {
|
||||
transform: translateY(-7px);
|
||||
}
|
||||
#appmenu:hover li span {
|
||||
opacity: 1;
|
||||
bottom: 2px;
|
||||
z-index: -1;
|
||||
/* fix clickability issue - otherwise we need to move the span into the link */
|
||||
}
|
||||
#appmenu:hover li:hover span, #appmenu:hover li:focus span,
|
||||
#appmenu:hover li .active + span {
|
||||
opacity: 1;
|
||||
}
|
||||
#appmenu:hover li a::before {
|
||||
border-width: 5px;
|
||||
}
|
||||
#appmenu li a:focus {
|
||||
/* Move up app icon */
|
||||
/* Show app title */
|
||||
/* Smaller triangle because of limited space */
|
||||
}
|
||||
#appmenu li a:focus svg,
|
||||
#appmenu li a:focus .icon-more,
|
||||
#appmenu li a:focus .icon-more-white,
|
||||
#appmenu li a:focus .icon-loading-small,
|
||||
#appmenu li a:focus .icon-loading-small-dark {
|
||||
transform: translateY(-7px);
|
||||
}
|
||||
#appmenu li a:focus + span,
|
||||
#appmenu li a:focus span {
|
||||
opacity: 1;
|
||||
bottom: 2px;
|
||||
}
|
||||
#appmenu li a:focus::before {
|
||||
border-width: 5px;
|
||||
}
|
||||
#appmenu li a::before {
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border: 0 solid transparent;
|
||||
border-bottom-color: var(--color-main-background);
|
||||
border-width: 10px;
|
||||
transform: translateX(-50%);
|
||||
left: 50%;
|
||||
bottom: -5px;
|
||||
display: none;
|
||||
}
|
||||
#appmenu li a.active::before,
|
||||
#appmenu li:hover a::before,
|
||||
#appmenu li:hover a.active::before,
|
||||
#appmenu li a:focus::before {
|
||||
display: block;
|
||||
}
|
||||
#appmenu li a.active::before {
|
||||
z-index: 99;
|
||||
}
|
||||
#appmenu li:hover a::before,
|
||||
#appmenu li a.active:hover::before,
|
||||
#appmenu li a:focus::before {
|
||||
z-index: 101;
|
||||
}
|
||||
#appmenu li.hidden {
|
||||
display: none;
|
||||
}
|
||||
#appmenu #more-apps {
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.unread-counter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#apps .app-icon-notification,
|
||||
#appmenu .app-icon-notification {
|
||||
fill: var(--color-error);
|
||||
}
|
||||
|
||||
#apps svg:not(.has-unread) .app-icon-notification-mask,
|
||||
#appmenu svg:not(.has-unread) .app-icon-notification-mask {
|
||||
display: none;
|
||||
}
|
||||
#apps svg:not(.has-unread) .app-icon-notification,
|
||||
#appmenu svg:not(.has-unread) .app-icon-notification {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Skip navigation links – show only on keyboard focus */
|
||||
#skip-actions {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["variables.scss","header.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBA;AACA;AAAA;AAAA;EAGC;EACA;EACA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;EACA;;;AAIF;AACA;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA,QDoEe;ECnEf;EACA;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;;AASF;AACC;AAiHA;AA4BA;;AA1IA;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EAhBD;EACA;EAiBC;EACA,KDsBc;ECrBd;AAMA;AAqBA;;AAzBA;AAAA;EACC;;AAID;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGD;AAAA;AAAA;AAAA;EAGC;EACA;EA3CF;EACA;;AAkDG;AAAA;AAAA;EACC;EACA;EACA,QAhDuB;EAiDvB;EACA;EACA;EACA;EACA;EACA;;AACA;AAAA;AAAA;AAAA;AAAA;EAEC;;AAED;AAAA;AAAA;AAAA;AAAA;EAEC;;AAED;AAAA;AAAA;EACC;EACA;;AAED;AAAA;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;AAAA;AAAA;EACC;EACA;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEC;EACA;EACA;EACA;EACA;;AAML;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAGD;EACC;EACA;EACA;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAGD;AAAA;EAEC;EACA;;AAGD;EACC;EACA;EACA;;AAGD;EACC;EACA;;AAKA;AAAA;EAEC;EACA;;AACA;AAAA;EACC;EACA;EACA;EACA,ODnHY;ECoHZ;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC;;AAGD;AAAA;EACC;;;AAOL;AAEA;EACC;;;AAIA;EACC;;AAGA;EACC;;AAID;EACC;;AAID;EACC;;;AAKH;AACA;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AACA;EACC;;;AAGD;AACA;EACC;EACA,ODlMe;ECmMf,QDnMe;ECoMf;EACA;;;AAGD;EACC;EACA;AAAY;EACZ;EACA;;;AAGD;AAAA;AAAA;EAGC;EACA;;AACA;AAAA;AAAA;AACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAAoB;;;AAItB;EACC;;AACA;EACC;;;AAIF;AACA;EACC;EACA;EACA;EACA;AAEA;;AACA;EACC;AAAY;EACZ;AAqBA;AA2BA;;AA9CA;EAGC;;AAEA;AAAA;AAAA;AAAA;EAEC;EACA;EACA;;AAED;EACC;;AAED;EACC;;AAKF;EACC;EACA;EACA;AAMA;;AAJA;EACC;EACA;;AAGD;EACC;;AAIF;EACC;EACA;EACA;AAEA;;AACA;EACC;;AAKF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACC;;;AAIF;AACA;EACC;EACA,WD9Te;EC+Tf;AA6FA;AAiCA;AAwBA;AAgBA;;AApKA;EACC;EACA;EACA;EACA;EACA;AAiBA;AA4BA;AAYA;AAcA;AACA;AAQA;;AA9EA;EACC;EACA;EACA;EACA;EACA,OD7Ua;EC8Ub;EACA;EACA;EAEA;EACA;EACA;;AAID;AAAA;AAAA;EAGC;EACA;;AAID;AAAA;EAEC;;AAGD;AAAA;AAAA;AAAA;EAMC;EACA;EACA;EACA;EACA;EACA;;AAID;AAAA;EAEC;EACA;EACA;;AAGD;EACC;;AAID;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKD;AAAA;EAEC;EAEA;;AAID;EACC;;AAMD;AACC;AASA;AAOA;AAOA;;AAtBA;AAAA;AAAA;AAAA;AAAA;EAKC;;AAID;EACC;EACA;EACA;AAAa;;AAId;AAAA;EAGC;;AAID;EACC;;AAMH;AACC;AASA;AAOA;;AAfA;AAAA;AAAA;AAAA;AAAA;EAKC;;AAID;AAAA;EAEC;EACA;;AAID;EACC;;AAKF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAID;AAAA;AAAA;AAAA;EAIC;;AAED;EACC;;AAED;AAAA;AAAA;EAGC;;AAGD;EACC;;AAGD;EACC;;;AAIF;EACC;;;AAED;AAAA;EAEC;;;AAKA;AAAA;EACC;;AAED;AAAA;EACC;;;AAKF;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC,KD5hBc;;;ACiiBhB;AAGC;AAAA;EACC;EACA;;AAED;AAAA;AAAA;AAAA;EAEC;EACA;EACA","file":"header.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["variables.scss","header.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBA;AACA;AAAA;EAEC;EACA;EACA;;AACA;AAAA;AAAA;AAAA;EACC;EACA;EACA;;;AAIF;AACA;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA,QDqEe;ECpEf;EACA;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;;AASF;AACC;AAgIA;;AA7HA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EAfD;EACA;EAgBC;EACA,KDwBc;ECvBd;AAMA;AAoBA;;AAxBA;EACC;;AAID;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGD;EAEC;EACA;EAzCF;EACA;;AA+CG;EACC;EACA;EACA,QA7CuB;EA8CvB;EACA;EACA;EACA;EACA;EACA;;AACA;EAEC;;AAED;EAEC;;AAED;EACC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAED;AAAA;EAEC;EACA;EACA;EACA;EACA;;AAML;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAGD;EACC;EACA;EACA;;AAGD;AAAA;EAEC;EACA;;AAGD;EACC;EACA;EACA;;AAGD;EACC;EACA;;AAKA;AAAA;EAEC;EACA;;AACA;AAAA;EACC;EACA;EACA;EACA,ODrGY;ECsGZ;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC;;AAGD;AAAA;EACC;;;AAOL;AAEA;EACC;;;AAGD;AACA;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;AAEA;;AACA;EACC;AAAY;EACZ;AAqBA;AA2BA;;AA9CA;EAGC;;AAEA;AAAA;AAAA;AAAA;EAEC;EACA;EACA;;AAED;EACC;;AAED;EACC;;AAKF;EACC;EACA;EACA;AAMA;;AAJA;EACC;EACA;;AAGD;EACC;;AAIF;EACC;EACA;EACA;AAEA;;AACA;EACC;;AAKF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACC;;;AAIF;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC,KDjPc;;;ACsPhB;AAGC;AAAA;EACC;EACA;;AAED;AAAA;AAAA;AAAA;EAEC;EACA;EACA","file":"header.css"}
|
||||
|
|
@ -2292,16 +2292,12 @@ label.infield {
|
|||
*/
|
||||
/* prevent ugly selection effect on accidental selection */
|
||||
#header,
|
||||
#navigation,
|
||||
#expanddiv {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
#header a:not(.button):focus-visible, #header button:not(.button-vue):focus-visible, #header div[role=button]:focus-visible,
|
||||
#navigation a:not(.button):focus-visible,
|
||||
#navigation button:not(.button-vue):focus-visible,
|
||||
#navigation div[role=button]:focus-visible,
|
||||
#expanddiv a:not(.button):focus-visible,
|
||||
#expanddiv button:not(.button-vue):focus-visible,
|
||||
#expanddiv div[role=button]:focus-visible {
|
||||
|
|
@ -2346,10 +2342,8 @@ label.infield {
|
|||
|
||||
#header {
|
||||
/* Header menu */
|
||||
/* show caret indicator next to logo to make clear it is tappable */
|
||||
/* Right header standard */
|
||||
}
|
||||
#header .header-left > nav > .menu,
|
||||
#header .header-right > div > .menu {
|
||||
background-color: var(--color-main-background);
|
||||
filter: drop-shadow(0 1px 5px var(--color-box-shadow));
|
||||
|
|
@ -2364,13 +2358,11 @@ label.infield {
|
|||
top: 50px;
|
||||
margin: 0;
|
||||
/* Dropdown arrow */
|
||||
/* Use by the apps menu and the settings right menu */
|
||||
/* Use by the settings right menu */
|
||||
}
|
||||
#header .header-left > nav > .menu:not(.popovermenu),
|
||||
#header .header-right > div > .menu:not(.popovermenu) {
|
||||
display: none;
|
||||
}
|
||||
#header .header-left > nav > .menu:after,
|
||||
#header .header-right > div > .menu:after {
|
||||
border: 10px solid transparent;
|
||||
border-bottom-color: var(--color-main-background);
|
||||
|
|
@ -2382,17 +2374,12 @@ label.infield {
|
|||
pointer-events: none;
|
||||
right: 10px;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul, #header .header-left > nav > .menu > div, #header .header-left > nav > .menu > ul,
|
||||
#header .header-right > div > .menu #apps > ul,
|
||||
#header .header-right > div > .menu > div,
|
||||
#header .header-right > div > .menu > ul {
|
||||
#header .header-right > div > .menu > div, #header .header-right > div > .menu > ul {
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
min-height: 66px;
|
||||
max-height: calc(100vh - 50px * 4);
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a, #header .header-left > nav > .menu.settings-menu > ul li a,
|
||||
#header .header-right > div > .menu #apps > ul li a,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
|
@ -2404,28 +2391,16 @@ label.infield {
|
|||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a:hover, #header .header-left > nav > .menu #apps > ul li a:focus, #header .header-left > nav > .menu.settings-menu > ul li a:hover, #header .header-left > nav > .menu.settings-menu > ul li a:focus,
|
||||
#header .header-right > div > .menu #apps > ul li a:hover,
|
||||
#header .header-right > div > .menu #apps > ul li a:focus,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:hover,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:focus {
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:hover, #header .header-right > div > .menu.settings-menu > ul li a:focus {
|
||||
background-color: var(--color-background-hover);
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a:active, #header .header-left > nav > .menu #apps > ul li a.active, #header .header-left > nav > .menu.settings-menu > ul li a:active, #header .header-left > nav > .menu.settings-menu > ul li a.active,
|
||||
#header .header-right > div > .menu #apps > ul li a:active,
|
||||
#header .header-right > div > .menu #apps > ul li a.active,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:active,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a.active {
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:active, #header .header-right > div > .menu.settings-menu > ul li a.active {
|
||||
background-color: var(--color-primary-light);
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a:focus-visible, #header .header-left > nav > .menu.settings-menu > ul li a:focus-visible,
|
||||
#header .header-right > div > .menu #apps > ul li a:focus-visible,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a:focus-visible {
|
||||
box-shadow: inset 0 0 0 2px var(--color-primary);
|
||||
outline: none;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a span, #header .header-left > nav > .menu.settings-menu > ul li a span,
|
||||
#header .header-right > div > .menu #apps > ul li a span,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a span {
|
||||
display: inline-block;
|
||||
padding-bottom: 0;
|
||||
|
|
@ -2435,17 +2410,10 @@ label.infield {
|
|||
text-overflow: ellipsis;
|
||||
max-width: 110px;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a .icon-loading-small, #header .header-left > nav > .menu.settings-menu > ul li a .icon-loading-small,
|
||||
#header .header-right > div > .menu #apps > ul li a .icon-loading-small,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a .icon-loading-small {
|
||||
margin-right: 10px;
|
||||
background-size: 16px 16px;
|
||||
}
|
||||
#header .header-left > nav > .menu #apps > ul li a img,
|
||||
#header .header-left > nav > .menu #apps > ul li a svg, #header .header-left > nav > .menu.settings-menu > ul li a img,
|
||||
#header .header-left > nav > .menu.settings-menu > ul li a svg,
|
||||
#header .header-right > div > .menu #apps > ul li a img,
|
||||
#header .header-right > div > .menu #apps > ul li a svg,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a img,
|
||||
#header .header-right > div > .menu.settings-menu > ul li a svg {
|
||||
opacity: 0.7;
|
||||
|
|
@ -2472,15 +2440,6 @@ label.infield {
|
|||
padding-right: 10px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
#header .icon-caret {
|
||||
display: inline-block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
margin: 0;
|
||||
margin-top: -21px;
|
||||
padding: 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
#header #header-left, #header .header-left,
|
||||
#header #header-right, #header .header-right {
|
||||
display: inline-flex;
|
||||
|
|
@ -2526,19 +2485,6 @@ label.infield {
|
|||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.menutoggle .icon-caret {
|
||||
opacity: 0.75;
|
||||
}
|
||||
.menutoggle:hover .header-appname, .menutoggle:hover .icon-caret {
|
||||
opacity: 1;
|
||||
}
|
||||
.menutoggle:focus .header-appname, .menutoggle:focus .icon-caret {
|
||||
opacity: 1;
|
||||
}
|
||||
.menutoggle.active .header-appname, .menutoggle.active .icon-caret {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* TODO: move into minimal css file for public shared template */
|
||||
/* only used for public share pages now as we have the app icons when logged in */
|
||||
.header-appname {
|
||||
|
|
@ -2563,60 +2509,6 @@ label.infield {
|
|||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
/* do not show menu toggle on public share links as there is no menu */
|
||||
#body-public #header .icon-caret {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* NAVIGATION --------------------------------------------------------------- */
|
||||
nav[role=navigation] {
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-left: -50px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#header .header-left > nav > #navigation {
|
||||
position: relative;
|
||||
left: 25px;
|
||||
/* half the togglemenu */
|
||||
transform: translateX(-50%);
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
#header .header-left > nav > #navigation,
|
||||
.ui-datepicker,
|
||||
.ui-timepicker.ui-widget {
|
||||
background-color: var(--color-main-background);
|
||||
filter: drop-shadow(0 1px 10px var(--color-box-shadow));
|
||||
}
|
||||
#header .header-left > nav > #navigation:after,
|
||||
.ui-datepicker:after,
|
||||
.ui-timepicker.ui-widget:after {
|
||||
/* position of dropdown arrow */
|
||||
left: 50%;
|
||||
bottom: 100%;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
border-bottom-color: var(--color-main-background);
|
||||
border-width: 10px;
|
||||
margin-left: -10px;
|
||||
/* border width */
|
||||
}
|
||||
|
||||
#navigation {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
#navigation .in-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* USER MENU -----------------------------------------------------------------*/
|
||||
#settings {
|
||||
display: inline-block;
|
||||
|
|
@ -2688,191 +2580,6 @@ nav[role=navigation] {
|
|||
right: 22px;
|
||||
}
|
||||
|
||||
/* Apps menu */
|
||||
#appmenu {
|
||||
display: inline-flex;
|
||||
min-width: 50px;
|
||||
z-index: 2;
|
||||
/* Show all app titles on hovering app menu area */
|
||||
/* Also show app title on focusing single entry (showing all on focus is only possible with CSS4 and parent selectors) */
|
||||
/* show triangle below active app */
|
||||
/* triangle focus feedback */
|
||||
}
|
||||
#appmenu li {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
padding: 0 2px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
/* focused app visual feedback */
|
||||
/* hidden apps menu */
|
||||
/* App title */
|
||||
/* Set up transitions for showing app titles on hover */
|
||||
/* App icon */
|
||||
/* Triangle */
|
||||
}
|
||||
#appmenu li a {
|
||||
position: relative;
|
||||
display: flex;
|
||||
margin: 0;
|
||||
height: 44px;
|
||||
width: 50px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
opacity: 0.85;
|
||||
letter-spacing: -0.5px;
|
||||
font-size: 12px;
|
||||
margin: 2px;
|
||||
}
|
||||
#appmenu li:hover a,
|
||||
#appmenu li a:focus,
|
||||
#appmenu li a.active {
|
||||
opacity: 1;
|
||||
font-weight: bold;
|
||||
}
|
||||
#appmenu li:hover a,
|
||||
#appmenu li a:focus {
|
||||
font-size: 14px;
|
||||
}
|
||||
#appmenu li:hover a + span,
|
||||
#appmenu li a:focus + span, #appmenu li:hover span, #appmenu li:focus span,
|
||||
#appmenu li a:focus span,
|
||||
#appmenu li a.active span {
|
||||
display: inline-block;
|
||||
text-overflow: initial;
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
padding: 0 5px;
|
||||
z-index: 2;
|
||||
}
|
||||
#appmenu li img,
|
||||
#appmenu li .icon-more-white {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
#appmenu li .icon-more-white {
|
||||
background-image: url("../img/actions/more-white.svg?v=1");
|
||||
}
|
||||
#appmenu li span {
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
color: var(--color-primary-text);
|
||||
bottom: 2px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
transition: all var(--animation-quick) ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
#appmenu li svg,
|
||||
#appmenu li .icon-more-white {
|
||||
transition: transform var(--animation-quick) ease;
|
||||
filter: var(--primary-invert-if-bright);
|
||||
}
|
||||
#appmenu li a::before {
|
||||
transition: border var(--animation-quick) ease;
|
||||
}
|
||||
#appmenu:hover li {
|
||||
/* Move up app icon */
|
||||
/* Show app title */
|
||||
/* Prominent app title for current and hovered/focused app */
|
||||
/* Smaller triangle because of limited space */
|
||||
}
|
||||
#appmenu:hover li svg,
|
||||
#appmenu:hover li .icon-more,
|
||||
#appmenu:hover li .icon-more-white,
|
||||
#appmenu:hover li .icon-loading-small,
|
||||
#appmenu:hover li .icon-loading-small-dark {
|
||||
transform: translateY(-7px);
|
||||
}
|
||||
#appmenu:hover li span {
|
||||
opacity: 1;
|
||||
bottom: 2px;
|
||||
z-index: -1;
|
||||
/* fix clickability issue - otherwise we need to move the span into the link */
|
||||
}
|
||||
#appmenu:hover li:hover span, #appmenu:hover li:focus span,
|
||||
#appmenu:hover li .active + span {
|
||||
opacity: 1;
|
||||
}
|
||||
#appmenu:hover li a::before {
|
||||
border-width: 5px;
|
||||
}
|
||||
#appmenu li a:focus {
|
||||
/* Move up app icon */
|
||||
/* Show app title */
|
||||
/* Smaller triangle because of limited space */
|
||||
}
|
||||
#appmenu li a:focus svg,
|
||||
#appmenu li a:focus .icon-more,
|
||||
#appmenu li a:focus .icon-more-white,
|
||||
#appmenu li a:focus .icon-loading-small,
|
||||
#appmenu li a:focus .icon-loading-small-dark {
|
||||
transform: translateY(-7px);
|
||||
}
|
||||
#appmenu li a:focus + span,
|
||||
#appmenu li a:focus span {
|
||||
opacity: 1;
|
||||
bottom: 2px;
|
||||
}
|
||||
#appmenu li a:focus::before {
|
||||
border-width: 5px;
|
||||
}
|
||||
#appmenu li a::before {
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border: 0 solid transparent;
|
||||
border-bottom-color: var(--color-main-background);
|
||||
border-width: 10px;
|
||||
transform: translateX(-50%);
|
||||
left: 50%;
|
||||
bottom: -5px;
|
||||
display: none;
|
||||
}
|
||||
#appmenu li a.active::before,
|
||||
#appmenu li:hover a::before,
|
||||
#appmenu li:hover a.active::before,
|
||||
#appmenu li a:focus::before {
|
||||
display: block;
|
||||
}
|
||||
#appmenu li a.active::before {
|
||||
z-index: 99;
|
||||
}
|
||||
#appmenu li:hover a::before,
|
||||
#appmenu li a.active:hover::before,
|
||||
#appmenu li a:focus::before {
|
||||
z-index: 101;
|
||||
}
|
||||
#appmenu li.hidden {
|
||||
display: none;
|
||||
}
|
||||
#appmenu #more-apps {
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.unread-counter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#apps .app-icon-notification,
|
||||
#appmenu .app-icon-notification {
|
||||
fill: var(--color-error);
|
||||
}
|
||||
|
||||
#apps svg:not(.has-unread) .app-icon-notification-mask,
|
||||
#appmenu svg:not(.has-unread) .app-icon-notification-mask {
|
||||
display: none;
|
||||
}
|
||||
#apps svg:not(.has-unread) .app-icon-notification,
|
||||
#appmenu svg:not(.has-unread) .app-icon-notification {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Skip navigation links – show only on keyboard focus */
|
||||
#skip-actions {
|
||||
position: absolute;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
4
dist/core-common.js
vendored
4
dist/core-common.js
vendored
File diff suppressed because one or more lines are too long
2
dist/core-common.js.map
vendored
2
dist/core-common.js.map
vendored
File diff suppressed because one or more lines are too long
4
dist/core-main.js
vendored
4
dist/core-main.js
vendored
File diff suppressed because one or more lines are too long
2
dist/core-main.js.map
vendored
2
dist/core-main.js.map
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in a new issue