Right align like bar counters
This commit is contained in:
parent
274d5dbc86
commit
6cb99b2d2e
|
@ -39,10 +39,10 @@
|
|||
.likeSection
|
||||
margin-top: 16px
|
||||
font-size: 14px
|
||||
display: grid
|
||||
grid-template-columns: auto auto
|
||||
justify-content: space-between
|
||||
display: flex
|
||||
flex-direction: column
|
||||
margin-left: auto
|
||||
text-align: right
|
||||
max-width: 210px
|
||||
|
||||
@media screen and (max-width: 680px)
|
||||
|
@ -51,10 +51,11 @@
|
|||
.likeBar
|
||||
height: 8px
|
||||
border-radius: 4px
|
||||
background: red
|
||||
grid-column: 1 / 3
|
||||
margin-bottom: 4px
|
||||
|
||||
.likeCount
|
||||
margin-right: 6px
|
||||
|
||||
.videoOptions
|
||||
margin-top: 16px
|
||||
display: flex
|
||||
|
|
|
@ -48,8 +48,10 @@
|
|||
class="likeBar"
|
||||
:style="{ background: `linear-gradient(to right, var(--accent-color) ${likePercentageRatio}%, #9E9E9E ${likePercentageRatio}%` }"
|
||||
></div>
|
||||
<div class="likeCount">👍 {{ likeCount }}</div>
|
||||
<div class="dislikeCount">{{ dislikeCount }} 👎</div>
|
||||
<div>
|
||||
<span class="likeCount">👍 {{ likeCount }}</span>
|
||||
<span class="dislikeCount">👎 {{ dislikeCount }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="videoOptions">
|
||||
|
|
Loading…
Reference in New Issue