From 6a97fba1defce41650320c9c5b9ae0e56553b4f8 Mon Sep 17 00:00:00 2001 From: franzz Date: Tue, 18 Aug 2015 21:07:17 +0200 Subject: [PATCH] mobile friendly --- .gitignore | 3 + masks/index.html | 8 +- style/{big_screen.css => _big_screen.scss} | 0 .../{font-awesome.css => _font-awesome.scss} | 0 style/{normalize.css => _normalize.scss} | 0 style/_small_screen.scss | 9 + style/ugc.css | 228 +---------------- style/ugc.css.map | 7 + style/ugc.scss | 235 ++++++++++++++++++ 9 files changed, 263 insertions(+), 227 deletions(-) rename style/{big_screen.css => _big_screen.scss} (100%) rename style/{font-awesome.css => _font-awesome.scss} (100%) rename style/{normalize.css => _normalize.scss} (100%) create mode 100644 style/_small_screen.scss mode change 100755 => 100644 style/ugc.css create mode 100644 style/ugc.css.map create mode 100755 style/ugc.scss diff --git a/.gitignore b/.gitignore index d6aa32a..149904c 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,6 @@ /.buildpath /.project /.settings/ +/build.xml +/.externalToolBuilders/ +/.sass-cache/ \ No newline at end of file diff --git a/masks/index.html b/masks/index.html index dccddcd..2343a36 100755 --- a/masks/index.html +++ b/masks/index.html @@ -3,12 +3,10 @@ + - - - UGC Clone @@ -26,7 +24,9 @@
-
+
+
+

Filtered films

diff --git a/style/big_screen.css b/style/_big_screen.scss similarity index 100% rename from style/big_screen.css rename to style/_big_screen.scss diff --git a/style/font-awesome.css b/style/_font-awesome.scss similarity index 100% rename from style/font-awesome.css rename to style/_font-awesome.scss diff --git a/style/normalize.css b/style/_normalize.scss similarity index 100% rename from style/normalize.css rename to style/_normalize.scss diff --git a/style/_small_screen.scss b/style/_small_screen.scss new file mode 100644 index 0000000..2114e4e --- /dev/null +++ b/style/_small_screen.scss @@ -0,0 +1,9 @@ +@media (max-width: 40.5em) { + #buffer { + width: 6em; + height: 6em; + } + #buffer .fa { + font-size:6em; + } +} \ No newline at end of file diff --git a/style/ugc.css b/style/ugc.css old mode 100755 new mode 100644 index d578ea5..92d9864 --- a/style/ugc.css +++ b/style/ugc.css @@ -1,223 +1,5 @@ -@CHARSET "UTF-8"; - -/* Default Tags */ - -body { - margin:0; - padding:1em; - font-family: 'Open Sans', sans-serif; - font-size: 1em; - color:#222; - background:white; - min-width: 30em; -} - -a { - text-decoration: none; - color:#222; -} -a:hover { - color:#08288B; -} - -h1 { - margin:0 0 1em 0; -} - -/* Common Classes */ - -.fa-icon { - margin-right:0.5em; -} - -/* Font Awesome Classes */ - -.fa-film:before { - content: "\f008"; -} -.fa-trailer:before { - content: "\f144"; -} -.fa-spinner:before { - content: "\f110"; -} -.fa-cinema:before { - content: "\f017"; -} -.fa-date:before { - content: "\f133"; -} -.fa-power:before { - content: "\f1b0"; -} -.fa-edito:before { - content: "\f0e7"; -} -.fa-feedback:before { - content: "\f0b0"; -} - -/* Sections */ - -/* Section - Header */ - -header { - 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; -} - -header .title time { - display:inline-block; - font-size: 2em; - color:#08288B; - padding:1.5em 0 1.5em 0.75em; -} - -/* Section - Main */ - -main { - margin-top:1em; -} - -#buffer { - position: fixed; - top: 0px; - left: 0px; - right: 0px; - bottom: 0px; - width: 1em; - height: 1em; - margin: auto; - padding: 0px; - font-size:2em; - color:#08288B; - padding-bottom: 0.5em; -} - -/* Section - Film */ - -.film { - 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 img.bg { - position:absolute; - 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; - padding-left:1em; - width: calc(100% - 1em - 152px); -} - -.film p { - margin:0.5em 0; -} - -.film .title a.name { - font-weight: bold; -} - -.film .title .edito { - font-style: italic; - margin-left:1em; - color:#777; -} - -.film .trailer { - -} - -.film .timetable { - margin-top:1em; - font-size: 0.8em; -} - -.film .timetable p { - line-height: 2.0; - margin: 0; -} - -.film .timetable .cinema { - margin-right:0.5em; -} - -.film .timetable .cinema .fa { - font-size: 1.25em; - line-height: 0.7656249414em; - vertical-align: -14.06250352%; -} - -.film .timetable .lang { - margin-right:0.5em; -} - -.film .timetable .time { - background:#666; - color:white; - padding:0.1em 0.4em; - border-radius:3px; -} -.film .timetable .time:hover { - background:#08288B; -} - -/* Section - Feeback */ - -#feedback { - background:#EEE; - padding:1em; - font-size:0.6em; - margin-bottom: 1em; - display:none; - color:#999; -} - -#feedback p:FIRST-CHILD { - margin-top:0; -} -#feedback p:LAST-CHILD { - margin-bottom:0; -} - -/* Section - Footer */ - -footer { - font-size: 0.8em; - margin: 1em 0px; - display: none; - color:#08288B; -} \ No newline at end of file +@CHARSET "UTF-8";/*! normalize.css v3.0.2 | MIT License | git.io/normalize */img,legend{border:0}legend,td,th{padding:0}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,optgroup,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}table{border-collapse:collapse;border-spacing:0}/*! + * Font Awesome 4.3.0 by @davegandy - http://fontawesome.io - @fontawesome + * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) + */@font-face{font-family:'FontAwesome';src:url("fontawesome-webfont.eot?v=4.3.0");src:url("fontawesome-webfont.eot?#iefix&v=4.3.0") format("embedded-opentype"),url("fontawesome-webfont.woff2?v=4.3.0") format("woff2"),url("fontawesome-webfont.woff?v=4.3.0") format("woff"),url("fontawesome-webfont.ttf?v=4.3.0") format("truetype"),url("fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format("svg");font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transform:translate(0, 0)}.fa-lg{font-size:1.33333333em;line-height:0.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:0.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid 0.08em #eeeeee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#ffffff}.fa-gear:before{content:"\f013"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-underline:before{content:"\f0cd"}.fa-ol:before{content:"\f0cb"}.fa-ul:before{content:"\f03a"}body{margin:0;padding:1em;font-family:'Open Sans', sans-serif;font-size:1em;color:#222;background:white;min-width:30em}a{text-decoration:none;color:#222}a:hover{color:#08288B}h1{margin:0 0 1em 0}.fa-icon{margin-right:0.5em}.fa-film:before{content:"\f008"}.fa-trailer:before{content:"\f144"}.fa-spinner:before{content:"\f110"}.fa-cinema:before{content:"\f017"}.fa-date:before{content:"\f133"}.fa-power:before{content:"\f1b0"}.fa-edito:before{content:"\f0e7"}.fa-feedback:before{content:"\f0b0"}header{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}header .title time{display:inline-block;font-size:2em;color:#08288B;padding:1.5em 0 1.5em 0.75em}main{margin-top:1em}#buffer{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:2em;height:2em;margin:auto;padding:0px;color:#08288B}#buffer .fa{font-size:2em}.film{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 img.bg{position:absolute;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;padding-left:1em;width:calc(100% - 1em - 152px)}.film p{margin:0.5em 0}.film .title a.name{font-weight:bold}.film .title .edito{font-style:italic;margin-left:1em;color:#777}.film .timetable{margin-top:1em;font-size:0.8em}.film .timetable p{line-height:2.0;margin:0}.film .timetable .cinema{margin-right:0.5em}.film .timetable .cinema .fa{font-size:1.25em;line-height:0.7656249414em;vertical-align:-14.06250352%}.film .timetable .lang{margin-right:0.5em}.film .timetable .time{background:#666;color:white;padding:0.1em 0.4em;border-radius:3px}.film .timetable .time:hover{background:#08288B}#feedback{background:#EEE;padding:1em;font-size:0.6em;margin-bottom:1em;display:none;color:#999}#feedback p:FIRST-CHILD{margin-top:0}#feedback p:LAST-CHILD{margin-bottom:0}footer{font-size:0.8em;margin:1em 0 0 0;display:none;color:#08288B}@media (max-width: 40.5em){#buffer{width:6em;height:6em}#buffer .fa{font-size:6em}}@media (min-width: 40.5em){body{max-width:50em;min-width:40.5em;margin:0px auto}} +/*# sourceMappingURL=ugc.css.map */ diff --git a/style/ugc.css.map b/style/ugc.css.map new file mode 100644 index 0000000..3c853fb --- /dev/null +++ b/style/ugc.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": "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", +"sources": ["ugc.scss","_normalize.scss","_font-awesome.scss","_small_screen.scss","_big_screen.scss"], +"names": [], +"file": "ugc.css" +} diff --git a/style/ugc.scss b/style/ugc.scss new file mode 100755 index 0000000..eaf2bd6 --- /dev/null +++ b/style/ugc.scss @@ -0,0 +1,235 @@ +@CHARSET "UTF-8"; + +/* External librairies */ + +@import 'normalize'; +@import 'font-awesome'; + +/* Default Tags */ + +body { + margin:0; + padding:1em; + font-family: 'Open Sans', sans-serif; + font-size: 1em; + color:#222; + background:white; + min-width: 30em; +} + +a { + text-decoration: none; + color:#222; +} +a:hover { + color:#08288B; +} + +h1 { + margin:0 0 1em 0; +} + +/* Common Classes */ + +.fa-icon { + margin-right:0.5em; +} + +/* Font Awesome Classes */ + +.fa-film:before { + content: "\f008"; +} +.fa-trailer:before { + content: "\f144"; +} +.fa-spinner:before { + content: "\f110"; +} +.fa-cinema:before { + content: "\f017"; +} +.fa-date:before { + content: "\f133"; +} +.fa-power:before { + content: "\f1b0"; +} +.fa-edito:before { + content: "\f0e7"; +} +.fa-feedback:before { + content: "\f0b0"; +} + +/* Sections */ + +/* Section - Header */ + +header { + 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; +} + +header .title time { + display:inline-block; + font-size: 2em; + color:#08288B; + padding:1.5em 0 1.5em 0.75em; +} + +/* Section - Main */ + +main { + margin-top:1em; +} + +#buffer { + position: fixed; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; + width: 2em; + height: 2em; + margin: auto; + padding: 0px; + color:#08288B; +} + +#buffer .fa { + font-size:2em; +} + +/* Section - Film */ + +.film { + 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 img.bg { + position:absolute; + 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; + padding-left:1em; + width: calc(100% - 1em - 152px); +} + +.film p { + margin:0.5em 0; +} + +.film .title a.name { + font-weight: bold; +} + +.film .title .edito { + font-style: italic; + margin-left:1em; + color:#777; +} + +.film .trailer { + +} + +.film .timetable { + margin-top:1em; + font-size: 0.8em; +} + +.film .timetable p { + line-height: 2.0; + margin: 0; +} + +.film .timetable .cinema { + margin-right:0.5em; +} + +.film .timetable .cinema .fa { + font-size: 1.25em; + line-height: 0.7656249414em; + vertical-align: -14.06250352%; +} + +.film .timetable .lang { + margin-right:0.5em; +} + +.film .timetable .time { + background:#666; + color:white; + padding:0.1em 0.4em; + border-radius:3px; +} +.film .timetable .time:hover { + background:#08288B; +} + +/* Section - Feeback */ + +#feedback { + background:#EEE; + padding:1em; + font-size:0.6em; + margin-bottom: 1em; + display:none; + color:#999; +} + +#feedback p:FIRST-CHILD { + margin-top:0; +} +#feedback p:LAST-CHILD { + margin-bottom:0; +} + +/* Section - Footer */ + +footer { + font-size: 0.8em; + margin: 1em 0 0 0; + display: none; + color:#08288B; +} + +/* Mobile Support */ + +@import 'small_screen'; +@import 'big_screen';