From 2b4b4defe64da8b5c3c06bd9a46fe3ea59f1a0c6 Mon Sep 17 00:00:00 2001 From: vdigital Date: Tue, 16 Sep 2008 21:02:20 +0000 Subject: CSS review including Advisor mode git-svn-id: http://piwigo.org/svn/trunk@2541 68402e56-0260-453c-a942-63ccdbb3a9ee --- .../goto/theme/roma/images/header_msgs-bg.gif | Bin 0 -> 44 bytes admin/template/goto/theme/roma/theme.css | 35 ++++----- plugins/admin_advices/admin_advices.tpl | 12 +-- template/yoga/header.tpl | 2 +- .../yoga/theme/Sylvia/images/header_msgs-bg.gif | Bin 0 -> 44 bytes template/yoga/theme/Sylvia/theme.css | 81 ++++++--------------- 6 files changed, 46 insertions(+), 84 deletions(-) create mode 100644 admin/template/goto/theme/roma/images/header_msgs-bg.gif create mode 100644 template/yoga/theme/Sylvia/images/header_msgs-bg.gif diff --git a/admin/template/goto/theme/roma/images/header_msgs-bg.gif b/admin/template/goto/theme/roma/images/header_msgs-bg.gif new file mode 100644 index 000000000..0879e1b79 Binary files /dev/null and b/admin/template/goto/theme/roma/images/header_msgs-bg.gif differ diff --git a/admin/template/goto/theme/roma/theme.css b/admin/template/goto/theme/roma/theme.css index a5adbbd07..64ef78e52 100644 --- a/admin/template/goto/theme/roma/theme.css +++ b/admin/template/goto/theme/roma/theme.css @@ -7,7 +7,6 @@ INPUT[type="submit"], INPUT[type="reset"], INPUT[type="file"], select, textarea color:#444; background-color: #eee; } input.rateButton, legend, #theAdminPage h3 { color: #777; } #theAdminPage h2 { color: #333; } - .content .infos { color: #3f6; border:0; background-color: transparent; padding:5px 0px 0pt 10pt; min-height: 48px; text-align:left; } .content .infos li, .content .errors li { list-style-type:none; } @@ -15,12 +14,10 @@ padding:5px 0px 0pt 10pt; min-height: 48px; text-align:left; } padding:5px 0px 0pt 10pt; min-height: 48px; text-align:left; font-weight:bold; } #copyright { color:#777; margin:60px auto 0px 240px; text-align:center; padding-bottom: 15px; } -.header_notes { -background: transparent url(../../../../../template/yoga/icon/note.png) no-repeat right top; +.header_notes { background: transparent url(../../icon/note.png) no-repeat right top; border:0; font-weight:bold; min-height: 48px; padding:15px 60px 0 0; position:absolute; right:0; text-align:right; top:90px; width:550px; } - html, body { min-height: 100%; } body { margin: 0; padding: 0; background:#111111 url(images/bottom-left-bg.png) no-repeat fixed left bottom; } @@ -34,7 +31,7 @@ background:transparent url(images/piwigo_logo_sombre_214x100.png) no-repeat scro h3, #imageToolBar a:hover, .row1, .content { background-color: #222; } .row2 { background-color:#111; } #content { background: #222 url(images/fillet.png) repeat-x top left; min-height: 466px; } -.content { padding:0px 5px 5px 5px; margin: 0 10px 0 248px; z-index:99; } +.content { padding:5px 5px 5px 5px; margin: 0 10px 0 248px; z-index:99; } .content h3 { font-size:20px; letter-spacing:-0.4px; margin:0 20px 12px 0; text-align:right; background:none; border: 0; } .content h4 { font-size:14px; text-align:left; padding:3px; margin: 2px;} @@ -44,7 +41,8 @@ letter-spacing:0.1em; margin-right:30px; text-align:right; color: #777; text-transform:none; font-weight:bold; padding-left:20px; } .content dl, dd { margin:5px; } .content div.titrePage { height:55px; } -.instructions { text-align: left; padding: 20px 20px 0 20px; } +.instructions { height:450px; overflow:scroll; padding:0 20px 0; text-align:left; } +.instructions { overflow-y:scroll; overflow-x:hidden; } .instructions h3 { text-align: center; margin: 30px 0 0 0; } .throw, td h3 { background-image: url(images/fillet.png); background-repeat: repeat-x; } @@ -70,16 +68,16 @@ a.Piwigo { font-family: verdana, arial, helvetica, sans-serif !important; font-size: 11px; font-weight: normal; letter-spacing: 0; color : #f36; text-decoration: none; border: 0; color: #f36; } - * { outline-width: 0; } a { color:#f70; border-color: #FF3363; } a:hover { color: #f33; border-color: #FF3363; } - h2 { display:block; font-size:28px; letter-spacing:-1px; margin:0 20px; height:95px; overflow:hidden; padding:0; position:absolute; right:0; text-align:right; top:0; width:770px; } -.header_msgs { background-color:transparent; } -.HelpActions a { border:0; margin:4px 14px 0 0; position:absolute; right:0; } +.header_msgs { background:transparent url(images/header_msgs-bg.gif) repeat scroll right top; +border:0; color:#333; font-size:24px; height:30px; left:0; margin:0; padding:10px 0 0; position:absolute; +text-align:center; top:0; width:100%; z-index:99; } +.HelpActions a { border:0; margin:-14px 14px 0 0; position:absolute; right:0; } .HelpActions li {list-style-image:none; list-style-position:outside; list-style-type:none; text-align:center; text-indent:0pt; } #content.content div.comment a.illustration{ margin-right: 30px;} @@ -89,19 +87,18 @@ background-color:transparent; border:0; display:table; float:right; font-family:verdana,arial,helvetica,sans-serif; font-size:8px; line-height:14px; list-style-image:none; padding: 0; position:relative; text-decoration:none; top:-2px; white-space:nowrap; margin: 0 28px 0 0;} -.tabsheet li { float:left; margin: 0 8px; text-align:right; overflow: hidden; -background:transparent url(images/inactive_tab2.png) no-repeat scroll right 5px; } +.tabsheet li { background:transparent url(images/inactive_tab2.png) no-repeat scroll right 0; +float:left; margin:0 5px; overflow:hidden; text-align:right; } .tabsheet a { -background:transparent url(images/inactive_tab.png) no-repeat scroll left 5px; +background:transparent url(images/inactive_tab.png) no-repeat scroll left 0px; color:#777; display:block; font-size:11px; text-transform:capitalize; border:0; -font-weight:bold; height:28px; overflow:hidden; padding:12px 7px 5px 18px; line-height: 18px; +font-weight:bold; height:28px; overflow:hidden; padding:7px 7px 5px 18px; line-height: 18px; text-align:right; text-decoration:none; margin: 0 4px 0 0; } .tabsheet li:hover, .tabsheet li.selected_tab { -background:transparent url(images/active_tab2.png) no-repeat scroll right 5px; } +background:transparent url(images/active_tab2.png) no-repeat scroll right 0px; } .tabsheet a:hover, .tabsheet li.selected_tab a { color: #F36; -background:transparent url(images/active_tab.png) no-repeat scroll left 5px; } -.tabsheet a span { background-color: #222; font-size: 10px; } - +background:transparent url(images/active_tab.png) no-repeat scroll left 0px; } +.tabsheet a span { background-color:#222; display:block; font-size:10px; padding:0 3px; } #debug { margin-left:248px; font-size:12px; } /* menubar is on all admin pages => No specific css file */ #menubar { @@ -133,4 +130,4 @@ color: #F70; border-bottom: 1px dotted #F70;} #menubar li.external { list-style-image:url(images/external_inactive.png); padding:10px 0px 0pt 10px; } #menubar li.external:hover { list-style-image:url(images/external_active.png); } #menubar ul { color: #333; margin:10px 0pt 3px 9px; - list-style-type: square; list-style-position: inside; padding: 0 0 0 2px; } + list-style-type: square; list-style-position: inside; padding: 0 0 0 2px; } \ No newline at end of file diff --git a/plugins/admin_advices/admin_advices.tpl b/plugins/admin_advices/admin_advices.tpl index 7afcaf561..aed952217 100644 --- a/plugins/admin_advices/admin_advices.tpl +++ b/plugins/admin_advices/admin_advices.tpl @@ -17,17 +17,17 @@ {$thumbnail.IMAGE_ALT} - {$thumbnail.IMAGE_ALT} {'Name'|@translate}
- {$thumbnail.IMAGE_ALT} {'Description'|@translate}
- {$thumbnail.IMAGE_ALT} {'Author'|@translate}
- {$thumbnail.IMAGE_ALT} {'Creation date'|@translate}
- {$thumbnail.IMAGE_ALT} {'Metadata'|@translate}
- {$thumbnail.IMAGE_ALT} {'Tags'|@translate} ({$thumbnail.NUM_TAGS}) {/if} diff --git a/template/yoga/header.tpl b/template/yoga/header.tpl index dc1b6a799..e6e289612 100644 --- a/template/yoga/header.tpl +++ b/template/yoga/header.tpl @@ -61,7 +61,7 @@ {if not empty($header_msgs)}
{foreach from=$header_msgs item=elt} -

{$elt}

+ {$elt}
{/foreach}
{/if} diff --git a/template/yoga/theme/Sylvia/images/header_msgs-bg.gif b/template/yoga/theme/Sylvia/images/header_msgs-bg.gif new file mode 100644 index 000000000..0879e1b79 Binary files /dev/null and b/template/yoga/theme/Sylvia/images/header_msgs-bg.gif differ diff --git a/template/yoga/theme/Sylvia/theme.css b/template/yoga/theme/Sylvia/theme.css index e0c357470..e2e3d26cf 100644 --- a/template/yoga/theme/Sylvia/theme.css +++ b/template/yoga/theme/Sylvia/theme.css @@ -1,30 +1,22 @@ /* $Id$ */ - .content div.thumbnailCategory div.illustration { width:190px !important; /* Usable range 162px-360px , optimal : Thumbnail width + 40px */ } .content div.thumbnailCategory { height: 180px !important; /* Usable range 172px-250px , optimal : Thumbnail height + 30px */ } - /* Sylvia Theme is close to the Roma Admin theme */ - -BODY, H1, H3, DT, -INPUT.rateButtonSelected { color:#d0d0d0; } - +BODY, H1, H3, DT, INPUT.rateButtonSelected { color:#ddd; } H2, #menubar DT { color: #666; } - -/* backgrounds */ -/* H3, */ #imageHeaderBar, #imageToolBar A:hover { background-color: transparent; } - -body { -background:#111111 url(images/bottom-left-bg.jpg) no-repeat fixed left bottom; +#imageHeaderBar, #imageToolBar A:hover { background-color: transparent; } +BODY { background:#111 url(images/bottom-left-bg.jpg) no-repeat fixed left bottom; margin:0; min-height: 100%; height: 100%; padding:0; } -#the_page { -background:transparent url(images/top-left-bg.jpg) no-repeat scroll left top; -left:0; margin:0; padding:0; position:absolute; top:0; z-index:0; -width: 100%; min-width: 100%; } +#the_page { background:transparent url(images/top-left-bg.jpg) no-repeat scroll left top; +left:0; margin:0; padding:0; position:absolute; top:0; z-index:0; width: 100%; min-width: 100%; } #mbIdentification p, .totalImages { color: #333; } -.header_notes { background-color: #222; border: 1px solid #000; margin:0 7px -12px 290px; padding-top:0;} +.header_msgs { background:transparent url(images/header_msgs-bg.gif) repeat scroll right top; +border:0; color:#333; font-size:24px; left:0; margin:0; padding:10px 0 6px 0; position:absolute; +text-align:center; top:0; width:100%; z-index:99; } +.header_notes { border:0; color:#333; margin:0; padding:12px 44px 0 0; position:absolute; +right:9px; top:48px; z-index:99; background-position: right top; } #menubar DL { background:transparent url(images/menuBox_top.gif) no-repeat scroll left top; -margin:0 0 5px 40px; padding:0; width: 231px; min-width: 231px; border: 0; -min-height: 32px; overflow-x: hidden;} +margin:0 0 5px 40px; padding:0; width: 231px; min-width: 231px; border: 0; min-height: 32px; overflow-x: hidden;} #imageHeaderBar H2 { border: 0; } #menubar DT { background-color:#111; border:0; display:inline; margin-left:8px; text-align:left; } #menubar DD { background:transparent url(images/menuBox_bottom.gif) no-repeat scroll left bottom; @@ -36,8 +28,7 @@ margin:0; } #menubar UL { color: #333; font-size: 16px; line-height: 13px; } #menubar LI { padding-left: 12px; } #menubar A, .menuInfoCat { font-size: 13px; } -#menubar form { background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom; -margin:0; } +#menubar form { background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom; margin:0; } #menubar DL#mbIdentification { background:transparent url(images/menuId_top.gif) no-repeat scroll left top !important;} #menubar #mbIdentification DD { background:transparent url(images/menuId_bottom.gif) no-repeat scroll left bottom; } #menubar #mbIdentification UL, #menubar #mbIdentification p, @@ -50,14 +41,11 @@ margin:0; } #menubar #mbIdentification .button { height:24px; right:0px; top:0px; } #menubar #mbIdentification fieldset { border:0; margin:0 24px 0 23px; } #menubar #mbIdentification legend { display: none; } -#content { background:#222 url(images/fillet.gif) repeat-x scroll left top; -min-height:466px; } -/* borders */ -.content { border: 1px solid #000000; border-top: 0; margin:21px 7px 0 290px; padding-top:7px; } +#content { background:#222 url(images/fillet.gif) repeat-x scroll left top; min-height:466px; } +.content { border: 1px solid #000; border-top: 0; margin:21px 7px 0 290px; padding-top:7px; } .content h2 { margin:0; padding:0px 10px 15px 15px; border:0;} #content ul.thumbnailCategories li { -background:#222 url(images/cat_bottom-right.gif) no-repeat scroll right bottom; -width:49%; margin: 0; padding:0; } +background:#222 url(images/cat_bottom-right.gif) no-repeat scroll right bottom; width:49%; margin: 0; padding:0; } .content div.thumbnailCategory { background:transparent url(images/cat_bottom-left.gif) no-repeat scroll left bottom; padding: 0; margin:0; } #content .thumbnailCategory div.illustration { background:transparent url(images/cat_top-left.gif) no-repeat scroll left top; @@ -66,39 +54,16 @@ padding: 0 0 0 10px; margin: 0; } #content .thumbnailCategory div.description { background:transparent url(images/cat_top-right.gif) no-repeat scroll right top; margin:0; padding:15px 0 0 0; } #content .thumbnailCategory div.description p { overvflow: hidden; } - #content.content .thumbnailCategory div.description H3 { display: block; margin: 0; } #content ul.thumbnailCategories li:hover { background-color:#111; } #imageHeaderBar .imageNumber { margin-right:170px; } #imageHeaderBar .browsePath { margin-left:125px; } -H2, #imageToolBar { - border-bottom: 1px solid #000000; -} - -FIELDSET, INPUT, SELECT, TEXTAREA { - border: 1px solid gray; -} - +H2 { border-bottom: 1px solid #000000; } +FIELDSET, INPUT, SELECT, TEXTAREA { border: 1px solid #666; } .content UL.thumbnails SPAN.wrap2 { - border: 1px solid #aaaaaa; /* thumbnails border color and style */ - border-radius: 4px 4px; /* round corners with CSS3 compliant browsers */ -} - -.content UL.thumbnails SPAN.wrap2:hover { - background-color: #faebd7; - border:1px solid #ff3363; /* thumbnails border color when mouse cursor is over it */ - color: black; -} - - -/* links */ -A, INPUT.rateButton { - color: #f70; outline: none; - border: none; -} - -A:hover, A:active { - color: #f33; border: 0; outline: none; -} - -.virtual_cat { background: #3f3f3f; } +border: 1px solid #666; /* thumbnails border color and style */ +border-radius: 4px 4px; /* round corners with CSS3 compliant browsers */ } +.content UL.thumbnails SPAN.wrap2:hover { color: #666; +background-color: #111; border:1px solid #ff3363; /* thumbnails border color when mouse cursor is over it */ } +A, INPUT.rateButton { color: #f70; outline: none; border: none;} +A:hover, A:active { color: #f33; border: 0; outline: none; } \ No newline at end of file -- cgit v1.2.3