webui: fixed width for speed info (#6739)

* webui: fixed width for speed info

* fix: match download icon-text gap with upload

* webui: move speed arrow to the right of the text
This commit is contained in:
Yat Ho 2024-05-26 02:32:01 +08:00 committed by GitHub
parent 8bb49e3fdf
commit 381c17e0bb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 57 additions and 42 deletions

View File

@ -383,20 +383,30 @@ a {
> * { > * {
margin-right: 5px; margin-right: 5px;
} }
}
#speed-up-icon, .speed-container {
#speed-dn-icon { display: inherit;
fill: var(--color-fg-primary); align-items: inherit;
flex-direction: inherit;
svg { &:not(:nth-child(1 of #mainwin-statusbar .speed-container)) {
width: 20px; width: 100px;
}
} }
}
#speed-dn-label, #speed-up-icon,
#speed-up-label { #speed-dn-icon {
text-align: right; fill: var(--color-fg-primary);
svg {
width: 20px;
}
}
#speed-dn-label,
#speed-up-label {
text-align: right;
}
} }
/// TORRENT CONTAINER /// TORRENT CONTAINER

View File

@ -203,40 +203,45 @@
<input type="search" id="torrent-search" placeholder="Filter" /> <input type="search" id="torrent-search" placeholder="Filter" />
<span id="filter-count">&nbsp;</span> <span id="filter-count">&nbsp;</span>
<span class="flexible-space"></span> <span class="flexible-space"></span>
<div id="speed-dn-icon"> <div class="speed-container">
<svg <div id="speed-dn-label"></div>
xmlns="http://www.w3.org/2000/svg" <div id="speed-dn-icon">
width="32" <svg
height="32" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" width="32"
fill="none" height="32"
stroke="currentColor" viewBox="0 0 24 24"
stroke-width="2" fill="none"
stroke-linecap="round" stroke="currentColor"
stroke-linejoin="round" stroke-width="2"
class="feather feather-chevron-down" stroke-linecap="round"
> stroke-linejoin="round"
<polyline points="6 9 12 15 18 9"></polyline> class="feather feather-chevron-down"
</svg> >
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</div>
</div> </div>
<div id="speed-dn-label"></div> <div class="speed-container">
<div id="speed-up-icon"> <span class="flexible-space"></span>
<svg <div id="speed-up-label"></div>
xmlns="http://www.w3.org/2000/svg" <div id="speed-up-icon">
width="32" <svg
height="32" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" width="32"
fill="none" height="32"
stroke="currentColor" viewBox="0 0 24 24"
stroke-width="2" fill="none"
stroke-linecap="round" stroke="currentColor"
stroke-linejoin="round" stroke-width="2"
class="feather feather-chevron-up" stroke-linecap="round"
> stroke-linejoin="round"
<polyline points="18 15 12 9 6 15"></polyline> class="feather feather-chevron-up"
</svg> >
<polyline points="18 15 12 9 6 15"></polyline>
</svg>
</div>
</div> </div>
<div id="speed-up-label"></div>
</header> </header>
<main id="mainwin-workarea"> <main id="mainwin-workarea">