make buttons look kinda 3D
Hunter
Tuesday, October 28th, 2025 at 11:44 AM
72 min-height: 45px;
73 padding-left: 15px;
74 padding-right: 10px;
- padding-top: 8px;
- padding-bottom: 8px;
75 + padding-top: 9px;
76 + padding-bottom: 9px;
77 }
78
79 .playlist-item-content {
230
231 .control-button {
232 width: 120px;
- height: 42px;
233 + height: 45px;
234 background-size: contain;
235 background-repeat: no-repeat;
236 background-position: center;
238 cursor: pointer;
239 margin: 0 5px;
240 border-radius: 50%;
241 + background-color: var(--icee);
242 + box-shadow:
243 + inset -2px -2px 4px rgba(0, 0, 0, 0.3),
244 + inset 2px 2px 4px rgba(255, 255, 255, 0.4),
245 + 0 2px 4px rgba(0, 0, 0, 0.5),
246 + 0 4px 8px rgba(0, 0, 0, 0.3);
247 filter:
- drop-shadow(0 1px 2px rgba(0, 0, 0, 0.9))
- drop-shadow(0 3px 6px rgba(0, 0, 0, 0.6));
248 + drop-shadow(0 0 1px rgba(0, 0, 0, 0.8))
249 + drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.6))
250 + drop-shadow(-0.5px -0.5px 0 rgba(255, 255, 255, 0.2));
251 }
252
253 #playPause {
254 background-image: url('resources/play.png');
- background-position: 53% center;
255 + background-position: 52.5% center;
256 }
257
258 #playPause.pause {
262
263 #prev {
264 background-image: url('resources/prev.png');
- background-position: 44% center;
265 + background-position: 45% center;
266 }
267
268 #next {
269 background-image: url('resources/next.png');
- background-position: 56% center;
270 + background-position: 55% center;
271 }