aboutsummaryrefslogtreecommitdiffstats
path: root/themes/elegant/theme.css
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--themes/elegant/theme.css324
1 files changed, 189 insertions, 135 deletions
diff --git a/themes/elegant/theme.css b/themes/elegant/theme.css
index 1997d5dc6..c6b072249 100644
--- a/themes/elegant/theme.css
+++ b/themes/elegant/theme.css
@@ -1,183 +1,237 @@
-/* colors & backgrounds */
+/* backgorunds */
-html, body {background-color:#111;}
+html, body { background-color: #111;}
-body {margin: 5px 0;}
+#content, .content { background-color: #222;}
+.content .titrePage { background-color: #111;}
-a:hover {border-bottom:none;}
+#menubar, #the_page #menuSwitcher.menuhidden { background-color: #222;}
-#menuswitcher {
- display:block;
- font-size:200%;
- text-align:center;
- float:left;
- height:33px;
- cursor:pointer;
- margin: 28px 0 0 -35px;
-}
+#thePicturePage, #imageHeaderBar { background-color: #111;}
+#imageInfos, #infoSwitcher.infohidden { background-color: #333;}
+#thePicturePage #comments { background-color: #333;}
-#menubar,
-#menuswitcher.menuhidden {
- border-radius : 0 10px 10px 0;
- background-color: #222;
- border: solid 1px #333;
- border-width: 2px 2px 2px 0;
-}
+.switchBox, .header_notes { background-color: #555;}
+.thumbnailCategory, .commentElement { background-color: #333;}
+.message { background-color: #666;}
-#menuswitcher.menuhidden {
- width:25px;
- margin-left:0;
-}
+INPUT[type="text"], INPUT[type="password"],
+INPUT[type="button"], INPUT[type="submit"],
+INPUT[type="reset"], INPUT[type="file"] { background-color: #999;}
+INPUT:focus, SELECT:focus, TEXTAREA:focus { background-color: #ccc;}
-/* content */
-#content.menushown, #the_page > .content.menushown { margin-left:240px;}
-#content.menuhidden, #the_page > .content.menuhidden { margin-left:35px;}
-#content, #the_page > .content { margin-right:0;}
+/* font colors */
-#content,.content {
- background-color: #222;
- border-bottom: 2px solid #444;
- margin-bottom: 4px;
- padding-bottom: 4px;
-}
+body, legend { color: #aaa;}
+a { color: #ccc;}
+a:hover { color: #fff;}
+INPUT.rateButton { color: #fff;}
+H1, H3, INPUT.rateButtonSelected { color: #ccc;}
+.message { color: #fff;}
+.commentContent .comments_toggle:hover { color: #fff;}
-#thePicturePage #content {padding-bottom:0;}
-.content .titrePage {
- background-color: #111;
- border-bottom: 2px solid #444;
- padding:0;
- margin-bottom:4px;
-}
+/* borders */
-.content .titrePage H2 {
- line-height: 20px;
- margin: 0;
- padding: 8px 0 0 2px;
-}
+#content,.content, .content .titrePage { border-bottom: 2px solid #444;}
+#imageHeaderBar { border: solid 0 #444; border-bottom-width:2px;}
+#copyright { border-top-width:2px;}
+.switchBox { border: 1px solid #000;}
+.switchBoxTitle { border-bottom: 1px solid #444;}
+FIELDSET, INPUT, SELECT, TEXTAREA { border: 1px solid #999;}
+
+
+/* icons */
+.pwg-icon { background-image: url(../default/s26/outline_808080.png);}
+A:hover .pwg-icon { background-image: url(../default/s26/outline_ffffff.png);}
-body { color: #999;}
-a { color: #ccc;}
-a:hover { color: #fff;}
+/* general rules */
+
+body { margin: 5px 0;}
+a:hover { border-bottom: none;}
+#copyright { padding:0 4px 0 0; text-align:right;}
+
+
+/* content */
+
+#the_page #content.menushown, #the_page > .content.menushown, .contentWithMenu { margin-left: 240px;}
+#the_page #content.menuhidden, #the_page > .content.menuhidden { margin-left: 35px;}
+#the_page #content, #the_page > .content { margin-right: 0;}
+
+#content,.content { margin-bottom: 4px; padding-bottom: 4px;}
+#thePicturePage #content { padding-bottom: 0;}
+.content .titrePage { padding:0; margin-bottom:4px;}
+.content .titrePage H2 { line-height: 20px; margin: 0; padding: 8px 0 0 2px;}
/* menubar */
-#menubar {
+#menubar {
+ display: inline;
+ width: 230px;
float: left;
- margin: 28px 13px 10px 0;
+ margin: 28px 8px 10px 0;
padding: 0;
- display: inline;
- width: 225px;
}
+#menubar DT { text-align: left;}
+#menubar dd { padding: 0 0 1em 1em;}
+#menubar .pwg-icon-filter { display: none;}
-#menubar DT { color: #999; text-align:left;}
-#menubar DT a { color: #ccc;}
-#menubar DT a:hover { color: #fff;}
-#menubar dd { padding: 0 0 1em 1em;}
-/* text color */
-BODY, H1, H3,
-INPUT.rateButtonSelected /* <= why IE doesn't inherit this ? */ {
- color:#d0d0d0;
-}
+/* switchers */
-#menubar .pwg-icon-filter {display:none;}
+#menuSwitcher {
+ display: block;
+ text-align: center;
+ height: 32px;
+ cursor: pointer;
+ float: left;
+ margin: 28px 0 0 -34px;
+}
+#imageInfos, #infoSwitcher.infohidden { border-radius: 10px 0 0 10px;}
+#menubar, #the_page #menuSwitcher.menuhidden { border-radius: 0 10px 10px 0;}
+#the_page #menuSwitcher.menuhidden { width: 25px; margin-left: 0;}
+#infoSwitcher {
+ display: block;
+ text-align: center;
+ height: 32px;
+ cursor: pointer;
+ position:absolute;
+ left:75%;
+ top:0;
+ margin: 10px 0 0 7px;
+ z-index:99;
+}
-/* backgrounds */
+#infoSwitcher.infohidden {
+ width:25px;
+ top:10px;
+ right:0;
+ left:auto;
+ margin:0;
+}
+#theImage.infohidden { width: 100%;}
-#imageToolBar, #imageHeaderBar, #derivativeSwitchBox, #sortOrderBox, .header_notes {
- background-color: #505050;
-}
+#commentsSwitcher { float: left; margin:3px 0; cursor:pointer;}
+.noCommentContent #commentsSwitcher { display: none;}
-#imageHeaderBar H2 {
- background-image: none;
-}
+.switchArrow { width: 16px; height: 16px; margin: 8px 5px 8px 4px;}
+.switchArrow { background: transparent url("icon/arrows_ccc.png");}
+.switchArrow:hover { background: transparent url("icon/arrows_fff.png");}
+.menuhidden .switchArrow { background-position: 0 0;}
+.menushown .switchArrow { background-position: -16px 0;}
+.infohidden .switchArrow { background-position: -16px 0;}
+.infoshown .switchArrow { background-position: 0 0;}
+.commentshidden .switchArrow { background-position: -48px 0;}
+.commentsshown .switchArrow { background-position: -32px 0;}
-#imageHeaderBar {
- border-top: 1px solid #000;
-}
-/* borders */
-#derivativeSwitchBox, #sortOrderBox {
- border: 2px solid #444;
-}
+/* switchboxes */
-.switchBoxTitle {
- border-bottom:2px solid #444;
+.switchBox {
+ border-radius: 4px 4px 4px 4px;
+ padding: 0.5em 10px;
+ text-align: left;
+ z-index: 100;
}
+.switchBox .switchCheck { width: 18px; text-align: left; display: inline-block; line-height:17px;}
+.switchBox .switchUnselected { margin-left: 18px; line-height:17px;}
-.derivativeSizeDetails {display:none}
-FIELDSET, INPUT, SELECT, TEXTAREA {
- border: 1px solid gray;
-}
+/* thumbnails */
+#thumbnails { padding-top: 5px;}
+.thumbnails IMG { margin-bottom: 0; vertical-align: middle;}
+.thumbnailCategory DIV.illustration,
+.commentElement DIV.illustration { margin: 2px; text-align: center;}
-.thumbnails IMG {margin-bottom:0; vertical-align:middle;}
-.thumbnailCategory DIV.illustration, .commentElement DIV.illustration {margin: 2px; text-align:center;}
/* picture page */
-#thePicturePage {background-color:#111;}
-#imageHeaderBar { border: solid 0 #444; padding:0 0 0 10px;}
-.contentWithMenu #imageHeaderBar {padding:0;}
-#copyright {border-top-width:2px;}
-#imageHeaderBar {border-bottom-width:2px; width:auto; background:#111}
-#imageToolBar {background:none;}
-#imageToolBar {margin-top: -28px; margin-bottom:0;}
-#theImage {padding-top:10px;}
-#imageHeaderBar .browsePath {display:inline-block; float:none; font-size:120%; line-height:20px; padding: 8px 0 0 2px; font-weight:bold; margin:0;}
-#imageHeaderBar .imageNumber {display:inline-block; float:none; line-height:20px; padding: 8px 0 0 12px; font-weight:bold; margin:0;}
-#imageHeaderBar .imageNumber:before {content:'['}
-#imageHeaderBar .imageNumber:after {content:']'}
-#imageHeaderBar h2 {font-size:100%;}
-#thePicturePage .pwg-button {width:26px;}
-#thePicturePage .actionButtons {margin-right: 26px;}
-#imageToolBar {float:right;}
-
-#thePicturePage #comments {padding-top:12px; padding-bottom:12px;}
-#thePicturePage #comments h3 {margin-top:10px; margin-bottom:10px;}
-#thePicturePage #comments form { margin-bottom:10px;}
-#thePicturePage #comments fieldset{margin-top: 0; margin-bottom:0;}
-.noCommentText {display:block;}
-#copyright {padding:4px 4px 0 0; text-align:right;}
-
-#thePicturePage .comments_toggle_on:before {content:'(+) '}
-#thePicturePage .comments_toggle_off:before {content:'(-) '}
-
-.comments_hidden ul, .comments_hidden form {display:none;}
-.thumbnailCategory, .commentElement {background-color: #333;}
-.comments_toggle {cursor: pointer;}
-.comments_toggle:hover {color:#fff;}
-
-#the_page .content .stuffs {margin:0!important}
-
-#thumbnails {padding-top: 5px;}
-
-INPUT[type="text"], INPUT[type="password"], INPUT[type="button"], INPUT[type="submit"], INPUT[type="reset"], INPUT[type="file"] {background-color:#999;}
-INPUT:focus, SELECT:focus, TEXTAREA:focus {background-color:#ccc;}
-
-/* links */
-INPUT.rateButton {
- color: #fff;
+
+.contentWithMenu #imageHeaderBar { padding: 0;}
+#imageHeaderBar { padding: 0 0 0 10px;}
+#imageHeaderBar { width: auto;}
+#imageHeaderBar h2 { font-size: 100%; font-weight: inherit;}
+#imageHeaderBar .browsePath {
+ display:inline-block;
+ float:none;
+ font-size:120%;
+ line-height:20px;
+ padding: 8px 0 0 2px;
+ font-weight:bold;
+ margin:0;
}
+.imageNumber { display: inline-block; float: right; line-height: 26px; margin-right: 2px; min-width: 40px; text-align: center;}
+#imageToolBar { margin-top: -28px; margin-bottom: 0; float: right;}
+#thePicturePage .pwg-button { width: 26px;}
+#thePicturePage .actionButtons { margin-right: 26px;}
-.pwg-icon {
- background-image: url(../default/s26/outline_808080.png);
+#theImageAndInfos {
+ display: block;
+ width: 100%;
+ position: relative;
+}
+#theImage {
+ display: inline-block;
+ width: 75%;
+ vertical-align: top;
+ overflow: auto;
+ padding: 10px 0 5px 0;
}
-A:hover .pwg-icon {
- background-image: url(../default/s26/outline_ffffff.png);
+.rateButtonStarFull { background: url('icon/rating-stars.png') no-repeat -16px center; width:16px;}
+.rateButtonStarEmpty { background: url('icon/rating-stars.png') no-repeat 0 center; width:16px;}
+
+
+/* image infos */
+
+#imageInfos {
+ display: inline-block;
+ width: 24.5%;
+ vertical-align: top;
+ padding-top: 35px;
+ padding-bottom: 5px;
+ margin: 10px 0 10px 0.5%;
+ word-wrap:break-word;
}
-.message {
- color:white;
- background-color:#666;
-} \ No newline at end of file
+#imageInfos .navThumbs { width: 250px; height: 130px; margin: auto; padding: 0 5px;}
+#imageInfos .navThumb { position: relative; width: 120px; height: 120px; margin: 0; overflow: hidden;}
+#imageInfos #linkPrev { float: left;}
+#imageInfos #linkNext { float: right;}
+#imageInfos .thumbHover { position: absolute; width: 100%; height: 100%;}
+#imageInfos .prevThumbHover { background: transparent url(icon/none.png) no-repeat center center;}
+#imageInfos .prevThumbHover:hover { background: transparent url(icon/img_prev.png) no-repeat center center;}
+#imageInfos .nextThumbHover { background: transparent url(icon/none.png) no-repeat center center;}
+#imageInfos .nextThumbHover:hover { background: transparent url(icon/img_next.png) no-repeat center center;}
+
+#imageInfos dl { padding: 0 15px;}
+#imageInfos dt { font-weight: bold;}
+#imageInfos dd { margin: 0 0 5px 20px;}
+#imageInfos h3 { margin: 20px 0 10px;}
+
+
+/* image comments */
+
+#thePicturePage #comments { padding: 2px 5px;}
+#thePicturePage #comments h3 { margin: 10px 0;}
+#thePicturePage #comments form { margin-bottom: 10px;}
+#thePicturePage #comments fieldset { margin: 0 1em;}
+
+.noCommentText { display:block;}
+.commentshidden ul,
+.commentshidden form {display:none;}
+.commentContent .comments_toggle {cursor: pointer;}
+
+
+/* plugins */
+
+#the_page .content .stuffs { margin: 0!important}
+.categoryActions .theme_menuf { display: none;} \ No newline at end of file