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

new film bg

Browse Source
This commit is contained in:
Franzz
2015-08-17 22:22:08 +02:00
parent 5b300d8eb3
commit 05a7a0cd28
3 changed files with 39 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
masks/index.html
View File

@@ -25,10 +25,8 @@
</script>
</head>
<body>
<header><!-- <i class="fa fa-icon fa-date"></i> --><time id="date"></time></header>
<main>
<div id="buffer"><i class="fa fa-spinner fa-spin"></i></div>
</main>
<header><div class="title"><time id="date"></time></div></header>
<main><i id="buffer" class="fa fa-spinner fa-spin"></i></main>
<div id="feedback">
<h1><i class="fa fa-icon fa-feedback"></i>Filtered films</h1>
<div id="feed_content"></div>

2
script/film.js
View File

@@ -90,7 +90,7 @@ function Film()
this._anchor = $('<div>', {'class':'film', 'id':'film_'+this.getRank()})
.data('rank', this.getRank())
.data('id', this.id())
//.append($('<img>', {'class':'bg', 'src':this.poster()}))
.append($('<img>', {'class':'bg', 'src':this.poster()}))
.append($('<img>', {'class':'poster', 'src':this.poster()}))
.append($('<div>', {'class':'info'})
.append($('<p>', {'class':'title'})

53
style/ugc.css
View File

@@ -7,14 +7,14 @@ body {
padding:1em;
font-family: 'Open Sans', sans-serif;
font-size: 1em;
color:#333;
background:#DDD;
color:#222;
background:white;
min-width: 30em;
}
a {
text-decoration: none;
color:#333;
color:#222;
}
a:hover {
color:#08288B;
@@ -62,12 +62,22 @@ h1 {
/* Section - Header */
header {
padding:1em 0 1em calc(113px + 0.5em);
margin:0;
visibility:hidden;
text-align: center;
}
header .title {
display:inline-block;
padding-left:113px;
background:url(../images/logo_ugc.png) 0 50% no-repeat;
margin:0 0 0 0.5em;
}
header .title time {
display:inline-block;
font-size: 2em;
color:#08288B;
visibility:hidden;
padding:1.5em 0 1.5em 0.75em;
}
/* Section - Main */
@@ -97,21 +107,35 @@ main {
position:relative;
background:white;
margin-bottom:1em;
overflow: hidden;
-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);
box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5);
}
.film:nth-child(even) {
}
.film .bg {
.film img.bg {
position:absolute;
width:1000%;
opacity:0.3;
z-index: -1;
display:none;
top:50%;
margin-top:-25%;
left:152px;
right:0;
bottom:0;
width:calc(100% - 152px);
opacity:0.25;
}
.film img.poster {
width:152px;
display: block;
z-index:2;
}
.film .info {
z-index:2;
position:absolute;
top:0;
left:152px;
@@ -130,12 +154,7 @@ main {
.film .title .edito {
font-style: italic;
margin-left:1em;
color:#999;
}
.film img.poster {
width:152px;
display: block;
color:#777;
}
.film .trailer {