kavin/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-12-13 13:50:27 +05:30
Code Issues Projects Releases Wiki Activity

fix close button

Browse Source
This commit is contained in:
Bnyro 2022-09-08 22:56:24 +02:00
parent bece257c80
commit d525b6991f
3 changed files with 9 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/ModalComponent.vue
View File

@ -2,6 +2,7 @@
<div class="modal"> <div class="modal">
<div @click="handleClick"> <div @click="handleClick">
<div class="modal-container"> <div class="modal-container">
<button @click="$emit('close')"><font-awesome-icon icon="xmark" /></button>
<slot></slot> <slot></slot>
</div> </div>
</div> </div>
@ -41,6 +42,10 @@ export default {
} }
.modal-container { .modal-container {
@apply w-min m-auto px-8 bg-dark-700 p-6 rounded-xl min-w-[20vw]; @apply w-min m-auto px-8 bg-dark-700 p-6 rounded-xl min-w-[20vw] relative;
}
.modal-container > button {
@apply absolute right-8 top-6;
} }
</style> </style>

3
src/components/PlaylistAddModal.vue
View File

@ -1,9 +1,6 @@
<template> <template>
<ModalComponent> <ModalComponent>
<div class="flex">
<span class="text-2xl w-max inline-block" v-t="'actions.select_playlist'" /> <span class="text-2xl w-max inline-block" v-t="'actions.select_playlist'" />
<button class="ml-3" @click="$emit('close')"><font-awesome-icon icon="xmark" /></button>
</div>
<select class="select w-full mt-3" v-model="selectedPlaylist"> <select class="select w-full mt-3" v-model="selectedPlaylist">
<option v-for="playlist in playlists" :value="playlist.id" :key="playlist.id" v-text="playlist.name" /> <option v-for="playlist in playlists" :value="playlist.id" :key="playlist.id" v-text="playlist.name" />
</select> </select>

5
src/components/ShareModal.vue
View File

@ -1,9 +1,6 @@
<template> <template>
<ModalComponent> <ModalComponent>
<div class="flex">
<h2 v-t="'actions.share'" /> <h2 v-t="'actions.share'" />
<button class="ml-3" @click="$emit('close')"><font-awesome-icon icon="xmark" /></button>
</div>
<div class="flex justify-between mt-4"> <div class="flex justify-between mt-4">
<label v-t="'actions.with_timecode'" for="withTimeCode" /> <label v-t="'actions.with_timecode'" for="withTimeCode" />
<input id="withTimeCode" type="checkbox" v-model="withTimeCode" /> <input id="withTimeCode" type="checkbox" v-model="withTimeCode" />
@ -16,7 +13,7 @@
<label v-t="'actions.time_code'" /> <label v-t="'actions.time_code'" />
<input class="input w-12" type="text" v-model="timeStamp" /> <input class="input w-12" type="text" v-model="timeStamp" />
</div> </div>
<h3 class="mt-4" v-text="generatedLink" /> <a :href="generatedLink" target="_blank"><h3 class="mt-4" v-text="generatedLink" /></a>
<div class="flex justify-end mt-4"> <div class="flex justify-end mt-4">
<button class="btn" v-t="'actions.follow_link'" @click="followLink()" /> <button class="btn" v-t="'actions.follow_link'" @click="followLink()" />
<button class="btn ml-3" v-t="'actions.copy_link'" @click="copyLink()" /> <button class="btn ml-3" v-t="'actions.copy_link'" @click="copyLink()" />