Spotify/top-lists
0
0
Fork 0
Code Issues Activity

Add a character counter to the title

Browse source
This commit is contained in:
Oliver-Akins 2020-08-15 15:26:58 -06:00
parent 119f8c7447
commit 6a714f1a2a
1 changed files with 15 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/components/modals/PlaylistExport.vue
View file

@ -16,6 +16,9 @@
type="text" type="text"
name="Playlist Name" name="Playlist Name"
> >
<span class="char_counter">
{{ name.length }}/100
</span>
</div> </div>
<div class="input-row"> <div class="input-row">
<textarea-autosize <textarea-autosize
@ -185,14 +188,26 @@ div.modal-form {
display: flex; display: flex;
} }
input#playlist-name {
padding-right: 80px;
font-size: 16px;
}
.input-row { .input-row {
justify-content: space-evenly; justify-content: space-evenly;
margin-bottom: 10px; margin-bottom: 10px;
position: relative;
flex-wrap: wrap; flex-wrap: wrap;
display: flex; display: flex;
width: 100%; width: 100%;
} }
.char_counter {
position: absolute;
bottom: 15px;
right: 15px;
}
button { button {
margin: 10px; margin: 10px;
} }