Valko-harmaa modaus artistisivulle.

Vaikutteita otettu Applen kotisivuilta muutamien taiteellisten vapauksien saattelemana. Mahdollisimman selkeän ulkoasun saavuttamiseksi tässä modauksessa on poistettu melko paljon artistisivun elementtejä mukaanlukien mm. välilehdet (fanien määrä ei ole näkyvissä artistisivulla), popup-soittimen linkit ja kappaleiden lisäyspäivät. Koska myös kielivalikko on poistettu oikeasta yläkulmasta, tämä modaus vaatii Vapaa HTML-kentän yksilöllistä käyttöä ja on siten astetta vaativampi modaus toteuttaa. Modaus saattaa vaatia myös sen, että muut Vapaa HTML-kentän tiedot joudutaan modaajan taidoista riippuen muuttamaan tai poistamaan, jos halutaan yhtenäinen look.

Keveys:
Näyttävyys:
Asentamisen helppous:

Ennen käyttöä tutustu modausten käyttöoikeuksiin. Asentamalla modauksen omalle artistisivullesi hyväksyt ehdot.

Ohjeet tulevat tässä. Kannattaa jättää tämä ohje auki ja avata uusi ikkuna tai välilehti, jossa suoritat modaamisen.

1. Kirjaudu sisään Mikseri.nettiin.
2. Klikkaa "Omat projektit" -> Projektisi nimeä -> "Kotisivun ulkoasu".
3. Valitse "Artistisivun pohja" -vetovalikosta Mikseri Uusi.
4. Klikkaa Vapaa HTML -kohtaa ja liitä siihen seuraava tekstijono:

<div class="badding">
<div align="center">
<a href="www.mikseri.net/artists/?id=63660&displ_lang=fi">
<img src="http://users.tkk.fi/~mtmotton/images/finlandicon.png" border="0" /></a>
<a href="http://www.mikseri.net/artists/?id=63660&displ_lang=en">
<img src="http://users.tkk.fi/~mtmotton/images/ukicon.png" border="0" /></a>
</div>
</div>

5. Näetkö ylläolevassa koodissa 2 kappaletta vahvennettuja ja kursivoituja 5-numeroisia sarjoja (63660)? Avaa uusi välilehti ja mene artistisivullesi. Selaimen osoitekentässä näkyy samanlainen id-tunnus omalle kotisivullesi. Kirjoita oma id-numerosi ylös ja korvaa HTML-laatikkoon liittämäsi koodin numerot 63660 omalla id-numerollasi. Näin kielivalinnat viittaavat omaan kotisivuusi, ei minun.
6. Kopioi koko HTML-kentän teksti, klikkaa ylläolevasta vetovalikosta HTML-kentän kielivalinnaksi English ja liitä koko tekstinpätkä englanninkieliseen HTML-ruutuun.
7. Klikkaa HTML-laatikon ulkopuolelle, odota hetki ja klikkaa Tallenna.
8. Mene artistisivullesi ja klikkaa Muokkaa ulkoasua.

Oikeaan reunaan aukeaa työkalu, jolla voit muokata sivun ulkoasua. Klikkaamalla tekstialueita voit valita värejä joko väripaletin avulla tai kirjoittamalla lukuarvot käsin. Syötä alueisiin seuraavat numerot (muista aina tarkistaa, että numeroiden edestä löytyy myös risuaita):

Taustaväri: #FFFFFF
Sisältöalueen tausta: (tyhjä!)
Teksti: #6E6E6E
Linkit: #26697E (voit myös valita itsellesi sopivan värin!)
Kappaleiden tausta: (tyhjä!)
Arvosanojen tausta: (tyhjä!)
Taustakuvan URL: http://images.apple.com/euro/home/images/bg-20100209.gif

Kopioi katkoviivan jälkeen kaikki koodi ja liitä se kohtaan "Lisää oma CSS". Tämän jälkeen modaus on valmis ja voit tallentaa sen painamalla "Tallenna"-näppäintä. Lopputuloksen näet menemällä artistisivullesi.

Älä kopioi tätä katkoviivaa, vaan pelkästään kaikki teksti sen jälkeen =)
--------------------------------------------------------------------------

#leftblock img {margin-top:8px;}

h3 a img{display:none;}
a.listenb{background:none;padding:5px 1px 5px 1px}
div.lined_spacer {display:none}

div.track-tools a img{display:none;}
a.songtool{background:none; border: none;}

div.lined_spacer {display:none}

input, textarea.field {
color: #4a4a4a !important;
background: #f8f8f8 url('http://users.tkk.fi/~mtmotton/images/fadingback.png') repeat-x;
background-position: 0px -1px;
border: 1px #dfdfdf solid;
-moz-border-radius:8px;
-webkit-border-radius:8px;
font-family: verdana;
}

#languageselect a{
display:none;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}

select {background-color: white;
padding: 1px;
color:#333333;
border: 1px #aeaeae solid;}

body {
background-repeat: repeat-x;
}

ul.submenu {
display: none;
}

#footer {display: none;}

#body_container {
margin-top:15px;
background: url('http://users.tkk.fi/~mtmotton/images/appleback.png') repeat-x;
width: 980px;
height: 21px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

#submenuarea .tools a {
font-family: lucida sans, arial;
font-size: 11px;
color:#000000 !important;}
#submenuarea .tools a:hover {color:#3d81ae !important;
text-decoration: none !important;}

div.expressurl {
text-align: center;
}

#navibar {
background: url('http://users.tkk.fi/~mtmotton/images/appleback.png') repeat-x;
width: 960px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

#navibar .sel_top { background:url('http://users.tkk.fi/~mtmotton/images/selected.png') repeat-x; padding:10px;
border-right: 1px #afafaf solid;
}

#navibar a:link, #navibar a:visited {color: #000 !important;}

#navibar a.projects {color:#000000 !important; }

#navibar a.sel_top {color:#ffffff !important; }

#navibar .navi {background:url('http://users.tkk.fi/~mtmotton/images/appleback.png') repeat-x fixed inherit;}

#navibar .utils {top:-20px;}

#navibar .utils #bandsearch {
background: #FFFFFF url('http://users.tkk.fi/~mtmotton/images/search.png') no-repeat;
background-position: 5px 3px;
padding-left: 17px;
border-top: 1px #888888 solid;
border-left: 1px #aaaaaa solid;
border-right: 1px #aaaaaa solid;
-moz-border-radius:10px;
-webkit-border-radius:10px;}

#navibar .utils a { color:#000 !important;}

#navibar .utils .qs_button { display:none !important;}

div.track, div#leftblock, div.badding {
font-family: lucida sans, tahoma;
background: #FFFFFF;
font-size:13px;
color: #4e4e4e;
padding:7px;
padding-top:2px;
margin:22px 0;
margin-top: 0px;
}

div.track, div.badding {
background: #FFFFFF;
/* url('http://users.tkk.fi/~mtmotton/images/appleboo3.png') repeat-x; */
border: 1px #d8d9da solid;
border-bottom: 1px #aaaaaa solid;
border-top: 1px #e5e5e5 solid;
-moz-border-radius:6px;
-webkit-border-radius:6px;
}

div.track {
background: #FFF url('http://users.tkk.fi/~mtmotton/images/bottomapple.png') repeat-x;
background-position: left bottom;}

div.badding {padding-bottom:0px;}

div.track-description {
padding-top:15px;
padding-bottom:15px;}

.spot {
color: white;
background: #f5f6f7;
margin-top: 20px;
padding-top: 6px;
border: 1px #dedede solid;
-moz-border-radius:6px;
-webkit-border-radius:6px;
}

h1 {
text-align: center;
font-family: cambria, lucida sans, arial;
font-size: 32px !important;
text-transform: lowercase;
}

h3 {
text-align: center;
font-size: 14px;
}

.track h3 {
margin-top:10px;
margin-bottom: 10px;}

.track a:link {
font-weight: normal;
font-family:verdana, arial;
color: #262626;}

.track a:hover {
text-decoration: none;
color: #26697e;
}

div#leftblock {
padding-top: 12px;
margin-left: 1px;
padding-right: 12px;
}

div.dotted_spacer {
display: none;
}

.body {
background: #FFFFFF;
border: 1px #dedede solid;
border-bottom: 0px;
-moz-border-radius-topleft:4px !important;
-webkit-border-radius-topleft:4px !important;
-moz-border-radius-topright:4px !important;
-webkit-border-radius-topright:4px !important;
}


#contents {
margin-left: -1px;
background: #FFFFFF;
border: 1px #dedede solid;
border-top: 0px;
-moz-border-radius-bottomleft:4px;
-moz-border-radius-bottomright:4px;
-webkit-border-radius-bottomleft:4px;
-webkit-border-radius-bottomright:4px;
margin-bottom: 15px;
}

#submenuarea{
text-align:center;}

#submenuarea .tools {
color: #ffffff;
background: none;
}

.track-rates-comments {
background: inherit;
padding-top: 4px;
margin-bottom: 0px;
border-top: 1px #dedede solid;
}

div.guestbook-comment {
background: #f8f8f8 url('http://users.tkk.fi/~mtmotton/images/fadingback.png') repeat-x;
background-position: 0px -1px;
border: 1px #dfdfdf solid;
padding:5px;
margin-bottom:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

div.track-info {
color: black;
}

div.artistinfo {
padding-left:2px;
}

SPAN.songmeta {
color: #6e6e6e;
}

input.smallsubmit {
margin-top:5px;
padding: 0px 2px;
color: #000 !important;
background: none;
-moz-border-radius:5px;
-webkit-border-radius:5px;
font-weight: normal;
}

input.submit {
background: #383838 url('http://users.tkk.fi/~mtmotton/images/appleback.png') repeat-x;
border: none;
color: black !important;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

small.track-added {
display: none;}

.artist_idols{
text-transform: capitalize;
}

div.copynote {color: cccccc;}

div.badding {
background: white;
padding-top:10px;
margin-bottom:3px;
}

.smallsubmit:hover {
background: #bfbfbf;
}

.submit:hover {
color: white !important;
}