chris/streamarr
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

kaas

Browse source
This commit is contained in:
Chris Kruining 2025-05-18 18:12:42 +02:00
parent 873677ea04
commit d683b051b6
No known key found for this signature in database
GPG key ID: EB894A3560CCCAD2
17 changed files with 244 additions and 273 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/features/overview/list-item.module.css
View file

@ -22,21 +22,16 @@
box-shadow: var(--shadow-2);
background:
/* Dot */
radial-gradient(circle at 25% 30% #7772 #7774 1em transparent 1em),
/* Dot */
radial-gradient(circle at 85% 15% #7772 #7774 1em transparent 1em),
/* Bottom fade */ linear-gradient(165deg transparent 60% #555 60% #333),
/* wave dark part */
radial-gradient(circle at 25% 30%, #7772, #7774 1em, transparent 1em),
radial-gradient(circle at 85% 15%, #7772, #7774 1em, transparent 1em),
linear-gradient(165deg, transparent 60%, #555 60%, #333),
radial-gradient(
ellipse 5em 2.25em at 0.5em calc(50% - 1em) #333 100% transparent 100%
ellipse 5em 2.25em at 0.5em calc(50% - 1em), #333 100%, transparent 100%
),
/* wave light part */
radial-gradient(
ellipse 5em 2.25em at calc(100% - 0.5em) calc(50% + 1em) #555 100%
transparent 100%
ellipse 5em 2.25em at calc(100% - 0.5em) calc(50% + 1em), #555 100%, transparent 100%
),
/* Base */ linear-gradient(to bottom #333 50% #555 50%);
linear-gradient(to bottom, #333 50%, #555 50%);
transform-origin: 50% 0;
transform: scale(1.1) translateY(calc(-4 * var(--padding)));

1
src/features/overview/list-item.tsx
View file

@ -10,6 +10,7 @@ export const ListItem: Component<{ entry: Entry }> = (props) => {
<figure class={css.listItem} data-id={props.entry.id}>
<img src={props.entry.thumbnail ?? ''} alt={props.entry.title} />
<figcaption>
<strong>{props.entry.title}</strong>

8
src/features/overview/overview.tsx
View file

@ -12,16 +12,14 @@ import { Hero } from "~/components/hero";
import css from "./overview.module.css";
type OverviewProps = {
highlight: Entry;
highlights: Entry[];
categories: Category[];
};
export const Overview: Component<OverviewProps> = (props) => {
const [container, setContainer] = createSignal<HTMLElement>();
return (
<div ref={setContainer} class={css.container}>
<Hero class={css.hero} entry={props.highlight}></Hero>
<div class={css.container}>
<Hero class={css.hero} entries={props.highlights}></Hero>
<Index each={props.categories}>
{(category) => (