js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 04:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix scroller styles; closes #1724 (#1785)

Browse Source
This commit is contained in:
Cory LaViska
2025-11-19 07:34:22 -05:00
committed by GitHub
parent 1429095eed
commit 200b02f023
2 changed files with 14 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/webawesome/docs/docs/resources/changelog.md
View File

@@ -15,6 +15,7 @@ Components with the <wa-badge variant="warning">Experimental</wa-badge> badge sh
- Fixed a bug in `<wa-slider>` that caused some touch devices to end up with the incorrect value [issue:1703] - Fixed a bug in `<wa-slider>` that caused some touch devices to end up with the incorrect value [issue:1703]
- Fixed a bug in `<wa-card>` that prevented some slots from being detected correctly [discuss:1450] - Fixed a bug in `<wa-card>` that prevented some slots from being detected correctly [discuss:1450]
- Fixed a z-index bug in `<wa-scroller>` styles [issue:1724]
- Fixed a bug in `<wa-icon>` that caused some icon libraries to render with the incorrect SVG fill [issue:1733] - Fixed a bug in `<wa-icon>` that caused some icon libraries to render with the incorrect SVG fill [issue:1733]
- Fixed a bug in `<wa-tree-item>` that caused the spinner to not show when lazy loading [issue:1678] - Fixed a bug in `<wa-tree-item>` that caused the spinner to not show when lazy loading [issue:1678]
- Fixed a bug in `<wa-dropdown>` that caused the browser to hang when cancelling the `wa-hide` event [issue:1483] - Fixed a bug in `<wa-dropdown>` that caused the browser to hang when cancelling the `wa-hide` event [issue:1483]

30
packages/webawesome/src/components/scroller/scroller.css
View File

@@ -53,6 +53,19 @@
overflow-y: auto; overflow-y: auto;
} }
#start-shadow,
#end-shadow {
z-index: 2;
}
#start-shadow {
opacity: var(--start-shadow-opacity);
}
#end-shadow {
opacity: var(--end-shadow-opacity);
}
/* Horizontal shadows */ /* Horizontal shadows */
:host([orientation='horizontal']) { :host([orientation='horizontal']) {
#start-shadow, #start-shadow,
@@ -64,14 +77,6 @@
pointer-events: none; pointer-events: none;
} }
#start-shadow {
opacity: var(--start-shadow-opacity);
}
#end-shadow {
opacity: var(--end-shadow-opacity);
}
#start-shadow { #start-shadow {
&:dir(ltr) { &:dir(ltr) {
left: 0; left: 0;
@@ -102,21 +107,12 @@
#start-shadow, #start-shadow,
#end-shadow { #end-shadow {
position: absolute; position: absolute;
z-index: 2;
right: 0; right: 0;
left: 0; left: 0;
height: var(--shadow-size); height: var(--shadow-size);
pointer-events: none; pointer-events: none;
} }
#start-shadow {
opacity: var(--start-shadow-opacity);
}
#end-shadow {
opacity: var(--end-shadow-opacity);
}
#start-shadow { #start-shadow {
top: 0; top: 0;
background: linear-gradient(to bottom, var(--shadow-color), transparent 100%); background: linear-gradient(to bottom, var(--shadow-color), transparent 100%);