From d8e91338734185d1bf67f0c84f429d33effce142 Mon Sep 17 00:00:00 2001 From: Tim Almdal Date: Fri, 17 Apr 2009 02:06:00 +0000 Subject: Another iteration in the quest for the perfect organize module. At this point you can select microthumbs, by clicking on them, ctrl-click will add to the selection. You can select by drawing a lasso around images. Holding the ctrl will add the lassoed thumbs to the selection. Once slected, thumbs can be dragged and dropped within the current At this point no background processing takes place --- modules/organize/css/organize.css | 138 +++++++++++++++++++++----------------- 1 file changed, 75 insertions(+), 63 deletions(-) (limited to 'modules/organize/css') diff --git a/modules/organize/css/organize.css b/modules/organize/css/organize.css index c6c052bc..a1dc062a 100644 --- a/modules/organize/css/organize.css +++ b/modules/organize/css/organize.css @@ -1,85 +1,115 @@ /* @todo move to theme css */ -#gOrganizeTreeContainer, -#gMicroThumbContainer { +/******************************************************************* + * Album Tree styling + */ +#gOrganizeTreeContainer { overflow-y: auto; margin: 0 !important; padding: 0 !important; } -#gMicroThumbContainer { +#gOrganizeAlbumDescription { + height: 2em; + overflow-y: auto; +} + +.gBranchSelected { + background-color: #cfdeff !important; + border-bottom: 1px solid #999 !important; + display: block; + padding: .3em 0; +} + +.gBranchText { + cursor: pointer; +} + +.gBranchCollapsed { + display: none; +} + +.gBranchEmpty { + visibility: hidden; +} + +#gOrganizeTreeContainer ul ul li { + padding-left: 1.2em; +} + +/******************************************************************* + * Album Panel Styles + */ +#gMicroThumbPanel { + margin: 0 !important; + padding: 0 !important; background-color: #cfdeff; border: 1px solid #999 !important; border-top: none !important; border-left: none !important; margin-left: -1em !important; + overflow: auto; } -#gMicroThumbGrid li div div { - float: left; -} - -#gMicroThumbContainer #gMicroThumbGrid { - margin: 0; +#gMicroThumbGrid { + padding: .5em; } -#gMicroThumbContainer #gMicroThumbGrid .gMicroThumb { - background-color: #fff; - border: 2px solid #e8e8e8; - border-right-color: #ccc; - border-bottom-color: #ccc; +.gMicroThumbContainer { + display: block; + //border: 2px solid #e8e8e8; + //border-right-color: #ccc; + //border-bottom-color: #ccc; float: left; font-size: .7em; height: 9em; - margin-left: .5em; - margin-top: .5em; + margin-bottom: 1em; opacity: .4; - overflow: hidden; - padding: .5em; - text-align: center; - width: 9em; + padding: 0 .5em; } -#gOrganizeAlbumDescription { - height: 2em; - overflow-y: auto; +.gMicroThumb { + height: 9em; + width: 9em; + background-color: #fff; + display: block; + float: left; + text-align: center; } -#gMicroThumbContainer #gMicroThumbGrid .gAlbum { +#gMicroThumbPanel #gMicroThumbGrid .gAlbum { background-color: #e8e8e8; } -#gMicroThumbContainer #gMicroThumbGrid :hover { +#gMicroThumbPanel #gMicroThumbGrid :hover { opacity: 1; } -#gMicroThumbContainer #gMicroThumbGrid .gThumbSelected { - border: 0.2em solid #09f; +.gMicroThumbContainer.ui-selected { opacity: 1; } -.gBranchSelected { - background-color: #cfdeff !important; - border-bottom: 1px solid #999 !important; - display: block; - padding: .3em 0; +#gDragHelper .gMicroThumbGrid { + background-color: transparent; + padding: 0; + overflow: visible; } - -.gBranchText { - cursor: pointer; -} - -.gBranchCollapsed { - display: none; -} - -.gBranchEmpty { - visibility: hidden; + +#gDragHelper .gMicroThumbContainer { + display: block; + margin: 0; + padding: 0; } -#gOrganizeTreeContainer ul ul li { - padding-left: 1.2em; +#gDragHelper .gMicroThumb { + background-color: transparent; + height: auto; + width: auto; } + +/**************************************************************** + * Organize Edit styling + */ #gOrganizeFormButtons { bottom: 0.5em; position: absolute; @@ -102,21 +132,3 @@ margin: 0; text-align: center; } - -#gMicroThumbUnselectAll, -#gMicroThumbSelectAll { - font-size: 1.2em; - font-weight: bold; -} - -.gOrganizeReorderDropTarget { - visibility: hidden; - background-color: #5C9CCC; - float: none; - width: .5em; - height: 9em; -} - -.gOrganizeReorderDropTargetHover { - visibility: visible; -} -- cgit v1.2.3