diff options
Diffstat (limited to 'themes')
27 files changed, 1627 insertions, 438 deletions
diff --git a/themes/admin_default/css/admin_screen.css b/themes/admin_default/css/admin_screen.css new file mode 100644 index 00000000..d408acf0 --- /dev/null +++ b/themes/admin_default/css/admin_screen.css @@ -0,0 +1,458 @@ +/** + * Gallery 3 Default Admin Theme Screen Styles + * + * Extends themes/default/css/screen.css + * + * 1) Basic HTML elements + * 2) Reusable content blocks + * 3) Page layout containers + * 4) Content blocks in specific layout containers + * 5) Browser hacks + * 6) jQuery and jQuery UI + * 7) Server Add + * 8) Digibug Print Administration + */ + +/** ******************************************************************* + * 1) Basic HTML elements + **********************************************************************/ + +/** ******************************************************************* + * 2) Reusable content blocks + **********************************************************************/ + +.gBlock { + background-color: #fff; + border: 1px solid #ccc; + margin-bottom: 1em; + padding: 1em; +} + +#gSidebar .gBlockContent { + padding: 0; +} + +.gSelected img, +.gAvailable .gBlock img { + float: left; + margin-right: 1em; +} + +.rtl .gSelected img, +.rtl .gAvailable .gBlock img { + float: right; + margin-left: 1em; +} + +.gSelected { + background: #e8e8e8; +} + +.gAvailable .gInstalledToolkit:hover { + cursor: pointer; + background: #eee; +} + +.gAvailable .gButtonLink { + width: 96%; +} + +.gSelected .gButtonLink { + display: none; +} + +.gUnavailable { + border-color: #999; + opacity: 0.4; +} + +.gOddRow { + background-color: #eee; +} + +.gEvenRow { + background-color: #fff; +} + +/** ******************************************************************* + * 3) Page layout containers + **********************************************************************/ + +.gView { + min-width: 974px !important; +} + +#gHeader { + background-color: #e8e8e8; + border-bottom: 1px solid #ccc; + margin-bottom: 20px; + padding: 0 20px; +} + +#gContent { + font-size: 1.1em; + width: 96%; +} + +/** ******************************************************************* + * 4) Content blocks in specific layout containers + *********************************************************************/ + +#gHeader #gLogo { + float: left; + margin: -22px 10px 0 0; + display: block; + padding-left: 2px; + width: 105px; /* 107px - padding-left */ + height: 48px; + background-image: url('../../default/images/logo.png'); + color: #A5A5A5 ! important; +} +#gHeader #gLogo:hover { + color: #FF6600 ! important; + text-decoration: none; +} + +#gHeader #gLoginMenu { + float: none; + margin: 0; + padding: 5px 0 10px 0; + text-align: right; +} + + +.rtl #gHeader #gLoginMenu { + text-align: left; +} + +#gHeader #gSiteAdminMenu { + float: left; + font-size: 1.2em; +} + +.rtl #gHeader #gSiteAdminMenu { + float: right; +} + +#gHeader #gSiteAdminMenu ul { + margin-bottom: 0; +} + +.gBlock .ui-dialog-titlebar { + margin: -1em -1em 0; +} + +#gSidebar .gBlock h2 { + background: none; +} + +#gPhotoStream { + background-color: #e8e8e8; +} + +#gPhotoStream .gBlockContent ul { + border-right: 1px solid #e8e8e8; + height: 135px; + overflow: auto; + overflow: -moz-scrollbars-horizontal; /* for FF */ + overflow-x: scroll; /* scroll horizontal */ + overflow-y: hidden; /* Hide vertical*/ +} + +#gContent #gPhotoStream .gItem { + background-color: #fff; + border: 1px solid #e8e8e8; + border-right-color: #ccc; + border-bottom-color: #ccc; + float: left; + height: 90px; + overflow: hidden; + text-align: center; + width: 90px; +} + +.rtl #gContent #gPhotoStream .gItem { + float: right; +} + +#gSiteStatus { + margin-bottom: 0; +} + +#gContent .gItem { + background-color: #fff; + border: 1px solid #e8e8e8; + border-right-color: #ccc; + border-bottom-color: #ccc; + height: 90px; + padding: 14px 8px; + text-align: center; + width: 90px; +} + +#gAdminCommentsMenu { + margin: 1em 0; +} + +#gAdminCommentsMenu a { + margin: 0; + padding: .2em .6em; +} + +#gAdminGraphics .gAvailable .gBlock { + clear: none; + float: left; + height: 16em; + margin-right: 1em; + width: 30%; +} + +.rtl #gAdminGraphics .gAvailable .gBlock { + float: right; + margin-left: 1em; + margin-right: 0em; +} + +#gSiteTheme, +#gAdminTheme { + float: left; + width: 48%; +} + +.rtl #gSiteTheme, +.rtl #gAdminTheme { + float: right; +} + +#gSiteTheme { + margin-right: 1em; +} + +#gUserAdminList { + margin-bottom: 1em; +} +#gUserAdminList td { + vertical-align: bottom; +} + +#gUserAdminList .gDraggable:hover { + border: 1px dashed black; +} + +#gUserAdminList .admin { + color: #55f; + font-weight: bold; +} + +.gActions a, +.gActions span { + margin-right: 3em; +} + +li.gGroup { + float: left; + display: block; + width: 200px; + border: 1px solid gray; + padding: 0; + margin: 0 1em 1em 0; +} + +.rtl li.gGroup { + float: right; +} + +li.gGroup h4 { + background-color: #EEEEEE; + border-bottom: 1px dashed #CCCCCC; + padding: .5em 0 .5em .5em; +} +li.gGroup .gButtonLink { + padding: 0; +} +li.gGroup ul, li.gGroup div { + height: 180px; + margin: 1px; + overflow: auto; + padding-top: .2em; +} +li.gGroup div p { + color: gray; + text-align: center; + padding: 2em .5em 0 .5em +} +li.gGroup .gUser { + padding: .2em 0 0 .5em; +} +li.gGroup .gUser .gButtonLink { + vertical-align: middle; +} + +li.gDefaultGroup h4, li.gDefaultGroup .gUser { + color: gray; +} + +#gAdminAdvancedSettings tr.setting:hover { + background: #ffc; +} + +/** ******************************************************************* + * 5) Browser hacks + *********************************************************************/ + +#gHeader:after, +#gAdminCommentsMenu:after, +#gGroupAdmin:after, +.gSelected:after, +.gAvailable .gBlock:after, +#gModuleCreateForm ul li ul:after, +#gDeveloperTools:after, +#gPhotoStream:after { + clear: both; + content: "."; + display: block; + height: 0; + visibility: hidden; +} + +/** ******************************************************************* + * 6) jQuery and jQuery UI + *********************************************************************/ + +#gPanel { + display: none; + padding: 1em; +} + +#gPanel legend { + display: none; +} + +#gPanel fieldset { + border: none; +} + +.ui-draggable { + cursor: move; +} + +.gButtonSetVertical a { + width: 8em !important; +} + +#gAdminDashboard .ui-dialog-titlebar, +#gAdminDashboardSidebar .ui-dialog-titlebar { + padding: .2em .4em; +} + +/**** Stuff that needs a home! ****/ +#gTagAdmin { + table-layout: fixed; +} +#gTagAdmin td { + border: 0; +} +#gTagAdmin ul { + padding-bottom: .3em; +} +#gTagAdmin li { + padding: .1em 0 .2em .3em; +} +#gTagAdmin .gColumn { + float: left; + width: 200px; +} +.rtl #gTagAdmin .gColumn { + float: right; +} +.gEditable { + padding: .1em .3em .2em .3em; +} +.gEditable:hover { + background-color: #ffc; + cursor: text; +} +#gRenameTagForm input { + padding: 0 .2em 0 .2em; + clear: none; + float: left; + margin: 0 .2em 0 0; +} +.rtl #gRenameTagForm input { + float: right; +} +#gRenameTagForm input[type="submit"] { + height: 25px; +} +#gRenameTagForm a, #gRenameTagForm span { + display: block; + float: left; + padding: .2em .2em 0 .1em; +} +.rtl #gRenameTagForm a, #gRenameTagForm span { + float: right; +} +#gProgress button { + float: right; + margin-top: 1em; +} +.rtl #gProgress button { + float: left; +} + +#gTaskLogDialog h1 { + font-size: 1.1em; +} + +.gTaskLog { + border: 1pt solid; + font-size: .9em; + height: 400px; + margin: .5em 0; + overflow: auto; + padding: .5em +} + + +/** ******************************************************************* + * 7) Server Add + *********************************************************************/ +#gServerAddAdmin { + margin:auto; + text-align: left; +} + +.rtl #gServerAddAdmin { + text-align: right; +} + +#gServerAddAdmin form fieldset { + border: medium none; +} + +#gServerAddAdmin legend { + display: none; +} + +#gServerAddAdmin .gWarning { + background-color: #FFFF99; +} + +#gAuthorizedPath { + margin: 0 !important; + padding: 0.3em 1.5em 0.3em 1em; +} + +#gServerAdd Admin #path { + width: 80%; +} + +.gRemoveDir:hover { + cursor: pointer; +} + +#gLanguageSettingsForm .checklist li { + width: 150px; + overflow: hidden; +} + diff --git a/themes/admin_default/css/screen.css b/themes/admin_default/css/screen.css index d408acf0..88631e81 100644 --- a/themes/admin_default/css/screen.css +++ b/themes/admin_default/css/screen.css @@ -1,313 +1,774 @@ /** - * Gallery 3 Default Admin Theme Screen Styles + * Gallery 3 Default Theme Screen Styles * - * Extends themes/default/css/screen.css + * @requires YUI reset, font, grids CSS * - * 1) Basic HTML elements - * 2) Reusable content blocks - * 3) Page layout containers - * 4) Content blocks in specific layout containers - * 5) Browser hacks - * 6) jQuery and jQuery UI - * 7) Server Add - * 8) Digibug Print Administration + * Sheet organization: + * 1) Basic HTML elements + * 2) Reusable classes + * 3) Reusable content blocks + * 4) Page layout containers + * 5) Content blocks in specific layout containers + * 6) Navigation and menus + * 7) Browser hacks + * 8) jQuery and jQuery UI + * 9) Right-to-left language styles */ /** ******************************************************************* * 1) Basic HTML elements **********************************************************************/ -/** ******************************************************************* - * 2) Reusable content blocks - **********************************************************************/ +body, html { + background-color: #ccc; + font-family: 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; +} -.gBlock { - background-color: #fff; - border: 1px solid #ccc; +p { margin-bottom: 1em; - padding: 1em; } -#gSidebar .gBlockContent { - padding: 0; +em { + font-style: oblique; +} + +h1, h2, h3, h4, h5, strong, th { + font-weight: bold; +} + +h1 { + font-size: 1.7em; +} + +#gSearchResults h1 { + margin-bottom: 1em; +} + +#gProgress h1 { + font-size: 1.1em; +} + +h2 { + font-size: 1.4em; +} + +#gSidebar .gBlock h2 { + font-size: 1.2em; +} + +#gSidebar .gBlock li { + margin-bottom: .6em; } -.gSelected img, -.gAvailable .gBlock img { +h3 { + font-size: 1.2em; +} + +/* Links ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +a, +.gMenu a, +#gDialog a, +.gButtonLink, +.gButtonLink:hover, +.gButtonLink:active { + color: #5382BF !important; + text-decoration: none; + -moz-outline-style: none; +} + +a:hover, +#gDialog a:hover { + text-decoration: underline; +} + +.gMenu a:hover { + text-decoration: none; +} + +#gDialog .gCancel { + clear: none; float: left; - margin-right: 1em; + margin: .3em 1em; } -.rtl .gSelected img, -.rtl .gAvailable .gBlock img { +#gForgotPasswordLink { float: right; - margin-left: 1em; + font-size: .9em; } -.gSelected { - background: #e8e8e8; +#gDialog .gCancel { + float: left; } -.gAvailable .gInstalledToolkit:hover { - cursor: pointer; - background: #eee; +/* Tables ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +table { + width: 100%; +} + +#gContent table { + margin: 1em 0; +} + +caption, +th { + text-align: left; +} + +th, +td { + border: none; + border-bottom: 1px solid #ccc; + padding: .5em; + vertical-align: top; +} + +/* Forms ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +fieldset { + border: 1px solid #ccc; + padding-bottom: .8em; +} + +#gHeader fieldset, +#gSidebar fieldset, +.gShortForm fieldset { + border: none; } -.gAvailable .gButtonLink { - width: 96%; +legend { + font-weight: bold; + margin-left: 1em; } -.gSelected .gButtonLink { +#gHeader legend, +#gSidebar legend, +#gContent #gSearchForm legend, +input[type="hidden"], +.gShortForm label { display: none; } -.gUnavailable { - border-color: #999; - opacity: 0.4; +label { + cursor: help; } -.gOddRow { - background-color: #eee; +input[type="text"], +input[type="password"] { + width: 50%; } -.gEvenRow { - background-color: #fff; +input[type="text"], +input[type="password"], +textarea { + border: 1px solid #e8e8e8; + border-top-color: #ccc; + border-left-color: #ccc; + color: #333; } -/** ******************************************************************* - * 3) Page layout containers - **********************************************************************/ +textarea { + width: 100%; + height: 12em; +} -.gView { - min-width: 974px !important; +input:focus, +textarea:focus, +option:focus { + background-color: #ffc; + color: #000; } -#gHeader { - background-color: #e8e8e8; - border-bottom: 1px solid #ccc; - margin-bottom: 20px; - padding: 0 20px; +/* Form layout ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +form li { + margin: 0 !important; + padding: .3em 1.5em .3em 1em; } -#gContent { - font-size: 1.1em; - width: 96%; +form ul ul { + clear: both; +} + +form ul ul li { + float: left; +} + +input, +select, +textarea { + display: block; + clear: both; + padding: .2em; +} + +input[type="submit"], +input[type="reset"] { + display: inline; + clear: none; + float: left; +} + +/* Form validation ~~~~~~~~~~~~~~~~~~~~~~~ */ + +.gValidationRule { + font-size: 80%; + margin-top: .5em; +} + +form.gError input[type="text"], +li.gError input[type="text"], +form.gError input[type="password"], +li.gError input[type="password"], +form.gError input[type="checkbox"], +li.gError input[type="checkbox"], +form.gError input[type="radio"], +li.gError input[type="radio"], +form.gError textarea, +li.gError textarea, +form.gError select, +li.gError select { + border: 2px solid red; } /** ******************************************************************* - * 4) Content blocks in specific layout containers + * 2) Reusable generic classes *********************************************************************/ -#gHeader #gLogo { +.inactive, .understate { + color: #ccc; + font-weight: normal; +} + +.left { float: left; - margin: -22px 10px 0 0; - display: block; - padding-left: 2px; - width: 105px; /* 107px - padding-left */ - height: 48px; - background-image: url('../../default/images/logo.png'); - color: #A5A5A5 ! important; -} -#gHeader #gLogo:hover { - color: #FF6600 ! important; - text-decoration: none; + margin: 1em 1em 1em 0; } -#gHeader #gLoginMenu { - float: none; - margin: 0; - padding: 5px 0 10px 0; +.right { + float: right; + margin: 1em 0 1em 1em; +} + +.txtright { text-align: right; } +/** ******************************************************************* + * 3) Reusable content blocks + *********************************************************************/ + +.gBlock { + clear: both; + margin-bottom: 2.5em; +} + +.gBlock h2 { + background-color: #e8e8e8; + padding: .3em .8em; +} -.rtl #gHeader #gLoginMenu { - text-align: left; +.gBlockContent { + margin-top: 1em; } -#gHeader #gSiteAdminMenu { - float: left; - font-size: 1.2em; +/* Status messages ~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gMessage { + width: 99%; } -.rtl #gHeader #gSiteAdminMenu { - float: right; +#gAdminAkismet .gSuccess, +#gSiteStatus li, +#gMessage li { + border: 1px solid #ccc; + margin-bottom: .4em; } -#gHeader #gSiteAdminMenu ul { +#gSiteStatus li { margin-bottom: 0; + border: none; + border-bottom: 1px solid #ccc; } -.gBlock .ui-dialog-titlebar { - margin: -1em -1em 0; +#gSiteStatus .gError, +#gMessage .gError, +form p.gError, +#gSiteStatus .gInfo, +#gMessage .gInfo, +#gSiteStatus .gSuccess, +#gMessage .gSuccess, +#gSiteStatus .gWarning, +#gMessage .gWarning { + background-position: .4em 50%; + background-repeat: no-repeat; + padding: .4em .5em .4em 30px; } -#gSidebar .gBlock h2 { - background: none; +.gError { + background-color: #fcc; +} + +form .gError { + color: #f00; +} + +#gSiteStatus .gError, +#gMessage .gError, +form p.gError { + background-image: url('../images/ico-error.png'); } -#gPhotoStream { +.gInfo { background-color: #e8e8e8; } -#gPhotoStream .gBlockContent ul { - border-right: 1px solid #e8e8e8; - height: 135px; - overflow: auto; - overflow: -moz-scrollbars-horizontal; /* for FF */ - overflow-x: scroll; /* scroll horizontal */ - overflow-y: hidden; /* Hide vertical*/ +#gSiteStatus .gInfo, +#gMessage .gInfo { + background-image: url('../images/ico-info.png'); +} + +.gSuccess { + background-color: #96EF95; +} + +#gSiteStatus .gSuccess, +#gMessage .gSuccess { + background-image: url('../images/ico-success.png'); +} + +.gWarning { + background-color: #ff9; +} + +#gSiteStatus .gWarning, +#gMessage .gWarning { + background-image: url('../images/ico-warning.png'); } -#gContent #gPhotoStream .gItem { +form .gError, +.gPager .gInfo { background-color: #fff; - border: 1px solid #e8e8e8; - border-right-color: #ccc; - border-bottom-color: #ccc; +} + +#gAdminMaintenance .gError, +#gAdminMaintenance .gInfo, +#gAdminMaintenance .gWarning, +#gAdminMaintenance .gSuccess { + background-image: none; +} + +/* Inline layout (forms, lists) ~~~~~~~~~~ */ + +.gShortForm li { float: left; - height: 90px; - overflow: hidden; - text-align: center; - width: 90px; + padding: .4em 0; } -.rtl #gContent #gPhotoStream .gItem { - float: right; +.gShortForm input[type="text"] { + color: #666; + padding: .3em .6em; + width: 11em; } -#gSiteStatus { - margin-bottom: 0; +/*** ****************************************************************** + * 4) Page layout containers + *********************************************************************/ + +/* View container ~~~~~~~~~~~~~~~~~~~~~~~~ */ + +.gView { + background-color: #fff; + border: 1px solid #ccc; + border-bottom: none; +} + +/* Layout containers ~~~~~~~~~~~~~~~~~~~~~ */ + +#gHeader { + background-color: #e8e8e8; + border-bottom: 1px solid #fff; + font-size: .8em; + margin-bottom: 1em; + padding: 1em 20px 0 20px; } -#gContent .gItem { +#gContent { + font-size: 1.2em; + padding-left: 20px; + width: 696px; +} + +#gSidebar { background-color: #fff; + font-size: .9em; + padding: 0 20px; + width: 220px; +} + +#gFooter { + background-color: #e8e8e8; + border-top: 1px solid #ccc; + font-size: .8em; + margin-top: 20px; + padding: 10px 20px; +} + +/** ******************************************************************* + * 5) Content blocks in specific layout containers + *********************************************************************/ + +/* Header ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gHeader #gLogo img { + float: left; + margin: -4px 10px 0 0; +} + +#gHeader #gQuickSearchForm { + clear: right; + float: right; + margin: 1em 0; +} + +#gHeader #gQuickSearchForm input[type='text'] { + width: 17em; +} + +#gContent .gBlock h2 { + background-color: transparent; + padding-left: 0; +} + +#gSidebar .gBlockContent { + padding-left: 1em; +} + +/* Album content ~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gContent #gAlbumGrid { + margin: 1em 0; +} + +#gContent #gAlbumGrid .gItem { border: 1px solid #e8e8e8; border-right-color: #ccc; border-bottom-color: #ccc; - height: 90px; - padding: 14px 8px; + float: left; + font-size: .7em; + height: 240px; + overflow: hidden; + padding: 15px 8px 30px 8px; + position: relative; text-align: center; - width: 90px; + width: 213px; +} + +#gContent #gAlbumGrid .gItem h2 { + margin: 5px 0; } -#gAdminCommentsMenu { +#gContent #gAlbumGrid .gAlbum { + background-color: #e8e8e8; +} + +#gContent #gAlbumGrid .gAlbum h2 span { + background: transparent url('../images/ico-album.png') no-repeat top left !important; + display: inline-block; + height: 16px; + margin-right: 5px; + width: 16px; +} + +/* Individual photo content ~~~~~~~~~~~~~~ */ + +#gContent #gItem { + width: 99%; +} + +#gContent #gPhoto { + position: relative; +} + +#gContent #gItem .gFullSizeLink img { + display: block; + margin: 1em auto !important; +} + +#gContent #gComments { + margin-top: 2em; +} + +#gContent #gComments ul li { margin: 1em 0; } -#gAdminCommentsMenu a { - margin: 0; - padding: .2em .6em; +#gContent #gComments .gAuthor { + border-bottom: 1px solid #ccc; + color: #999; + height: 32px; + line-height: 32px; } -#gAdminGraphics .gAvailable .gBlock { - clear: none; - float: left; - height: 16em; - margin-right: 1em; - width: 30%; +#gContent #gComments ul li div { + padding: 0 8px 8px 43px; +} + +#gContent #gComments ul li #gRecaptcha { + padding: 0; +} + +#gContent #gComments ul li #gRecaptcha div { + padding: 0; +} + +#gContent #gComments .gAvatar { + height: 32px; + margin-right: .4em; + width: 32px; +} + +#gContent #gAddCommentForm { + margin-top: 2em; +} + +/* Footer content ~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gHeader #gLoginMenu li, +#gFooter #gCredits li { + display: inline; +} + +#gHeader #gLoginMenu li { + padding-left: 1.2em; +} + +#gFooter #gCredits li { + padding-right: 1.2em; +} + +#gContent #gSearchResults { + margin-top: 1em; + padding-top: 1em; +} + +/** ******************************************************************* + * 5) Navigation and menus + *********************************************************************/ + +#gSiteMenu, +.gBreadcrumbs, +#gTagCloud ul { + font-size: 1.2em; } -.rtl #gAdminGraphics .gAvailable .gBlock { +/* Login menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gHeader #gLoginMenu { + color: #999; float: right; - margin-left: 1em; - margin-right: 0em; } -#gSiteTheme, -#gAdminTheme { +/* Site Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gSiteMenu { float: left; - width: 48%; + margin-top: 20px; + padding: 0 20px 0 0; } -.rtl #gSiteTheme, -.rtl #gAdminTheme { - float: right; +#gSiteMenu ul { + margin-bottom: 0; +} + +/* Thumb Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gContent .gThumbMenu { + bottom: 0; + left: 0; + position: absolute; + width: 100%; } -#gSiteTheme { - margin-right: 1em; +#gContent .gThumbMenu li { + border-left: none; + border-right: none; + border-bottom: none; } -#gUserAdminList { +#gContent .gThumbMenu li li { + padding: .3em; +} + +#gContent .gThumbMenu a:hover { + text-decoration: none; +} + +/* View Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gViewMenu { margin-bottom: 1em; } -#gUserAdminList td { - vertical-align: bottom; + +#gViewMenu a { + background-repeat: no-repeat; + background-position: 50% 50%; + height: 28px !important; + width: 43px !important; } -#gUserAdminList .gDraggable:hover { - border: 1px dashed black; +#gViewMenu #gHybridLink { + background-image: url('../images/ico-view-hybrid.png'); } -#gUserAdminList .admin { - color: #55f; - font-weight: bold; +#gViewMenu #gSlideshowLink { + background-image: url('../images/ico-view-slideshow.png'); +} + +#gViewMenu .gFullSizeLink { + background-image: url('../images/ico-view-fullsize.png'); } -.gActions a, -.gActions span { - margin-right: 3em; +#gViewMenu #gCommentsLink { + background-image: url('../images/ico-view-comments.png'); +} + +#gViewMenu #gDigibugLink { + background-image: url('../images/ico-print.png'); +} + +/* Breadcrumbs ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +.gBreadcrumbs { + background-color: #fff; + border-top: 1px solid #ccc; + clear: both; + margin: 0 -20px; + padding-left: 20px; } -li.gGroup { +.gBreadcrumbs li { + background: transparent url('../images/ico-separator.gif') no-repeat scroll left center; float: left; + padding: 10px 6px 10px 16px !important; +} + +.gBreadcrumbs li.root { + background: transparent; +} + +.gBreadcrumbs li a, +.gBreadcrumbs li span { display: block; - width: 200px; - border: 1px solid gray; - padding: 0; - margin: 0 1em 1em 0; } -.rtl li.gGroup { - float: right; +.gBreadcrumbs li.active, +.gBreadcrumbs li.active span { + font-weight: bold; } -li.gGroup h4 { - background-color: #EEEEEE; - border-bottom: 1px dashed #CCCCCC; - padding: .5em 0 .5em .5em; +#gAddPhotos .gBreadcrumbs { + font-size: .9em; } -li.gGroup .gButtonLink { - padding: 0; + +/* Tags and cloud ~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gTagCloud ul { + text-align: justify; } -li.gGroup ul, li.gGroup div { - height: 180px; - margin: 1px; - overflow: auto; - padding-top: .2em; + +#gTagCloud ul li { + display: inline; + line-height: 1.5em; + text-align: justify; } -li.gGroup div p { - color: gray; - text-align: center; - padding: 2em .5em 0 .5em + +#gTagCloud ul li a { + text-decoration: none; } -li.gGroup .gUser { - padding: .2em 0 0 .5em; + +#gTagCloud ul li span { + display: none; } -li.gGroup .gUser .gButtonLink { - vertical-align: middle; + +#gTagCloud ul li.size1 a { + color: #9cf; + font-size: 80%; + font-weight: 100; +} + +#gTagCloud ul li.size2 a { + color: #69f; + font-size: 90%; + font-weight: 300; +} + +#gTagCloud ul li.size3 a { + color: #69c; + font-size: 100%; + font-weight: 500; +} + +#gTagCloud ul li.size4 a { + color: #369; + font-size: 110%; + font-weight: 700; } -li.gDefaultGroup h4, li.gDefaultGroup .gUser { - color: gray; +#gTagCloud ul li.size5 a { + color: #0e2b52; + font-size: 120%; + font-weight: 900; } -#gAdminAdvancedSettings tr.setting:hover { - background: #ffc; +#gTagCloud ul li.size6 a { + color: #0e2b52; + font-size: 130%; + font-weight: 900; +} + +#gTagCloud ul li.size7 a { + color: #0e2b52; + font-size: 140%; + font-weight: 900; +} + +#gTagCloud ul li a:hover { + color: #f30; + text-decoration: underline; +} + +/* Pagination ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +.gPager { + clear: both; + margin: 0; + padding: 5px 0 !important; + width: 100%; +} + +.gPager li { + float: left; + margin: 0; + width: 30%; +} + +.gPager .gInfo { + text-align: center; + width: 40%; } /** ******************************************************************* - * 5) Browser hacks + * 6) Browser hacks *********************************************************************/ +#gSiteMenu:after, #gHeader:after, -#gAdminCommentsMenu:after, -#gGroupAdmin:after, -.gSelected:after, -.gAvailable .gBlock:after, -#gModuleCreateForm ul li ul:after, -#gDeveloperTools:after, -#gPhotoStream:after { +.gBreadcrumbs:after, +#gAlbumGrid:after, +.gPager:after, +#gViewMenu:after { clear: both; content: "."; display: block; @@ -316,143 +777,315 @@ li.gDefaultGroup h4, li.gDefaultGroup .gUser { } /** ******************************************************************* - * 6) jQuery and jQuery UI + * 7) jQuery and jQuery UI *********************************************************************/ -#gPanel { - display: none; - padding: 1em; +/* Superfish menu overrides ~~~~~~~~~~~~~~ */ + +.sf-menu li li, .sf-menu li li ul li { + background-color: #bdd2ff; } -#gPanel legend { - display: none; +.sf-menu li:hover { + background-color: #dfe9ff; } -#gPanel fieldset { - border: none; +/* Ajax loading indicator ~~~~~~~~~~~~~~~~ */ + +.gLoadingLarge { + background: #e8e8e8 url('../images/loading-lg.gif') no-repeat center center; + font-size: 0; +} + +.gDialogLoadingLarge { + background: url('../images/loading-lg.gif') no-repeat center center !important; + font-size: 0; } -.ui-draggable { +.gLoadingSmall { + background: #e8e8e8 url('../images/loading-sm.gif') no-repeat center center; + font-size: 0; +} + +.gDraggable { cursor: move; } -.gButtonSetVertical a { - width: 8em !important; +.gDropTarget { + background-color: #cfdeff; + border: 1px dotted #999; + height: 100px; + margin: 1em 0; +} + +/* jQuery UI Dialog ~~~~~~~~~~~~~~~~~~~~~~ */ + +.ui-widget-overlay { + background: #000; + opacity: .7; + filter: Alpha(Opacity=70); } -#gAdminDashboard .ui-dialog-titlebar, -#gAdminDashboardSidebar .ui-dialog-titlebar { - padding: .2em .4em; +#gDialog { + text-align: left; } -/**** Stuff that needs a home! ****/ -#gTagAdmin { - table-layout: fixed; +#gDialog li { + padding-left: 0; } -#gTagAdmin td { - border: 0; + +#gDialog form input[type="text"], +#gDialog form input[type="password"] { + width: 100%; } -#gTagAdmin ul { - padding-bottom: .3em; + +#gDialog #gLoginForm, +#gDialog #gAddUserForm, +#gDialog #gAddGroupForm { + margin: 0 auto; + width: 270px; } -#gTagAdmin li { - padding: .1em 0 .2em .3em; + +#gDialog fieldset { + border: none; } -#gTagAdmin .gColumn { - float: left; - width: 200px; + +#gDialog legend { + display: none; } -.rtl #gTagAdmin .gColumn { - float: right; + +/* jQuery UI ThemeRoller buttons */ + +.gButtonLink { + display: inline-block; + margin: 0 4px 0 0; + padding: .2em .4em; + outline: 0; } -.gEditable { - padding: .1em .3em .2em .3em; + +.gButtonSet { + padding-left: 1px; } -.gEditable:hover { - background-color: #ffc; - cursor: text; + +.gButtonSet li { + float: left; } -#gRenameTagForm input { - padding: 0 .2em 0 .2em; - clear: none; + +.gButtonSet .gButtonLink { + margin: 0; +} + +.ui-icon-left .ui-icon { float: left; - margin: 0 .2em 0 0; + margin-right: .2em; } -.rtl #gRenameTagForm input { + +.ui-icon-right .ui-icon { float: right; + margin-left: .2em; } -#gRenameTagForm input[type="submit"] { - height: 25px; + +.ui-icon-rotate-ccw { + background-position: -192px -64px; } -#gRenameTagForm a, #gRenameTagForm span { - display: block; - float: left; - padding: .2em .2em 0 .1em; + +.ui-icon-rotate-cw { + background-position: -208px -64px; } -.rtl #gRenameTagForm a, #gRenameTagForm span { - float: right; + +/* STUFF THAT NEEDS A HOME */ + +#gMove ul { + padding-left: 1em; } -#gProgress button { - float: right; - margin-top: 1em; + +#gMove .selected { + background: #999; } -.rtl #gProgress button { + +/* Server Add */ + +#gServerAdd button { float: left; + margin-bottom: .5em; } -#gTaskLogDialog h1 { - font-size: 1.1em; +#gServerAddTree { + cursor: pointer; + padding-left: 4px; } -.gTaskLog { - border: 1pt solid; - font-size: .9em; - height: 400px; - margin: .5em 0; +#gServerAddTree li { + padding: 0; + float: none; +} + +#gServerAddTree span.selected { + background: #ddd; +} + +#gServerAddTree { + border: 1px solid #ccc; + height: 25em; overflow: auto; - padding: .5em + margin-bottom: .5em; + padding-top: .5em; + padding-bottom: .5em; } +#gServerAdd ul ul li { + padding-left: 1.2em; +} -/** ******************************************************************* - * 7) Server Add - *********************************************************************/ -#gServerAddAdmin { - margin:auto; - text-align: left; +#gServerAdd .gBreadcrumbs { + font-size: 1em; + padding: 0; + margin: 0; + border-top-width: 0; } -.rtl #gServerAddAdmin { - text-align: right; +#gServerAdd p { + margin: 0; } -#gServerAddAdmin form fieldset { - border: medium none; +#gServerAdd .gBreadcrumbs li { + padding: 10px 6px 10px 16px; } -#gServerAddAdmin legend { - display: none; +/* Permissions ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +#gPermissions .gDenied, +#gPermissions .gAllowed { + text-align: center; + vertical-align: middle; +} +#gPermissions .gDenied { + background-color: #fcc; } +#gPermissions .gAllowed { + background-color: #cfc; +} + +/*************** STUFF THAT NEEDS A HOME ****************/ -#gServerAddAdmin .gWarning { - background-color: #FFFF99; +.gProgressBar { + height: 1em; + width: 100%; + margin-top: .5em; + display: inline-block; } -#gAuthorizedPath { - margin: 0 !important; - padding: 0.3em 1.5em 0.3em 1em; +#gAddPhotos p { + margin: 0; + padding: 0; } -#gServerAdd Admin #path { - width: 80%; +#gAddPhotosCanvas { + height: 325px; + width: 450px; + overflow: auto; } -.gRemoveDir:hover { - cursor: pointer; +#gAddPhotosQueue .progressbar { + height: 4px; } -#gLanguageSettingsForm .checklist li { - width: 150px; - overflow: hidden; +#gAddPhotosQueue .title { + font-size: 1.25em; +} + +#gAddPhotosQueue .status { + font-size: .75em; +} + +#gAddPhotosQueue .box { + margin-bottom: 8px; + padding: 4px; +} + +#gAddPhotosQueue .pending { + background-color: #e8e8e8; + border: 1px solid #d7d7d7; +} + +#gAddPhotosQueue .error { + background-color: #fcc; + border: 1px solid #ebb; +} + +#gAddPhotosQueue .uploading { + background-color: #ff9; + border: 1px solid #ee8; +} + +#gAddPhotosQueue .complete { + background-color: #cfc; + border: 1px solid #beb; +} + +#gAdminG2ImportNotes { + padding-bottom: 20px; +} + +#gAdminG2ImportDetails { + padding-top: 20px; +} + +#gAdminG2ImportDetails .gWarning { + margin-top: 4px; +} + +#gAdminG2ImportDetails .gInfo { + padding: 2px; + border: 1px solid #999; + margin-bottom: 10px; +} + +#gAdminG2ImportNotes p, +#gAdminG2ImportDetails .gInfo p { + padding: 0; + margin: 0; +} + +#gAdminG2ImportNotes ul li, +#gAdminG2Import .gInfo ul li { + padding-left: 0; + margin-left: 20px; + list-style-type: disc; +} + +/* Right to left styles ~~~~~~~~~~~~~~~~~~~~ */ + +.rtl { + direction: rtl; +} + +.rtl caption, +.rtl th, +.rtl #gDialog { + text-align: right; +} + +.rtl #gHeader #gQuickSearchForm, +.rtl #gForgotPasswordLink, +.rtl #gHeader #gLoginMenu, +.rtl .ui-icon-right .ui-icon { + clear: left; + float: left; +} + +.rtl #gDialog .gCancel, +.rtl form ul ul li, +.rtl input[type="submit"], +.rtl input[type="reset"], +.rtl .gShortForm li, +.rtl #gHeader #gLogo img, +.rtl #gContent #gAlbumGrid .gItem, +.rtl #gSiteMenu, +.rtl .gBreadcrumbs li, +.rtl .gPager li, +.rtl .gButtonSet li, +.rtl .ui-icon-left .ui-icon { + float: right; } diff --git a/themes/admin_default/images/ico-album.png b/themes/admin_default/images/ico-album.png Binary files differnew file mode 100644 index 00000000..affa1b84 --- /dev/null +++ b/themes/admin_default/images/ico-album.png diff --git a/themes/admin_default/images/ico-error.png b/themes/admin_default/images/ico-error.png Binary files differnew file mode 100644 index 00000000..c37bd062 --- /dev/null +++ b/themes/admin_default/images/ico-error.png diff --git a/themes/admin_default/images/ico-info.png b/themes/admin_default/images/ico-info.png Binary files differnew file mode 100644 index 00000000..12cd1aef --- /dev/null +++ b/themes/admin_default/images/ico-info.png diff --git a/themes/admin_default/images/ico-print.png b/themes/admin_default/images/ico-print.png Binary files differnew file mode 100644 index 00000000..b82a8e1e --- /dev/null +++ b/themes/admin_default/images/ico-print.png diff --git a/themes/admin_default/images/ico-separator.gif b/themes/admin_default/images/ico-separator.gif Binary files differnew file mode 100644 index 00000000..3de2d0d3 --- /dev/null +++ b/themes/admin_default/images/ico-separator.gif diff --git a/themes/admin_default/images/ico-success.png b/themes/admin_default/images/ico-success.png Binary files differnew file mode 100644 index 00000000..a9925a06 --- /dev/null +++ b/themes/admin_default/images/ico-success.png diff --git a/themes/admin_default/images/ico-view-comments.png b/themes/admin_default/images/ico-view-comments.png Binary files differnew file mode 100644 index 00000000..e5d3630f --- /dev/null +++ b/themes/admin_default/images/ico-view-comments.png diff --git a/themes/admin_default/images/ico-view-fullsize.png b/themes/admin_default/images/ico-view-fullsize.png Binary files differnew file mode 100644 index 00000000..0be23e9b --- /dev/null +++ b/themes/admin_default/images/ico-view-fullsize.png diff --git a/themes/admin_default/images/ico-view-hybrid.png b/themes/admin_default/images/ico-view-hybrid.png Binary files differnew file mode 100644 index 00000000..ee902e55 --- /dev/null +++ b/themes/admin_default/images/ico-view-hybrid.png diff --git a/themes/admin_default/images/ico-view-slideshow.png b/themes/admin_default/images/ico-view-slideshow.png Binary files differnew file mode 100644 index 00000000..82f61f63 --- /dev/null +++ b/themes/admin_default/images/ico-view-slideshow.png diff --git a/themes/admin_default/images/ico-warning.png b/themes/admin_default/images/ico-warning.png Binary files differnew file mode 100644 index 00000000..628cf2da --- /dev/null +++ b/themes/admin_default/images/ico-warning.png diff --git a/themes/admin_default/images/loading-lg.gif b/themes/admin_default/images/loading-lg.gif Binary files differnew file mode 100644 index 00000000..cc70a7a8 --- /dev/null +++ b/themes/admin_default/images/loading-lg.gif diff --git a/themes/admin_default/images/loading-sm.gif b/themes/admin_default/images/loading-sm.gif Binary files differnew file mode 100644 index 00000000..d0bce154 --- /dev/null +++ b/themes/admin_default/images/loading-sm.gif diff --git a/themes/admin_default/js/ui.init.js b/themes/admin_default/js/ui.init.js index 3f062a27..daa6dd70 100644 --- a/themes/admin_default/js/ui.init.js +++ b/themes/admin_default/js/ui.init.js @@ -1,5 +1,4 @@ $(document).ready(function(){ - // Initialize Superfish menus $("#gSiteAdminMenu ul.gMenu").addClass("sf-menu"); $("ul.gMenu").addClass("sf-menu"); @@ -15,23 +14,20 @@ $(document).ready(function(){ $("#gSiteAdminMenu").css("display", "block"); // Initialize status message effects - $("#gMessage li").showMessage(); + $("#gMessage li").gallery_show_message(); // Initialize modal dialogs - var dialogLinks = $(".gDialogLink"); - for (var i=0; i < dialogLinks.length; i++) { - $(dialogLinks[i]).bind("click", handleDialogEvent); - } + $(".gDialogLink").gallery_dialog(); + + // Initialize ajax links + $(".gDialogLink").gallery_ajax(); // Initialize panels - var panelLinks = $(".gPanelLink"); - for (i=0; i<panelLinks.length; i++) { - $(panelLinks[i]).bind("click", handlePanelEvent); - } + $(".gPanelLink").gallery_panel(); if ($("#gPhotoStream").length) { // Vertically align thumbs in photostream - $(".gItem").vAlign(); + $(".gItem").gallery_valign(); } // Apply jQuery UI button css to submit inputs diff --git a/themes/admin_default/theme.info b/themes/admin_default/theme.info index d21b0ff5..b3d9741d 100644 --- a/themes/admin_default/theme.info +++ b/themes/admin_default/theme.info @@ -1,6 +1,6 @@ -name = Gallery Default -description = A crisp Site Administration theme with soft colors and drop down menus. +name = "Gallery Default" +description = "A crisp Site Administration theme with soft colors and drop down menus." version = 1 -author = Gallery Team +author = "Gallery Team" admin = 1 site = 0 diff --git a/themes/admin_default/views/admin.html.php b/themes/admin_default/views/admin.html.php index 575f8a96..3f4128cb 100644 --- a/themes/admin_default/views/admin.html.php +++ b/themes/admin_default/views/admin.html.php @@ -7,28 +7,29 @@ <title><?= t("Admin Dashboard") ?></title> <link rel="shortcut icon" href="<?= url::file("themes/default/images/favicon.ico") ?>" type="image/x-icon" /> - <?= $theme->css("lib/yui/reset-fonts-grids.css") ?> - <?= $theme->css("lib/themeroller/ui.base.css") ?> - <?= $theme->css("lib/superfish/css/superfish.css") ?> - <?= $theme->css("themes/default/css/screen.css") ?> - <?= $theme->theme_css("css/screen.css") ?> + <?= $theme->css("yui/reset-fonts-grids.css") ?> + <?= $theme->css("themeroller/ui.base.css") ?> + <?= $theme->css("superfish/css/superfish.css") ?> + <?= $theme->css("screen.css") ?> + <?= $theme->css("admin_screen.css") ?> <!--[if lt IE 8]> - <link rel="stylesheet" type="text/css" href="<?= $theme->theme_url("css/fix-ie.css") ?>" + <link rel="stylesheet" type="text/css" href="<?= $theme->url("fix-ie.css") ?>" media="screen,print,projection" /> <![endif]--> - <?= $theme->script("lib/jquery.js") ?> - <?= $theme->script("lib/jquery.form.js") ?> - <?= $theme->script("lib/jquery-ui.js") ?> - <?= $theme->script("lib/gallery.common.js") ?> + <?= $theme->script("jquery.js") ?> + <?= $theme->script("jquery.form.js") ?> + <?= $theme->script("jquery-ui.js") ?> + <?= $theme->script("gallery.common.js") ?> <? /* MSG_CANCEL is required by gallery.dialog.js */ ?> <script type="text/javascript"> var MSG_CANCEL = "<?= t('Cancel') ?>"; </script> - <?= $theme->script("lib/gallery.dialog.js") ?> - <?= $theme->script("lib/superfish/js/superfish.js") ?> - <?= $theme->theme_script("js/jquery.dropshadow.js") ?> - <?= $theme->theme_script("js/ui.init.js") ?> + <?= $theme->script("gallery.ajax.js") ?> + <?= $theme->script("gallery.dialog.js") ?> + <?= $theme->script("superfish/js/superfish.js") ?> + <?= $theme->script("jquery.dropshadow.js") ?> + <?= $theme->script("ui.init.js") ?> <?= $theme->admin_head() ?> </head> @@ -45,7 +46,7 @@ <?= $theme->admin_header_top() ?> <ul id="gLoginMenu"> <li class="first"><?= html::anchor("albums/1", "← ".t("Back to the Gallery")) ?></li> - <li id="gLogoutLink"><a href="<?= url::site("logout?continue=albums/1&csrf=$csrf") ?>"><?= t("Logout") ?></a></li> + <li id="gLogoutLink"><a href="<?= url::site("logout?continue=albums/1&csrf=$csrf") ?>"><?= t("Logout") ?></a></li> </ul> <a id="gLogo" href="<?= url::site("albums/1") ?>" title="<?= t("go back to the Gallery") ?>"> ← <?= t("back to the ...") ?> diff --git a/themes/default/css/fix-ie.css b/themes/default/css/fix-ie.css index 3d9604e6..eee88c15 100644 --- a/themes/default/css/fix-ie.css +++ b/themes/default/css/fix-ie.css @@ -1,26 +1,17 @@ /** * Fix display in IE 6, 7 */ -#gHeader, -#gSiteMenu, + +#gBanner, .gBreadcrumbs, #gAlbumGrid, #gPager, -#gViewMenu { +#gViewMenu { zoom: 1; } -#gHeader #gLogo img { - margin-top: 5px; - margin-bottom: 0; -} - -#gHeader #gSiteMenu { - margin-top: 28px; -} - -#gHeader #gQuickSearchForm { - margin-bottom: 0; +#gBanner { + z-index: 2; } input.submit { @@ -44,7 +35,3 @@ input.submit { .gPager .ui-icon-right { width: 60px; } - -#gQuickPane { - height: 32px !important; -}
\ No newline at end of file diff --git a/themes/default/css/screen.css b/themes/default/css/screen.css index 41e51623..55839c57 100644 --- a/themes/default/css/screen.css +++ b/themes/default/css/screen.css @@ -131,7 +131,7 @@ fieldset { padding-bottom: .8em; } -#gHeader fieldset, +#gBanner fieldset, #gSidebar fieldset, .gShortForm fieldset { border: none; @@ -142,7 +142,7 @@ legend { margin-left: 1em; } -#gHeader legend, +#gBanner legend, #gSidebar legend, #gContent #gSearchForm legend, input[type="hidden"], @@ -387,16 +387,21 @@ form .gError, /* Layout containers ~~~~~~~~~~~~~~~~~~~~~ */ #gHeader { + margin-bottom: 1em; +} + +#gBanner { background-color: #e8e8e8; - border-bottom: 1px solid #fff; + border-bottom: 1px solid #ccc; font-size: .8em; - margin-bottom: 1em; - padding: 1em 20px 0 20px; + padding: 1em 20px; + position: relative; } #gContent { font-size: 1.2em; padding-left: 20px; + position: relative; width: 696px; } @@ -421,18 +426,17 @@ form .gError, /* Header ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -#gHeader #gLogo img { - float: left; - margin: -4px 10px 0 0; +#gBanner #gLogo img { + margin: 0; } -#gHeader #gQuickSearchForm { +#gBanner #gQuickSearchForm { clear: right; float: right; - margin: 1em 0; + margin-top: 1em; } -#gHeader #gQuickSearchForm input[type='text'] { +#gBanner #gQuickSearchForm input[type='text'] { width: 17em; } @@ -449,45 +453,74 @@ form .gError, #gContent #gAlbumGrid { margin: 1em 0; + position: relative; + z-index: 1; } #gContent #gAlbumGrid .gItem { - border: 1px solid #e8e8e8; - border-right-color: #ccc; - border-bottom-color: #ccc; + background-color: #fff; + border: 1px solid #fff; float: left; font-size: .7em; - height: 240px; + height: 220px; overflow: hidden; - padding: 14px 8px; + padding: .6em 8px; + position: relative; text-align: center; width: 213px; + z-index: 1; } #gContent #gAlbumGrid .gItem h2 { margin: 5px 0; } +#gContent .gPhoto h2, +#gContent .gItem .gMetadata { + display: none; +} + #gContent #gAlbumGrid .gAlbum { background-color: #e8e8e8; } #gContent #gAlbumGrid .gAlbum h2 span { - background: transparent url('../images/ico-album.png') no-repeat top left !important; + background: transparent url('../images/ico-album.png') no-repeat top left; display: inline-block; height: 16px; margin-right: 5px; width: 16px; } +#gContent #gAlbumGrid #gHoverItem { + background-color: #fff; + border: 1px solid #000; + display: none; + height: auto; + padding: 0; + position: absolute; + width: auto; + z-index: 100; +} + +#gContent #gAlbumGrid #gHoverItem .gItem { + border: none; +} + +#gContent #gHoverItem .gItem h2, +#gContent #gHoverItem .gItem .gMetadata { + display: block; +} + /* Individual photo content ~~~~~~~~~~~~~~ */ #gContent #gItem { + position: relative; width: 99%; } #gContent #gPhoto { - + position: relative; } #gContent #gItem .gFullSizeLink img { @@ -534,12 +567,12 @@ form .gError, /* Footer content ~~~~~~~~~~~~~~~~~~~~~~~~ */ -#gHeader #gLoginMenu li, +#gBanner #gLoginMenu li, #gFooter #gCredits li { display: inline; } -#gHeader #gLoginMenu li { +#gBanner #gLoginMenu li { padding-left: 1.2em; } @@ -557,14 +590,13 @@ form .gError, *********************************************************************/ #gSiteMenu, -.gBreadcrumbs, #gTagCloud ul { font-size: 1.2em; } /* Login menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ -#gHeader #gLoginMenu { +#gBanner #gLoginMenu { color: #999; float: right; } @@ -572,15 +604,63 @@ form .gError, /* Site Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #gSiteMenu { - float: left; - margin-top: 20px; - padding: 0 20px 0 0; + bottom: 0; + display: none; + left: 140px; + position: absolute; } #gSiteMenu ul { - margin-bottom: 0; + margin-bottom: 0 !important; } +/* Context Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + +.gContextMenu { + position: absolute; + bottom: 0; + left: 0; +} + +.gItem .gContextMenu { + display: none; + margin-top: 2em; + width: 100%; +} + +#gItem .gContextMenu { + font-size: .7em; +} + +#gItem .gContextMenu ul { + display: none; +} + +.gContextMenu li { + border-left: none; + border-right: none; + border-bottom: none; +} + +.gContextMenu li a { + display: block; + line-height: 1.6em; +} + +#gHoverItem .gContextMenu { + display: block; +} + +#gHoverItem .gContextMenu li { + text-align: left; +} + +#gHoverItem .gContextMenu a:hover { + text-decoration: none; +} + +/* View Menu ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ + #gViewMenu { margin-bottom: 1em; } @@ -615,11 +695,7 @@ form .gError, /* Breadcrumbs ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .gBreadcrumbs { - background-color: #fff; - border-top: 1px solid #ccc; - clear: both; - margin: 0 -20px; - padding-left: 20px; + padding: 0 20px; } .gBreadcrumbs li { @@ -737,9 +813,7 @@ form .gError, * 6) Browser hacks *********************************************************************/ -#gSiteMenu:after, #gHeader:after, -.gBreadcrumbs:after, #gAlbumGrid:after, .gPager:after, #gViewMenu:after { @@ -797,7 +871,6 @@ form .gError, .ui-widget-overlay { background: #000; opacity: .7; - filter: Alpha(Opacity=70); } #gDialog { @@ -879,24 +952,26 @@ form .gError, /* Server Add */ -.gCheckboxTree input { - display: inline; +#gServerAdd button { + float: left; + margin-bottom: .5em; } -.gCheckboxTree li { - padding: 0; - float: none; +#gServerAddTree { + cursor: pointer; + padding-left: 4px; } -.gCheckboxTree .ui-icon { - cursor: pointer; +#gServerAddTree li { + padding: 0; + float: none; } -.gFile { - padding-left: 2.5em; +#gServerAddTree span.selected { + background: #ddd; } -#gServerAdd #gServerAddTree { +#gServerAddTree { border: 1px solid #ccc; height: 25em; overflow: auto; @@ -909,10 +984,6 @@ form .gError, padding-left: 1.2em; } -#gServerAdd ul li .gFile { - padding-left: 2.5em; -} - #gServerAdd .gBreadcrumbs { font-size: 1em; padding: 0; diff --git a/themes/default/js/ui.init.js b/themes/default/js/ui.init.js index 9d9d3079..2391f638 100644 --- a/themes/default/js/ui.init.js +++ b/themes/default/js/ui.init.js @@ -1,8 +1,5 @@ /** - * Initialize jQuery UI and Plugin elements - * - * @todo Standardize how elements requiring listeners are handled - * http://docs.jquery.com/Events/live + * Initialize jQuery UI and Gallery Plugin elements */ var shortForms = new Array( @@ -26,15 +23,11 @@ $(document).ready(function() { $("#gSiteMenu").css("display", "block"); // Initialize status message effects - $("#gMessage li").showMessage(); + $("#gMessage li").gallery_show_message(); // Initialize dialogs - $(".gMenuLink").addClass("gDialogLink"); $("#gLoginLink").addClass("gDialogLink"); - var dialogLinks = $(".gDialogLink"); - for (var i=0; i < dialogLinks.length; i++) { - $(dialogLinks[i]).bind("click", handleDialogEvent); - } + $(".gDialogLink").gallery_dialog(); // Initialize view menu if ($("#gViewMenu").length) { @@ -50,21 +43,78 @@ $(document).ready(function() { // Apply jQuery UI button css to submit inputs $("input[type=submit]:not(.gShortForm input)").addClass("ui-state-default ui-corner-all"); + // Apply styles and icon classes to gContextMenu + if ($(".gContextMenu").length) { + $(".gContextMenu li").addClass("ui-state-default"); + $(".gContextMenu a").addClass("gButtonLink ui-icon-left"); + $(".gContextMenu a").prepend("<span class=\"ui-icon\"></span>"); + $(".gContextMenu a span").each(function() { + var iconClass = $(this).parent().attr("class").match(/ui-icon-.[^\s]+/).toString(); + $(this).addClass(iconClass); + }); + } + // Album view only if ($("#gAlbumGrid").length) { // Vertical align thumbnails/metadata in album grid - $(".gItem").vAlign(); + $(".gItem").gallery_valign(); + + // Initialize context menus + $(".gItem").hover( + function(){ + var position = $(this).position(); + var item_classes = $(this).attr("class"); + var bg_color = $(this).css("background-color"); + var container = $(this).parent(); + $("#gHoverItem").remove(); + container.append("<div id=\"gHoverItem\"><div class=\"" + item_classes + "\">" + + $(this).html() + "</div></div>"); + $("#gHoverItem").css("top", position.top); + $("#gHoverItem").css("left", position.left); + $("#gHoverItem").css("background-color", bg_color); + $.fn.gallery_hover_init(); + var v_align = $(this).find(".gValign"); + var title = $(this).find("h2"); + var meta = $(this).find(".gMetadata"); + var context = $(this).find(".gContextMenu"); + var context_label = $(this).find(".gContextMenu li:first"); + $("#gHoverItem .gItem").height( + $(v_align).gallery_height() + + $(title).gallery_height() + + $(meta).gallery_height() + + parseInt($(context).css("margin-top").replace("px","")) + + $(context_label).gallery_height() + ); + + $("#gHoverItem").fadeIn("fast"); + $("#gHoverItem").hover( + function(){ + $(this).gallery_context_menu(); + }, + function() { + $(this).hide(); + } + ); + } + ); } - // Photo/Item item view only + // Photo/Item item view if ($("#gItem").length) { - // Ensure that sized image versions - // fit inside their container - sizedImage(); + // Ensure the resized image fits within its container + $("#gItem").gallery_fit_photo(); + + // Initialize context menus + var resize = $("#gItem").gallery_get_photo(); + $(resize).hover(function(){ + $(this).gallery_context_menu(); + }); // Collapse comments form, insert button to expand if ($("#gAddCommentForm").length) { - var showCommentForm = '<a href="#add_comment_form" class="showCommentForm gButtonLink ui-corner-all ui-icon-left ui-state-default right"><span class="ui-icon ui-icon-comment"></span>' + ADD_A_COMMENT + '</a>'; + var showCommentForm = '<a href="#add_comment_form"' + + ' class="showCommentForm gButtonLink ui-corner-all ui-icon-left ui-state-default right">' + + '<span class="ui-icon ui-icon-comment"></span>' + ADD_A_COMMENT + '</a>'; $("#gAddCommentForm").hide(); $("#gComments").prepend(showCommentForm); $(".showCommentForm").click(function(){ @@ -78,32 +128,9 @@ $(document).ready(function() { duration: 1000, hash: true }); - } - // Add hover state for buttons - $(".ui-state-default").hover( - function(){ - $(this).addClass("ui-state-hover"); - }, - function(){ - $(this).removeClass("ui-state-hover"); - } - ); + // Initialize button hover effect + $.fn.gallery_hover_init(); }); - -/** - * Reduce width of sized photo if it's wider than its parent container - */ -function sizedImage() { - var containerWidth = $("#gItem").width(); - var oPhoto = $("#gItem img").filter(function() { - return this.id.match(/gPhotoId-/); - }); - if (containerWidth < oPhoto.width()) { - var proportion = containerWidth / oPhoto.width(); - oPhoto.width(containerWidth); - oPhoto.height(proportion * oPhoto.height()); - } -} diff --git a/themes/default/theme.info b/themes/default/theme.info index 71e8a740..5f19d0d7 100644 --- a/themes/default/theme.info +++ b/themes/default/theme.info @@ -1,6 +1,6 @@ -name = Gallery Default -description = A crisp and distinctive theme that uses large fonts and icons for easy navigation and an enjoyable browsing experience. +name = "Gallery Default" +description = "A crisp and distinctive theme that uses large fonts and icons for easy navigation and an enjoyable browsing experience." version = 1 -author = Gallery Team +author = "Gallery Team" site = 1 admin = 0 diff --git a/themes/default/views/album.html.php b/themes/default/views/album.html.php index 65ea3381..e2890482 100644 --- a/themes/default/views/album.html.php +++ b/themes/default/views/album.html.php @@ -19,7 +19,7 @@ <?= $child->thumb_img(array("class" => "gThumbnail")) ?> </a> <?= $theme->thumb_bottom($child) ?> - <?= $theme->thumb_menu($child) ?> + <?= $theme->context_menu($child, "#gItemId-{$child->id} .gThumbnail") ?> <h2><span></span><a href="<?= $child->url() ?>"><?= p::clean($child->title) ?></a></h2> <ul class="gMetadata"> <?= $theme->thumb_info($child) ?> diff --git a/themes/default/views/header.html.php b/themes/default/views/header.html.php index 5428d9fd..2ba1e923 100644 --- a/themes/default/views/header.html.php +++ b/themes/default/views/header.html.php @@ -1,19 +1,19 @@ <?php defined("SYSPATH") or die("No direct script access.") ?> -<?= $theme->header_top() ?> -<? if ($header_text = module::get_var("gallery", "header_text")): ?> -<?= $header_text ?> -<? else: ?> -<a id="gLogo" href="<?= url::site("albums/1") ?>" title="<?= t("go back to the Gallery home") ?>"> - <img width="107" height="48" alt="<?= t("Gallery logo: Your photos on your web site") ?>" src="<?= $theme->theme_url("images/logo.png") ?>" /> -</a> -<? endif ?> - -<div id="gSiteMenu" style="display: none"> -<?= $theme->site_menu() ?> +<div id="gBanner"> + <?= $theme->header_top() ?> + <? if ($header_text = module::get_var("gallery", "header_text")): ?> + <?= $header_text ?> + <? else: ?> + <a id="gLogo" href="<?= url::site("albums/1") ?>" title="<?= t("go back to the Gallery home") ?>"> + <img width="107" height="48" alt="<?= t("Gallery logo: Your photos on your web site") ?>" src="<?= $theme->url("images/logo.png") ?>" /> + </a> + <? endif ?> + <div id="gSiteMenu"> + <?= $theme->site_menu() ?> + </div> + <?= $theme->header_bottom() ?> </div> -<?= $theme->header_bottom() ?> - <? if (!empty($parents)): ?> <ul class="gBreadcrumbs"> <? foreach ($parents as $parent): ?> diff --git a/themes/default/views/movie.html.php b/themes/default/views/movie.html.php index 66c80ded..c8ecd769 100644 --- a/themes/default/views/movie.html.php +++ b/themes/default/views/movie.html.php @@ -2,16 +2,29 @@ <div id="gItem"> <?= $theme->photo_top() ?> - <ul id="gPager"> - <li><?= t("%position of %total", array("position" => $position, "total" => $sibling_count)) ?></li> - <? if ($previous_item): ?> - <li><span class="ui-icon ui-icon-seek-prev"></span><a href="<?= $previous_item->url() ?>"><?= t("previous") ?></a></li> - <? endif ?> - <? if ($next_item): ?> - <li><a href="<?= $next_item->url() ?>"><?= t("next") ?></a><span class="ui-icon ui-icon-seek-next"></span></li> - <? endif ?> + <ul class="gPager"> + <li> + <? if ($previous_item): ?> + <a href="<?= $previous_item->url() ?>" class="gButtonLink ui-icon-left ui-state-default ui-corner-all"> + <span class="ui-icon ui-icon-triangle-1-w"></span><?= t("previous") ?></a> + <? else: ?> + <a class="gButtonLink ui-icon-left ui-state-disabled ui-corner-all"> + <span class="ui-icon ui-icon-triangle-1-w"></span><?= t("previous") ?></a> + <? endif; ?> + </li> + <li class="gInfo"><?= t("%position of %total", array("position" => $position, "total" => $sibling_count)) ?></li> + <li class="txtright"> + <? if ($next_item): ?> + <a href="<?= $next_item->url() ?>" class="gButtonLink ui-icon-right ui-state-default ui-corner-all"> + <span class="ui-icon ui-icon-triangle-1-e"></span><?= t("next") ?></a> + <? else: ?> + <a class="gButtonLink ui-icon-right ui-state-disabled ui-corner-all"> + <span class="ui-icon ui-icon-triangle-1-e"></span><?= t("next") ?></a> + <? endif ?> + </li> </ul> + <?= $item->movie_img(array("class" => "gMovie", "id" => "gMovieId-{$item->id}")) ?> <div id="gInfo"> @@ -23,4 +36,5 @@ var ADD_A_COMMENT = "<?= t("Add a comment") ?>"; </script> <?= $theme->photo_bottom() ?> + <?= $theme->context_menu($item, "#gMovieId-{$item->id}") ?> </div> diff --git a/themes/default/views/page.html.php b/themes/default/views/page.html.php index 181a2c46..2cb71b9e 100644 --- a/themes/default/views/page.html.php +++ b/themes/default/views/page.html.php @@ -23,13 +23,13 @@ <? endif ?> <? endif ?> </title> - <link rel="shortcut icon" href="<?= $theme->theme_url("images/favicon.ico") ?>" type="image/x-icon" /> - <?= $theme->css("lib/yui/reset-fonts-grids.css") ?> - <?= $theme->css("lib/superfish/css/superfish.css") ?> - <?= $theme->css("lib/themeroller/ui.base.css") ?> - <?= $theme->theme_css("css/screen.css") ?> + <link rel="shortcut icon" href="<?= $theme->url("images/favicon.ico") ?>" type="image/x-icon" /> + <?= $theme->css("yui/reset-fonts-grids.css") ?> + <?= $theme->css("superfish/css/superfish.css") ?> + <?= $theme->css("themeroller/ui.base.css") ?> + <?= $theme->css("screen.css") ?> <!--[if lt IE 8]> - <link rel="stylesheet" type="text/css" href="<?= $theme->theme_url("css/fix-ie.css") ?>" + <link rel="stylesheet" type="text/css" href="<?= $theme->url("css/fix-ie.css") ?>" media="screen,print,projection" /> <![endif]--> <? if ($theme->page_type == 'album'): ?> @@ -45,26 +45,27 @@ </style> <? endif ?> <? endif ?> - <?= $theme->script("lib/jquery.js") ?> - <?= $theme->script("lib/jquery.form.js") ?> - <?= $theme->script("lib/jquery-ui.js") ?> - <?= $theme->script("lib/gallery.common.js") ?> + <?= $theme->script("jquery.js") ?> + <?= $theme->script("jquery.form.js") ?> + <?= $theme->script("jquery-ui.js") ?> + <?= $theme->script("gallery.common.js") ?> <? /* MSG_CANCEL is required by gallery.dialog.js */ ?> <script type="text/javascript"> var MSG_CANCEL = "<?= t('Cancel') ?>"; </script> - <?= $theme->script("lib/gallery.dialog.js") ?> - <?= $theme->script("lib/gallery.form.js") ?> - <?= $theme->script("lib/superfish/js/superfish.js") ?> - <?= $theme->script("lib/jquery.localscroll.js") ?> - <?= $theme->theme_script("js/ui.init.js") ?> + <?= $theme->script("gallery.ajax.js") ?> + <?= $theme->script("gallery.dialog.js") ?> + <?= $theme->script("gallery.form.js") ?> + <?= $theme->script("superfish/js/superfish.js") ?> + <?= $theme->script("jquery.localscroll.js") ?> + <?= $theme->script("ui.init.js") ?> <? /* These are page specific, but if we put them before $theme->head() they get combined */ ?> <? if ($theme->page_type == "photo"): ?> - <?= $theme->script("lib/jquery.scrollTo.js") ?> - <?= $theme->script("lib/gallery.show_full_size.js") ?> + <?= $theme->script("jquery.scrollTo.js") ?> + <?= $theme->script("gallery.show_full_size.js") ?> <? elseif ($theme->page_type == "movie"): ?> - <?= $theme->script("lib/flowplayer.js") ?> + <?= $theme->script("flowplayer.js") ?> <? endif ?> <?= $theme->head() ?> diff --git a/themes/default/views/photo.html.php b/themes/default/views/photo.html.php index bf4d9da3..fa5def47 100644 --- a/themes/default/views/photo.html.php +++ b/themes/default/views/photo.html.php @@ -5,7 +5,7 @@ <script> $(document).ready(function() { $(".gFullSizeLink").click(function() { - show_full_size("<?= $theme->item()->file_url() ?>", "<?= $theme->item()->width ?>", "<?= $theme->item()->height ?>"); + $.gallery_show_full_size("<?= $theme->item()->file_url() ?>", "<?= $theme->item()->width ?>", "<?= $theme->item()->height ?>"); return false; }); }); @@ -47,6 +47,7 @@ </a> <? endif ?> <?= $theme->resize_bottom($item) ?> + <?= $theme->context_menu($item, "#gPhotoId-{$item->id}") ?> </div> <div id="gInfo"> |
