Permalink
Browse files

Improves selectors.

  • Loading branch information...
1 parent ad845db commit 66e9dafaa51016a1a46d4fa81959cf2e4ae26000 @lrsjng committed Sep 3, 2013
@@ -4,6 +4,7 @@
@col-hover: rgb(29,119,194);
@col-border: rgba(0,0,0,0.05);
@col-border-strong: rgba(0,0,0,0.15);
+@col-border-stronger: rgba(0,0,0,0.3);
@col-error: rgb(204,51,51);
@@ -8,7 +8,7 @@
margin: 2px;
a, a:active, a:visited {
- width: @icon-size + 186px;
+ width: @icon-size + 182px;
height: @icon-size + 6px;
border: 1px solid rgba(0,0,0,0);
@@ -58,7 +58,7 @@
&.item {
a, a:active, a:visited {
- width: @size + 186px;
+ width: @size + 182px;
height: @size + 6px;
}
@@ -21,47 +21,6 @@
background-color: rgba(0,0,0,0.01);
}
-#selector {
- position: absolute;
- left: 0;
- top: 0;
- width: 24px;
- height: 24px;
- margin-top: -3px;
- margin-left: -3px;
- background-color: #f8f8f8;
- border: 1px solid rgba(0,0,0,0.3);
- border-radius: 3px;
- opacity: 0.6;
- cursor: pointer;
- .transition(all 0.2s ease-in-out);
-
- .on-selected, .on-not-selected {
- display: block;
- width: 100%;
- height: 100%;
- }
-
- &:hover {
- opacity: 1;
- }
-}
-
-.item.selected {
- #selector {
- .on-not-selected {
- display: none;
- }
- }
-}
-.item:not(.selected) {
- #selector {
- .on-selected {
- display: none;
- }
- }
-}
-
#view {
display: none;
@@ -124,6 +83,10 @@
color: @col-hover;
background-color: @item-background-col-hover;
border-color: @item-border-col-hover;
+
+ .selector {
+ display: block;
+ }
}
}
@@ -138,6 +101,15 @@
border-color: @item-border-col-sel;
}
}
+
+ .selector {
+ display: block;
+ // border-color: @col-border-stronger;
+
+ img {
+ display: block;
+ }
+ }
}
}
@@ -194,6 +166,29 @@
text-align: right;
width: 80px;
}
+
+ .selector {
+ display: none;
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 18px;
+ height: 18px;
+ background-color: #fff;
+ border: 1px solid @col-border-strong;
+ cursor: pointer;
+ .transition(all 0.2s ease-in-out);
+
+ &:hover {
+ border-color: @col-border-stronger;
+ }
+
+ img {
+ display: none;
+ width: 100%;
+ height: 100%;
+ }
+ }
}
.empty, .no-match {
@@ -115,31 +115,14 @@ modulejs.define('ext/select', ['_', '$', 'core/settings', 'core/resource', 'core
initItem = function (item) {
if (item.$view) {
- item.$view.find('a')
- .on('mouseenter', function () {
-
- var $icon = item.$view.find('.icon');
-
- $('#selector').remove();
- $('<div id="selector">' +
- '<img src="' + resource.image('select') + '" class="on-selected" alt="selected" />' +
- '<img src="' + resource.image('blank') + '" class="on-not-selected" alt="not-selected" />' +
- '</div>')
- .on('click', function (event) {
-
- event.stopImmediatePropagation();
- event.preventDefault();
-
- item.$view.toggleClass('selected');
- publish();
- })
- .appendTo(item.$view.find('a'));
- })
- .on('mouseleave', function () {
-
- $('.hover').removeClass('hover');
- $('#selector').remove();
- });
+ item.$view.find('.selector').on('click', function (event) {
+
+ event.stopImmediatePropagation();
+ event.preventDefault();
+
+ item.$view.toggleClass('selected');
+ publish();
+ });
}
},
@@ -15,6 +15,9 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
'<span class="label"/>' +
'<span class="date"/>' +
'<span class="size"/>' +
+ '<span class="selector">' +
+ '<img src="' + resource.image('select') + '" alt="selected"/>' +
+ '</span>' +
'</a>' +
'</li>',
hintTemplate = '<span class="hint"/>',
@@ -72,6 +75,7 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
$label.addClass('l10n-parentDirectory');
}
$html.addClass('folder-parent');
+ $html.find('.selector').remove();
}
if (item.$view) {
@@ -29,7 +29,7 @@ modulejs.define('view/viewmode', ['_', '$', 'core/settings', 'core/resource', 'c
var contentWidth = $('#content').width(),
$view = $('#view'),
- itemWidth = ($view.hasClass('view-icons') || $view.hasClass('view-grid')) ? ($view.find('.item').eq(0).width() || 1) : 1;
+ itemWidth = ($view.hasClass('view-icons') || $view.hasClass('view-grid')) ? ($view.find('.item').eq(0).outerWidth(true) || 1) : 1;
$view.width(Math.floor(contentWidth / itemWidth) * itemWidth);
},

0 comments on commit 66e9daf

Please sign in to comment.