diff options
| author | momo-i <momo-i@ampache> | 2010-05-14 02:45:29 +0000 |
|---|---|---|
| committer | momo-i <momo-i@ampache> | 2010-05-14 02:45:29 +0000 |
| commit | 9e98e5b261f213aa6a37471a63b740c190090e31 (patch) | |
| tree | f6f343c2a24e1bb139cb8cc2d1084f22b10bc081 /themes | |
| parent | c4ea23c83bc3744a196fcda23c1551ecc258333d (diff) | |
| download | ampache-9e98e5b261f213aa6a37471a63b740c190090e31.tar.gz ampache-9e98e5b261f213aa6a37471a63b740c190090e31.tar.bz2 ampache-9e98e5b261f213aa6a37471a63b740c190090e31.zip | |
test add: layout for rtl language.
The file was just copied except classic theme.
classic theme was only replaced from right(or left) to left(or right).
ex: float: left -> float: right
Diffstat (limited to 'themes')
| -rw-r--r-- | themes/classic/templates/default-rtl.css | 780 | ||||
| -rw-r--r-- | themes/greysme/templates/default-rtl.css | 813 | ||||
| -rw-r--r-- | themes/penguin/templates/default-rtl.css | 1030 |
3 files changed, 2623 insertions, 0 deletions
diff --git a/themes/classic/templates/default-rtl.css b/themes/classic/templates/default-rtl.css new file mode 100644 index 00000000..2ea769f6 --- /dev/null +++ b/themes/classic/templates/default-rtl.css @@ -0,0 +1,780 @@ +/*
+
+ Copyright (c) Ampache.org
+ All rights reserved.
+
+ This program is free software; you can redistribute it and/or
+ modify it under the terms of the GNU General Public License v2
+ as published by the Free Software Foundation
+
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License
+ along with this program; if not, write to the Free Software
+ Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+
+*/
+
+
+/************************************************/
+/* Unify default browsers style rules */
+/************************************************/
+h1, h2, h3, h4, h5, h6, pre, code { font-size: 1em; line-height: 1em; } /* avoid browser default inconsistent font-sizes */
+ol, ul { list-style: none; }
+table { border-collapse: separate; border-spacing: 0; }
+caption, th, td { text-align: right; font-weight: normal; }
+* { margin: 0; padding: 0; } /* White space reset */
+a img, :link img, :visited img { border: 0; } /* no blue linked image borders */
+
+
+/************************************************/
+/* General style rules */
+/************************************************/
+body {
+ background:#d3d3d3;
+ font-family:Arial, Helvetica, Sans-Serif;
+ min-width:1000px;
+}
+p {
+ color: #000;
+ margin:1em 0;
+}
+a, a:visited, a:active {
+ color: #000;
+ font-family: Verdana, Helvetica, sans-serif;
+}
+td {
+ padding: 0 8px;
+ color: #000;
+ font:12px Verdana, Helvetica, sans-serif;
+}
+th {
+ padding-right: 10px;
+ font-family: Verdana, Helvetica, sans-serif;
+ font-size:13px;
+ font-weight:bold;
+}
+input, select, textarea{
+ font: 12px Verdana, Helvetica, sans-serif;
+ background: #ddd;
+ color: #000;
+}
+input {
+ font-weight: bold;
+}
+
+/************************************************/
+/* IE6 behaviors */
+/* - csshover2: :hover support on any element */
+/************************************************/
+body { behavior:url("templates/csshover2.htc"); }
+
+/************************************************/
+/* Float Clearer */
+/************************************************/
+/* float clearing for IE6 */
+* html .clearfix{ height: 1%; overflow: visible; }
+/* float clearing for IE7 */
+/**+html .clearfix{ min-height: 1%; }*/
+/* float clearing for everyone else */
+.clearfix:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
+
+/************************************************/
+/* XSPF Player */
+/************************************************/
+.xspf_player {
+ left: 20px;
+ position: absolute;
+}
+
+/************************************************/
+/* Main Container */
+/************************************************/
+#maincontainer{}
+
+/************************************************/
+/* Header */
+/************************************************/
+#header {
+ height: 85px;
+ padding: 3px 0 0 10px;
+}
+#headerbox {
+ float: left;
+ font-size: 10px;
+}
+#headerlogo, #headerlogo a{
+ float: right;
+}
+.box_headerbox {display:table;}
+.box_headerbox #loginInfo {font-weight:bold;display:block;text-align:left;margin-bottom:.3em;}
+
+#play_type_switch {
+ float:right;
+ margin-top:2px;
+}
+
+/************************************************/
+/* Content block */
+/************************************************/
+#content {
+ margin: 20px 135px 20px 135px;
+}
+
+/************************************************/
+/* Footer */
+/************************************************/
+#footer {
+ clear:both;
+ text-align:center;
+ font-size:10px;
+ padding:3px;
+}
+
+/************************************************/
+/* Buttons */
+/************************************************/
+.button, input[type=button], input[type=submit] {
+ border: 1px solid #f0f0f0;
+ border-color: #f0f0f0 #a0a0a0 #a0a0a0 #f0f0f0;
+ background: #d0d0d0;
+ padding: 0 1px;
+ font-size: 11px;
+ font-weight:bold;
+ text-decoration:none;
+ cursor: pointer;
+}
+a.button{padding:1px 3px;}
+
+/************************************************/
+/* Sidebar */
+/************************************************/
+#sidebar{
+ position:absolute;
+ top:100px;
+ right:0;
+ width:120px;
+ padding-top:28px;
+ background:#c0c0c0 url(../images/sidebar_top.jpg) no-repeat;
+ font-size:0.9em;
+}
+
+#sidebar select { width: 95%; }
+#sidebar input { vertical-align:middle; background:#fff; }
+#sidebar ul { list-style:none; }
+#sidebar a { text-decoration:none; }
+
+
+/* For sidebar tabs */
+/********************/
+#sidebar-tabs{
+ border-top:1px solid #8b8b8b;
+}
+
+#sidebar-tabs li.sb1 {
+ float: right;
+ padding:2px;
+ background: #c0c0c0 ;
+}
+#sidebar-tabs li.active {
+ background: #fff url(../images/top.gif) repeat-x 0 0;
+ margin-top:8px;
+}
+#sidebar-tabs li.active img{
+ margin-top:4px;position:relative;z-index:2;
+}
+
+/* Tabs content */
+/****************/
+#sidebar-page {
+ position:absolute;
+ right:0;
+ top:52px;
+ background: #fff url(../images/bottom.gif) 0 100% repeat-x;
+ padding-bottom:0.5em;
+ border-left:2px solid #c0c0c0;
+ font-size: 0.8em;
+ width:118px;
+}
+#sidebar-page ul.sb2 {
+ padding:2px 4px;
+}
+#sidebar-page ul.sb2 li{
+ font-weight:bold;
+ margin:1em auto;
+ padding-bottom: 0.5em;
+ border-bottom: 1px solid #666;
+}
+#sidebar-page ul.sb2 h4{ padding-bottom: 0.5em; }
+
+#sidebar-page ul.sb3, #sidebar-page div.sb3 {
+ font-size:0.9em;
+ margin-right:2px;
+ font-weight:normal;
+ color:#5b5b5b;
+}
+#sidebar-page div.sb3 input[type=radio] {
+ margin-right:2px;
+}
+
+#sidebar-page ul.sb3 li{
+ margin:0;
+ padding:0;
+ border:none;
+ font-weight:normal;
+}
+* html #sidebar-page ul.sb3 li{display:inline;} /* fix ie6 */
+
+#sidebar-page .sb3 a{
+ padding:0.1em;
+ border-bottom:1px dotted #c0c0c0;
+ color:#5b5b5b;
+}
+
+
+#sidebar-page a{
+ display:block;
+}
+#sidebar-page a:hover {
+ background:#99ccff;
+ color:#fff;
+}
+
+/* SIDEBAR : Home */
+/******************/
+
+/* SIDEBAR : Browse */
+/********************/
+.alphabet {
+ background:transparent; /* fix ie bug */
+ font-size:0.95em;
+ font-weight:normal;
+ margin: 0.3em auto;
+ color:#5b5b5b;
+}
+.alphabet span.link {
+ cursor: pointer;
+ margin: 0;
+ padding:0 5px;
+ font-family: monospace, Courier, Georgia;
+}
+.alphabet span.active{ background:#5b5b5b; color:#fff; }
+.alphabet span.link:hover {
+ background: #99ccff;
+ color:#fff;
+}
+
+#multi_alpha_filter {
+ width:40px;
+ margin-bottom:4px;
+}
+
+/* SIDEBAR : Localplay */
+/***********************/
+.active_instance {
+ background:#99ccff;
+}
+
+/* SIDEBAR : Preferences */
+/*************************/
+
+/* SIDEBAR : Admin */
+/*******************/
+#sb_admin_catalogs li.sb_admin_catalogs_ctrls img {margin:0;}
+#sb_admin_catalogs li.sb_admin_catalogs_ctrls a{
+ display:inline;
+ padding:0;
+ border:none;
+}
+
+
+/************************************************/
+/* XSPF Player */
+/************************************************/
+#xspf_player {
+ width:400px;
+ float: right;
+ background:#fff;
+ font-family: Verdana,Helvetica,sans-serif;
+}
+
+/************************************************/
+/* Rightbar */
+/************************************************/
+#rightbar {
+ width:120px;
+ background:#fff;
+ padding-top:28px;
+ background:#c0c0c0 url(../images/rightbar_top.jpg) no-repeat;
+ float:left;
+ font-family: Verdana,Helvetica,sans-serif;
+ clear:both;
+}
+#rightbar ul { list-style:none; }
+#rightbar a { text-decoration:none; }
+
+
+/* Rightbar Menu */
+#rightbar #rb_action {
+ border-top:1px solid #8b8b8b;
+ padding:4px;
+}
+#rightbar #rb_action li { display:inline; }
+
+#rightbar li#rb_add, #rightbar li#pl_add { position:relative; z-index:10;}
+#rightbar li#rb_add:hover, #rightbar li#pl_add:hover { background:#99ccff; }
+/* Rightbar AddItems SubMenu */
+#rightbar li:hover .submenu { display:block; }
+#rightbar .submenu {
+ display:none;
+ position:absolute;
+ left:0px;
+ top:18px;
+ background:#fff;
+ border:2px solid #c0c0c0;
+ width:120px;
+ font-size:0.7em;
+ padding:0.3em;
+}
+* html #rightbar .submenu {right:100px;} /* IE6 fix */
+
+#rightbar .submenu a {
+ display:block;
+ padding:0.1em;
+ border-bottom:1px dotted #c0c0c0;
+ color:#5b5b5b;
+ text-decoration:none;
+ text-align:left;
+}
+
+#rightbar .submenu a:hover,
+#rightbar #rb_current_playlist a:hover { background:#99ccff; color:#fff; }
+
+/* Rightbar playlist */
+#rightbar #rb_current_playlist {
+ background: #fff url(../images/bottom.gif) 0 100% repeat-x;
+ padding-bottom:0.5em;
+ border-left:2px solid #c0c0c0;
+ border-right:2px solid #c0c0c0;
+}
+#rightbar #rb_current_playlist li { position:relative; font-size:0.6em;line-height:14px; color:#5b5b5b; padding-left:20px;}
+#rightbar #rb_current_playlist li a { display:block; padding:0.2em;}
+#rightbar .delitem { position:absolute;left:0;top:0; }
+
+/* Rightbar Localplay Controls */
+#rightbar #localplay-control {
+ padding-right: 5px;
+}
+#localplay-control span {
+ cursor: pointer;
+}
+
+
+/************************************************/
+/* Styles for the star ratings */
+/************************************************/
+.star-rating {
+ position:relative;
+}
+.dynamic-star-rating{
+ width:95px;
+}
+.star-rating ul,
+.star-rating a:hover,
+.star-rating .current-rating{
+ background: url(../../../images/ratings/star_rating.gif) right -1000px repeat-x;
+}
+.star-rating ul{
+ position:relative;
+ width:80px;
+ height:15px;
+ overflow:hidden;
+ list-style:none;
+ margin:0;
+ padding:0;
+ background-position: right top;
+}
+.star-rating li{
+ display: inline;
+}
+.star-rating a, .star-rating span,
+.star-rating .current-rating{
+ position:absolute;
+ top:0;
+ right:0;
+ text-indent:-1000em;
+ height:15px;
+ line-height:15px;
+ outline:none;
+ overflow:hidden;
+ border:none;
+}
+.star-rating .star1 { width:20%; z-index:6; }
+.star-rating .star2 { width:40%; z-index:5; }
+.star-rating .star3 { width:60%; z-index:4; }
+.star-rating .star4 { width:80%; z-index:3; }
+.star-rating .star5 { width:100%; z-index:2;}
+.star-rating .current-rating { z-index:1; background-position: right bottom; }
+
+.star-rating a.star0 {
+ right:0px;
+ width:16px;
+ background: url(../../../images/ratings/x_off.gif) right top;
+}
+
+/* hovering effect only for dynamic star rating */
+.dynamic-star-rating a:hover {
+ background-position: right center;
+}
+.dynamic-star-rating a:hover.star0 {
+ background: url(../../../images/ratings/x.gif) right top;
+}
+.dynamic-star-rating ul {
+ right:16px;
+}
+
+/************************************************/
+/* Box Related Styles */
+/************************************************/
+
+.box-title {
+ border-bottom: solid 1px #000;
+ font-size: 1.05em;
+ font-weight: bold;
+ margin: 0 10px;
+}
+.box-list {
+ padding-left: 10px;
+}
+
+/* Enclosing Boxes Styles */
+
+.box, .info-box {
+ background: #f7f7f7 url(../images/left.gif) top right repeat-y;
+ float:left;
+ clear:left;
+ height:1%; /* IE6 : Holly Hack comes to rescue once again */
+}
+.box-inside {
+ background: url(../images/right.gif) top left repeat-y;
+}
+.box-content {
+ padding:8px 15px;
+}
+
+.box-top {
+ background: url(../images/top.gif) 0 0 repeat-x;
+ position:relative;
+}
+.box-left-top {
+ background: url(../images/topleft.gif) no-repeat;
+ height:16px;
+ width:16px;
+ position:relative;right:0;top:0;
+}
+.box-right-top {
+ background: url(../images/topright.gif) no-repeat;
+ height:16px;
+ width:20px;
+ position:absolute;left:0;top:0;
+}
+* html .box-right-top {left: expression(-this.parentNode.offsetWidth%2+"px");} /* Fixes an IE6 rounding error */
+.box-bottom {
+ background: url(../images/bottom.gif) 0 0 repeat-x;
+ position:relative;clear:both;
+}
+.box-left-bottom {
+ background: url(../images/bottomleft.gif) no-repeat;
+ height:18px;
+ width:16px;
+ position:relative;right:0;top:0;
+}
+.box-right-bottom {
+ background: url(../images/bottomright.gif) no-repeat;
+ height:18px;
+ width:20px;
+ position:absolute;left:0;top:0;
+}
+* html .box-right-bottom {left: expression(-this.parentNode.offsetWidth%2+"px");} /* Fixes an IE6 rounding error */
+
+
+/* Specific to Info Boxes */
+.info-box { float:right;margin-left:10px; }
+.album_art { float:right; margin-left:10px; }
+#information_actions { margin-right:5px; font-size:0.7em; float:right; }
+#information_actions h3 { font-size:1.2em; margin:0.2em; }
+
+/* Specific boxes */
+.box_newest_albums {}
+.box_newest_artists {clear:none;}
+.box_newest_genres {clear:none;}
+.box_popular_album {}
+.box_popular_artists {clear:none;}
+.box_popular_genres {clear:none;}
+.box_preferences h4 {color:#000;font:bold 14px Verdana, Helvetica, sans-serif;padding:0.8em 0;}
+
+
+/************************************************/
+/* Tables (songs lists...) */
+/************************************************/
+.tabledata .th-top, .tabledata .th-bottom {
+ font-size:1.1em;
+ vertical-align: top;
+ text-align:center;
+}
+
+.tableform select {
+ width: 150px;
+}
+
+/* table rows */
+.tabledata .odd, .tabledata .odd td,
+.tabledata .even, .tabledata .even td, .row-highlight {
+ font-size: 12px;
+ border-bottom:1px dotted #c0c0c0;
+}
+.tabledata .even:hover, .tabledata .odd:hover {
+ background:#9cf;
+}
+.row-highlight:hover {
+ background:#c33;
+}
+
+
+/* Misc */
+.border { background: #000; }
+.tabledata input, .tabledata select{ margin:2px 0;}
+
+/* specific cells */
+td.cel_cover{padding:6px;}
+.cel_select, .cel_action, .cel_date, .cel_applytoall, .cel_level {text-align:center;}
+/* specific cells : users login state */
+.user_online{background:#0f0;}
+.user_offline{background:#7f0000;}
+.user_disabled{background:#ccc;}
+
+/* specific tables */
+#recently_played .th-bottom {display:none;}
+.box_preferences .th-bottom {display:none;}
+
+/* Inline Editing Tables */
+.inline-edit input, .inline-edit select {
+ font-size: 0.8em;
+}
+
+/************************************************/
+/* Song details */
+/************************************************/
+dl.song_details{font-size:0.8em;}
+.song_details dt {
+ float:right;
+ clear:both;
+ width:20%;
+ min-width:20%; /*Ie bugfix*/
+ font-weight:bold;
+}
+.song_details dd {
+ float:right;
+ width:79%;
+ min-width:79%; /*Ie bugfix*/
+ margin:0 0 0.2em .3em;
+ padding-right:.2em;
+}
+dt + dd {border-bottom:1px dotted #c0c0c0;}
+dt:hover, dt:hover + dd {background:#9cf;}
+
+/************************************************/
+/* Albums of the moment */
+/************************************************/
+.random_album{
+ position:relative;
+ float:right;
+ padding:8px;
+ width:80px;
+}
+
+.random_album .play_album{
+ display:none;
+}
+
+/************************************************/
+/* Now Playing */
+/************************************************/
+#now_playing{
+}
+
+.np_row {
+ padding: 3px;
+ float:right;
+ font-size:0.75em;
+ display:block;
+
+}
+.np_cell {
+ padding-right:5px;
+ margin-right:5px;
+}
+
+.np_row label {
+ display:block;
+ font-weight:bold;
+ margin:2px 0 0 -5px;
+}
+
+.np_group {
+ float:right;
+ padding-left:15px;
+}
+
+.np_row a {
+ font-size:0.8em;
+}
+
+/************************************************/
+/* Shoutbox */
+/************************************************/
+
+#shoutbox {
+ font-size:0.8em;
+}
+
+#shoutbox div.shout {
+ padding-top:0.5em;
+ margin:10px 5px 0 0;
+ border-top:1px dotted #c0c0c0;
+}
+#shoutbox div.shout:hover {border-top:1px solid #9cf;}
+
+#shoutbox span.information {}
+#shoutbox .shouttext {display:block;font-size:.9em;margin-top:.5em;}
+img.shoutboximage { margin:0 3px;}
+
+#shoutbox div.odd{margin-left:20%;text-align:right;}
+#shoutbox div.even{margin-right:20%;text-align:left;}
+#shoutbox .odd img.shoutboximage {float:right;}
+#shoutbox .even img.shoutboximage {float:left;}
+
+/************************************************/
+/* List Header */
+/************************************************/
+.list-header{margin:7px 0; padding:0 4em; text-align:center; font-size: 0.8em;position:relative;}
+.list-header .prev{position:absolute; top:0; right:0;}
+.list-header .next{position:absolute; top:0; left:0;}
+.list-header .selected{background: #e0e0e0;}
+.list-header .page-nb{padding:1px;border: 1px solid #ccc;text-decoration: none;}
+.list-header .page-nb:hover{background: #d0d0d0;}
+
+/************************************************/
+/* Errors */
+/************************************************/
+.error {
+ color:#903;
+}
+
+.fatalerror {
+ display:table-cell;
+ padding:3px;
+ color:#903;
+ font-weight:bold;
+ font-size:1.2em;
+}
+
+
+/************************************************/
+/* LocalPlay */
+/************************************************/
+.lp_box_ctrl, .lp_box_vol {
+ text-align: center; /*for compatibility, may be controlled by themers now*/
+}
+
+td.lp_current a {
+ font-weight:bold;
+ text-decoration:none;
+}
+
+/************************************************/
+/* Styles for Login template */
+/************************************************/
+#loginPage #maincontainer{
+ margin:100px auto 0 auto;
+ width:437px;
+ font-size:12px;
+ text-align:center;
+}
+#loginPage #header{
+ padding:0;
+}
+
+#loginPage #loginbox{
+ background:url(../images/bg_login.jpg) no-repeat;
+ height:292px;
+}
+#loginPage h2{
+ color:#333;
+ padding-top:60px;
+ font-weight: normal;
+}
+.loginfield{
+ text-align:left;
+ padding-right:100px;
+ margin: 1em 0;
+}
+.loginfield input.text_input{
+ width:12em;
+ border:1px solid #999;
+}
+.loginfield label{
+ font-weight:bold;
+}
+.loginfield #rememberme{
+ margin-left:5em;
+ background:none;
+}
+
+#loginPage div.fatalerror {
+ padding:5px;
+ margin:10px;
+}
+
+#motd {
+ margin:0 auto 0 auto;
+ width: 437px;
+}
+
+/************************************************/
+/* Misc */
+/************************************************/
+.formValidation{
+ margin-top:1em;
+ text-align:center;
+}
+
+.text-box, .confirmation-box {
+ display:table-cell;
+ padding:5px 5px 0 5px;
+ margin-bottom:10px;
+ background:#bbb;
+ border:2px solid #000;
+}
+
+#ajax-loading {
+ position: absolute;
+ top:42px;
+ right:345px;
+ width:43px;
+ height:11px;
+ z-index:100;
+ background: url(../images/ajax-loader.gif) no-repeat;
+ display: none;
+ text-indent:-9999em;
+}
+
+.information,.information a {
+ font-size: 0.9em;
+ font-style: italic;
+ color: #c0c0c0;
+}
+
diff --git a/themes/greysme/templates/default-rtl.css b/themes/greysme/templates/default-rtl.css new file mode 100644 index 00000000..a2aff896 --- /dev/null +++ b/themes/greysme/templates/default-rtl.css @@ -0,0 +1,813 @@ +/*
+
+ Copyright (c) Ampache.org
+ All rights reserved.
+
+ This program is free software; you can redistribute it and/or
+ modify it under the terms of the GNU General Public License v2
+ as published by the Free Software Foundation; either version
+ of the License, or (at your option) any later version.
+
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License
+ along with this program; if not, write to the Free Software
+ Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+
+*/
+
+/***************************************************************/
+
+ Ampache Theme "Greysme"
+ by Mickael Despesse (Spocky) v1.03 (2008/04/18)
+
+ Feel free to modify/reuse, just mention my name _somewhere_
+
+/***************************************************************/
+/* Theme colors : */
+/* ---------------*/
+/* Red : #8b3e38 (#5a211c was too dark) */
+/* Light blue : #74718a (#5b596d was too dark) */
+/* Dark blue : #2b293d */
+/* Black : #050505 */
+/* Dark grey : #111 */
+/* Orange: #e9ad51 */
+
+
+
+
+/************************************************/
+/* Unify default browsers style rules */
+/************************************************/
+h1, h2, h3, h4, h5, h6, pre, code { font-size: 1em; line-height: 1em; } /* avoid browser default inconsistent font-sizes */
+ol, ul { list-style: none; }
+table { border-collapse: separate; border-spacing: 0; }
+caption, th, td { text-align: left; font-weight: normal; }
+* { margin: 0; padding: 0; border:0; } /* White space reset */
+a img, :link img, :visited img { border: 0; } /* no blue linked image borders */
+
+/************************************************/
+/* General style rules */
+/************************************************/
+html{ font-size: 62.5%; }
+
+body{
+ font-size:1.1em;
+ font-family: Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif;
+ background: #2b293d url(../images/background.jpg) 0 0 repeat-x fixed;
+ /*min-width:90em;*/
+ color:#e9ad51;
+}
+
+ol { list-style-type: decimal-leading-zero; }
+p { color: #e9ad51; }
+a { color: #74718a; text-decoration: none; }
+
+td { padding: 0 8px; color: #e9ad51; }
+th { font-weight:bold; padding: 0 .3em;}
+
+input, select {
+ font-size:1em;
+ font-family: Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif;
+ color: #e9ad51;
+ background-color: #111;
+ border: 1px solid #8b3e38;
+ margin:0 0 0px 0;
+}
+
+input{ padding:0 2px; }
+input:focus, select:focus { border-style: dotted; }
+textarea { background-color: #111; color: #e9ad51; }
+
+/************************************************/
+/* IE6 behaviors */
+/* - csshover2: :hover support on any element */
+/************************************************/
+body { behavior:url("templates/csshover2.htc"); }
+
+/************************************************/
+/* Float Clearer */
+/************************************************/
+/* float clearing for IE6 */
+* html .clearfix{ height: 1%; overflow: visible; }
+/* float clearing for IE7 */
+/**+html .clearfix{ min-height: 1%; }*/
+/* float clearing for everyone else */
+.clearfix:after{ clear: both; content: "."; display: block; height: 0; visibility: hidden; }
+
+
+/************************************************/
+/* Main Container */
+/************************************************/
+#maincontainer{ margin-top:18px;}
+
+/************************************************/
+/* Header */
+/************************************************/
+#header { padding: 0 0; }
+#headerbox { font-size: 0.9em; text-align: right; color: #e9ad51; position: absolute; top: 3px; right: 0; padding: 3px; }
+#headerbox b { font-weight: normal }
+#headerbox a { color: #e9ad51;}
+#headerlogo { text-align: center; background: url(../images/ampache_back.gif) 0 0 repeat-x;}
+#headerlogo a { }
+#headerbox .box-content {background:transparent;border:none;}
+#headerbox .box-top{display:none;}
+#headerbox .box-bottom{display:none;}
+
+#play_type_switch {
+ float:left;
+ margin-top:2px;
+}
+
+/************************************************/
+/* Content block */
+/************************************************/
+#content {
+ margin:10px 14em 10px 13.5em;
+}
+
+/************************************************/
+/* Footer */
+/************************************************/
+#footer {
+ clear:both;
+ text-align:center;
+ font-size:.8em;
+ padding:3px 0;
+ background:#2c2b39;
+ border-top:5px solid #21212a;
+ margin-top:20px;
+}
+
+/************************************************/
+/* Buttons */
+/************************************************/
+
+.button, input[type=button], input[type=submit] {
+ background:#8b3e38 url(../images/button_back2.png) 0 100% repeat-x !important;
+ background:#8b3e38;
+ color:#e9ad51;
+ padding:0px 0.5em;
+ margin:4px 0 0 0;
+ border:0;
+ cursor:pointer;
+}
+.button:hover, input[type=button]:hover, input[type=submit]:hover {
+ background:#74718a url(../images/button_back2.png) 0 100% repeat-x !important;
+ background:#74718a;
+}
+
+a.button { padding:1px .5em; }
+input[type=checkbox] { border:0;background:none; }
+
+/************************************************/
+/* Sidebar */
+/************************************************/
+#sidebar {
+ float:left:
+ position:relative;
+ width: 13em;
+ text-align: left;
+ font-size: 0.8em;
+ padding-top:29px;
+ background:#2b293d url(../images/ampache_menu.gif) 50% 0 no-repeat;
+ z-index:20;
+}
+
+/* For supporting browsers *cough*... I mean not IE6... *cough*, fix sidebar position on the left */
+*>div#sidebar{ position: fixed; }
+
+#sidebar select { width: 95%; }
+
+/* For sidebar tabs */
+/********************/
+#sidebar-tabs, #rightbar #rb_action{
+ border-top:1px solid #000;
+ background:#111;
+}
+
+#sidebar-tabs li.sb1, #rightbar #rb_action li {
+ float: left;
+ padding:1px;
+ background: #111 ;
+ border-top:0.5em solid #8b3e38;
+ border-right:1px solid #000;width:16px;
+}
+#sidebar-tabs li.active {
+ border-top-color: #e9ad51;
+}
+#sidebar-tabs li:hover.sb1, #rightbar #rb_action li:hover
+{
+ background:#000;
+ border-top-color: #e9ad51;
+}
+/* Tabs content */
+/****************/
+#sidebar-page {
+ position:absolute;
+ left:0;
+ top:52px;
+ background: #111;
+ padding-bottom:0.5em;
+ width:13em;
+ color:#8b3e38;
+}
+#sidebar-page ul.sb2 {
+}
+#sidebar-page ul.sb2 li{
+ margin:1em auto;
+ padding-bottom: 0.5em;
+}
+#sidebar-page ul.sb2 h4{
+ padding:.2em .5em .5em 0;
+ font-style:italic;
+ font-weight:normal;
+ font-size:1em;
+ letter-spacing:.2em;
+ text-align:right;
+ border-bottom:1px dotted #e9ad51;
+ text-decoration: overline;
+ background: url(../images/puce.gif) -8px -8px no-repeat;
+ color:#e9ad51;
+}
+#sidebar-page ul.sb2 li:hover h4{
+ background-color:#000;
+}
+
+#sidebar-page ul.sb3, #sidebar-page div.sb3 {
+ color:#8b3e38;
+}
+#sidebar-page .sb3 a{ color:#8b3e38; }
+#sidebar-page ul.sb3 li{
+ margin:0;
+ padding:0;
+ border:none;
+ font-weight:normal;
+ background: #111 url(../images/button_back.png) 0 100% repeat-x;
+ border-bottom: 1px solid #000;
+}
+* html #sidebar-page ul.sb3 li{display:inline;background:#111;} /* fix ie6 */
+#sidebar-page .sb3 a, #sidebar-page .sb3 div{
+ padding:.2em .6em;
+ border-left: .5em solid #8b3e38;
+}
+#sidebar-page .sb3 a:hover{
+ border-left-color: #e9ad51;
+}
+
+#sidebar-page a{
+ display:block;
+}
+#sidebar-page a:hover{
+ background:#000;
+ color:#e9ad51;
+}
+
+/* SIDEBAR : Home */
+/******************/
+
+/* SIDEBAR : Browse */
+/********************/
+#multi_alpha_filter {
+ width:40px;
+ margin-bottom:4px;
+}
+
+/* SIDEBAR : Localplay */
+/***********************/
+.active_instance {
+}
+
+/* SIDEBAR : Preferences */
+/*************************/
+
+/* SIDEBAR : Admin */
+/*******************/
+#sb_admin_catalogs li.sb_admin_catalogs_ctrls img {margin:0;}
+#sb_admin_catalogs li.sb_admin_catalogs_ctrls a{
+ display:inline;
+ padding:0;
+ border:none;
+}
+/************************************************/
+/* XSPF Player */
+/************************************************/
+#xspf_player {
+ width:410px;
+ position: relative;
+ float: left;
+ font-family: Verdana,Helvetica,sans-serif;
+}
+
+
+/************************************************/
+/* Rightbar */
+/************************************************/
+#rightbar {
+ width:13em;
+ background:#000;
+ float:right;
+ z-index:21;
+}
+#rightbar a { text-decoration:none; }
+
+
+/* Rightbar Menu */
+#rightbar #rb_action { }
+#rightbar #rb_action li { }
+#rightbar li#rb_add, #rightbar li#pl_add { position:relative; z-index:10; }
+/* Rightbar AddItems SubMenu */
+#rightbar li:hover .submenu { display:block;}
+#rightbar .submenu {
+ display:none;
+ position:absolute;
+ right:0px;
+ top:15px;
+ background: #050505 url(../images/button_back.png) 0 100% repeat-x !important;
+ background: #050505;
+ border:2px solid #e9ad51;
+ width:15em;
+ padding:0.3em;
+ font-size:0.8em;
+
+}
+* html #rightbar .submenu {right:100px;} /* IE6 fix */
+
+#rightbar #rb_action .submenu li {float:none; width:auto; border:none;}
+#rightbar .submenu a {
+ display:block;
+ padding:0.1em;
+ color:#8b3e38;
+ text-decoration:none;
+ text-align:right;
+}
+#rightbar .submenu a:hover,
+#rightbar #rb_current_playlist a:hover { color:#e9ad51; }
+
+/* Rightbar playlist */
+#rightbar #rb_current_playlist {
+ background: #111;
+ padding-bottom:0.5em;
+ clear:both;
+}
+#rightbar #rb_current_playlist li {
+ position:relative;
+ font-size:0.9em;
+ line-height:14px;
+ color:#5b5b5b;
+ padding-right:20px;
+ background: #111 url(../images/button_back.png) 0 100% repeat-x;
+ border-bottom: 1px solid #000;
+}
+#rightbar #rb_current_playlist li a { display:block; padding:0.2em;}
+#rightbar .delitem { position:absolute;right:0;top:0; }
+
+
+/************************************************/
+/* Styles for the star ratings */
+/************************************************/
+.star-rating {
+ position:relative;
+}
+.dynamic-star-rating{
+ width:96px;
+}
+
+.star-rating ul,
+.star-rating a:hover,
+.star-rating .current-rating{
+ background: url(../images/ratings/star_rating.gif) left -1000px repeat-x;
+}
+.star-rating ul{
+ position:relative;
+ width:80px;
+ height:15px;
+ overflow:hidden;
+ list-style:none;
+ margin:0;
+ padding:0;
+ background-position: left top;
+ /*float:left;*/
+}
+.star-rating li{
+ display: inline;
+}
+.star-rating a, .star-rating span,
+.star-rating .current-rating{
+ position:absolute;
+ top:0;
+ left:0;
+ text-indent:-1000em;
+ height:15px;
+ line-height:15px;
+ outline:none;
+ overflow:hidden;
+ border: none;
+}
+.star-rating .star1 { width:20%; z-index:6; }
+.star-rating .star2 { width:40%; z-index:5; }
+.star-rating .star3 { width:60%; z-index:4; }
+.star-rating .star4 { width:80%; z-index:3; }
+.star-rating .star5 { width:100%; z-index:2;}
+.star-rating .current-rating { z-index:1; background-position: left bottom; }
+
+.star-rating-reset {height:16px;}
+.star-rating a.star0 {
+ left:0px;
+ height:16px;
+ width:16px;
+ background: url(../images/ratings/x_off.gif) left top;
+}
+/* hovering effect only for dynamic star rating */
+#content .dynamic-star-rating a:hover{
+ background-position: left center;
+ background-color:transparent;
+}
+.dynamic-star-rating a:hover.star0 {
+ background: url(../images/ratings/x.gif) left top;
+}
+.dynamic-star-rating ul {
+ left:16px;
+}
+
+/************************************************/
+/* Box Related Styles */
+/************************************************/
+.box-title {
+ display:block;
+ color:#8b3e38;
+ padding:3px 13px 0 28px;
+ background: #000 url(../images/puce.gif) 10px 50% no-repeat;
+ font-size: 1.1em;
+ font-variant:small-caps;
+ border-bottom:1px solid #8b3e38;
+ letter-spacing:0.1em;
+}
+.box-title:first-letter{font-style:italic;}
+
+.box-list {
+ padding-right: 10px;
+}
+
+/* Enclosing Boxes Styles */
+.box, .info-box {
+ margin-top: 7px;
+ margin-right: 11px;
+ /*background: url(../images/back-box.gif) 0 0 no-repeat;*/
+ font-size : 0.9em;
+ float:left;
+ clear:left;
+ height:1%; /* IE6 : Holly Hack comes to rescue once again */
+}
+/* Hovering effects on links */
+.box a:hover, .info-box a:hover { /*background-color: #8b3e38;*/ color: #e9ad51;}
+
+.box-inside {
+/* background: url(../images/right.gif) top right repeat-y; */
+}
+.box-content {
+ padding:12px 12px;
+ background:#000;
+}
+
+.box-top {
+ position:relative;
+ background:transparent url(../images/box_top.png) 0 100% repeat-x !important;
+ background:#000;
+}
+.box-left-top {
+ /*background: url(../images/punaise-tl.gif) no-repeat;*/
+ height:15px;
+ width:17px;
+ position:relative;left:/*-8px*/ 30%;top:-3px;
+}
+.box-right-top {
+ /*background: url(../images/curl.gif) no-repeat;*/
+ background: url(../images/punaise-tl.gif) no-repeat;
+ height:15px;
+ width:17px;
+ position:absolute;left:30%;top:-3px;
+}
+* html .box-right-top {right: expression(-this.parentNode.offsetWidth%2+"px");} /* Fixes an IE6 rounding error */
+.box-bottom {
+ position:relative;clear:both;
+ background:transparent url(../images/box_bottom.png) 0 0 repeat-x !important;
+ background:#000;
+}
+.box-left-bottom {
+ background: url(../images/punaise-bl.gif) no-repeat;
+ height:15px;
+ width:17px;
+ position:relative;left:-7px;top:-3px;
+}
+.box-right-bottom {
+ background: url(../images/punaise-br.gif) no-repeat;
+ height:15px;
+ width:17px;
+ position:absolute;right:-7px;top:-3px;
+}
+* html .box-right-bottom {right: expression(-this.parentNode.offsetWidth%2+"px");} /* Fixes an IE6 rounding error */
+
+
+/* Specific to Info Boxes */
+.info-box .album_art {float:left;margin-right:10px;}
+.info-box th {color:#8b3e38;}
+#information_actions { }
+#information_actions h3 { color:#8b3e38; font-size:1.2em; margin:0.2em; }
+
+/* Specific boxes */
+.box_newest_albums {}
+.box_newest_artists {clear:none;}
+.box_newest_genres {clear:none;}
+.box_popular_album {}
+.box_popular_artists {clear:none;}
+.box_popular_genres {clear:none;}
+.box_preferences h4 {color: #8b3e38;font-size: 1.1em;text-align:center;font-weight: bold;border-bottom:1px solid #8b3e38;padding:1em;}
+
+/************************************************/
+/* Tables (songs lists...) */
+/************************************************/
+.tabledata .th-top, .tabledata .th-bottom {
+ background: #111;
+ vertical-align: top;
+ font-size:1em;
+}
+.tabledata th {
+ color:#8b3e38;
+ font-variant:small-caps;
+ font-weight:normal;
+ border-right:3px solid #000;
+ text-align:center;
+ line-height:2em;
+}
+.tabledata th a {
+ color:#8b3e38;
+ padding-right:10px;
+ background: url(../images/sort_off.gif) 100% 50% no-repeat;
+ display:block;
+}
+.tabledata th a:hover {
+ color:#8b3e38;
+ background-color:transparent;
+ background-image:url(../images/sort_on.gif);
+}
+
+.tableform select {
+ width: 150px;
+}
+
+/* table rows */
+.tabledata .odd, .tabledata .even, .row-highlight { background: url(../images/list_back.png) 0 50% repeat-x !important; background-image: none;}
+.tabledata .odd { background-color: #111 !important;}
+.tabledata .even { }
+.tabledata .odd:hover,
+.tabledata .even:hover { background-color: #2b293d !important;}
+.row-highlight:hover { background-color: #cc3333 !important;}
+
+/* Misc */
+.border { background: #000; }
+.tabledata input[type=text], .tabledata select{ margin:1px 0; }
+.discnb { font-style: italic; font-size:0.8em; }
+
+/* specific cells */
+td.cel_cover{padding:6px;}
+.cel_select, .cel_action, .cel_date, .cel_applytoall, .cel_level {text-align:center;}
+td.cel_track {text-align:right;}
+/* specific cells : users login state */
+.user_online{background:#0f0;}
+.user_offline{background:#7f0000;}
+.user_disabled{background:#ccc;}
+/* specific cells : enlarge links */
+.tabledata td a{display:block;}
+.tabledata td.cel_add a, .tabledata td.cel_action a{display:inline;}
+/* specific cells : image links */
+.odd td a img, .even td a img {opacity:0.7;}
+.odd td a img:hover, .even td a img:hover {opacity:1;}
+
+/* specific tables */
+#recently_played .th-bottom {display:none;}
+.box_preferences .th-bottom {display:none;}
+
+/* Inline Editing Tables */
+.inline-edit input, .inline-edit select {
+ font-size: 0.8em;
+}
+
+/************************************************/
+/* Song details */
+/************************************************/
+dl.song_details{font-size:1em;}
+.song_details dt {
+ float:left;
+ clear:both;
+ width:20%;
+ min-width:20%; /*Ie bugfix*/
+ font-weight:bold;
+}
+.song_details dd {
+ float:left;
+ width:79%;
+ min-width:79%; /*Ie bugfix*/
+ margin:0 0 0.2em .3em;
+ padding-left:.2em;
+}
+dt, dt + dd {background: url(../images/list_back.png) 0 50% repeat-x !important; background-image: none;}
+dt, dt + dd { background-color: #111 !important;}
+dt:hover, dt:hover + dd {background-color: #2b293d !important;}
+
+
+/************************************************/
+/* Albums of the moment */
+/************************************************/
+.random_album{
+ position:relative;
+ float:left;
+ padding:8px;
+}
+
+.random_album .play_album{
+ position:absolute;
+ top:10px;
+ right:0;
+}
+
+#random_selection .box-content{
+ float:left;
+}
+
+/************************************************/
+/* Now Playing */
+/************************************************/
+#now_playing{
+}
+
+.np_row {
+ padding: 3px;
+ float:left;
+ clear:both;
+}
+.np_cell {
+ padding-left:5px;
+ margin-left:5px;
+}
+
+.np_row label {
+ display:block;
+ font-weight:bold;
+ margin-left:-5px;
+}
+
+.np_group {
+ float:left;
+ padding-left:10px;
+}
+
+#now_playing .box-content{
+background:#000;
+ float:left;
+}
+
+/************************************************/
+/* Shoutbox */
+/************************************************/
+
+
+#shoutbox {
+ font-size:1em;
+ position:relative;
+}
+
+#shoutbox div.shout {
+ /*float:left;*/
+ padding:1em 85px 0 30px;
+}
+
+#shoutbox span.information {
+/* float:left;
+ clear:left;*/
+}
+#shoutbox .shouttext{display:block;}
+img.shoutboximage {
+ margin-right:3px;
+ width:25px;
+ height:25px;
+ position:absolute;margin-left:-30px;
+}
+#shoutbox .odd img.shoutboximage {/*float:right;*/}
+#shoutbox .even img.shoutboximage {/*float:right;*/}
+
+div.shout:hover img.shoutboximage{width:75px;height:75px;position:absolute;top:50%;right:0;margin-top:-38px}
+
+/************************************************/
+/* List Header */
+/************************************************/
+.list-header{margin:7px 0; padding:0 4em; text-align:center; font-size: 0.9em;position:relative;}
+.list-header .prev{position:absolute; top:0; left:0;}
+.list-header .next{position:absolute; top:0; right:0;}
+.list-header .selected{background:#e9ad51;color:#111;}
+.list-header .page-nb{padding:1px;border: 1px solid #111;}
+.list-header a:hover{background: transparent; border-color:#e9ad51;}
+
+/************************************************/
+/* Errors */
+/************************************************/
+.error {
+ color: #990033;
+}
+
+.fatalerror {
+ padding: 3px;
+ display: table-cell;
+ color: #990033;
+ font-weight:bold;
+ border:2px solid #990033;
+}
+
+
+/************************************************/
+/* LocalPlay */
+/************************************************/
+.lp_box_ctrl, .lp_box_vol {
+ text-align: center; /*for compatibility, may be controlled by themers now*/
+}
+
+td.lp_current a {
+ font-weight:bold;
+ text-decoration:none;
+}
+
+/************************************************/
+/* Styles for Login template */
+/************************************************/
+#loginPage #maincontainer {
+ margin: 5% auto 0px auto;
+ text-align:center;
+}
+#loginPage h2{
+ color:#111;
+ font-size:0.8em;
+ font-style:italic;
+ font-weight:normal;
+ margin: 0 0 2em 0;
+}
+#loginPage #loginbox{
+}
+.loginfield{
+ text-align:right;
+ margin: 1px 0;
+ width:15em;
+ margin:auto;
+}
+.loginfield input.text_input{
+ width:8em;
+ border:1px solid #74718a;
+}
+
+#loginPage div.fatalerror {
+ padding:5px;
+ margin:10px;
+}
+
+#motd {
+ margin:0 auto 0 auto;
+ width: 437px;
+}
+
+
+/************************************************/
+/* Misc */
+/************************************************/
+
+.formValidation{
+ margin-top:1em;
+ text-align:center;
+}
+
+.text-box, .confirmation-box {
+ display: table-cell;
+ padding:5px;
+ margin:0 0 10px 0;
+ background-color: #111;
+}
+
+#ajax-loading {
+ position: absolute;
+ top:106px;
+ left:42%;
+ width:265px;
+ height:50px;
+ z-index: 100;
+ background: url(../images/ajax-loader.gif) no-repeat;
+ text-indent:-9999em;
+ display: none;
+}
+
+.information,.information a {
+ font-size: 0.9em;
+ font-style: italic;
+ color: #c0c0c0;
+}
+
diff --git a/themes/penguin/templates/default-rtl.css b/themes/penguin/templates/default-rtl.css new file mode 100644 index 00000000..e6ac1aa4 --- /dev/null +++ b/themes/penguin/templates/default-rtl.css @@ -0,0 +1,1030 @@ +/*
+
+ Copyright (c) Ampache.org
+ All rights reserved.
+
+ This program is free software; you can redistribute it and/or
+ modify it under the terms of the GNU General Public License v2
+ as published by the Free Software Foundation
+
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License
+ along with this program; if not, write to the Free Software
+ Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
+
+*/
+
+
+/************************************************/
+/* Unify default browsers style rules */
+/************************************************/
+h1, h2, h3, h4, h5, h6, pre, code {
+ font-family:Verdana, Geneva, sans-serif;
+ font-size: 10px;
+} /* avoid browser default inconsistent font-sizes */
+ol, ul {
+ list-style: none;
+}
+table {
+ border-collapse: separate;
+ border-spacing: 0;
+}
+caption, th, td {
+ text-align: left;
+ font-weight: normal;
+}
+* {
+ margin: 0;
+ padding: 0;
+} /* White space reset */
+a img, :link img, :visited img {
+ border: 0;
+} /* no blue linked image borders */
+/************************************************/
+/* General style rules */
+/************************************************/
+body {
+ background:#222 url(../images/background.gif) repeat;
+ font-family:Arial, Helvetica, Sans-Serif;
+ min-width:1250px;
+}
+p {
+ color: #fc0;
+ margin:1em 0;
+}
+a, a:visited, a:active {
+ color: #fff;
+ font-family: Verdana, Helvetica, sans-serif;
+ text-decoration:none;
+}
+td {
+ padding-left: 5px;
+ padding-right: 10px;
+ color: #fff;
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ text-transform:small-caps;
+}
+th {
+ padding-right: 10px;
+ font-family: Verdana, Helvetica, sans-serif;
+ font-size:10px;
+ font-weight:bold;
+ text-transform:uppercase;
+ background: #333;
+ padding:2px;
+}
+input, textarea {
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ background: #222;
+ color: #fff;
+ border: 1px solid #666;
+ margin: 2px;
+}
+input {
+ font-weight: bold;
+ padding: 1px;
+}
+select {
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ background:#222;
+ color: #fff;
+ margin:3px;
+ border: 1px solid #666;
+}
+input[type=checkbox] {
+ border:0
+}
+/************************************************/
+/* IE6 behaviors */
+/* - csshover2: :hover support on any element */
+/************************************************/
+body {
+ behavior:url("templates/csshover2.htc");
+}
+/************************************************/
+/* Float Clearer */
+/************************************************/
+/* float clearing for IE6 */
+* html .clearfix {
+ height: 1%;
+ overflow: visible;
+}
+/* float clearing for IE7 */
+/**+html .clearfix{ min-height: 1%; }*/
+/* float clearing for everyone else */
+.clearfix:after {
+ clear: both;
+ content: ".";
+ display: block;
+ height: 0;
+ visibility: hidden;
+}
+/************************************************/
+/* XSPF Player */
+/************************************************/
+.xspf_player {
+ right: 20px;
+ position: absolute;
+}
+/************************************************/
+/* Main Container */
+/************************************************/
+#maincontainer {
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ text-transform:uppercase;
+}
+/************************************************/
+/* Header */
+/************************************************/
+#header {
+ height: 40px;
+ padding: 0px 0 0 10px;
+}
+#headerbox {
+ position:absolute;
+ top:0px;
+ left:307px;
+ font-size: 10px;
+ padding-top: 5px;
+ padding-bottom: 5px;
+ background: #fff;
+ height: 30px;
+ width: 450px;
+}
+#headerlogo, #headerlogo a {
+ position: absolute;
+ left: 0px;
+ top: 0px;
+}
+.box_headerbox {
+ padding-left: 100px;
+ display:table;
+ color: #333;
+}
+.box_headerbox #loginInfo {
+ position:absolute;
+ top:-200px;
+ left:-200px;
+ font-size:0px;
+}
+#play_type_switch {
+ position:absolute;
+ top:10px;
+ left:-10px;
+ text-transform:lowercase;
+}
+/************************************************/
+/* Content block */
+/************************************************/
+#content {
+ margin: 8px 50px 20px 300px;
+}
+/************************************************/
+/* Footer */
+/************************************************/
+#footer {
+ color:FC0;
+ font-size:9px;
+ font-weight:bold;
+ position:absolute;
+ top:5px;
+ left: 815px;
+ width:400px;
+ text-align:left;
+ z-index:250;
+ text-transform:uppercase;
+ line-height: 10px;
+}
+#footer a:link {
+ color:#222;
+}
+/************************************************/
+/* Buttons */
+/************************************************/
+.button, input[type=button], input[type=submit] {
+ border: 1px solid #fff;
+ border-style: none;
+ background: #fff;
+ color: #333;
+ font-weight:bold;
+ text-decoration:none;
+ cursor: pointer;
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:9px;
+ text-transform: uppercase;
+ vertical-align:middle;
+}
+a.button {
+ border: 1px solid #fff;
+ padding-left:5px;
+ padding-right:5px;
+ padding-top:2px;
+ padding-bottom:2px;
+ vertical-align:middle;
+ color: #222;
+}
+/************************************************/
+/* Sidebar */
+/************************************************/
+#sidebar {
+ position:absolute;
+ top:0px;
+ left:0px;
+ width:200px;
+ height: 40px;
+ padding-top:0px;
+ background:#fff;
+}
+#sidebar select {
+ width: 95%;
+}
+#sidebar input {
+ vertical-align:middle;
+ background:#fff;
+ color:#000;
+}
+#sidebar ul {
+ list-style:none;
+}
+#sidebar a {
+ text-decoration:none;
+}
+/* For sidebar tabs */
+/********************/
+#sidebar-tabs {
+ padding-left: 5px;
+ padding-top: 12px;
+ padding-bottom: 0px;
+}
+#sidebar-tabs li.sb1 {
+ float: left;
+ padding-left:0px;
+ padding-right:11px;
+ background: #fff;
+}
+#sidebar-tabs li.active {
+ background: #fff;
+ margin-top:0px;
+}
+#sidebar-tabs li.active img {
+ margin-top:0px;
+ position:relative;
+ z-index:2;
+}
+/* Tabs content */
+/****************/
+#sidebar-page {
+ position:absolute;
+ left:0;
+ top:41px;
+ background: #fff url(../images/bottom.gif) 0 100% repeat-x;
+ padding-bottom:10px;
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ text-transform:uppercase;
+ width:130px;
+}
+#sidebar-page ul.sb2 {
+ padding-top:2px;
+ padding-left:5px;
+ padding-right:10px;
+}
+#sidebar-page ul.sb2 li {
+ font-weight:bold;
+ margin:10px auto;
+ padding-bottom: 10px;
+}
+#sidebar-page ul.sb2 h4 {
+ padding-bottom: 5px;
+}
+#sidebar-page ul.sb3, #sidebar-page div.sb3 {
+ font-size:10px;
+ margin-left:0px;
+ font-weight:normal;
+ text-transform:capitalize;
+ color:#666;
+}
+#sidebar-page div.sb3 input[type=radio] {
+ margin-left:0px;
+ border:none;
+}
+#sidebar-page ul.sb3 li {
+ margin:0;
+ padding:0;
+ border:none;
+ font-weight:normal;
+}
+* html #sidebar-page ul.sb3 li {
+ display:inline;
+} /* fix ie6 */
+#sidebar-page .sb3 a {
+ padding:1px;
+ border-bottom:1px dotted #ccc;
+ color: #666;
+}
+#sidebar-page a {
+ display:block;
+}
+#sidebar-page a:hover {
+ background:#FC0;
+ color:#000;
+}
+/* SIDEBAR : Home */
+/******************/
+
+/* SIDEBAR : Browse */
+/********************/
+.alphabet {
+ background:transparent; /* fix ie bug */
+ font-size:0.95em;
+ font-weight:normal;
+ margin: 0.3em auto;
+ color:#5b5b5b;
+}
+.alphabet span.link {
+ cursor: pointer;
+ margin: 0;
+ padding:0 5px;
+ font-family: monospace, Courier, Georgia;
+}
+.alphabet span.active {
+ background:#5b5b5b;
+ color:#fff;
+}
+.alphabet span.link:hover {
+ background: #99ccff;
+ color:#fff;
+}
+#multi_alpha_filter {
+ width:40px;
+ margin-bottom:4px;
+}
+/* SIDEBAR : Localplay */
+/***********************/
+.active_instance {
+ background:#0C0;
+}
+/* SIDEBAR : Preferences */
+/*************************/
+
+/* SIDEBAR : Admin */
+/*******************/
+#sb_admin_catalogs li.sb_admin_catalogs_ctrls img {
+ margin:0;
+}
+#sb_admin_catalogs li.sb_admin_catalogs_ctrls a {
+ display:inline;
+ padding:0;
+ border:none;
+}
+/************************************************/
+/* XSPF Player */
+/************************************************/
+#xspf_player {
+ width:400px;
+ float: left;
+ background:#fff;
+ font-family: Verdana, Helvetica, sans-serif;
+}
+/************************************************/
+/* Rightbar */
+/************************************************/
+#rightbar {
+ position:absolute;
+ left: 131px;
+ top: 0px;
+ width:150px;
+ padding-top:12px;
+ background:url(../images/rightbar_top.jpg) 0px 41px no-repeat;
+ font-family: Verdana, Helvetica, sans-serif;
+}
+#rightbar ul {
+ list-style:none;
+}
+#rightbar a {
+ text-decoration:none;
+}
+/* Rightbar Menu */
+#rightbar #rb_action {
+ padding-bottom:11px;
+ padding-left:3px;
+}
+#rightbar #rb_action li {
+ display:inline;
+ margin-right:11px;
+}
+#rightbar li#rb_add, #rightbar li#pl_add {
+ position:relative;
+ z-index:10;
+}
+#rightbar li#rb_add:hover, #rightbar li#pl_add:hover {
+}
+/* Rightbar AddItems SubMenu */
+#rightbar li:hover .submenu {
+ display:block;
+ color:#000;
+}
+#rightbar .submenu {
+ display:none;
+ position:absolute;
+ left:-15px;
+ top:12px;
+ background:#FC0;
+ border:5px solid #222;
+ width:120px;
+ font-size:10px;
+ text-transform: capitalize;
+ padding: 5px 5px 5px 5px;
+}
+* html #rightbar .submenu {
+ right:100px;
+} /* IE6 fix */
+#rightbar .submenu a {
+ display: block;
+ padding: 1px;
+ border-bottom:1px dotted #222;
+ color:#222;
+ text-decoration:none;
+ text-align:left;
+}
+#rightbar .submenu a:hover, #rightbar #rb_current_playlist a:hover {
+ background:#222;
+ color:#fff;
+}
+/* Rightbar playlist */
+#rightbar #rb_current_playlist {
+ background: #666 url(../images/bottomright.gif) 0 100% repeat-x;
+ margin-top: 36px;
+ padding-bottom:10px;
+ padding-left: 6px;
+ padding-right: 0px;
+ text-transform: capitalize;
+}
+#rightbar #rb_current_playlist li {
+ position:relative;
+ font-size:10px;
+ line-height:10px;
+ color:#fff;
+ padding-right:20px;
+}
+#rightbar #rb_current_playlist li a {
+ display:block;
+ padding:1px;
+ color:#FC0;
+}
+#rightbar #rb_current_playlist li a:hover {
+ background: #FC0;
+ color:#000;
+}
+#rightbar .delitem {
+ position:absolute;
+ right:5px;
+ top:0px;
+}
+/* Rightbar Localplay Controls */
+#rightbar #localplay-control {
+ position:fixed;
+ display: block;
+ width: 15px;
+ height: 50%;
+ bottom:0px;
+ right:0px;
+ list-style:none;
+ background:#inherit;
+ font-size:0px;
+ z-index:200;
+}
+#localplay-control span {
+ cursor: pointer;
+}
+/************************************************/
+/* Styles for the star ratings */
+/************************************************/
+.star-rating {
+ position:relative;
+}
+.dynamic-star-rating {
+ width:90px;
+}
+.star-rating ul, .star-rating a:hover, .star-rating .current-rating {
+ background: url(../images/ratings/star_rating.gif) left -1000px repeat-x;
+}
+.star-rating ul {
+ position:relative;
+ width:80px;
+ height:15px;
+ overflow:hidden;
+ list-style:none;
+ margin:0;
+ padding:0;
+ background-position: left top;
+}
+.star-rating li {
+ display: inline;
+}
+.star-rating a, .star-rating span, .star-rating .current-rating {
+ position:absolute;
+ top:0;
+ left:0;
+ text-indent:-1000em;
+ height:15px;
+ line-height:15px;
+ outline:none;
+ overflow:hidden;
+ border:none;
+}
+.star-rating .star1 {
+ width:20%;
+ z-index:6;
+}
+.star-rating .star2 {
+ width:40%;
+ z-index:5;
+}
+.star-rating .star3 {
+ width:60%;
+ z-index:4;
+}
+.star-rating .star4 {
+ width:80%;
+ z-index:3;
+}
+.star-rating .star5 {
+ width:100%;
+ z-index:2;
+}
+.star-rating .current-rating {
+ z-index:1;
+ background-position: left bottom;
+}
+.star-rating a.star0 {
+ left:0px;
+ width:16px;
+ background: url(../images/ratings/x_off.gif) left top;
+}
+/* hovering effect only for dynamic star rating */
+.dynamic-star-rating a:hover {
+ background-position: left center;
+}
+.dynamic-star-rating a:hover.star0 {
+ background: url(../images/ratings/x.gif) left top;
+}
+.dynamic-star-rating ul {
+ left:16px;
+}
+/************************************************/
+/* Box Related Styles */
+/************************************************/
+
+.box-title {
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ font-weight: bold;
+ text-transform:uppercase;
+ padding-bottom: 10px;
+ color:#FFF;
+}
+.box-list {
+}
+/* Enclosing Boxes Styles */
+
+.box, .info-box {
+ background:inherit;
+ color:#FFF;
+ float:left;
+ clear:left;
+ height:1%; /* IE6 : Holly Hack comes to rescue once again */
+}
+.box-inside {
+}
+.box-content {
+}
+.box-top {
+ position:relative;
+}
+.box-left-top {
+ height:5px;
+ width:5px;
+ position:relative;
+ left:0;
+ top:0;
+}
+.box-right-top {
+ height:5px;
+ width:5px;
+ position:absolute;
+ right:0;
+ top:0;
+}
+* html .box-right-top {
+right: expression(-this.parentNode.offsetWidth%2+"px");
+} /* Fixes an IE6 rounding error */
+.box-bottom {
+ position:relative;
+ clear:both;
+}
+.box-left-bottom {
+ height:5px;
+ width:5px;
+ position:relative;
+ left:0;
+ top:0;
+}
+.box-right-bottom {
+ height:5px;
+ width:5px;
+ position:absolute;
+ right:0;
+ top:0;
+}
+* html .box-right-bottom {
+right: expression(-this.parentNode.offsetWidth%2+"px");
+} /* Fixes an IE6 rounding error */
+/* Specific to Info Boxes */
+.info-box {
+ float:left;
+ margin-right:10px;
+}
+.album_art {
+ float:left;
+ margin-right:10px;
+}
+#information_actions {
+ padding: 20px 0px 10px 0px;
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ line-height: 20px;
+}
+#information_actions h3 {
+ float:right;
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ margin:10px;
+}
+/* Specific boxes */
+.box_newest_albums {
+}
+.box_newest_artists {
+ clear:none;
+}
+.box_newest_genres {
+ clear:none;
+}
+.box_popular_album {
+}
+.box_popular_artists {
+ clear:none;
+}
+.box_popular_genres {
+ clear:none;
+}
+.box_preferences h4 {
+ color:#fff;
+ font-family: Verdana, Geneva, sans-serif;
+ font-size:10px;
+ font-weight:bold;
+ text-transform:uppercase;
+ padding:5px 0px 10px 0px;
+ color: #fc0;
+}
+/************************************************/
+/* Tables (songs lists...) */
+/************************************************/
+.tabledata .th-top, .tabledata .th-bottom {
+ vertical-align: center;
+ text-align:center;
+}
+.tableform select {
+ width: 100px;
+}
+/* table rows */
+.tabledata .odd {
+}
+.tabledata .odd td {
+}
+.tabledata .even {
+}
+.tabledata .even td {
+}
+.row-highlight {
+}
+.tabledata .even:hover, .tabledata .odd:hover {
+ background:#666;
+}
+.row-highlight:hover {
+ background:#333;
+}
+/* Misc */
+.border {
+ background: #000;
+}
+.tabledata input, .tabledata select {
+ font-weight:normal;
+ background:#222;
+ color: #FC0;
+ margin:2px 0px 0px 0px;
+ border:1px solid #666;
+}
+/* specific cells */
+td.cel_cover {
+}
+.cel_select, .cel_date, .cel_applytoall, .cel_level {
+ text-align:right;
+}
+.cel_action {
+ text-align:right;
+ padding-right:0px;
+}
+/* specific cells : users login state */
+.user_online {
+ background:#222;
+}
+.user_offline {
+ background:#C00;
+}
+.user_disabled {
+ background:#ccc;
+}
+/* specific tables */
+#recently_played .th-bottom {
+ display:none;
+}
+.box_preferences .th-bottom {
+ display:none;
+}
+/* Inline Editing Tables */
+.inline-edit input, .inline-edit select {
+ font-size: 10px;
+}
+/************************************************/
+/* Song details */
+/************************************************/
+dl.song_details {
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+}
+.song_details dt {
+ text-transform:uppercase;
+ float:left;
+ clear:both;
+ width:20%;
+ min-width:20%; /*Ie bugfix*/
+ font-weight:bold;
+ padding: 2px 0px 0px 0px;
+}
+.song_details dd {
+ float:left;
+ width:79%;
+ min-width:79%; /*Ie bugfix*/
+ padding: 2px 0px 0px 0px;
+}
+dt + dd {
+ border-bottom:1px dotted #666;
+}
+dt:hover, dt:hover + dd {
+ background:#666;
+ color: #fff;
+}
+/************************************************/
+/* Albums of the moment */
+/************************************************/
+.random_album {
+ position:relative;
+ float:left;
+ padding-right:10px;
+ width:80px;
+}
+.random_album .play_album {
+ display:none;
+}
+/************************************************/
+/* Now Playing */
+/************************************************/
+#now_playing {
+}
+.np_row {
+ padding: 3px;
+ float:left;
+ font-size:10px;
+ display:block;
+}
+.np_cell {
+ padding-left:5px;
+ margin-left:5px;
+}
+.np_row label {
+ display:block;
+ font-weight:bold;
+ margin:2px 0 0 -5px;
+}
+.np_group {
+ float:left;
+ padding-right:15px;
+}
+.np_row a {
+ font-size:10px;
+}
+/************************************************/
+/* Shoutbox */
+/************************************************/
+
+#shoutbox {
+ font-size:1em;
+}
+#shoutbox div.shout {
+ padding-top:0.5em;
+ margin:10px 5px 0 0;
+ border-top:1px dotted #c0c0c0;
+}
+#shoutbox div.shout:hover {
+ border-top:1px solid #9cf;
+}
+#shoutbox span.information {
+}
+#shoutbox .shouttext {
+ display:block;
+ font-size:.9em;
+ margin-top:.5em;
+}
+img.shoutboximage {
+ margin:0 3px;
+}
+#shoutbox div.odd {
+ margin-right:20%;
+ text-align:left;
+}
+#shoutbox div.even {
+ margin-left:20%;
+ text-align:right;
+}
+#shoutbox .odd img.shoutboximage {
+ float:left;
+}
+#shoutbox .even img.shoutboximage {
+ float:right;
+}
+/************************************************/
+/* List Header */
+/************************************************/
+.list-header {
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ text-transform:uppercase;
+ color:#000;
+ margin-top: 10px;
+ margin-bottom: 10px;
+ text-align:center;
+ position:relative;
+}
+.list-header .prev {
+ position:absolute;
+ top:0;
+ left:0;
+ text-transform:uppercase;
+ font-size:10px;
+ font-weight:bold;
+ color: #FC0;
+}
+.list-header .next {
+ position:absolute;
+ top:0;
+ right:0;
+ text-transform:uppercase;
+ font-size:10px;
+ font-weight:bold;
+ color: #FC0;
+ padding-right:0px;
+}
+.list-header .selected {
+ background: #fff;
+}
+.list-header .page-nb {
+ padding: 2px 5px 2px 5px;
+ border: 1px dotted #ccc;
+ text-decoration: none;
+}
+.list-header .page-nb:hover {
+ background: #FC0;
+ color:#000
+}
+/************************************************/
+/* Errors */
+/************************************************/
+.error {
+ display:block;
+ font-family:Verdana, Geneva, sans-serif;
+ font-size: 10px;
+ color:#C00;
+}
+.fatalerror {
+ display:table-cell;
+ padding:3px;
+ color:#c00;
+ font-weight:bold;
+ font-size:10px;
+}
+/************************************************/
+/* LocalPlay */
+/************************************************/
+.lp_box_ctrl {
+}
+.lp_box_vol {
+ text-align: center; /*for compatibility, may be controlled by themers now*/
+}
+td.lp_current a {
+ font-weight:bold;
+ text-decoration:none;
+}
+/************************************************/
+/* Styles for Login template */
+/************************************************/
+#loginPage #maincontainer {
+ margin:100px auto 0 auto;
+ width:360px;
+ font-size:10px;
+ text-align:center;
+}
+#loginPage #header {
+ padding:0;
+}
+#loginPage #loginbox {
+ background:url(../images/bg_login.jpg) no-repeat;
+ height:230px;
+}
+#loginPage h2 {
+ color:#fff;
+ padding-top:60px;
+ font-weight: normal;
+}
+.loginfield {
+ text-align:right;
+ padding-top:10px;
+ padding-right:50px;
+}
+.loginfield input.text_input {
+ vertical-align:middle;
+ width:180px;
+ border:5px solid #222;
+}
+.loginfield label {
+ color: #222;
+ font-weight:bold;
+}
+.loginfield #rememberme {
+ vertical-align:middle;
+ text-align:left;
+ margin-left: auto;
+ margin-right: auto;
+ background:none;
+}
+#loginPage div.fatalerror {
+ padding:5px;
+ margin:10px;
+}
+#motd {
+ background: #fff;
+ color: #222;
+ margin:0 auto 0 auto;
+ width: 360px;
+}
+/************************************************/
+/* Misc */
+/************************************************/
+.formValidation {
+ margin-top:10px;
+ text-align:center;
+}
+.text-box, .confirmation-box {
+ display:table-cell;
+ padding:5px 5px 0 5px;
+ margin-bottom:10px;
+ background:#bbb;
+ border:2px solid #000;
+}
+#ajax-loading {
+ position: absolute;
+ top:25px;
+ left:265px;
+ width:48px;
+ height:48px;
+ z-index:-1;
+ background: url(../images/ajax-loader.gif) no-repeat;
+ display: none;
+ text-indent:-9999em;
+}
+.information, .information a {
+ position:relative;
+ font-family:Verdana, Geneva, sans-serif;
+ font-size:10px;
+ font-weight:bold;
+ text-transform:uppercase;
+ color: #FC0;
+}
|