Improve style
parent
bf776ce55e
commit
c1e2fca751
|
@ -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;
|
||||
|
|
|
@ -27,7 +27,7 @@ module Librarix
|
|||
private
|
||||
|
||||
def around(content)
|
||||
"<ul>#{content}</ul>"
|
||||
"<ul id=\"menu\">#{content}</ul>"
|
||||
end
|
||||
|
||||
class Element
|
||||
|
|
|
@ -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}
|
||||
|
|
Loading…
Reference in New Issue