diff --git a/src/renderer/components/watch-video-info/watch-video-info.sass b/src/renderer/components/watch-video-info/watch-video-info.sass index 83b804ef..afdecd2a 100644 --- a/src/renderer/components/watch-video-info/watch-video-info.sass +++ b/src/renderer/components/watch-video-info/watch-video-info.sass @@ -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 diff --git a/src/renderer/components/watch-video-info/watch-video-info.vue b/src/renderer/components/watch-video-info/watch-video-info.vue index 722df7d9..30b5e917 100644 --- a/src/renderer/components/watch-video-info/watch-video-info.vue +++ b/src/renderer/components/watch-video-info/watch-video-info.vue @@ -48,8 +48,10 @@ class="likeBar" :style="{ background: `linear-gradient(to right, var(--accent-color) ${likePercentageRatio}%, #9E9E9E ${likePercentageRatio}%` }" > -
👍 {{ likeCount }}
-
{{ dislikeCount }} 👎
+
+ 👍 {{ likeCount }} + 👎 {{ dislikeCount }} +