Styling pass for scrollbars, fieldsets, and scroll shadows

This commit is contained in:
Carlos Fernandez 2026-05-29 05:41:22 -04:00
parent ddf4747310
commit 6ee4515c4a
42 changed files with 346 additions and 207 deletions

View file

@ -4,44 +4,7 @@
.application.sheet.daggerheart.actor.dh-style.character {
.tab.loadout {
.search-section {
display: flex;
align-items: center;
justify-content: space-between;
.search-bar {
position: relative;
color: light-dark(@dark-blue-50, @beige-50);
width: 80%;
padding-top: 5px;
input {
border-radius: 50px;
background: light-dark(@dark-blue-10, @golden-10);
border: none;
outline: 2px solid transparent;
transition: all 0.3s ease;
padding: 0 20px;
&:hover {
outline: 2px solid light-dark(@dark, @golden);
}
&::-webkit-search-cancel-button {
-webkit-appearance: none;
display: none;
}
}
.icon {
align-content: center;
height: 32px;
position: absolute;
right: 20px;
font-size: var(--font-size-16);
z-index: 1;
color: light-dark(@dark-blue-50, @beige-50);
}
}
padding-right: 14px;
.btn-toggle-view {
background: light-dark(@dark-blue-10, @dark-blue);
@ -90,8 +53,10 @@
gap: 10px;
height: 100%;
overflow-y: auto;
mask-image: linear-gradient(0deg, transparent 0%, black 10%, black 98%, transparent 100%);
padding: 20px 0;
scrollbar-gutter: stable;
margin-top: 20px;
padding-bottom: 4px;
.with-scroll-shadows();
}
}
}