modification: instructions are displayed by blocks that can be expanded

individually. The icon doesn't fit with roma theme currently.


git-svn-id: http://piwigo.org/svn/branches/2.0@3009 68402e56-0260-453c-a942-63ccdbb3a9ee

3 files changed, 8 insertions, 4 deletions

diff --git a/admin/template/goto/icon/collapse.png b/admin/template/goto/icon/collapse.png
new file mode 100644
index 000000000..a2566d534
--- /dev/null
+++ b/admin/template/goto/icon/collapse.png
diff --git a/admin/template/goto/icon/expand.png b/admin/template/goto/icon/expand.png
new file mode 100644
index 000000000..d4aa7b76b
--- /dev/null
+++ b/admin/template/goto/icon/expand.png
diff --git a/admin/template/goto/theme/roma/theme.css b/admin/template/goto/theme/roma/theme.css
index 2b3a21cc1..5e4d1f1d2 100644
--- a/admin/template/goto/theme/roma/theme.css
+++ b/admin/template/goto/theme/roma/theme.css
@@ -47,10 +47,14 @@ text-transform:none; font-weight:bold; padding-left:20px; width:54%; }
 
 .content dl, dd { margin:5px; }
 .content div.titrePage { height:55px; }
-.instructions { height:450px; overflow:scroll; padding:0 20px 0; text-align:left; margin-bottom: 20px;
-font-size:14px; line-height:21px; }
-.instructions { overflow-y:scroll; overflow-x:hidden; }
-.instructions  h3 { text-align: center; margin: 30px 0 0 0; }
+
+.instructions { text-align:left;}
+.instructionBlock {border: 1px solid #666; margin: 5px; overflow: hidden;}
+.instructionBlockHeaderCollapsed, .instructionBlockHeaderExpanded {font-size:110%; cursor: pointer; overflow: hidden; background-repeat: no-repeat; background-position: left center; padding-left: 20px; background-color: #111; padding: 5px 20px; color: #ff3363;}
+.instructionBlockHeaderCollapsed { background-image: url(../../icon/expand.png);}
+.instructionBlockHeaderExpanded { background-image: url(../../icon/collapse.png);}
+.instructionBlockContent { padding:5px;}
+
 .content ul.thumbnails span.wrap2:hover { background-color:#111; border:1px solid #FF3363; color:#666; }
 .content ul.thumbnails span.wrap2 { border:1px solid #666; padding: 4px; }
 .content ul.thumbnails span.wrap2 { -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -moz-border-radius-topleft:4px; -moz-border-radius-topright:4px; }