ngn/safetwitch
1
0
Fork 0
Code Issues 1 Pull Requests 10 Actions Packages Projects Releases Wiki Activity

Improve mobile responsiveness

Browse Source
This commit is contained in:
dragongoose 2023-04-11 20:49:52 -04:00
parent 7739bc99f0
commit ab6c499cad
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/views/UserView.vue
View File

@ -87,7 +87,7 @@ export default {
<video-player :options="videoOptions"> </video-player> <video-player :options="videoOptions"> </video-player>
</div> </div>
<div class="w-full flex-wrap p-3"> <div class="w-full flex-wrap md:p-3">
<div class="inline-flex md:w-2/3"> <div class="inline-flex md:w-2/3">
<div class="w-20 h-20 relative"> <div class="w-20 h-20 relative">
<img <img
@ -103,11 +103,11 @@ export default {
</div> </div>
<div class="ml-3 content-between"> <div class="ml-3 content-between">
<h1 class="text-4xl font-bold">{{ data.username }}</h1> <h1 class="text-2xl md:text-4xl font-bold">{{ data.username }}</h1>
<h1 v-if="!data.stream" class="font-bold text-md self-end"> <h1 v-if="!data.stream" class="font-bold text-md self-end">
{{ data.followersAbbv }} Followers {{ data.followersAbbv }} Followers
</h1> </h1>
<div v-else class="w-[17rem]"> <div v-else class="w-[14rem] md:w-[17rem]">
<p class="text-sm font-bold text-gray-200 self-end"> <p class="text-sm font-bold text-gray-200 self-end">
{{ truncate(data.stream.title, 130) }} {{ truncate(data.stream.title, 130) }}
</p> </p>
@ -124,7 +124,7 @@ export default {
</p> </p>
</div> </div>
<div v-else class="w-full"> <div v-else class="w-full">
<ul class="text-xs font-bold md:text-right space-x-1 space-y-1 overflow-y-auto"> <ul class="text-xs font-bold text-left md:text-right space-x-1 space-y-1 overflow-y-auto">
<li <li
v-for="tag in data.stream.tags" v-for="tag in data.stream.tags"
:key="tag" :key="tag"
@ -136,7 +136,7 @@ export default {
</div> </div>
</div> </div>
<div class="pt-2 pl- inline-flex"> <div class="pt-2 inline-flex">
<follow-button :username="data.username"></follow-button> <follow-button :username="data.username"></follow-button>
<p class="align-baseline font-bold ml-3">{{ data.followersAbbv }} Followers</p> <p class="align-baseline font-bold ml-3">{{ data.followersAbbv }} Followers</p>
</div> </div>