Styling
This commit is contained in:
1 parent
d77cfb3e69
commit
b8b6024592
4 files changed
+51
-48
No files matched your search
+1
@@ -0,0 +1 @@
|
||||
.search_form{display:inline-block;vertical-align:middle;text-align:right;-webkit-transition:all .4s cubic-bezier(0.9,0,.1,1);transition:all .4s cubic-bezier(0.9,0,.1,1);z-index:20;border:0 solid transparent;border-bottom-width:4px}.search_form:hover{border-color:#047792}@media all and (max-width:480px){.search_form{right:44px}}.search_form.focused,.search_form.shown{border-color:#04bce6}.search_form .input{height:100%;overflow:hidden;width:45px;-webkit-transition:all .4s cubic-bezier(0.9,0,.1,1);transition:all .4s cubic-bezier(0.9,0,.1,1)}.search_form.focused .input,.search_form.shown .input{width:380px;background:#4e5969}.search_form .input input{-webkit-border-radius:0;border-radius:0;display:block;border:0;background:0 0;color:#FFF;font-size:25px;height:100%;width:100%;opacity:0;padding:0 40px 0 10px;-webkit-transition:all .4s ease-in-out .2s;transition:all .4s ease-in-out .2s}.search_form.focused .input input,.search_form.shown .input input{opacity:1}.search_form input::-ms-clear{width:0;height:0}@media all and (max-width:480px){.search_form .input input{font-size:15px}.search_form.focused .input,.search_form.shown .input{width:277px}}.search_form .input a{position:absolute;top:0;right:0;width:44px;height:100%;cursor:pointer;vertical-align:middle;text-align:center;line-height:66px;font-size:15px;color:#FFF}.search_form .input a:after{content:"\e03e"}.search_form.shown.filled .input a:after{content:"\e04e"}@media all and (max-width:480px){.search_form .input a{line-height:44px}}.search_form .results_container{text-align:left;position:absolute;background:#5c697b;margin:4px 0 0;width:470px;min-height:50px;-webkit-box-shadow:0 20px 20px -10px rgba(0,0,0,.55);box-shadow:0 20px 20px -10px rgba(0,0,0,.55);display:none}@media all and (max-width:480px){.search_form .results_container{width:320px}}.search_form.focused.filled .results_container,.search_form.shown.filled .results_container{display:block}.search_form .results{max-height:570px;overflow-x:hidden}.media_result{overflow:hidden;height:50px;position:relative}.media_result .options{position:absolute;height:100%;top:0;left:30px;right:0;padding:13px;border:1px solid transparent;border-width:1px 0;-webkit-border-radius:0;border-radius:0;-webkit-box-shadow:inset 0 1px 8px rgba(0,0,0,.25);box-shadow:inset 0 1px 8px rgba(0,0,0,.25)}.media_result .options>.in_library_wanted{margin-top:-7px}.media_result .options>div{border:0}.media_result .options .thumbnail{vertical-align:middle}.media_result .options select{vertical-align:middle;display:inline-block;margin-right:10px}.media_result .options select[name=title]{width:170px}.media_result .options select[name=profile]{width:90px}.media_result .options select[name=category]{width:80px}@media all and (max-width:480px){.media_result .options select[name=title]{width:90px}.media_result .options select[name=category],.media_result .options select[name=profile]{width:50px}}.media_result .options .button{vertical-align:middle;display:inline-block}.media_result .options .message{height:100%;font-size:20px;color:#fff;line-height:20px}.media_result .data{position:absolute;height:100%;top:0;left:30px;right:0;background:#5c697b;cursor:pointer;border-top:1px solid rgba(255,255,255,.08);-webkit-transition:all .4s cubic-bezier(0.9,0,.1,1);transition:all .4s cubic-bezier(0.9,0,.1,1)}.media_result .data.open{left:100%!important}.media_result:last-child .data{border-bottom:0}.media_result .in_library,.media_result .in_wanted{position:absolute;bottom:2px;left:14px;font-size:11px}.media_result .thumbnail{width:34px;min-height:100%;display:block;margin:0;vertical-align:top}.media_result .info{position:absolute;top:20%;left:15px;right:7px;vertical-align:middle}.media_result .info h2{margin:0;font-weight:400;font-size:20px;padding:0}.search_form .info h2{position:absolute;width:100%}.media_result .info h2 .title{display:block;margin:0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.search_form .info h2 .title{position:absolute;width:88%}.media_result .info h2 .year{padding:0 5px;text-align:center;position:absolute;width:12%;right:0}@media all and (max-width:480px){.search_form .info h2 .year{font-size:12px;margin-top:7px}}.media_result .mask,.search_form .mask{position:absolute;height:100%;width:100%;left:0;top:0}.movies{padding:10px 0 20px;position:relative;z-index:3;width:100%}.movies>div{clear:both}.movies>div .message{display:block;padding:20px;font-size:20px;color:#fff;text-align:center}.movies>div .message a{padding:20px;display:block}.movies.thumbs_list>div:not(.description){margin-right:-4px}.movies .loading{display:block;padding:20px 0 0;width:100%;z-index:3;-webkit-transition:all .4s cubic-bezier(0.9,0,.1,1);transition:all .4s cubic-bezier(0.9,0,.1,1);height:40px;opacity:1;position:absolute;text-align:center}.movies .loading.hide{height:0;padding:0;opacity:0;margin-top:-20px;overflow:hidden}.movies .loading .spinner{display:inline-block}.movies .loading .message{margin:0 20px}.movies h2{margin-bottom:20px}@media all Line truncated
|
||||
@@ -1,23 +1,22 @@
|
||||
|
||||
/* Fonts */
|
||||
@font-face {
|
||||
font-family: 'Elusive-Icons';
|
||||
src:url('../static/fonts/Elusive-Icons.eot');
|
||||
src:url('../static/fonts/Elusive-Icons.eot?#iefix') format('embedded-opentype'),
|
||||
url('../static/fonts/Elusive-Icons.woff') format('woff'),
|
||||
url('../static/fonts/Elusive-Icons.ttf') format('truetype'),
|
||||
url('../static/fonts/Elusive-Icons.svg#Elusive-Icons') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-family: 'Elusive-Icons';
|
||||
src:url('../fonts/Elusive-Icons.eot');
|
||||
src:url('../fonts/Elusive-Icons.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/Elusive-Icons.woff') format('woff'),
|
||||
url('../fonts/Elusive-Icons.ttf') format('truetype'),
|
||||
url('../fonts/Elusive-Icons.svg#Elusive-Icons') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSans';
|
||||
src: url('../static/fonts/OpenSans-Light-webfont.eot');
|
||||
src: url('../static/fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../static/fonts/OpenSans-Light-webfont.woff') format('woff'),
|
||||
url('../static/fonts/OpenSans-Light-webfont.ttf') format('truetype'),
|
||||
url('../static/fonts/OpenSans-Light-webfont.svg#OpenSansRegular') format('svg');
|
||||
src: url('../fonts/OpenSans-Light-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Light-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Light-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Light-webfont.svg#OpenSansRegular') format('svg');
|
||||
font-weight: 200;
|
||||
font-style: normal;
|
||||
|
||||
@@ -25,57 +24,55 @@
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSans';
|
||||
src: url('../static/fonts/OpenSans-Regular-webfont.eot');
|
||||
src: url('../static/fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../static/fonts/OpenSans-Regular-webfont.woff') format('woff'),
|
||||
url('../static/fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
|
||||
url('../static/fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
|
||||
src: url('../fonts/OpenSans-Regular-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Regular-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSans';
|
||||
src: url('../static/fonts/OpenSans-Italic-webfont.eot');
|
||||
src: url('../static/fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../static/fonts/OpenSans-Italic-webfont.woff') format('woff'),
|
||||
url('../static/fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
|
||||
url('../static/fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
|
||||
src: url('../fonts/OpenSans-Italic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Italic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSans';
|
||||
src: url('../static/fonts/OpenSans-Bold-webfont.eot');
|
||||
src: url('../static/fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../static/fonts/OpenSans-Bold-webfont.woff') format('woff'),
|
||||
url('../static/fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
|
||||
url('../static/fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
|
||||
src: url('../fonts/OpenSans-Bold-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Bold-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'OpenSans';
|
||||
src: url('../static/fonts/OpenSans-BoldItalic-webfont.eot');
|
||||
src: url('../static/fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../static/fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
|
||||
url('../static/fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
|
||||
url('../static/fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
|
||||
src: url('../fonts/OpenSans-BoldItalic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Lobster';
|
||||
src: url('../static/fonts/Lobster-webfont.eot');
|
||||
src: url('../static/fonts/Lobster-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../static/fonts/Lobster-webfont.woff') format('woff'),
|
||||
url('../static/fonts/Lobster-webfont.ttf') format('truetype'),
|
||||
url('../static/fonts/Lobster-webfont.svg#lobster_1.4regular') format('svg');
|
||||
src: url('../fonts/Lobster-webfont.eot');
|
||||
src: url('../fonts/Lobster-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/Lobster-webfont.woff') format('woff'),
|
||||
url('../fonts/Lobster-webfont.ttf') format('truetype'),
|
||||
url('../fonts/Lobster-webfont.svg#lobster_1.4regular') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@@ -8,8 +8,9 @@ body, html {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: #111;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
background: $menu_color;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@@ -35,11 +36,11 @@ a {
|
||||
.navigation {
|
||||
|
||||
.logo {
|
||||
background: #ac0000;
|
||||
background: $couch_color;
|
||||
display: block;
|
||||
text-align: center;
|
||||
|
||||
font-family: Lobster;
|
||||
font-family: Lobster, serif;
|
||||
color: #FFF;
|
||||
font-size: 38px;
|
||||
line-height: 80px;
|
||||
@@ -67,11 +68,10 @@ a {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.content {
|
||||
@include flex(1 auto);
|
||||
|
||||
background: #FFF;
|
||||
background: $background_color;
|
||||
border-radius: 3px 0 0 3px;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -82,7 +82,7 @@ a {
|
||||
|
||||
.pages {
|
||||
height: 100%;
|
||||
widows: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.footer {
|
||||
|
||||
@@ -1,3 +1,8 @@
|
||||
$couch_color: #ac0000;
|
||||
$background_color: #FFF;
|
||||
$menu_color: #111;
|
||||
$theme_off: #f2f2f2;
|
||||
|
||||
@mixin flexbox() {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
|
||||
Reference in new issue
Block a user