wip: fixed sidebar style; style: removed foreground inverted variable; style: removed icon hover variable; style: removed panels text variable; wip: sidebar link active style

This commit is contained in:
Roberto Tonino
2020-10-16 23:56:53 +02:00
parent 09f3b2138d
commit 301c6f0ebe
9 changed files with 23 additions and 73 deletions

View File

@@ -1,7 +1,7 @@
<template>
<aside
id="sidebar"
class="top-0 left-0 flex flex-col w-12 h-full absoluteZ bg-panels-bg text-panels-text"
class="top-0 left-0 flex flex-col w-12 h-full absoluteZ bg-panels-bg text-foreground"
role="navigation"
aria-label="sidebar"
>
@@ -15,13 +15,10 @@
:aria-label="link.ariaLabel"
:to="{ name: link.routerName }"
@click.native="activeTablink = link.name"
style="transition: all 500ms; color: inherit"
>
<i class="p-2 text-3xl transition-all duration-500 material-icons side_icon">{{ link.icon }}</i>
<span
class="ml-5 overflow-hidden capitalize whitespace-no-wrap transition-all duration-75 ease-in-out delay-200 opacity-0 main_tablinks_text"
style="letter-spacing: 1.3px"
>
<!-- style="color: inherit" -->
<i class="p-2 text-3xl material-icons side_icon">{{ link.icon }}</i>
<span class="ml-5 overflow-hidden capitalize whitespace-no-wrap main_tablinks_text" style="letter-spacing: 1.3px">
{{ $t(link.label) }}
</span>
<span

View File

@@ -1,7 +1,7 @@
<template>
<div
id="download_tab_container"
class="block tab_hidden bg-panels-bg text-panels-text"
class="block tab_hidden bg-panels-bg text-foreground"
@transitionend="$refs.container.style.transition = ''"
ref="container"
:data-label="$t('downloads')"

View File

@@ -224,7 +224,7 @@ export default {
left: 0;
min-width: 100px;
border-radius: 7px;
background: var(--foreground-inverted);
background: var(--secondary-background);
box-shadow: 4px 10px 18px 0px hsla(0, 0%, 0%, 0.15);
overflow: hidden;
z-index: 10000;