List and dropdown styling issues

This commit is contained in:
Ruud
2013-05-01 17:48:59 +02:00
parent 0654c8cf07
commit be28820fb2
3 changed files with 70 additions and 65 deletions

View File

@@ -48,7 +48,7 @@ var MovieList = new Class({
self.changeView('list');
else
self.changeView(self.getSavedView() || self.options.view || 'details');
self.getMovies();
App.addEvent('movie.added', self.movieAdded.bind(self))
@@ -149,8 +149,7 @@ var MovieList = new Class({
var self = this;
var chars = '#ABCDEFGHIJKLMNOPQRSTUVWXYZ';
self.current_view = self.getSavedView() || 'details';
self.el.addClass(self.current_view+'_list with_navigation')
self.el.addClass('with_navigation')
self.navigation = new Element('div.alph_nav').grab(
new Element('div').adopt(

View File

@@ -27,9 +27,10 @@
}
.movies .loading.hide {
height: 0;
padding: 20px 0 0 0;
padding: 0;
opacity: 0;
margin-top: -20px;
overflow: hidden;
}
.movies .loading .spinner {
@@ -451,7 +452,8 @@
font-size: 20px;
position: absolute;
padding: 70px 0 0;
width: 100%;
left: 120px;
right: 0;
}
.movies .delete_container .cancel {
}
@@ -469,7 +471,8 @@
.movies .options {
position: absolute;
width: 840px;
right: 0;
left: 120px;
}
.movies .options .form {
@@ -525,7 +528,7 @@
overflow: hidden;
}
.movies .options .table .name {
width: 350px;
width: 340px;
overflow: hidden;
text-align: left;
padding: 0 10px;
@@ -620,6 +623,7 @@
text-align: right;
height: 100%;
padding: 3px 0;
top: 0;
}
.movies.mass_edit_list .trynext { display: none; }
.wanted .movies .movie .trynext {
@@ -666,7 +670,6 @@
position: relative;
z-index: 4;
top: 0px;
height: 45px;
right: 0;
margin: 0 auto;
width: 100%;
@@ -682,9 +685,9 @@
.movies .alph_nav > div {
position: relative;
max-width: 980px;
height: 45px;
margin: 0 auto;
padding: 0;
min-height: 24px;
}
.movies .alph_nav .numbers,

View File

@@ -639,71 +639,74 @@ body > .spinner, .mask{
.more_menu {
display: inline-block;
vertical-align: middle;
overflow: visible;
}
.more_menu > a {
display: block;
background: url('../images/sprite.png') no-repeat center -137px;
height: 25px;
width: 25px;
border: 1px solid rgba(0,0,0,0.3);
transition: all 0.3s ease-in-out;
}
.more_menu.show > a:not(:active), .more_menu > a:hover:not(:active) {
background-color: #406db8;
}
.more_menu .wrapper {
display: none;
background: rgba(255,255,255,0.98);
padding: 4px;
position: absolute;
z-index: 90;
margin: 32px 0 0 -145px;
width: 185px;
box-shadow: 0 20px 20px -5px rgba(0,0,0,0.1);
text-align: center;
color: #000;
background-image: linear-gradient(
-45deg,
rgb(200,200,200) 0%,
rgb(255,255,255) 100%
);
}
.more_menu.show .wrapper {
.more_menu > a {
display: block;
background: url('../images/sprite.png') no-repeat center -137px;
height: 25px;
width: 25px;
border: 1px solid rgba(0,0,0,0.3);
transition: all 0.3s ease-in-out;
}
.more_menu ul {
padding: 0;
margin: 0;
list-style: none;
.more_menu.show > a:not(:active), .more_menu > a:hover:not(:active) {
background-color: #406db8;
}
.more_menu .wrapper {
display: none;
background: rgba(255,255,255,0.98);
top: 0;
right: 0;
padding: 4px;
margin: 26px 0 0 0;
position: absolute;
z-index: 90;
width: 185px;
box-shadow: 0 20px 20px -5px rgba(0,0,0,0.1);
text-align: center;
color: #000;
background-image: linear-gradient(
-45deg,
rgb(200,200,200) 0%,
rgb(255,255,255) 100%
);
}
.more_menu .wrapper li {
width: 100%;
height: auto;
}
.more_menu .wrapper li a {
.more_menu.show .wrapper {
display: block;
border-bottom: 1px solid rgba(255,255,255,0.2);
box-shadow: none;
font-weight: normal;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 1px;
padding: 3px 0;
color: #000;
}
.more_menu .wrapper li:last-child a {
border: none;
.more_menu ul {
padding: 0;
margin: 0;
list-style: none;
}
.more_menu .wrapper li a:hover {
background: rgba(0,0,0,0.05);
.more_menu .wrapper li {
width: 100%;
height: auto;
}
.more_menu .wrapper li a {
display: block;
border-bottom: 1px solid rgba(255,255,255,0.2);
box-shadow: none;
font-weight: normal;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 1px;
padding: 3px 0;
color: #000;
}
.more_menu .wrapper li:last-child a {
border: none;
}
.more_menu .wrapper li a:hover {
background: rgba(0,0,0,0.05);
}
.messages {
position: fixed;