flynx/ImageGrid
1
1
Fork 0
mirror of https://github.com/flynx/ImageGrid.git synced 2025-10-29 10:20:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

added size classes to update paramiters depending on magnification -- if we'll use this more often will need a more flexible system...

Browse Source 
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-06-09 17:34:24 +04:00
parent aee42a4370
commit 49cd566d2e
3 changed files with 48 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
ui/layout.css
View File

@ -848,6 +848,23 @@ body {
.dark.viewer .overlay-block .background {
background: #0a0a0a;
}
.large.marks-visible.viewer:not(.single-image-mode) .current.image {
border-width: 3px;
}
.large.marks-visible.viewer:not(.single-image-mode) .marked.image:after {
-webkit-transform: rotate(0deg) scaleY(0.7) scaleX(0.7);
-moz-transform: rotate(0deg) scaleY(0.7) scaleX(0.7);
-o-transform: rotate(0deg) scaleY(0.7) scaleX(0.7);
-ms-transform: rotate(0deg) scaleY(0.7) scaleX(0.7);
transform: rotate(0deg) scaleY(0.7) scaleX(0.7);
}
.small.marks-visible.viewer:not(.single-image-mode) .marked.image:after {
-webkit-transform: rotate(0deg) scaleY(1.8) scaleX(1.8);
-moz-transform: rotate(0deg) scaleY(1.8) scaleX(1.8);
-o-transform: rotate(0deg) scaleY(1.8) scaleX(1.8);
-ms-transform: rotate(0deg) scaleY(1.8) scaleX(1.8);
transform: rotate(0deg) scaleY(1.8) scaleX(1.8);
}
/********************************************************* Overlay ***/
.overlay-block {
display: none;

15
ui/layout.less
View File

@ -37,6 +37,9 @@
-ms-transform: rotate(@deg) scaleY(@scaleY) scaleX(@scaleX);
transform: rotate(@deg) scaleY(@scaleY) scaleX(@scaleX);
}
.scale (@scale) {
.transform(0deg, @scale, @scale)
}
.rotate (@deg) {
.transform(@deg)
}
@ -843,6 +846,18 @@ body {
}
.large.marks-visible.viewer:not(.single-image-mode) .current.image {
border-width: 3px;
}
.large.marks-visible.viewer:not(.single-image-mode) .marked.image:after {
.scale(0.7);
}
.small.marks-visible.viewer:not(.single-image-mode) .marked.image:after {
.scale(1.8);
}
/********************************************************* Overlay ***/

16
ui/setup.js
View File

@ -187,6 +187,22 @@ function setupDataBindings(viewer){
}
}
// update size classes...
// XXX make thresholds global...
if(n <= 2.5){
$('.viewer')
.removeClass('small')
.addClass('large')
} else if (n >= 6) {
$('.viewer')
.addClass('small')
.removeClass('large')
} else {
$('.viewer')
.removeClass('small')
.removeClass('large')
}
// update previews...
updateImages()
})