guillaume
/
librarix
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
lib/librarix/assets/application.scss
View File

@ -2,11 +2,41 @@ body {
margin: 10px; margin: 10px;
} }
h2 { a {
margin-top: 0; 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; display: flex;
input { input {
@ -26,12 +56,6 @@ body > form #search-main {
} }
} }
ul#movies {
list-style-type: none;
margin: 0;
padding: 0;
}
.default, .compact { .default, .compact {
li { li {
padding: 10px 0; padding: 10px 0;

2
lib/librarix/menu.rb
View File

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

2
lib/librarix/public/application.css
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}