fix: [Electron Demo] - update screenshots, and re-style the details element.

This commit is contained in:
syntaxbullet 2025-04-30 18:13:38 +02:00
parent 4ff62b8032
commit 93de5bce80
2 changed files with 35 additions and 3 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 30 KiB

@ -100,17 +100,21 @@ button, input[type="submit"] {
transition: background-color 0.2s ease;
color: var(--button-text);
}
button:hover, input[type="submit"]:hover {
background-color: var(--button-primary-hover);
}
button:active, input[type="submit"]:active {
background-color: var(--button-primary-active);
}
button:disabled, input[type="submit"]:disabled {
background-color: var(--button-primary-disabled);
cursor: not-allowed;
opacity: 0.3;
}
input[type="file"] {
display: none;
}
@ -139,9 +143,11 @@ button:focus, input[type="submit"]:focus, input[type="file"]:focus {
border-radius: 4px;
background-color: var(--white);
}
.file-upload input[type="file"] {
display: none;
}
.file-upload.drag-over {
border-color: var(--text-accent);
background-color: #e6f8ee;
@ -177,6 +183,7 @@ footer {
position: relative;
bottom: 0;
}
footer ul {
margin: 0;
padding: 0;
@ -186,6 +193,7 @@ footer ul {
gap: 1rem;
width: 100%;
}
footer li {
list-style: none;
}
@ -207,10 +215,8 @@ table {
padding: 1rem;
max-width: 900px;
border-collapse: collapse;
margin: 0 auto;
font-family: "Roboto", "Roboto Condensed", sans-serif;
overflow: hidden;
margin-bottom: 2rem;
}
table caption {
@ -250,7 +256,6 @@ table tbody tr:hover {
.sheetjs-sheet-name {
font-family: "Roboto Condensed", sans-serif;
color: var(--text-accent);
padding: 0.5rem;
font-weight: 600;
}
@ -259,9 +264,31 @@ table tbody tr:hover {
margin: 1rem auto;
width: 90%;
max-width: 900px;
cursor: pointer;
background-color: #eee;
border-radius: 4px;
}
details:focus-within {
outline: 3px solid var(--text-accent);
outline-offset: 2px;
box-shadow: 0 0 0 2px var(--text-accent);
}
a:focus {
outline: 3px solid var(--text-accent);
outline-offset: 2px;
box-shadow: 0 0 0 2px var(--text-accent);
}
summary:focus-within {
outline: none;
}
.sheetjs-tab-content {
cursor: pointer;
padding: 1rem;
}
/* =====================
File Status/Loaded/Unload
@ -272,6 +299,7 @@ table tbody tr:hover {
min-height: 1.5em;
transition: color 0.2s;
}
.file-loaded {
display: flex;
gap: 1rem;
@ -279,6 +307,7 @@ table tbody tr:hover {
justify-content: center;
margin-bottom: 1rem;
}
.unload-btn:hover {
background: var(--danger);
color: var(--white);
@ -296,6 +325,7 @@ table tbody tr:hover {
justify-content: center;
z-index: 10000;
}
.spinner {
border: 6px solid #f3f3f3;
border-top: 6px solid var(--text-accent);
@ -318,10 +348,12 @@ table tbody tr:hover {
padding: 0.25rem 0.5rem;
font-size: 0.9rem;
}
table caption {
font-size: 1rem;
padding: 0.25rem;
}
}