boiii/traxxx
1
0
Fork 0
forked from DebaucheryLibrarian/traxxx
Code Issues Pull Requests Projects Releases Wiki Activity

Improved tag view for mobile.

Browse Source
This commit is contained in:
ThePendulum
2020-01-09 01:59:30 +01:00
parent a0db2677ed
commit 01c98d7008
4 changed files with 299 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
public/css/style.css
View File

@@ -729,9 +729,9 @@
height: 3rem;
display: -webkit-box;
display: flex;
flex-shrink: 0;
-webkit-box-pack: center;
justify-content: center;
flex-shrink: 0;
border-bottom: solid 1px rgba(0, 0, 0, 0.1);
background: #222;
}
@@ -1167,6 +1167,39 @@
}
}
/* $primary: #ff886c; */
/* $logo-highlight: drop-shadow(1px 0 0 $highlight-weak) drop-shadow(-1px 0 0 $highlight-weak) drop-shadow(0 1px 0 $highlight-weak) drop-shadow(0 -1px 0 $highlight-weak); */
.photos[data-v-9d950ba8] {
background: #222;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
padding: 0 1rem;
overflow: hidden;
}
.photos.compact[data-v-9d950ba8] {
display: none;
padding: 0 1rem 1rem 1rem;
overflow-x: auto;
}
.photos.compact .photos-inner[data-v-9d950ba8] {
max-width: 100%;
display: -webkit-inline-box;
display: inline-flex;
}
.photos.compact .poster[data-v-9d950ba8],
.photos.compact .photo[data-v-9d950ba8] {
height: 10rem;
width: auto;
margin: 0 1rem 0 0;
}
.poster[data-v-9d950ba8],
.photo[data-v-9d950ba8] {
width: 100%;
margin: 0 0 .5rem 0;
}
/* $primary: #ff886c; */
/* $logo-highlight: drop-shadow(1px 0 0 $highlight-weak) drop-shadow(-1px 0 0 $highlight-weak) drop-shadow(0 1px 0 $highlight-weak) drop-shadow(0 -1px 0 $highlight-weak); */
.description a {
@@ -1182,27 +1215,68 @@
.tag[data-v-7f130e7f] {
display: -webkit-box;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
flex-direction: row;
-webkit-box-flex: 1;
flex-grow: 1;
-webkit-box-pack: stretch;
justify-content: stretch;
overflow: hidden;
}
.tag.nomedia[data-v-7f130e7f] {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
}
.tag.nomedia .sidebar[data-v-7f130e7f] {
display: none;
}
.tag.nomedia .header[data-v-7f130e7f] {
display: -webkit-box;
display: flex;
}
.content-inner[data-v-7f130e7f] {
padding: 0;
}
.header[data-v-7f130e7f] {
background: #222;
color: #fff;
display: none;
-webkit-box-pack: center;
justify-content: center;
padding: .5rem 1rem;
}
.header .title[data-v-7f130e7f] {
margin: 0 2rem 0 0;
}
.header .description[data-v-7f130e7f] {
padding: 0;
}
.sidebar[data-v-7f130e7f] {
background: #222;
color: #fff;
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
width: 25rem;
box-sizing: border-box;
padding: 1rem;
overflow: hidden;
}
.poster[data-v-7f130e7f] {
width: 100%;
.sidebar .title[data-v-7f130e7f] {
padding: 1rem;
}
.sidebar .description[data-v-7f130e7f] {
padding: 0 1rem;
margin: -1rem 0 0 0;
}
.sidebar.empty[data-v-7f130e7f] {
display: none;
}
.sidebar-content[data-v-7f130e7f] {
overflow-y: auto;
}
.title[data-v-7f130e7f] {
padding: 0;
margin: 1rem 0;
margin: 0;
flex-shrink: 0;
text-transform: capitalize;
}
.title .icon[data-v-7f130e7f] {
@@ -1211,12 +1285,29 @@
height: 1.25rem;
}
.description[data-v-7f130e7f] {
padding: 0;
margin: 0 0 1rem 0;
margin: 0;
line-height: 1.5;
}
.photo[data-v-7f130e7f] {
width: 100%;
.releases[data-v-7f130e7f] {
padding: 1rem;
}
@media (max-width: 1200px) {
.tag[data-v-7f130e7f] {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
}
.sidebar[data-v-7f130e7f] {
display: none;
}
.header[data-v-7f130e7f] {
display: -webkit-box;
display: flex;
}
.photos.compact[data-v-7f130e7f] {
display: -webkit-box;
display: flex;
}
}
/* $primary: #ff886c; */