change source headings

This commit is contained in:
James Hawkins 2021-07-22 21:11:53 +01:00
parent 98d076f4e9
commit ffabfa4866
5 changed files with 30 additions and 11 deletions

View File

@ -24,7 +24,6 @@ export function MovieRow(props) {
<span className="year">({props.year})</span>
</div>
<div className="watch">
<span className="attribute">{props.source}</span>
<p>Watch {props.type}</p>
<Arrow/>
</div>

View File

@ -22,6 +22,8 @@
--choice: #2E2F37;
--choice-hover: #45464D;
--choice-active: #45464D;
--source-headings: #5b5c63;
}
/* @media (prefers-color-scheme: light) {
:root {

View File

@ -35,7 +35,7 @@ async function findContent(searchTerm, type) {
if (results.length > 1) {
return { options: results };
} else {
return { options: [ { ...results[0], source: 'gomostream' } ] }
return { options: [ results[0] ] }
}
} catch (err) {
console.error(err);

View File

@ -40,3 +40,11 @@
.topRightCredits a:hover .arrow {
transform: translateY(.1rem) translateX(.2rem);
}
p.source {
text-transform: uppercase;
font-weight: bold;
color: var(--source-headings);
font-size: 0.8em;
margin-top: 2rem;
}

View File

@ -128,7 +128,7 @@ export function SearchView() {
noWrap={true}
selected={type}
/>
<InputBox placeholder={ type === "movie" ? "Hamilton" : "Atypical" } onSubmit={(str) => searchMovie(str, type)} />
<InputBox placeholder={type === "movie" ? "Hamilton" : "Atypical"} onSubmit={(str) => searchMovie(str, type)} />
<Progress show={progress > 0} failed={failed} progress={progress} steps={maxSteps} text={text} />
</Card>
@ -136,15 +136,25 @@ export function SearchView() {
<Title size="medium">
Whoops, there are a few {type}s like that
</Title>
{options?.map((v, i) => (
<MovieRow key={i} title={v.title} slug={v.slug} type={v.type} year={v.year} source={v.source} onClick={() => {
setShowingOptions(false)
getStream(v.title, v.slug, v.type, v.source)
}}/>
))}
{ Object.entries(options.reduce((a, v) => {
if (!a[v.source]) a[v.source] = []
a[v.source].push(v)
return a;
}, {})).map(v => (
<div key={v[0]}>
<p className="source">{v[0]}</p>
{v[1].map((v, i) => (
<MovieRow key={i} title={v.title} slug={v.slug} type={v.type} year={v.year} source={v.source} onClick={() => {
setShowingOptions(false)
getStream(v.title, v.slug, v.type, v.source)
}} />
))}
</div>
))
}
</Card>
<div className="topRightCredits">
<a href="https://github.com/JamesHawkinss/movie-web" target="_blank" rel="noreferrer">Check it out on GitHub <Arrow/></a>
<a href="https://github.com/JamesHawkinss/movie-web" target="_blank" rel="noreferrer">Check it out on GitHub <Arrow /></a>
</div>
</div>
)