akanealw/misode.github.io
1
0
Fork 0
mirror of https://github.com/misode/misode.github.io.git synced 2026-04-30 09:42:44 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Hide errors view by default

Browse Source
This commit is contained in:
Misode
2020-08-10 15:39:40 +02:00
parent 8f9bbd6519
commit 4a7b4124f2
3 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/app.ts
View File

@@ -313,11 +313,11 @@ Promise.all([
})
errorsToggle.addEventListener('click', evt => {
if (errorsViewEl.classList.contains('hidden')) {
errorsViewEl.classList.remove('hidden')
if (errorsViewEl.classList.contains('active')) {
errorsViewEl.classList.remove('active')
errorsToggle.classList.remove('toggled')
} else {
errorsViewEl.classList.add('hidden')
errorsViewEl.classList.add('active')
errorsToggle.classList.add('toggled')
}
})

4
src/index.html
View File

@@ -102,9 +102,9 @@
</div>
<div id="errors-view" class="errors">
<div class="error-list"></div>
<div id="errors-toggle" class="toggle toggled">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="24" height="24"><path fill-rule="evenodd" d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zm-.25-6.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z"></path></svg>
<div id="errors-toggle" class="toggle">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="32" height="32"><path fill-rule="evenodd" d="M12.78 6.22a.75.75 0 010 1.06l-4.25 4.25a.75.75 0 01-1.06 0L3.22 7.28a.75.75 0 011.06-1.06L8 9.94l3.72-3.72a.75.75 0 011.06 0z"></path></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="24" height="24"><path fill-rule="evenodd" d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zm-.25-6.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z"></path></svg>
</div>
</div>
</div>

8
src/styles/global.css
View File

@@ -303,7 +303,7 @@ body {
fill: var(--errors-text);
}
.errors.hidden .error-list {
.errors:not(.active) .error-list {
display: none;
}
@@ -318,7 +318,7 @@ body {
}
.errors .toggle {
padding: 2px;
padding: 6px;
width: 36px;
height: 36px;
align-self: flex-end;
@@ -326,8 +326,8 @@ body {
user-select: none;
}
.errors .toggle.toggled {
padding: 6px;
.errors.active .toggle {
padding: 2px;
}
.home {