- Add visible-focus effect on each header entry - Show focus outline when using focus-visible (keyboard navigation) - Add polyfy for focus-visible since it's only very recently available on webkit - Change text for link to home button to describe the destination and not the current page - Improve focus effect in app sidebar navigation Signed-off-by: Carl Schwan <carl@carlschwan.eu>tags/v25.0.0beta1
@@ -517,9 +517,9 @@ export default { | |||
& > .panel--content { | |||
margin: 0 16px 16px 16px; | |||
height: 420px; | |||
height: 424px; | |||
// We specifically do not want scrollbars inside widgets | |||
overflow: hidden; | |||
overflow: visible; | |||
} | |||
// No need to extend height of widgets if only one column is shown | |||
@@ -566,7 +566,7 @@ export default { | |||
background-color: var(--color-background-hover)!important; | |||
} | |||
&:focus-visible { | |||
border: 2px solid var(--color-main-text)!important; | |||
box-shadow: 0 0 0 2px var(--color-main-text) !important; | |||
} | |||
} | |||
@@ -316,6 +316,9 @@ table th .columntitle { | |||
-moz-box-sizing: border-box; | |||
vertical-align: middle; | |||
} | |||
table th .columntitle:focus-visible { | |||
border-radius: 2px; | |||
} | |||
table.multiselect th .columntitle { | |||
display: inline-block; | |||
@@ -606,6 +609,9 @@ table td.selection { | |||
.select-all:focus + label { | |||
background-color: var(--color-background-hover); | |||
border-radius: var(--border-radius-pill); | |||
outline: none !important; | |||
border: 2px solid var(--color-primary) !important; | |||
padding: 14px; | |||
} | |||
#fileList tr td.selection > .selectCheckBox:focus-visible + label, | |||
@@ -944,6 +950,10 @@ table.dragshadow td.size { | |||
position: relative; | |||
} | |||
.breadcrumb .icon-home { | |||
border-radius: var(--border-radius); | |||
} | |||
.breadcrumb .canDrop > a, | |||
#filestable tbody tr.canDrop { | |||
background-color: rgba(0, 130, 201, 0.3); | |||
@@ -981,9 +991,6 @@ table.dragshadow td.size { | |||
background-color: transparent; | |||
z-index: 1; | |||
} | |||
#quota > a[href="#"] { | |||
box-shadow: none !important; | |||
} | |||
#quota > a[href="#"], #quota > a[href="#"] * { | |||
cursor: default !important; | |||
} | |||
@@ -1240,6 +1247,9 @@ table.dragshadow td.size { | |||
#view-toggle:hover, #view-toggle:focus, #showgridview:focus + #view-toggle { | |||
opacity: 1; | |||
} | |||
#view-toggle:focus-visible, #showgridview:focus-visible + #view-toggle { | |||
box-shadow: inset 0 0 0 2px var(--color-primary) !important; | |||
} | |||
/** | |||
* Make sure the hidden input is always |
@@ -232,6 +232,9 @@ table th .columntitle { | |||
box-sizing: border-box; | |||
-moz-box-sizing: border-box; | |||
vertical-align: middle; | |||
&:focus-visible { | |||
border-radius: 2px; | |||
} | |||
} | |||
table.multiselect th .columntitle { | |||
display: inline-block; | |||
@@ -507,6 +510,9 @@ table td.selection { | |||
&:focus + label { | |||
background-color: var(--color-background-hover); | |||
border-radius: var(--border-radius-pill); | |||
outline: none !important; | |||
border: 2px solid var(--color-primary) !important; | |||
padding: 14px; | |||
} | |||
} | |||
@@ -845,6 +851,10 @@ table.dragshadow td.size { | |||
position: relative; | |||
} | |||
.breadcrumb .icon-home { | |||
border-radius: var(--border-radius); | |||
} | |||
.breadcrumb .canDrop > a, | |||
#filestable tbody tr.canDrop { | |||
background-color: rgba( variables.$color-primary, .3 ); | |||
@@ -885,7 +895,6 @@ table.dragshadow td.size { | |||
> a[href='#'] { | |||
// if no link is set, no mouse feedback | |||
box-shadow: none !important; | |||
&, * { | |||
cursor: default !important; | |||
} | |||
@@ -1196,6 +1205,11 @@ table.dragshadow td.size { | |||
#showgridview:focus + & { | |||
opacity: 1; | |||
} | |||
&:focus-visible, | |||
#showgridview:focus-visible + & { | |||
box-shadow: inset 0 0 0 2px var(--color-primary) !important; | |||
} | |||
} | |||
/** |
@@ -316,6 +316,9 @@ table th .columntitle { | |||
-moz-box-sizing: border-box; | |||
vertical-align: middle; | |||
} | |||
table th .columntitle:focus-visible { | |||
border-radius: 2px; | |||
} | |||
table.multiselect th .columntitle { | |||
display: inline-block; | |||
@@ -606,6 +609,9 @@ table td.selection { | |||
.select-all:focus + label { | |||
background-color: var(--color-background-hover); | |||
border-radius: var(--border-radius-pill); | |||
outline: none !important; | |||
border: 2px solid var(--color-primary) !important; | |||
padding: 14px; | |||
} | |||
#fileList tr td.selection > .selectCheckBox:focus-visible + label, | |||
@@ -944,6 +950,10 @@ table.dragshadow td.size { | |||
position: relative; | |||
} | |||
.breadcrumb .icon-home { | |||
border-radius: var(--border-radius); | |||
} | |||
.breadcrumb .canDrop > a, | |||
#filestable tbody tr.canDrop { | |||
background-color: rgba(0, 130, 201, 0.3); | |||
@@ -981,9 +991,6 @@ table.dragshadow td.size { | |||
background-color: transparent; | |||
z-index: 1; | |||
} | |||
#quota > a[href="#"] { | |||
box-shadow: none !important; | |||
} | |||
#quota > a[href="#"], #quota > a[href="#"] * { | |||
cursor: default !important; | |||
} | |||
@@ -1240,6 +1247,9 @@ table.dragshadow td.size { | |||
#view-toggle:hover, #view-toggle:focus, #showgridview:focus + #view-toggle { | |||
opacity: 1; | |||
} | |||
#view-toggle:focus-visible, #showgridview:focus-visible + #view-toggle { | |||
box-shadow: inset 0 0 0 2px var(--color-primary) !important; | |||
} | |||
/** | |||
* Make sure the hidden input is always |
@@ -1686,7 +1686,9 @@ | |||
td.append( | |||
'<input id="select-' + this.id + '-' + fileData.id + | |||
'" type="checkbox" class="selectCheckBox checkbox"/><label for="select-' + this.id + '-' + fileData.id + '">' + | |||
'<span class="hidden-visually">' + t('files', 'Select') + '</span>' + | |||
'<span class="hidden-visually">' + (fileData.type === 'dir' ? | |||
t('files', 'Select directory "{dirName}"', {dirName: name}) : | |||
t('files', 'Select file "{fileName}"', {fileName: name})) + '</span>' + | |||
'</label>' | |||
); | |||
@@ -5,7 +5,7 @@ | |||
<input type="checkbox" class="hidden-visually" id="showgridview" | |||
aria-label="<?php p($l->t('Toggle grid view'))?>" | |||
<?php if ($_['showgridview']) { ?>checked="checked" <?php } ?>/> | |||
<label id="view-toggle" for="showgridview" class="button <?php p($_['showgridview'] ? 'icon-toggle-filelist' : 'icon-toggle-pictures') ?>" | |||
<label id="view-toggle" for="showgridview" tabindex="0" class="button <?php p($_['showgridview'] ? 'icon-toggle-filelist' : 'icon-toggle-pictures') ?>" | |||
title="<?php p($l->t('Toggle grid view'))?>"></label> | |||
<?php foreach ($_['appContents'] as $content) { ?> |
@@ -44,13 +44,13 @@ | |||
</th> | |||
<th id='headerName' class="hidden column-name"> | |||
<div id="headerName-container"> | |||
<a class="name sort columntitle" data-sort="name"> | |||
<a class="name sort columntitle" onclick="event.preventDefault()" href="#" data-sort="name"> | |||
<span><?php p($l->t('Name')); ?></span> | |||
<span class="sort-indicator"></span> | |||
</a> | |||
<span id="selectedActionsList" class="selectedActions"> | |||
<a href="" class="actions-selected"> | |||
<a href="#" onclick="event.preventDefault()" class="actions-selected"> | |||
<span class="icon icon-more"></span> | |||
<span><?php p($l->t('Actions'))?></span> | |||
</a> | |||
@@ -58,10 +58,10 @@ | |||
</div> | |||
</th> | |||
<th id="headerSize" class="hidden column-size"> | |||
<a class="size sort columntitle" data-sort="size"><span><?php p($l->t('Size')); ?></span><span class="sort-indicator"></span></a> | |||
<a class="size sort columntitle" href="#" onclick="event.preventDefault()" data-sort="size"><span><?php p($l->t('Size')); ?></span><span class="sort-indicator"></span></a> | |||
</th> | |||
<th id="headerDate" class="hidden column-mtime"> | |||
<a id="modified" class="columntitle" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> | |||
<a id="modified" class="columntitle" href="#" onclick="event.preventDefault()" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> | |||
</th> | |||
</tr> | |||
</thead> |
@@ -16,20 +16,20 @@ | |||
<tr> | |||
<th id='headerName' class="hidden column-name"> | |||
<div id="headerName-container"> | |||
<a class="name sort columntitle" | |||
<a class="name sort columntitle" href="#" onclick="event.preventDefault()" | |||
data-sort="name"><span><?php p($l->t('Name')); ?></span></a> | |||
</div> | |||
</th> | |||
<th id="headerSize" class="hidden column-size"> | |||
<a class="size sort columntitle" | |||
<a class="size sort columntitle" href="#" onclick="event.preventDefault()" | |||
data-sort="size"><span><?php p($l->t('Size')); ?></span></a> | |||
</th> | |||
<th id="headerDate" class="hidden column-mtime"> | |||
<a id="modified" class="columntitle" | |||
<a id="modified" class="columntitle" href="#" onclick="event.preventDefault()" | |||
data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span | |||
class="sort-indicator"></span></a> | |||
<span class="selectedActions"> | |||
<a href="" class="delete-selected"> | |||
<a href="#" onclick="event.preventDefault()" class="delete-selected"> | |||
<span class="icon icon-delete"></span> | |||
<span><?php p($l->t('Delete')) ?></span> | |||
</a> |
@@ -18,16 +18,16 @@ | |||
<tr> | |||
<th id='headerName' class="hidden column-name"> | |||
<div id="headerName-container"> | |||
<a class="name sort columntitle" data-sort="name"><span><?php p($l->t('Name')); ?></span><span class="sort-indicator"></span></a> | |||
<a class="name sort columntitle" onclick="event.preventDefault()" href="#" data-sort="name"><span><?php p($l->t('Name')); ?></span><span class="sort-indicator"></span></a> | |||
</div> | |||
</th> | |||
<th id="headerSize" class="hidden column-size"> | |||
<a class="size sort columntitle" data-sort="size"><span><?php p($l->t('Size')); ?></span><span class="sort-indicator"></span></a> | |||
<a class="size sort columntitle" onclick="event.preventDefault()" href="#" data-sort="size"><span><?php p($l->t('Size')); ?></span><span class="sort-indicator"></span></a> | |||
</th> | |||
<th id="headerDate" class="hidden column-mtime"> | |||
<a id="modified" class="columntitle" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> | |||
<a id="modified" class="columntitle" onclick="event.preventDefault()" href="#" data-sort="mtime"><span><?php p($l->t('Modified')); ?></span><span class="sort-indicator"></span></a> | |||
<span class="selectedActions"> | |||
<a href="" class="delete-selected"> | |||
<a onclick="event.preventDefault()" href="#" class="delete-selected"> | |||
<img class="svg" alt="" | |||
src="<?php print_unescaped(OCP\Template::image_path("core", "actions/delete.svg")); ?>" /> | |||
<?php p($l->t('Delete'))?> |
@@ -119,12 +119,12 @@ describe('OCA.Files.FileList tests', function() { | |||
'<thead><tr>' + | |||
'<th id="headerName" class="hidden column-name">' + | |||
'<input type="checkbox" id="select_all_files" class="select-all checkbox">' + | |||
'<a class="name columntitle" data-sort="name"><span>Name</span><span class="sort-indicator"></span></a>' + | |||
'<a class="name columntitle" href="#" onclick="event.preventDefault()" data-sort="name"><span>Name</span><span class="sort-indicator"></span></a>' + | |||
'<span id="selectedActionsList" class="selectedActions hidden">' + | |||
'<a href class="actions-selected"><span class="icon icon-more"></span><span>Actions</span></a>' + | |||
'<a class="actions-selected" href="#" onclick="event.preventDefault()"><span class="icon icon-more"></span><span>Actions</span></a>' + | |||
'</th>' + | |||
'<th class="hidden column-size"><a class="columntitle" data-sort="size"><span class="sort-indicator"></span></a></th>' + | |||
'<th class="hidden column-mtime"><a class="columntitle" data-sort="mtime"><span class="sort-indicator"></span></a></th>' + | |||
'<th class="hidden column-size"><a class="columntitle" href="#" onclick="event.preventDefault()" data-sort="size"><span class="sort-indicator"></span></a></th>' + | |||
'<th class="hidden column-mtime"><a class="columntitle" href="#" onclick="event.preventDefault()" data-sort="mtime"><span class="sort-indicator"></span></a></th>' + | |||
'</tr></thead>' + | |||
'<tbody id="fileList"></tbody>' + | |||
'<tfoot></tfoot>' + |
@@ -217,6 +217,12 @@ select#timezone, select#languageinput, select#localeinput { | |||
.development-notice { | |||
text-align: center; | |||
} | |||
.development-notice a:not(.link-button) { | |||
text-decoration: underline; | |||
} | |||
.development-notice a:not(.link-button):hover { | |||
background-color: var(--color-primary-element-lighter); | |||
} | |||
.link-button { | |||
display: inline-block; | |||
@@ -513,6 +519,9 @@ table.nostyle td { | |||
padding-left: 0 !important; | |||
margin-left: -10px; | |||
} | |||
.social-button a { | |||
display: inline-block; | |||
} | |||
.social-button img { | |||
padding: 10px; | |||
} |
@@ -185,6 +185,12 @@ select { | |||
// Button for 'Reasons to use Nextcloud in your organization' | |||
.development-notice { | |||
text-align: center; | |||
a:not(.link-button) { | |||
text-decoration: underline; | |||
&:hover { | |||
background-color: var(--color-primary-element-lighter); | |||
} | |||
} | |||
} | |||
.link-button { | |||
@@ -556,6 +562,9 @@ table.nostyle { | |||
.social-button { | |||
padding-left: 0 !important; | |||
margin-left: -10px; | |||
a { | |||
display: inline-block; | |||
} | |||
img { | |||
padding: 10px; |
@@ -231,6 +231,11 @@ export default { | |||
align-items: flex-start !important; | |||
color: var(--color-main-text) !important; | |||
&:focus-visible { | |||
padding: 6px 8px 1px 8px !important; | |||
margin: 2px !important; | |||
} | |||
&:not([href]) { | |||
height: var(--header-menu-item-height) !important; | |||
color: var(--color-text-maxcontrast) !important; | |||
@@ -298,7 +303,7 @@ export default { | |||
background-color: var(--color-background-hover); | |||
} | |||
&:focus { | |||
border: 2px solid var(--color-main-text)!important; | |||
box-shadow: 0 0 0 2px var(--color-main-text) !important; | |||
} | |||
} | |||
} |
@@ -192,7 +192,7 @@ kbd { | |||
#app-navigation:not(.vue) > ul { | |||
position: relative; | |||
height: 100%; | |||
width: inherit; | |||
width: 100%; | |||
overflow-x: hidden; | |||
overflow-y: auto; | |||
box-sizing: border-box; | |||
@@ -232,6 +232,11 @@ kbd { | |||
#app-navigation:not(.vue) > ul > li a:focus > a { | |||
background-color: var(--color-background-hover); | |||
} | |||
#app-navigation:not(.vue) > ul > li a:focus-visible { | |||
border-radius: var(--border-radius); | |||
box-shadow: var(--color-primary) inset 0 0 0 2px; | |||
outline: none; | |||
} | |||
#app-navigation:not(.vue) > ul > li.active, | |||
#app-navigation:not(.vue) > ul > li.active > a, | |||
#app-navigation:not(.vue) > ul > li a:active, | |||
@@ -344,6 +349,10 @@ kbd { | |||
#app-navigation:not(.vue) > ul > li > ul > li > a.svg { | |||
padding: 0 12px 0 44px; | |||
} | |||
#app-navigation:not(.vue) > ul > li > a.svg :focus-visible, | |||
#app-navigation:not(.vue) > ul > li > ul > li > a.svg :focus-visible { | |||
padding: 0 8px 0 42px; | |||
} | |||
#app-navigation:not(.vue) > ul > li > a:first-child img, | |||
#app-navigation:not(.vue) > ul > li > ul > li > a:first-child img { | |||
margin-right: 11px; | |||
@@ -424,6 +433,12 @@ kbd { | |||
* link. */ | |||
left: 0; | |||
} | |||
#app-navigation:not(.vue) .collapsible .collapse:focus-visible { | |||
opacity: 1; | |||
border-width: 0; | |||
box-shadow: inset 0 0 0 2px var(--color-primary); | |||
background: none; | |||
} | |||
#app-navigation:not(.vue) .collapsible:before { | |||
position: absolute; | |||
height: 44px; | |||
@@ -759,6 +774,11 @@ kbd { | |||
display: block; | |||
filter: var(--background-invert-if-dark); | |||
} | |||
#app-settings-header .settings-button:focus-visible { | |||
box-shadow: 0 0 0 2px inset var(--color-primary) !important; | |||
border-radius: var(--border-radius); | |||
background-position: 12px center; | |||
} | |||
/* GENERAL SECTION ------------------------------------------------------------ */ | |||
.section { |
@@ -124,7 +124,7 @@ kbd { | |||
> ul { | |||
position: relative; | |||
height: 100%; | |||
width: inherit; | |||
width: 100%; | |||
overflow-x: hidden; | |||
overflow-y: auto; | |||
box-sizing: border-box; | |||
@@ -162,6 +162,11 @@ kbd { | |||
background-color: var(--color-background-hover); | |||
} | |||
} | |||
a:focus-visible { | |||
border-radius: var(--border-radius); | |||
box-shadow: var(--color-primary) inset 0 0 0 2px; | |||
outline: none; | |||
} | |||
&.active, | |||
a:active, | |||
a.selected , | |||
@@ -283,6 +288,9 @@ kbd { | |||
&.svg { | |||
padding: 0 12px 0 44px; | |||
:focus-visible { | |||
padding: 0 8px 0 42px; | |||
} | |||
} | |||
&:first-child img { | |||
margin-right: 11px; | |||
@@ -373,6 +381,13 @@ kbd { | |||
/* Needed for IE11; otherwise the button appears to the right of the | |||
* link. */ | |||
left: 0; | |||
&:focus-visible { | |||
opacity: 1; | |||
border-width: 0; | |||
box-shadow: inset 0 0 0 2px var(--color-primary); | |||
background: none; | |||
} | |||
} | |||
&:before { | |||
position: absolute; | |||
@@ -764,6 +779,12 @@ $min-content-width: variables.$breakpoint-mobile - variables.$navigation-width - | |||
display: block; | |||
filter: var(--background-invert-if-dark); | |||
} | |||
&:focus-visible { | |||
box-shadow: 0 0 0 2px inset var(--color-primary) !important; | |||
border-radius: var(--border-radius); | |||
background-position: 12px center; | |||
} | |||
} | |||
/* GENERAL SECTION ------------------------------------------------------------ */ |
@@ -461,6 +461,11 @@ input[type='checkbox'].checkbox--white:checked + label:before { | |||
#show + label:hover, #dbpassword-toggle + label:hover, #personal-show + label:hover { | |||
opacity: 1; | |||
} | |||
#show:focus-visible + label, #dbpassword-toggle:focus-visible + label, #personal-show:focus-visible + label { | |||
box-shadow: var(--color-primary) 0 0 0 2px; | |||
opacity: 1; | |||
border-radius: 9999px; | |||
} | |||
#pass2, input[name='personal-password-clone'] { | |||
padding: .6em 2.5em .4em .4em; | |||
width: 8em; |
@@ -42,6 +42,17 @@ | |||
-moz-user-select: none; | |||
-ms-user-select: none; | |||
} | |||
#header a:focus-visible, #header button:not(.button-vue):focus-visible, #header div[role=button]:focus-visible, | |||
#navigation a:focus-visible, | |||
#navigation button:not(.button-vue):focus-visible, | |||
#navigation div[role=button]:focus-visible, | |||
#expanddiv a:focus-visible, | |||
#expanddiv button:not(.button-vue):focus-visible, | |||
#expanddiv div[role=button]:focus-visible { | |||
box-shadow: inset 0 0 0 2px var(--color-primary-text); | |||
border-radius: var(--border-radius); | |||
outline: none; | |||
} | |||
/* removed until content-focusing issue is fixed */ | |||
#skip-to-content a { | |||
@@ -78,19 +89,17 @@ | |||
/* LOGO and APP NAME -------------------------------------------------------- */ | |||
#nextcloud { | |||
padding: 7px 0; | |||
padding: 5px 0; | |||
padding-left: 86px; | |||
position: relative; | |||
height: 100%; | |||
height: calc(100% - 4px); | |||
box-sizing: border-box; | |||
opacity: 1; | |||
align-items: center; | |||
display: flex; | |||
flex-wrap: wrap; | |||
overflow: hidden; | |||
} | |||
#nextcloud:focus { | |||
opacity: 0.75; | |||
margin: 2px; | |||
} | |||
#nextcloud:hover, #nextcloud:active { | |||
opacity: 1; | |||
@@ -170,6 +179,12 @@ | |||
#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 { | |||
@@ -252,11 +267,19 @@ | |||
justify-content: center; | |||
align-items: center; | |||
width: 50px; | |||
height: 100%; | |||
height: 44px; | |||
cursor: pointer; | |||
opacity: 0.6; | |||
opacity: 0.85; | |||
padding: 0; | |||
margin: 0; | |||
margin: 2px 0; | |||
} | |||
#header .header-right > div > .menutoggle:focus, | |||
#header .header-right > form > .menutoggle:focus { | |||
opacity: 1; | |||
} | |||
#header .header-right > div > .menutoggle:focus-visible, | |||
#header .header-right > form > .menutoggle:focus-visible { | |||
outline: none; | |||
} | |||
/* hover effect for app switcher label */ | |||
@@ -366,7 +389,7 @@ nav[role=navigation] { | |||
#settings #expand { | |||
opacity: 1; | |||
/* override icon opacity */ | |||
padding-right: 12px; | |||
margin-right: 12px; | |||
/* Profile picture in header */ | |||
/* show triangle below user menu if active */ | |||
} | |||
@@ -453,13 +476,14 @@ nav[role=navigation] { | |||
position: relative; | |||
display: flex; | |||
margin: 0; | |||
height: 50px; | |||
height: 44px; | |||
width: 50px; | |||
align-items: center; | |||
justify-content: center; | |||
opacity: 0.6; | |||
opacity: 0.85; | |||
letter-spacing: -0.5px; | |||
font-size: 12px; | |||
margin: 2px; | |||
} | |||
#appmenu li:hover a, | |||
#appmenu li a:focus, | |||
@@ -565,7 +589,7 @@ nav[role=navigation] { | |||
border-width: 10px; | |||
transform: translateX(-50%); | |||
left: 50%; | |||
bottom: 0; | |||
bottom: -5px; | |||
display: none; | |||
} | |||
#appmenu li a.active::before, |
@@ -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;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;;;AAIF;AACA;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA,QDwDe;ECvDf;EACA;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAED;EACC;;;AASF;AACC;AA6GA;AA4BA;;AAtIA;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EAhBD;EACA;EAiBC;EACA,KDQc;ECPd;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;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,OD7HY;EC8HZ;EACA;EACA;EACA;EACA;;;AAMJ;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,ODpMe;ECqMf,QDrMe;ECsMf;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,WDhUe;ECiUf;AAwFA;AAiCA;AAwBA;AAgBA;;AA/JA;EACC;EACA;EACA;EACA;EACA;AAgBA;AA4BA;AAQA;AAcA;AACA;AAQA;;AAzEA;EACC;EACA;EACA;EACA,QD9Ua;EC+Ub,OD/Ua;ECgVb;EACA;EACA;EAEA;EACA;;AAID;AAAA;AAAA;EAGC;EACA;;AAID;AAAA;EAEC;;AAGD;AAAA;AAAA;AAAA;EAMC;EACA;EACA;EACA;EACA;EACA;;AAID;AAAA;EAEC;EACA;EACA;;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;AACA;EACA;;AAEA;EACC,MDzhBiB;EC0hBjB;;AAGD;EAEC,KDhiBc;;;ACqiBhB;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;AAAA;EAGC;EACA;EACA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;EACA;;;AAIF;AACA;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;;;AAIF;AACA;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA,QDmDe;EClDf;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,KDKc;ECJd;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,ODpIY;ECqIZ;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,ODnNe;ECoNf,QDpNe;ECqNf;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,WD/Ue;ECgVf;AAyFA;AAiCA;AAwBA;AAgBA;;AAhKA;EACC;EACA;EACA;EACA;EACA;AAiBA;AA4BA;AAQA;AAcA;AACA;AAQA;;AA1EA;EACC;EACA;EACA;EACA;EACA,OD9Va;EC+Vb;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;;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;AACA;EACA;;AAEA;EACC,MDziBiB;EC0iBjB;;AAGD;EAEC,KDhjBc;;;ACqjBhB;AAGC;AAAA;EACC;EACA;;AAED;AAAA;AAAA;AAAA;EAEC;EACA;EACA","file":"header.css"} |
@@ -21,6 +21,11 @@ | |||
-webkit-user-select: none; | |||
-moz-user-select: none; | |||
-ms-user-select: none; | |||
a:focus-visible, button:not(.button-vue):focus-visible, div[role="button"]:focus-visible { | |||
box-shadow: inset 0 0 0 2px var(--color-primary-text); | |||
border-radius: var(--border-radius); | |||
outline: none; | |||
} | |||
} | |||
/* removed until content-focusing issue is fixed */ | |||
@@ -58,20 +63,18 @@ | |||
/* LOGO and APP NAME -------------------------------------------------------- */ | |||
#nextcloud { | |||
padding: 7px 0; | |||
padding: 5px 0; | |||
padding-left: 86px; // logo width + 2* pa | |||
position: relative; | |||
height: 100%; | |||
height: calc(100% - 4px); | |||
box-sizing: border-box; | |||
opacity: 1; | |||
align-items: center; | |||
display: flex; | |||
flex-wrap: wrap; | |||
overflow: hidden; | |||
margin: 2px; | |||
&:focus { | |||
opacity: .75; | |||
} | |||
&:hover, &:active { | |||
opacity: 1; | |||
} | |||
@@ -147,6 +150,10 @@ | |||
&.active { | |||
background-color: var(--color-primary-light); | |||
} | |||
&:focus-visible { | |||
box-shadow: inset 0 0 0 2px var(--color-primary); | |||
outline: none; | |||
} | |||
span { | |||
display: inline-block; | |||
padding-bottom: 0; | |||
@@ -231,11 +238,19 @@ | |||
justify-content: center; | |||
align-items: center; | |||
width: variables.$header-height; | |||
height: 100%; | |||
height: 44px; | |||
cursor: pointer; | |||
opacity: 0.6; | |||
opacity: 0.85; | |||
padding: 0; | |||
margin: 0; | |||
margin: 2px 0; | |||
&:focus { | |||
opacity: 1; | |||
} | |||
&:focus-visible { | |||
outline: none; | |||
} | |||
} | |||
} | |||
} | |||
@@ -353,7 +368,7 @@ nav[role='navigation'] { | |||
/* User menu on the right */ | |||
#expand { | |||
opacity: 1; /* override icon opacity */ | |||
padding-right: 12px; | |||
margin-right: 12px; | |||
&:hover, | |||
&:focus, | |||
@@ -439,14 +454,15 @@ nav[role='navigation'] { | |||
position: relative; | |||
display: flex; | |||
margin: 0; | |||
height: variables.$header-height; | |||
height: calc(variables.$header-height - 6px); | |||
width: variables.$header-height; | |||
align-items: center; | |||
justify-content: center; | |||
opacity: .6; | |||
opacity: .85; | |||
// Make sure most app names don’t ellipsize | |||
letter-spacing: -0.5px; | |||
font-size: 12px; | |||
margin: 2px; | |||
} | |||
/* focused app visual feedback */ | |||
@@ -583,7 +599,7 @@ nav[role='navigation'] { | |||
border-width: 10px; | |||
transform: translateX(-50%); | |||
left: 50%; | |||
bottom: 0; | |||
bottom: -5px; | |||
display: none; | |||
} | |||
@@ -147,6 +147,15 @@ div[contenteditable=true]:not(:disabled):not(.primary):active, | |||
background-color: var(--color-main-background); | |||
color: var(--color-text-light); | |||
} | |||
div.select2-drop .select2-search input:not(:disabled):not(.primary):focus-visible, | |||
select:not(:disabled):not(.primary):focus-visible, | |||
button:not(.button-vue):not(:disabled):not(.primary):focus-visible, .button:not(:disabled):not(.primary):focus-visible, | |||
input:not([type=range]):not(:disabled):not(.primary):focus-visible, | |||
textarea:not(:disabled):not(.primary):focus-visible, | |||
div[contenteditable=true]:not(:disabled):not(.primary):focus-visible, | |||
.pager li a:not(:disabled):not(.primary):focus-visible { | |||
box-shadow: 0 0 0 2px var(--color-primary); | |||
} | |||
div.select2-drop .select2-search input:disabled, | |||
select:disabled, | |||
button:not(.button-vue):disabled, .button:disabled, |
@@ -1 +1 @@ | |||
{"version":3,"sourceRoot":"","sources":["variables.scss","inputs.scss","functions.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;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBA;AAAA;AAAA;AA4BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ADlCC;AACD;EACC;;;AAED;EACC;;;AAKD;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;EAMC;EACA,YAVgB;EAWhB;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AA4BA;;AA1BC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;EACC;EACA;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;EACA;EACA;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;EACA;EACA;AAEA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEC;;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGC;EACA;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEC;EACA;EACA;;;AAKH;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;;AAGD;AACA;AAcC;AAAA;;AAbA;EACC;EACA;EAEA,QAvHe;;AAyHhB;EAIC;EACA;;AAID;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAED;EACC;;;AAIF;AACA;AAAA;AAAA;AAAA;AAAA;EAKC;EACA;EACA,YA1JgB;EA2JhB;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;EACC;;;AAKD;AAAA;EACC;;AAIA;AAAA;EACC;;;AAKH;AACA;AAAA;AAAA;AAAA;EAIC;EACA;AAEA;;AACA;AAAA;AAAA;AAAA;EACC;;AAGD;AAAA;AAAA;AAAA;EACC;EACA;EACA;;;AAID;AACC;;AACA;EAEC;EACA;EACA;;;AAKH;EACC;EACA;EACA;EACA;;AAEC;EAGC;EACA;;;AAKH;EACC;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EAEA,QA9OgB;;;AAiPjB;AAEC;AAsBC;;AAnBA;EACC;EACA;EACA;EACA;AACA;EACA;EACA;EACA,QA9Pc;EA+Pd,OA/Pc;EAgQd;EACA;EACA;;AACA;EACC;AC7NH;EAEA;;ADmOG;EACC;;AAID;EAGC;EACA;;AACA;EACC;;AAQH;EACC;EACA;AACA;EACA;;;AAOJ;AACA;AAAA;EAEC;;;AAED;AAAA;EAEC;;;AAGD;AAKC;AA8EC;;AA5EA;EAEC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;AAED;EAEC;;AAED;EACC;EACA;EACA,QAxBkB;EAyBlB,OAzBkB;EA0BlB;EACA;EACA;EACA;;AAED;EAEC;;AAED;EACC;EACA;EACA;EACA;;AAED;AAEA;AAAA;EAEC;EACA;EACA;;AAED;EACC;EACA;AAA4D;;AAE7D;EACC;;AAID;EACC;EACA;;AAED;EACC,eA/DkB;;AAmEnB;EACC;EACA,QArEkB;EAsElB,OAtEkB;EAuElB;EACA;;AAED;EACC;;AAED;EACC;;AAOD;EAEC;;AAED;EACC,cAzFyB;;AA2F1B;EACC;EACA;EACA;;AAED;EACC;AAAuE;EACvE;AAAiE;;AAElE;EACC;EACA;AAAiE;EACjE;;AAID;EAEC;AAA0C;EAC1C;AAAsD;EACtD;;AAED;EACC;;AAED;EACC;AAAc;;;AAMlB;AACA;EACC;EACA;;AACA;EACC;;AAED;EACC;EACA;EACA;;AACA;EACC;;AAGF;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;;AACA;EACC;;AACA;EACC;EACA;;AAIH;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA;;AAGA;EACC;;AAGF;EACE;EACA;;;AAMH;AAAA;AAAA;AAAA;EAEC;;;AAID;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACA;EAIC;EACA;EACA;EACA;;AAED;EACC;;AAGF;EACC;;AACA;EACC;;;AAKJ;EACC;;AACA;EACC;EACA;;AACA;EACC;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;;AACA;EACC;;AAED;EAEC;EACA;;AAGF;EACC;EACA;EACA;;AACA;EACC;EACA;;AAGF;EAGC;;AAED;EACC;;;AAKH;AACA;EACC;EACA;;AACA;EACC;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;AAIH;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACC;;AAED;EACC;EACA;;AACA;EACC;;;AAQL;AACA;EACC;EACA;EACA;EACA;EACA;EACA;AAiHA;;AAhHA;AACC;;AACA;EACC;EACA;;AAGF;EAEC;;AAED;AACC;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,QA1rBe;AA2rBf;AAoDA;AASA;AAaA;;AAzEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AACA;AAAA;AASA;;AAPA;EACC;AACA;;AACA;EACC;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACA;AAAA;EAEA;EACA;EACA;EACA;AACA;AAAA;AAQA;AAAA;;AANA;EACC;;AAED;EACC,cAnDa;;AAuDd;EACC;EACA;EACA;;AAKH;EACC;EACA;EACA;AAAY;EACZ;EACA;EACA;;AAGD;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;EACA,cAhFe;AAiFf;EACA;;AAGD;EACC;EACA;EACA;EACA;AACA;EACA;EACA;AACA;EACA;AACA;EACA;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;;AACA;AAAA;EAEC;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACA;AAiBA;AAAA;AAAA;;AAhBA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAMA;EACC;EACA;;AAGF;EACC;;AAED;EACC;;AAIA;EACC;;;AAQN;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEC;EACC;;AAED;EACC;;AAGF;EACC;;AAED;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;;AAIF;AACA;EACC;IAEC;;EAED;IAEC;;EAED;IAGC;;EAED;IAEC;;;AAGF;EACC;EACA;EACA;;;AAKD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;EAGC","file":"inputs.css"} | |||
{"version":3,"sourceRoot":"","sources":["variables.scss","inputs.scss","functions.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;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBA;AAAA;AAAA;AA4BA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ADlCC;AACD;EACC;;;AAED;EACC;;;AAKD;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;EAMC;EACA,YAVgB;EAWhB;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAMA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AA+BA;;AA7BC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA;EACC;EACA;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;EACA;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;EACA;EACA;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;EACA;EACA;EACA;AAEA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEC;;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGC;EACA;;AAED;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACC;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEC;EACA;EACA;;;AAKH;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;;AAGD;AACA;AAcC;AAAA;;AAbA;EACC;EACA;EAEA,QA1He;;AA4HhB;EAIC;EACA;;AAID;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAED;EACC;;;AAIF;AACA;AAAA;AAAA;AAAA;AAAA;EAKC;EACA;EACA,YA7JgB;EA8JhB;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;EACC;;;AAKD;AAAA;EACC;;AAIA;AAAA;EACC;;;AAKH;AACA;AAAA;AAAA;AAAA;EAIC;EACA;AAEA;;AACA;AAAA;AAAA;AAAA;EACC;;AAGD;AAAA;AAAA;AAAA;EACC;EACA;EACA;;;AAID;AACC;;AACA;EAEC;EACA;EACA;;;AAKH;EACC;EACA;EACA;EACA;;AAEC;EAGC;EACA;;;AAKH;EACC;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EAEA,QAjPgB;;;AAoPjB;AAEC;AAsBC;;AAnBA;EACC;EACA;EACA;EACA;AACA;EACA;EACA;EACA,QAjQc;EAkQd,OAlQc;EAmQd;EACA;EACA;;AACA;EACC;AChOH;EAEA;;ADsOG;EACC;;AAID;EAGC;EACA;;AACA;EACC;;AAQH;EACC;EACA;AACA;EACA;;;AAOJ;AACA;AAAA;EAEC;;;AAED;AAAA;EAEC;;;AAGD;AAKC;AA8EC;;AA5EA;EAEC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;AAED;EAEC;;AAED;EACC;EACA;EACA,QAxBkB;EAyBlB,OAzBkB;EA0BlB;EACA;EACA;EACA;;AAED;EAEC;;AAED;EACC;EACA;EACA;EACA;;AAED;AAEA;AAAA;EAEC;EACA;EACA;;AAED;EACC;EACA;AAA4D;;AAE7D;EACC;;AAID;EACC;EACA;;AAED;EACC,eA/DkB;;AAmEnB;EACC;EACA,QArEkB;EAsElB,OAtEkB;EAuElB;EACA;;AAED;EACC;;AAED;EACC;;AAOD;EAEC;;AAED;EACC,cAzFyB;;AA2F1B;EACC;EACA;EACA;;AAED;EACC;AAAuE;EACvE;AAAiE;;AAElE;EACC;EACA;AAAiE;EACjE;;AAID;EAEC;AAA0C;EAC1C;AAAsD;EACtD;;AAED;EACC;;AAED;EACC;AAAc;;;AAMlB;AACA;EACC;EACA;;AACA;EACC;;AAED;EACC;EACA;EACA;;AACA;EACC;;AAGF;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;;AACA;EACC;;AACA;EACC;EACA;;AAIH;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA;;AAGA;EACC;;AAGF;EACE;EACA;;;AAMH;AAAA;AAAA;AAAA;EAEC;;;AAID;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACA;EAIC;EACA;EACA;EACA;;AAED;EACC;;AAGF;EACC;;AACA;EACC;;;AAKJ;EACC;;AACA;EACC;EACA;;AACA;EACC;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;;AACA;EACC;;AAED;EAEC;EACA;;AAGF;EACC;EACA;EACA;;AACA;EACC;EACA;;AAGF;EAGC;;AAED;EACC;;;AAKH;AACA;EACC;EACA;;AACA;EACC;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;AAIH;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACC;;AAED;EACC;EACA;;AACA;EACC;;;AAQL;AACA;EACC;EACA;EACA;EACA;EACA;EACA;AAiHA;;AAhHA;AACC;;AACA;EACC;EACA;;AAGF;EAEC;;AAED;AACC;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,QA7rBe;AA8rBf;AAoDA;AASA;AAaA;;AAzEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AACA;AAAA;AASA;;AAPA;EACC;AACA;;AACA;EACC;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACA;AAAA;EAEA;EACA;EACA;EACA;AACA;AAAA;AAQA;AAAA;;AANA;EACC;;AAED;EACC,cAnDa;;AAuDd;EACC;EACA;EACA;;AAKH;EACC;EACA;EACA;AAAY;EACZ;EACA;EACA;;AAGD;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;EACA,cAhFe;AAiFf;EACA;;AAGD;EACC;EACA;EACA;EACA;AACA;EACA;EACA;AACA;EACA;AACA;EACA;;AAIF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;;AACA;AAAA;EAEC;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACA;AAiBA;AAAA;AAAA;;AAhBA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAMA;EACC;EACA;;AAGF;EACC;;AAED;EACC;;AAIA;EACC;;;AAQN;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEC;EACC;;AAED;EACC;;AAGF;EACC;;AAED;EACC;EACA;EACA;;AAED;EACC;EACA;EACA;;;AAIF;AACA;EACC;IAEC;;EAED;IAEC;;EAED;IAGC;;EAED;IAEC;;;AAGF;EACC;EACA;EACA;;;AAKD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;EAGC","file":"inputs.css"} |
@@ -72,6 +72,9 @@ div[contenteditable=true], | |||
background-color: var(--color-main-background); | |||
color: var(--color-text-light); | |||
} | |||
&:focus-visible { | |||
box-shadow: 0 0 0 2px var(--color-primary); | |||
} | |||
} | |||
&:disabled { | |||
background-color: var(--color-background-dark); |
@@ -40,7 +40,6 @@ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pr | |||
margin: 0; | |||
padding: 0; | |||
border: 0; | |||
outline: 0; | |||
font-weight: inherit; | |||
font-size: 100%; | |||
font-family: inherit; | |||
@@ -50,6 +49,23 @@ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pr | |||
scrollbar-width: thin; | |||
} | |||
.js-focus-visible :focus:not(.focus-visible) { | |||
outline: none; | |||
} | |||
:focus-visible { | |||
box-shadow: 0 0 0 2px var(--color-primary); | |||
outline: none; | |||
} | |||
/** Let vue apps handle the focus themselves */ | |||
#content-vue :focus-visible, | |||
#app-navigation-vue :focus-visible, | |||
.vue :focus-visible { | |||
box-shadow: none; | |||
outline: none; | |||
} | |||
html, body { | |||
height: 100%; | |||
} | |||
@@ -309,6 +325,12 @@ body { | |||
opacity: 0.8; | |||
} | |||
#show:focus-visible + label, #dbpassword-toggle:focus-visible + label, #personal-show:focus-visible + label { | |||
box-shadow: var(--color-primary) 0 0 0 2px; | |||
opacity: 1; | |||
border-radius: 9999px; | |||
} | |||
#show + label, #dbpassword + label, #personal-show + label { | |||
position: absolute !important; | |||
height: 20px; | |||
@@ -920,9 +942,15 @@ span.ui-icon { | |||
/* ---- CONTACTS MENU ---- */ | |||
#contactsmenu .menutoggle { | |||
cursor: pointer; | |||
} | |||
#contactsmenu .menutoggle:before { | |||
background-size: 20px 20px; | |||
background-repeat: no-repeat; | |||
background-position-x: 3px; | |||
background-position-y: 4px; | |||
padding: 14px; | |||
cursor: pointer; | |||
content: " "; | |||
background-image: var(--original-icon-contacts-white); | |||
filter: var(--primary-invert-if-bright); | |||
} | |||
@@ -1327,6 +1355,15 @@ div[contenteditable=true]:not(:disabled):not(.primary):active, | |||
background-color: var(--color-main-background); | |||
color: var(--color-text-light); | |||
} | |||
div.select2-drop .select2-search input:not(:disabled):not(.primary):focus-visible, | |||
select:not(:disabled):not(.primary):focus-visible, | |||
button:not(.button-vue):not(:disabled):not(.primary):focus-visible, .button:not(:disabled):not(.primary):focus-visible, | |||
input:not([type=range]):not(:disabled):not(.primary):focus-visible, | |||
textarea:not(:disabled):not(.primary):focus-visible, | |||
div[contenteditable=true]:not(:disabled):not(.primary):focus-visible, | |||
.pager li a:not(:disabled):not(.primary):focus-visible { | |||
box-shadow: 0 0 0 2px var(--color-primary); | |||
} | |||
div.select2-drop .select2-search input:disabled, | |||
select:disabled, | |||
button:not(.button-vue):disabled, .button:disabled, | |||
@@ -2259,6 +2296,17 @@ label.infield { | |||
-moz-user-select: none; | |||
-ms-user-select: none; | |||
} | |||
#header a:focus-visible, #header button:not(.button-vue):focus-visible, #header div[role=button]:focus-visible, | |||
#navigation a:focus-visible, | |||
#navigation button:not(.button-vue):focus-visible, | |||
#navigation div[role=button]:focus-visible, | |||
#expanddiv a:focus-visible, | |||
#expanddiv button:not(.button-vue):focus-visible, | |||
#expanddiv div[role=button]:focus-visible { | |||
box-shadow: inset 0 0 0 2px var(--color-primary-text); | |||
border-radius: var(--border-radius); | |||
outline: none; | |||
} | |||
/* removed until content-focusing issue is fixed */ | |||
#skip-to-content a { | |||
@@ -2295,19 +2343,17 @@ label.infield { | |||
/* LOGO and APP NAME -------------------------------------------------------- */ | |||
#nextcloud { | |||
padding: 7px 0; | |||
padding: 5px 0; | |||
padding-left: 86px; | |||
position: relative; | |||
height: 100%; | |||
height: calc(100% - 4px); | |||
box-sizing: border-box; | |||
opacity: 1; | |||
align-items: center; | |||
display: flex; | |||
flex-wrap: wrap; | |||
overflow: hidden; | |||
} | |||
#nextcloud:focus { | |||
opacity: 0.75; | |||
margin: 2px; | |||
} | |||
#nextcloud:hover, #nextcloud:active { | |||
opacity: 1; | |||
@@ -2387,6 +2433,12 @@ label.infield { | |||
#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 { | |||
@@ -2469,11 +2521,19 @@ label.infield { | |||
justify-content: center; | |||
align-items: center; | |||
width: 50px; | |||
height: 100%; | |||
height: 44px; | |||
cursor: pointer; | |||
opacity: 0.6; | |||
opacity: 0.85; | |||
padding: 0; | |||
margin: 0; | |||
margin: 2px 0; | |||
} | |||
#header .header-right > div > .menutoggle:focus, | |||
#header .header-right > form > .menutoggle:focus { | |||
opacity: 1; | |||
} | |||
#header .header-right > div > .menutoggle:focus-visible, | |||
#header .header-right > form > .menutoggle:focus-visible { | |||
outline: none; | |||
} | |||
/* hover effect for app switcher label */ | |||
@@ -2583,7 +2643,7 @@ nav[role=navigation] { | |||
#settings #expand { | |||
opacity: 1; | |||
/* override icon opacity */ | |||
padding-right: 12px; | |||
margin-right: 12px; | |||
/* Profile picture in header */ | |||
/* show triangle below user menu if active */ | |||
} | |||
@@ -2670,13 +2730,14 @@ nav[role=navigation] { | |||
position: relative; | |||
display: flex; | |||
margin: 0; | |||
height: 50px; | |||
height: 44px; | |||
width: 50px; | |||
align-items: center; | |||
justify-content: center; | |||
opacity: 0.6; | |||
opacity: 0.85; | |||
letter-spacing: -0.5px; | |||
font-size: 12px; | |||
margin: 2px; | |||
} | |||
#appmenu li:hover a, | |||
#appmenu li a:focus, | |||
@@ -2782,7 +2843,7 @@ nav[role=navigation] { | |||
border-width: 10px; | |||
transform: translateX(-50%); | |||
left: 50%; | |||
bottom: 0; | |||
bottom: -5px; | |||
display: none; | |||
} | |||
#appmenu li a.active::before, | |||
@@ -3253,7 +3314,7 @@ kbd { | |||
#app-navigation:not(.vue) > ul { | |||
position: relative; | |||
height: 100%; | |||
width: inherit; | |||
width: 100%; | |||
overflow-x: hidden; | |||
overflow-y: auto; | |||
box-sizing: border-box; | |||
@@ -3293,6 +3354,11 @@ kbd { | |||
#app-navigation:not(.vue) > ul > li a:focus > a { | |||
background-color: var(--color-background-hover); | |||
} | |||
#app-navigation:not(.vue) > ul > li a:focus-visible { | |||
border-radius: var(--border-radius); | |||
box-shadow: var(--color-primary) inset 0 0 0 2px; | |||
outline: none; | |||
} | |||
#app-navigation:not(.vue) > ul > li.active, | |||
#app-navigation:not(.vue) > ul > li.active > a, | |||
#app-navigation:not(.vue) > ul > li a:active, | |||
@@ -3405,6 +3471,10 @@ kbd { | |||
#app-navigation:not(.vue) > ul > li > ul > li > a.svg { | |||
padding: 0 12px 0 44px; | |||
} | |||
#app-navigation:not(.vue) > ul > li > a.svg :focus-visible, | |||
#app-navigation:not(.vue) > ul > li > ul > li > a.svg :focus-visible { | |||
padding: 0 8px 0 42px; | |||
} | |||
#app-navigation:not(.vue) > ul > li > a:first-child img, | |||
#app-navigation:not(.vue) > ul > li > ul > li > a:first-child img { | |||
margin-right: 11px; | |||
@@ -3485,6 +3555,12 @@ kbd { | |||
* link. */ | |||
left: 0; | |||
} | |||
#app-navigation:not(.vue) .collapsible .collapse:focus-visible { | |||
opacity: 1; | |||
border-width: 0; | |||
box-shadow: inset 0 0 0 2px var(--color-primary); | |||
background: none; | |||
} | |||
#app-navigation:not(.vue) .collapsible:before { | |||
position: absolute; | |||
height: 44px; | |||
@@ -3820,6 +3896,11 @@ kbd { | |||
display: block; | |||
filter: var(--background-invert-if-dark); | |||
} | |||
#app-settings-header .settings-button:focus-visible { | |||
box-shadow: 0 0 0 2px inset var(--color-primary) !important; | |||
border-radius: var(--border-radius); | |||
background-position: 12px center; | |||
} | |||
/* GENERAL SECTION ------------------------------------------------------------ */ | |||
.section { |
@@ -39,7 +39,6 @@ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pr | |||
margin: 0; | |||
padding: 0; | |||
border: 0; | |||
outline: 0; | |||
font-weight: inherit; | |||
font-size: 100%; | |||
font-family: inherit; | |||
@@ -49,6 +48,23 @@ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pr | |||
scrollbar-width: thin; | |||
} | |||
.js-focus-visible :focus:not(.focus-visible) { | |||
outline: none; | |||
} | |||
:focus-visible { | |||
box-shadow: 0 0 0 2px var(--color-primary); | |||
outline: none; | |||
} | |||
/** Let vue apps handle the focus themselves */ | |||
#content-vue :focus-visible, | |||
#app-navigation-vue :focus-visible, | |||
.vue :focus-visible { | |||
box-shadow: none; | |||
outline: none; | |||
} | |||
html, body { | |||
height: 100%; | |||
} | |||
@@ -308,6 +324,12 @@ body { | |||
opacity: 0.8; | |||
} | |||
#show:focus-visible + label, #dbpassword-toggle:focus-visible + label, #personal-show:focus-visible + label { | |||
box-shadow: var(--color-primary) 0 0 0 2px; | |||
opacity: 1; | |||
border-radius: 9999px; | |||
} | |||
#show + label, #dbpassword + label, #personal-show + label { | |||
position: absolute !important; | |||
height: 20px; | |||
@@ -919,9 +941,15 @@ span.ui-icon { | |||
/* ---- CONTACTS MENU ---- */ | |||
#contactsmenu .menutoggle { | |||
cursor: pointer; | |||
} | |||
#contactsmenu .menutoggle:before { | |||
background-size: 20px 20px; | |||
background-repeat: no-repeat; | |||
background-position-x: 3px; | |||
background-position-y: 4px; | |||
padding: 14px; | |||
cursor: pointer; | |||
content: " "; | |||
background-image: var(--original-icon-contacts-white); | |||
filter: var(--primary-invert-if-bright); | |||
} |
@@ -1 +1 @@ | |||
{"version":3,"sourceRoot":"","sources":["variables.scss","styles.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;AAAA;AAkBA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;;AACA;EACC;;;AAIF;EACC;EACA;;;AAGD;EACC;;AACA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;AACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AACA;EACC;;;AAKH;AAEA;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;;;AAID;AAEA;EACC;EACA;;;AAID;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAAa;EACb;EACA;EACA;EACA;EACA;EACA,KDxFe;;;AC2FhB;AAEA;EACC;;;AAGD;EACC;;;AAMC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;;;AAKH;AAEA;AAAA;EAEC;EACA;EACA;EACA;;AACA;AAAA;EACC;;AAED;AAAA;EACC;;AAED;AAAA;EACC;;AAED;AAAA;AAAA;AAAA;EAEC;EACA;EACA;EACA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEC;;;AAKH;AAEA;EACC;;;AAGD;AAEA;AAEA;AAEA;EACC;EACA;EACA;EACA;EACA;;;AAGD;AAEA;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAIC;AAAA;AAAA;EACC;;AAED;AAAA;AAAA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;;;AAGD;AAEA;EACC;EACA;EACA;EACA;EACA;;;AAIA;EACC;EACA;;;AAKD;EACC;EACA;;AACA;EACC;EACA;EACA;;AAGF;EACC;EACA;;;AAIF;EACC;EACA;;AACA;EACC;;;AAIF;EACC;;;AAGD;AACA;AAEA;AAEA;AAEA;EACC;EACA;;AACA;EACC;EACA;;;AAIF;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAKA;EACA;EACA;;AANA;EACC;EACA;;AAKD;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;;;AAKH;EACC;;;AAIA;AAAA;EAGC;;;AAIF;EACC;EACA;EACA;;AAEA;EACC;;;AAIF;EACC;EACA;;;AAGD;EACC;;;AAIA;EACC;;;AAKD;EACC;;;AAKD;EACC;;;AAKD;EACC;;;AAIF;EACC;;;AAGD;EACC;EACA;EACA;EACA;;AACA;EACC;;;AAIF;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EAGC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAED;EACC;;AAEA;EACC;;AAED;EACC;;AAGF;EACC;;AAID;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;;AAGA;EACC;;AAGD;AAAA;AAAA;EAGC;EACA;EACA;;AAGD;AAAA;EAEC;EACA;;;AAMJ;EACC;EACA;;;AAID;AACA;EACC;EACA;EACA;EACA;AAwBA;;AAtBA;EACC;;AAGD;AAAA;AAAA;EAGC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAIF;EACC;;AAGA;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;;AAGF;EACC;;AAGA;AAAA;AAAA;EAIC;EACA;EACA;;AAGD;EACC;;AAGD;EACC;;;AAMJ;AAGC;AAAA;EACC;EACA;EACA;;AACA;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;AACA;EACC;EACA;EACA;AA0BA;;AAxBA;EACC;EACA;EACA;;AAEA;EACC;EACA;EACA;;AAGA;EACC;;AAED;EACC;;AAED;EACC;EACA;;AAMH;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEC;;AAKF;EACC;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;;AAGD;EACC;EACA;;AACA;EACC;EACA;;AAMH;EACC;EACA;EACA;EACA;AACA;AACA;EACA;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAED;AACC;EACA;EACA;;AAEC;EACC;EACA;;AACA;EACC;EACA;;AAIH;EACC;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;AAED;AAAA;AAAA;EAGC;;AAED;AAAA;EAEC;;AAGD;EACC;EACA;;AAED;EACC;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AACA;EACC;;AACA;EACC;EACA;EACA;;AAED;EACC;;AAIH;EACC;;AAED;EACC;;AAED;EAIC;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA,SAhBS;EAiBT;EACA;EACA;;AAGA;EACC;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA,aA/BU;EAgCV;;AACA;EACC;;AAGF;EACC;EACA;;AAED;EACC;;AAON;EACC;;;AAIF;EACC;;;AAGD;EACC;EACA;;;AAGD;AAGC;EACC;EACA;EACA;EAEA;EACA;;AAEA;EAGC;;;AAKH;AACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AACA;AAAA;EAEC;;AAIF;AACC;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAEA;EACC;EACA;EACA;EACA;;AAKH;EACC;EACA;EACA;EACA;EACA;AA6CA;;AA3CA;EACC;;AAGD;EACC;EACA;EACA;;AAGD;EACC;EACA;;AAEA;EACC;EACA;;AAGD;AACC;EACA;EACA;EACA;EACA;;AAED;EACC;;AAIF;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAKF;EACC;EACA;;AAED;EACC;;;AAMH;EACC;EACA;EACA;;;AAGD;AAEA;EACC;;;AAGD;AAGC;EACC;EACA;;AAED;EACC;EACA;EACA;EACA;;AAED;EACC;EACA;;AACA;EACC;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;AAGF;EACC;EACA;;;AAIF;AACA;EACC;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACA;EACC;;AAIA;EACC;;AAIF;EACC;EACA;;AACA;EACC;EACA;EACA;EACA;;AACA;EACC;;AAGF;EACC;;AAIH;EACC;;AACA;EACC;;AAGF;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAEA;AAAA;AAAA;EAGC;;AAGF;EACC;EACA;;AAID;EACC;EACA;;AAEA;EACC;;AAGF;EACC;;AAEA;AAAA;AAAA;AAAA;AAAA;EAEC;;;AAKH;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;;AAIF;AAGC;EACC;EACA;;AAED;EACC;;;AAIF;AACA;EACC;;AAID;AAEA;EACC;EACA;EACA;EACA","file":"styles.css"} | |||
{"version":3,"sourceRoot":"","sources":["variables.scss","styles.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;AAAA;AAkBA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;AACA;AAAA;AAAA;EAGC;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;;AACA;EACC;;;AAIF;EACC;EACA;;;AAGD;EACC;;AACA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;AACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AACA;EACC;;;AAKH;AAEA;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;;;AAID;AAEA;EACC;EACA;;;AAID;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAAa;EACb;EACA;EACA;EACA;EACA;EACA,KDxGe;;;AC2GhB;AAEA;EACC;;;AAGD;EACC;;;AAMC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;;;AAKH;AAEA;AAAA;EAEC;EACA;EACA;EACA;;AACA;AAAA;EACC;;AAED;AAAA;EACC;;AAED;AAAA;EACC;;AAED;AAAA;AAAA;AAAA;EAEC;EACA;EACA;EACA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEC;;;AAKH;AAEA;EACC;;;AAGD;AAEA;AAEA;AAEA;EACC;EACA;EACA;EACA;EACA;;;AAGD;AAEA;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;;;AAED;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAIC;AAAA;AAAA;EACC;;AAED;AAAA;AAAA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;;;AAED;EACC;EACA;EACA;EACA;EACA;;;AAGD;AAEA;EACC;EACA;EACA;EACA;EACA;;;AAIA;EACC;EACA;;;AAKD;EACC;EACA;;AACA;EACC;EACA;EACA;;AAGF;EACC;EACA;;;AAIF;EACC;EACA;;AACA;EACC;;;AAIF;EACC;;;AAGD;AACA;AAEA;AAEA;AAEA;EACC;EACA;;AACA;EACC;EACA;;;AAIF;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAKA;EACA;EACA;;AANA;EACC;EACA;;AAKD;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;;;AAKH;EACC;;;AAIA;AAAA;EAGC;;;AAIF;EACC;EACA;EACA;;AAEA;EACC;;;AAIF;EACC;EACA;;;AAGD;EACC;;;AAIA;EACC;;;AAKD;EACC;;;AAKD;EACC;;;AAKD;EACC;;;AAIF;EACC;;;AAGD;EACC;EACA;EACA;EACA;;AACA;EACC;;;AAIF;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EAGC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAED;EACC;;AAEA;EACC;;AAED;EACC;;AAGF;EACC;;AAID;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;;AAGA;EACC;;AAGD;AAAA;AAAA;EAGC;EACA;EACA;;AAGD;AAAA;EAEC;EACA;;;AAMJ;EACC;EACA;;;AAID;AACA;EACC;EACA;EACA;EACA;AAwBA;;AAtBA;EACC;;AAGD;AAAA;AAAA;EAGC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAIF;EACC;;AAGA;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;;AAGF;EACC;;AAGA;AAAA;AAAA;EAIC;EACA;EACA;;AAGD;EACC;;AAGD;EACC;;;AAMJ;AAGC;AAAA;EACC;EACA;EACA;;AACA;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;AACA;EACC;EACA;EACA;AA0BA;;AAxBA;EACC;EACA;EACA;;AAEA;EACC;EACA;EACA;;AAGA;EACC;;AAED;EACC;;AAED;EACC;EACA;;AAMH;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEC;;AAKF;EACC;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;;AAGD;EACC;EACA;EACA;;AAGD;EACC;EACA;;AACA;EACC;EACA;;AAMH;EACC;EACA;EACA;EACA;AACA;AACA;EACA;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAED;AACC;EACA;EACA;;AAEC;EACC;EACA;;AACA;EACC;EACA;;AAIH;EACC;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;AAED;AAAA;AAAA;EAGC;;AAED;AAAA;EAEC;;AAGD;EACC;EACA;;AAED;EACC;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AACA;EACC;;AACA;EACC;EACA;EACA;;AAED;EACC;;AAIH;EACC;;AAED;EACC;;AAED;EAIC;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA,SAhBS;EAiBT;EACA;EACA;;AAGA;EACC;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA,aA/BU;EAgCV;;AACA;EACC;;AAGF;EACC;EACA;;AAED;EACC;;AAON;EACC;;;AAIF;EACC;;;AAGD;EACC;EACA;;;AAGD;AAGC;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AAGD;EAGC;;;AAKH;AACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AACA;AAAA;EAEC;;AAIF;AACC;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAEA;EACC;EACA;EACA;EACA;;AAKH;EACC;EACA;EACA;EACA;EACA;AA6CA;;AA3CA;EACC;;AAGD;EACC;EACA;EACA;;AAGD;EACC;EACA;;AAEA;EACC;EACA;;AAGD;AACC;EACA;EACA;EACA;EACA;;AAED;EACC;;AAIF;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;;AAKF;EACC;EACA;;AAED;EACC;;;AAMH;EACC;EACA;EACA;;;AAGD;AAEA;EACC;;;AAGD;AAGC;EACC;EACA;;AAED;EACC;EACA;EACA;EACA;;AAED;EACC;EACA;;AACA;EACC;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;AAGF;EACC;EACA;;;AAIF;AACA;EACC;;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AACA;EACC;;AAIA;EACC;;AAIF;EACC;EACA;;AACA;EACC;EACA;EACA;EACA;;AACA;EACC;;AAGF;EACC;;AAIH;EACC;;AACA;EACC;;AAGF;AAAA;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAEA;AAAA;AAAA;EAGC;;AAGF;EACC;EACA;;AAID;EACC;EACA;;AAEA;EACC;;AAGF;EACC;;AAEA;AAAA;AAAA;AAAA;AAAA;EAEC;;;AAKH;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;;AAIF;AAGC;EACC;EACA;;AAED;EACC;;;AAIF;AACA;EACC;;AAID;AAEA;EACC;EACA;EACA;EACA","file":"styles.css"} |
@@ -20,7 +20,6 @@ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pr | |||
margin: 0; | |||
padding: 0; | |||
border: 0; | |||
outline: 0; | |||
font-weight: inherit; | |||
font-size: 100%; | |||
font-family: inherit; | |||
@@ -30,6 +29,23 @@ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pr | |||
scrollbar-width: thin; | |||
} | |||
.js-focus-visible :focus:not(.focus-visible) { | |||
outline: none; | |||
} | |||
:focus-visible { | |||
box-shadow: 0 0 0 2px var(--color-primary); | |||
outline: none; | |||
} | |||
/** Let vue apps handle the focus themselves */ | |||
#content-vue :focus-visible, | |||
#app-navigation-vue :focus-visible, | |||
.vue :focus-visible { | |||
box-shadow: none; | |||
outline: none; | |||
} | |||
html, body { | |||
height: 100%; | |||
} | |||
@@ -294,6 +310,11 @@ body { | |||
#show:checked + label, #dbpassword:checked + label, #personal-show:checked + label { | |||
opacity: .8; | |||
} | |||
#show:focus-visible + label, #dbpassword-toggle:focus-visible + label, #personal-show:focus-visible + label { | |||
box-shadow: var(--color-primary) 0 0 0 2px; | |||
opacity: 1; | |||
border-radius: 9999px; | |||
} | |||
#show + label, #dbpassword + label, #personal-show + label { | |||
position: absolute !important; | |||
@@ -975,12 +996,18 @@ span.ui-icon { | |||
#contactsmenu { | |||
.menutoggle { | |||
background-size: 20px 20px; | |||
padding: 14px; | |||
cursor: pointer; | |||
// Force white | |||
background-image: var(--original-icon-contacts-white); | |||
filter: var(--primary-invert-if-bright); | |||
&:before { | |||
background-size: 20px 20px; | |||
background-repeat: no-repeat; | |||
background-position-x: 3px; | |||
background-position-y: 4px; | |||
padding: 14px; | |||
content: ' '; | |||
// Force white | |||
background-image: var(--original-icon-contacts-white); | |||
filter: var(--primary-invert-if-bright); | |||
} | |||
&:hover, | |||
&:focus, |
@@ -24,3 +24,4 @@ | |||
import './console' | |||
import './closest' | |||
import './windows-phone' | |||
import 'focus-visible' |
@@ -174,8 +174,8 @@ export default { | |||
align-items: center; | |||
justify-content: center; | |||
width: 50px; | |||
height: 100%; | |||
margin: 0; | |||
height: 44px; | |||
margin: 2px 0; | |||
padding: 0; | |||
cursor: pointer; | |||
opacity: .6; | |||
@@ -188,6 +188,10 @@ export default { | |||
opacity: 1; | |||
} | |||
&__trigger:focus-visible { | |||
outline: none; | |||
} | |||
&__wrapper { | |||
position: fixed; | |||
z-index: 2000; |
@@ -61,7 +61,7 @@ $getUserAvatar = static function (int $size) use ($_): string { | |||
id="nextcloud"> | |||
<div class="logo logo-icon"> | |||
<h1 class="hidden-visually"> | |||
<?php p($theme->getName()); ?> <?php p(!empty($_['application'])?$_['application']: $l->t('Apps')); ?> | |||
<?php p($l->t('%s\'s homepage', [$theme->getName()])); ?> | |||
</h1> | |||
</div> | |||
</a> | |||
@@ -136,7 +136,7 @@ $getUserAvatar = static function (int $size) use ($_): string { | |||
<div id="notifications"></div> | |||
<div id="unified-search"></div> | |||
<div id="contactsmenu"> | |||
<div class="icon-contacts menutoggle" tabindex="0" role="button" | |||
<div class="menutoggle" tabindex="0" role="button" | |||
aria-haspopup="true" aria-controls="contactsmenu-menu" aria-expanded="false"> | |||
<span class="hidden-visually"><?php p($l->t('Contacts'));?></span> | |||
</div> |
@@ -61,6 +61,7 @@ | |||
"debounce": "^1.2.1", | |||
"dompurify": "^2.3.6", | |||
"escape-html": "^1.0.3", | |||
"focus-visible": "^5.2.0", | |||
"handlebars": "^4.7.7", | |||
"ical.js": "^1.4.0", | |||
"jquery": "~3.6", |