add recommended tracks

This commit is contained in:
geoffrey45
2021-12-01 11:11:53 +03:00
parent 6ef31c4d82
commit 53b9ebdb60
11 changed files with 243 additions and 158 deletions
+9 -9
View File
@@ -25,36 +25,36 @@ export default {
<style>
.f-container {
margin-bottom: 1em;
margin-bottom: 1rem;
background: rgba(31, 30, 30, 0.521);
padding: 1em;
padding: 1rem;
}
#f-items {
display: flex;
flex-wrap: wrap;
border-top: 1px solid var(--seperator);
gap: 1em;
padding-top: 1em;
gap: 1rem;
padding-top: 1rem;
}
.f-container p {
text-transform: uppercase;
font-weight: normal;
color: rgba(255, 255, 255, 0.438);
margin-bottom: 1em;
margin-bottom: 1rem;
}
.f-container .f-item {
min-width: 15em;
min-height: 5em;
min-width: 14.4rem;
min-height: 5rem;
display: flex;
justify-content: center;
align-items: center;
position: relative;
background-image: url(../../assets/icons/folder.svg);
background-repeat: no-repeat;
background-position: 1em;
background-position: 1rem;
background-size: 10% 100%;
background-color: rgba(80, 80, 80, 0.247);
}
@@ -65,7 +65,7 @@ export default {
.f-container .f-item-text {
position: absolute;
left: 3em;
left: 3rem;
text-align: left;
overflow: hidden;
text-overflow: ellipsis;
+10 -10
View File
@@ -17,8 +17,8 @@ export default {};
<style>
.folder-top {
padding-bottom: 1em;
margin-bottom: 1em;
padding-bottom: 1rem;
margin-bottom: 1rem;
border-bottom: 1px solid var(--seperator);
}
@@ -27,12 +27,12 @@ export default {};
color: rgba(255, 255, 255, 0.438);
text-transform: uppercase;
display: flex;
align-items: center;
align-itrems: center;
}
.folder-top .fsearch {
width: 50%;
margin-right: 1em;
margin-right: 1rem;
}
.folder-top .fsearch div {
@@ -42,14 +42,14 @@ export default {};
}
.folder-top .fsearch input {
width: 30em;
width: 30rem;
border: none;
border-radius: .5em;
padding-left: 1em;
border-radius: .5rem;
padding-left: 1rem;
background-color: #4645456c;
color: rgba(255, 255, 255, 0.521);
font-size: 1em;
line-height: 3em;
font-size: 1rem;
line-height: 3rem;
outline: none;
}
@@ -63,6 +63,6 @@ export default {};
.folder-top .fsearch input:focus {
color: rgb(255, 255, 255);
outline: 0.1em solid #fafafa52;
outline: 0.1rem solid #fafafa52;
}
</style>
+8 -8
View File
@@ -87,22 +87,22 @@ export default {
}
.folder .table table td .album-art {
width: 3em;
height: 3em;
margin-right: 1em;
width: 3rem;
height: 3rem;
margin-right: 1rem;
background-color: #ccc;
background-image: url(../../assets/images/Jim_Reeves.png);
}
.folder .table .flex {
position: relative;
align-items: center;
align-itrems: center;
}
.folder .table .flex > div > span {
position: absolute;
bottom: 1.5em;
width: calc(100% - 6em);
bottom: 1.5rem;
width: calc(100% - 6rem);
}
td,
@@ -124,12 +124,12 @@ th {
}
.folder {
padding-bottom: 1em;
padding-bottom: 1rem;
}
td .artist {
color: #b1b1b1fd;
font-weight: lighter;
margin-right: 0.5em;
margin-right: 0.5rem;
}
</style>