Box modeling

This commit is contained in:
Ruud
2012-02-26 21:42:30 +01:00
parent 7a47ca96ed
commit ffd64c5122
4 changed files with 25 additions and 19 deletions
+11 -10
View File
@@ -20,8 +20,8 @@
} }
.movies .data { .movies .data {
padding: 20px; padding: 20px;
height: 140px; height: 180px;
width: 800px; width: 840px;
position: relative; position: relative;
float: right; float: right;
@@ -101,8 +101,8 @@
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
display: inline-block; display: inline-block;
width: 20px; width: 26px;
height: 20px; height: 26px;
padding: 3px; padding: 3px;
opacity: 0; opacity: 0;
} }
@@ -132,6 +132,7 @@
.movies .options { .movies .options {
position: absolute; position: absolute;
margin-left: 120px; margin-left: 120px;
width: 840px;
} }
.movies .options .form { .movies .options .form {
@@ -162,7 +163,7 @@
.movies .options .table .item > * { .movies .options .table .item > * {
display: inline-block; display: inline-block;
padding: 0 5px; padding: 0 5px;
width: 50px; width: 60px;
min-height: 24px; min-height: 24px;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
@@ -174,10 +175,10 @@
border: 0; border: 0;
} }
.movies .options .table .provider { .movies .options .table .provider {
width: 120px; width: 130px;
} }
.movies .options .table .name { .movies .options .table .name {
width: 360px; width: 370px;
overflow: hidden; overflow: hidden;
text-align: left; text-align: left;
padding: 0 10px; padding: 0 10px;
@@ -187,8 +188,8 @@
.movies .options .table .is_available { width: 80px; } .movies .options .table .is_available { width: 80px; }
.movies .options .table a { .movies .options .table a {
width: 16px !important; width: 30px !important;
height: 16px; height: 20px;
opacity: 0.8; opacity: 0.8;
} }
.movies .options .table a:hover { .movies .options .table a:hover {
@@ -241,7 +242,7 @@
.movies .alph_nav li { .movies .alph_nav li {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
width: 24px; width: 23px;
height: 24px; height: 24px;
line-height: 26px; line-height: 26px;
text-align: center; text-align: center;
@@ -10,11 +10,10 @@
} }
.search_form input { .search_form input {
padding-right: 25px;
padding: 4px; padding: 4px;
margin: 0; margin: 0;
font-size: 14px; font-size: 14px;
width: 90%; width: 100%;
} }
.search_form .input a { .search_form .input a {
width: 17px; width: 17px;
@@ -56,7 +55,7 @@
} }
.search_form .results { .search_form .results {
max-height: 550px; max-height: 570px;
overflow-x: hidden; overflow-x: hidden;
padding: 10px 0; padding: 10px 0;
} }
@@ -106,7 +105,7 @@
.movie_result .data { .movie_result .data {
padding: 0 15px; padding: 0 15px;
width: 440px; width: 470px;
position: relative; position: relative;
min-height: 100px; min-height: 100px;
top: 0; top: 0;
@@ -131,13 +130,12 @@
display: inline-block; display: inline-block;
margin: 15px 3% 15px 0; margin: 15px 3% 15px 0;
vertical-align: top; vertical-align: top;
border-radius: 3px; border-radius: 3px;
box-shadow: 0 0 3px rgba(0,0,0,0.35); box-shadow: 0 0 3px rgba(0,0,0,0.35);
} }
.movie_result .info { .movie_result .info {
width: 74%; width: 80%;
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
padding: 15px 0; padding: 15px 0;
+9 -2
View File
@@ -26,6 +26,12 @@ body {
#clean { #clean {
background: transparent !important; background: transparent !important;
} }
* {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
pre { pre {
white-space: pre-wrap; white-space: pre-wrap;
@@ -150,9 +156,10 @@ body > .spinner, .mask{
.header { .header {
background: #4e5969; background: #4e5969;
padding:10px; padding:10px;
height: 60px; height: 80px;
position: fixed; position: fixed;
width: 99%; margin: 0;
width: 100%;
z-index: 5; z-index: 5;
box-shadow: 0 0 5px rgba(0,0,0,0.05); box-shadow: 0 0 5px rgba(0,0,0,0.05);
transition: box-shadow .4s cubic-bezier(0.9,0,0.1,1); transition: box-shadow .4s cubic-bezier(0.9,0,0.1,1);
+1 -1
View File
@@ -47,7 +47,7 @@
.page.settings .containers { .page.settings .containers {
width: 75.8%; width: 80%;
float: left; float: left;
padding: 20px 2%; padding: 20px 2%;
min-height: 300px; min-height: 300px;