Improve style

master
Guillaume Dott 2015-11-13 12:41:25 +01:00
parent bf776ce55e
commit c1e2fca751
3 changed files with 35 additions and 11 deletions

View File

@ -2,11 +2,41 @@ body {
margin: 10px;
}
h2 {
margin-top: 0;
a {
text-decoration: none;
color: #666;
&:hover {
color: #888;
}
}
body > form #search-main {
h2 {
margin-top: 0;
overflow: hidden;
text-overflow: ellipsis;
font-size: 1.2em;
font-family: Verdana,Arial,sans-serif;
}
ul#movies, ul#menu {
list-style-type: none;
margin: 0;
padding: 0;
}
ul#menu {
display: flex;
flex-flow: row wrap;
justify-content: flex-end;
li {
margin: 5px;
}
}
form #search-main {
display: flex;
input {
@ -26,12 +56,6 @@ body > form #search-main {
}
}
ul#movies {
list-style-type: none;
margin: 0;
padding: 0;
}
.default, .compact {
li {
padding: 10px 0;

View File

@ -27,7 +27,7 @@ module Librarix
private
def around(content)
"<ul>#{content}</ul>"
"<ul id=\"menu\">#{content}</ul>"
end
class Element

View File

@ -1 +1 @@
body{margin:10px}h2{margin-top:0}body>form #search-main{display:flex}body>form #search-main input{border-radius:0.4em;border:solid 3px #f4f4f4}body>form #search-main input[type="submit"]{background-color:#f4f4f4}body>form #search-main input[type="text"]{flex-grow:1;min-width:50px;font-size:1.4em;padding:5px}ul#movies{list-style-type:none;margin:0;padding:0}.default li,.compact li{padding:10px 0}.default li:nth-child(even),.compact li:nth-child(even){background-color:#f4f4f4}.default .movie,.compact .movie{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.default .movie .poster,.compact .movie .poster{margin-right:10px}.default .movie .informations,.compact .movie .informations{align-self:flex-start;flex:1 1 300px}.poster{display:flex;flex-flow:row wrap}.poster .movie{width:160px}
body{margin:10px}a{text-decoration:none;color:#666}a:hover{color:#888}h2{margin-top:0;overflow:hidden;text-overflow:ellipsis;font-size:1.2em;font-family:Verdana,Arial,sans-serif}ul#movies,ul#menu{list-style-type:none;margin:0;padding:0}ul#menu{display:flex;flex-flow:row wrap;justify-content:flex-end}ul#menu li{margin:5px}form #search-main{display:flex}form #search-main input{border-radius:0.4em;border:solid 3px #f4f4f4}form #search-main input[type="submit"]{background-color:#f4f4f4}form #search-main input[type="text"]{flex-grow:1;min-width:50px;font-size:1.4em;padding:5px}.default li,.compact li{padding:10px 0}.default li:nth-child(even),.compact li:nth-child(even){background-color:#f4f4f4}.default .movie,.compact .movie{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.default .movie .poster,.compact .movie .poster{margin-right:10px}.default .movie .informations,.compact .movie .informations{align-self:flex-start;flex:1 1 300px}.poster{display:flex;flex-flow:row wrap}.poster .movie{width:160px}