themes/iphone/style.css
author Dan
Tue, 23 Sep 2008 23:26:18 -0400
changeset 50 1b4288399b1f
parent 19 75dd71fe35b2
child 72 b8730fcd64a9
permissions -rw-r--r--
Added graphical configuration, at this point only for the grey theme but others will follow soon. (This has been nearly done for two weeks or more but was on hold due to the bugs with multithreading)

/**
 * Based upon the AmaroK WebControl interface by:
 *    Jonas Christian Drewsen ( kde at xspect dot dk )
 *    André Kelpe ( fs111 at web dot de )
 *    Peter C. Ndikuwera ( pndiku at gmail dot com )
 */

body {
  font-family: sans-serif;
  background-color: #9cb2cd;
  color: #ffffff;
  margin: 0;
  padding: 0;
  width: 320px;
}

div.tblholder {
  padding: 1px;
  background-color: #ffffff;
  border: 1px solid #000000;
}

div.tblholder table {
  background-color: #596082;
}

tr th {
  background-color: #697092;
}

tr.row1 td {
  background-color: #394062;
}

tr.row2 td {
  background-color: #202050;
}

tr.current td {
  background-color: #495072;
  color: #ffff00;
}

div#playbar {
  width: 320px;
  padding: 0;
  margin: 0 0 10px 0;
  background-image: url(images/playbar.gif);
  background-repeat: repeat-x;
  background-color: #383f61;
  border-bottom: 1px solid #000000;
  text-align: center;
  position: absolute;
  top: 0px;
  left: 0px;
}

div.playbar-inner {
  padding: 5px;
  line-height: 22px;
}

a img {
  border-width: 0;
}

div#playlist {
  margin: 174px 8px 0 8px;
}

a.tracklink {
  text-decoration: none;
  color: white;
}

div.track_inner {
  display: none;
}

div#playlist tr.current a.tracklink {
  color: #ffff00;
}

span#playmeter, span#volume_wrap {
  position: relative;
  top: -7px;
}

a.volume_button {
  padding-right: 18px;
  margin-right: 1px;
  background-color: #33395d;
  border: 1px solid #909090;
  text-decoration: none;
}

a.volume_button_active {
  background-color: #9090c2;
  border-color: #d0d0d0;
}

div#footer {
  background-image: url(images/playbar.gif);
  background-repeat: repeat-x;
  text-align: center;
  margin-top: 10px;
  padding: 5px;
}

/* Position slider (playhead) */

div#playhead {
  background-image: url(images/position-empty.png);
  width: 250px;
  background-repeat: no-repeat;
  background-position: center center;
  margin: 0 auto 10px auto;
}

div#playhead-filler {
  background-image: url(images/position-full.png);
  width: 150px;
  background-repeat: no-repeat;
  background-position: left center;
}

div#playhead-button {
  background-image: url(images/playhead.png);
  width: 16px;
  height: 16px;
  font-size: 1px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center center;
}

/* The list of colors that will be cycled through as playback takes place */
tr.pulsar0 td { background-color: #47507a; }
tr.pulsar1 td { background-color: #424a73; }
tr.pulsar2 td { background-color: #3c436c; }
tr.pulsar3 td { background-color: #383d64; }
tr.pulsar4 td { background-color: #31365d; }
tr.pulsar5 td { background-color: #2c3155; }
tr.pulsar6 td { background-color: #272a4e; }
tr.pulsar7 td { background-color: #222447; }
tr.pulsar8 td { background-color: #1c1d3f; }
tr.pulsar9 td { background-color: #171738; }

div.poweredby {
  font-size: smaller;
  text-align: center;
  margin: 10px 0;
}

div.poweredby a {
  color: #57608a;
}