franzz/ugc
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Optimizing mobile layout (missing files)

Browse Source
This commit is contained in:
Franzz
2015-09-05 01:03:23 +02:00
parent 725c72a6aa
commit b03c05100f
2 changed files with 26 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
style/ugc.css.map
View File

File diff suppressed because one or more lines are too long

41
style/ugc.scss
View File

@@ -43,16 +43,14 @@ select {
border:none; border:none;
background:transparent; background:transparent;
color:#666; color:#666;
padding-right:1.5em;
}
select + .fa-down {
margin-left:-1em;
color:#666;
} }
/* Common Classes */ /* Common Classes */
.hide {
display:none;
}
.inline { .inline {
margin-right:0.5em; margin-right:0.5em;
} }
@@ -72,7 +70,7 @@ select + .fa-down {
padding:0.2em; padding:0.2em;
} }
.button.no_bg { .button.no_bg {
background:inherit; background:none;
color:#666; color:#666;
} }
.button.no_bg:hover, .button.no_bg.clicked { .button.no_bg:hover, .button.no_bg.clicked {
@@ -185,9 +183,11 @@ main {
.film { .film {
position:relative; position:relative;
display: inline-block;
background:white; background:white;
margin-bottom:1em; margin-bottom:1em;
overflow: hidden; overflow: hidden;
width:100%;
-webkit-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5); -webkit-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5);
-moz-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5); -moz-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5);
box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5); box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5);
@@ -197,6 +197,10 @@ main {
} }
.film * {
transform: translate(0px, 0px);
}
.film img.bg { .film img.bg {
position:absolute; position:absolute;
top:50%; top:50%;
@@ -204,36 +208,41 @@ main {
left:$poster_size; left:$poster_size;
right:0; right:0;
bottom:0; bottom:0;
width:calc(100% - #{$poster_size});
opacity:0.2; opacity:0.2;
width:calc(100% - #{$poster_size});
}
.film .poster-container {
display: inline-block;
} }
.film img.poster { .film img.poster {
width:$poster_size; width:$poster_size;
display: block;
z-index:2; z-index:2;
vertical-align: top;
} }
.film .info { .film .info {
z-index:2; z-index:2;
position:absolute; display: inline-block;
top:0; vertical-align:top;
left:$poster_size; padding:1em;
padding-left:1em; width: calc(100% - 2em - #{$poster_size});
width: calc(100% - 1em - #{$poster_size});
} }
.film p { .film p {
margin:0.5em 0; margin:0.5em 0;
} }
.film .title {
margin-top:0;
}
.film .title a.name { .film .title a.name {
font-weight: bold; font-weight: bold;
} }
.film .title .edito { .film .edito {
font-style: italic; font-style: italic;
margin-left:1em;
color:#777; color:#777;
} }