Spythere/stacjownik
1
0
Fork 0
mirror of https://github.com/Spythere/stacjownik.git synced 2026-05-03 05:18:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore(scenery): improved thumbnails toggle button appearance

Browse Source
This commit is contained in:
Spythere
2026-03-21 19:24:38 +01:00
parent 966b36e39f
commit d643259102
1 changed files with 13 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/SceneryView/SceneryTimetable/SceneryTimetableList.vue
+13 -3
View File
@@ -244,13 +244,15 @@
<img src="/images/icon-tablice.ico" alt="icon-tablice" /> <img src="/images/icon-tablice.ico" alt="icon-tablice" />
</a> </a>
<div class="list-divider"></div>
<button <button
class="thumbnails-btn" class="thumbnails-btn"
data-tooltip-type="HtmlTooltip" data-tooltip-type="HtmlTooltip"
:data-tooltip-content="`<b>${$t(`scenery.btn-${showStockThumbnails ? 'show' : 'hide'}-timetable-thumbnails`)}</b>`" :data-tooltip-content="`<b>${$t(`scenery.btn-${showStockThumbnails ? 'show' : 'hide'}-timetable-thumbnails`)}</b>`"
@click="toggleThumbnails" @click="toggleThumbnails"
> >
<i class="fa-solid" :class="`${showStockThumbnails ? 'fa-eye' : 'fa-eye-slash'}`"></i> <i class="fa-solid" :class="`${showStockThumbnails ? 'fa-expand' : 'fa-compress'}`"></i>
</button> </button>
</div> </div>
</div> </div>
@@ -376,7 +378,7 @@ function toggleThumbnails() {
.scenery-timetable-list { .scenery-timetable-list {
display: grid; display: grid;
grid-template-rows: auto 1fr auto; grid-template-rows: auto 1fr 40px;
overflow: hidden; overflow: hidden;
} }
@@ -534,14 +536,22 @@ function toggleThumbnails() {
gap: 0.5em; gap: 0.5em;
margin-top: 0.5em; margin-top: 0.5em;
.list-divider {
height: 80%;
width: 3px;
background-color: #6b6b6b;
}
img { img {
width: 25px; width: 25px;
height: 25px;
vertical-align: middle; vertical-align: middle;
} }
.thumbnails-btn { .thumbnails-btn {
width: 25px; width: 25px;
font-size: 1.2em; height: 25px;
font-size: 25px;
} }
} }