Compare commits

...

7 Commits

Author SHA1 Message Date
Cadence Ember 5246a74115
Remove rating/sentiment bar
There are no more dislikes and there is no more ratio bar.
2021-12-16 13:30:13 +13:00
Cadence Ember 893c22aded
Change dropdown marker to be more visible
The colour now contrasts more and the outline is reduced so that less
space is hinted in the middle of the arrow.

References: https://todo.sr.ht/~cadence/tube/46
2021-12-16 12:56:05 +13:00
Cadence Ember 4bd832e37d
Make link colour a little brighter
References: https://todo.sr.ht/~cadence/tube/46
2021-12-16 12:48:56 +13:00
Cadence Ember bec802fad5
Change input placeholder and border colour
References: https://todo.sr.ht/~cadence/tube/46
2021-12-16 12:47:30 +13:00
Cadence Ember e97d1b958e
Use h1 for channel title on channel page
References: https://todo.sr.ht/~cadence/tube/46
2021-12-16 12:29:29 +13:00
Cadence Ember 0dfa8ca2b6
Add quality label on video page, move main element 2021-12-16 12:16:03 +13:00
Cadence Ember 5a5901db7d
Add aria-label to search inputs
References: https://todo.sr.ht/~cadence/tube/46
2021-12-16 12:02:06 +13:00
9 changed files with 17 additions and 17 deletions

View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 5.821 2.117" height="8" width="22"><path d="M1.587.53l.53.528.529-.529h.264v.265l-.793.793-.794-.793V.529z" fill="#bbb" paint-order="markers stroke fill"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="8" viewBox="0 0 5.821 2.117"><path d="M1.269.53l.767.793h.161L2.964.53h.211v.265L2.117 1.852 1.058.794V.529z" fill="#d7d7d7" paint-order="markers stroke fill"/></svg>

Before

Width:  |  Height:  |  Size: 214 B

After

Width:  |  Height:  |  Size: 225 B

View File

@ -21,7 +21,7 @@ block content
.logo
img(src=thumbnail.url width=thumbnail.width height=thumbnail.height alt="").thumbnail-image
.about
.name= data.author
h1.name= data.author
.subscribers= data.second__subCountText
+subscribe_button(data.authorId, subscribed, `/channel/${data.authorId}`).subscribe-button.base-border-look
.description!= data.descriptionHtml

View File

@ -11,5 +11,5 @@ block content
p You're in control. Watch things your way.
p Go on. What do you want to watch?
form(method="get" action="/search").encouraging-search-form
input(type="text" name="q" placeholder="I'd like to watch..." autocomplete="off" autofocus=!mobile).search.base-border-look
input(type="text" name="q" placeholder="I'd like to watch..." aria-label="Search a video" autocomplete="off" autofocus=!mobile).search.base-border-look
p: a(href="/cant-think") ...can't think of anything?

View File

@ -23,7 +23,7 @@ html
image(href=getStaticURL("html", "/static/images/settings.svg") alt="Settings.").icon
title Settings
form(method="get" action="/search").search-form
input(type="text" placeholder="Search" name="q" autocomplete="off" value=query).search
input(type="text" placeholder="Search" aria-label="Search a video" name="q" autocomplete="off" value=query).search
div
block content

View File

@ -20,11 +20,11 @@ block content
script(type="module" src=getStaticURL("html", "/static/js/continuous.js"))
noscript
meta(http-equiv="refresh" content=`${video.lengthSeconds+5};url=/watch?v=${first.videoId}&continuous=1&session-watched=${sessionWatchedNext}`)
main.video-page(class={
.video-page(class={
"video-page--recommended-below": settings.recommended_mode === 1,
"video-page--recommended-hidden": settings.recommended_mode === 2
})
.main-video-section
main.main-video-section
.video-container
- const format = formats[0]
if format
@ -51,7 +51,6 @@ block content
- const month = new Intl.DateTimeFormat("en-US", {month: "short"}).format(date.getTime())
div= `Uploaded ${date.getUTCDate()} ${month} ${date.getUTCFullYear()}`
div= video.second__viewCountText
div(style=`--rating: ${video.rating*20}%`)#rating-bar.rating-bar
audio(preload="auto")#audio
#live-event-notice
@ -69,7 +68,7 @@ block content
.button-container
+subscribe_button(video.authorId, subscribed, `/watch?v=${video.videoId}`).border-look
//- button.border-look#theatre Theatre
select(autocomplete="off").border-look#quality-select
select(aria-label="Quality" autocomplete="off").border-look#quality-select
each f in formats
option(value=f.itag)= f.cloudtube__label
//-

View File

@ -31,6 +31,12 @@ input, select, button
button
cursor: pointer
::placeholder
color: #c4c4c4
opacity: 1
// focus section
:focus
outline: none

View File

@ -43,7 +43,9 @@
.name
font-size: 30px
font-weight: normal
color: c.$fg-bright
margin: 0
.subscribers
color: c.$fg-main

View File

@ -10,8 +10,8 @@ $fg-main: #ddd
$fg-dim: #bbb
$fg-warning: #fdca6d
$edge-grey: #808080
$edge-grey: #a0a0a0
$link: #72b4f6
$link: #8ac2f9
$power-deep: #c62727

View File

@ -68,13 +68,6 @@
align-items: flex-start
margin-left: 0px
.rating-bar
margin-top: 8px
width: 140px
height: 8px
border-radius: 3px
background: linear-gradient(to right, #1a1 var(--rating), #bbb var(--rating))
.continuous
display: flex
align-items: center