Jump to content

[Tutorial] Forums Redesign v2


Recommended Posts

i have a question for the background. i can make it my own background, i already figured it out, but can i make it so the white colour becomes blue or something? i would like a hex code please. thanks in advance.

How well do you know CSS?

Link to comment

you forgot to remove the mozilla extension thingy from chrome again




--- i changed the background to the background on my profile. if you want this style but hte background my profile background, use this:

[spoiler]@font-face {
font-family: 'Dosis';
font-style: normal;
font-weight: 500;
src: local('Dosis Medium'), local('Dosis-Medium'), url([url="http://themes.googleusercontent.com/static/fonts/dosis/v1/A4RWZsncmJ25G8iqn2EHN_esZW2xOQ-xsNqO47m55DA.woff"]http://themes.googleusercontent.com/static/fonts/dosis/v1/A4RWZsncmJ25G8iqn2EHN_esZW2xOQ-xsNqO47m55DA.woff[/url]) format('woff');
}
@font-face {
font-family: 'Dosis';
font-style: normal;
font-weight: 600;
src: local('Dosis SemiBold'), local('Dosis-SemiBold'), url([url="http://themes.googleusercontent.com/static/fonts/dosis/v1/f8qltGyj2S-SS_tsOHsjgfesZW2xOQ-xsNqO47m55DA.woff"]http://themes.googleusercontent.com/static/fonts/dosis/v1/f8qltGyj2S-SS_tsOHsjgfesZW2xOQ-xsNqO47m55DA.woff[/url]) format('woff');
}
@font-face {
font-family: 'Dosis';
font-style: normal;
font-weight: 700;
src: local('Dosis Bold'), local('Dosis-Bold'), url([url="http://themes.googleusercontent.com/static/fonts/dosis/v1/x-7NZTw0n-ypOAaIE8uSrvesZW2xOQ-xsNqO47m55DA.woff"]http://themes.googleusercontent.com/static/fonts/dosis/v1/x-7NZTw0n-ypOAaIE8uSrvesZW2xOQ-xsNqO47m55DA.woff[/url]) format('woff');
}

.input_submit {
background: url("[url="http://i.imgur.com/dY1Ru0G.png"]http://i.imgur.com/dY1Ru0G.png[/url]") center !important;
border:solid 1px white !important;
box-shadow:none !important;
transition:0.3s !important;
color:pink !important;
}

.input_submit:hover{
color:gold !important;
opacity:0.9 !important;
}




::selection{
background-color:rgba(255,102,0,0.5) !important;
color:rgba(30,144,255,1) !important;
}

::-moz-selection{
background-color:rgba(255,102,0,0.5) !important;
color:rgba(30,144,255,1) !important;
}

body{
font-family:'Dosis',sans-serif !important;
font-size:75% !important;
}

DIV#board_statistics.statistics.clearfix{
border-top:solid 3px rgba(255, 140, 105, 0.5) !important;
}



H3#anonymous_element_88{
background:transparent url("[url="http://pokemmo.eu/images/background-header-footer.png"]http://pokemmo.eu/images/background-header-footer.png[/url]") bottom !important;
color:white !important;
text-shadow: 2px 2px 2px rgba(0,0,0,0.5) !important;
font-family: 'Dosis', sans-serif !important;
}

DIV.ipsBox.table_wrap{
border-radius:20px !important;
}


#branding{
background:transparent url("[url="http://pokemmo.eu/images/background-header-footer.png"]http://pokemmo.eu/images/background-header-footer.png[/url]") bottom !important;
margin-bottom:2px !important;
color:black !important;
box-shadow:0px 5px 3px rgba(0,0,0,0.5) !important;

}

#logo:after{
content: "No Bullshit, Just Games!" ;
margin:20px !important;
font-size:24px;
position:absolute;
color:white !important;
text-shadow: 2px 2px 3px rgba(0, 0, 0,0.9) !important;
}

img[src*="[url="https://forums.pokemmo.eu/public/style_images/master/logo.png"]https://forums.pokemmo.eu/public/style_images/master/logo.png[/url]"]{
background:transparent url("[url="http://pokemmo.eu/images/pokemmo.png"]http://pokemmo.eu/images/pokemmo.png[/url]") bottom no-repeat !important;
width:0;
height:39px;
padding-right:292px;
margin-top:10px;
}

h3.maintitle{
background:transparent url("[url="http://pokemmo.eu/images/background-header-footer.png"]http://pokemmo.eu/images/background-header-footer.png[/url]") bottom !important;
border:none !important;
text-shadow:2px 2px 0px rgba(0,0,0,0.4) !important;
border-radius:5px !important;
}



#community_app_menu > li > a{
background:transparent url("[url="http://pokemmo.eu/images/call-to-action-blue.png"]http://pokemmo.eu/images/call-to-action-blue.png[/url]") center no-repeat !important;
border-radius:5px !important;
margin-left:2px;
transition:0.2s !important;


}

div.maintitle.clear.clearfix{
background:transparent url("[url="http://pokemmo.eu/images/background-header-footer.png"]http://pokemmo.eu/images/background-header-footer.png[/url]") bottom !important;
border:none !important;
text-shadow:2px 2px 0px rgba(0,0,0,0.4) !important;
border-radius:5px !important;
box-shadow:1px 1px 2px rgba(0,0,0,0.5) !important;
}

h3.row2{
border-bottom-left-radius:15px !important;
border-bottom-right-radius:15px !important;
background-color:rgb(115,172,227) !important;
color: white !important;
box-shadow:1px 1px 2px rgba(0,0,0,0.5) !important;

}

div.ipsBox{
padding:0px !important;
}

DIV.ipsBox_container.ipsPad{
border-radius:20px !important;
background-color:rgba(255,255,255,0.5) !important;
}
DIV#fast_reply_wrapper.ipsBox{
border-radius:20px !important;
background:none !important;
}
H1.ipsType_subtitle{
font-family:'Dosis', sans-serif !important;
}

span.author.vcard{
color:orange !important;
}

IMG.ipsUserPhoto.ipsUserPhoto_large{
border:solid 1px orange !important;
border-radius:5px !important;
box-shadow:1.5px 1.5px 2px rgba(0,0,0,0.3) !important;
}

#community_app_menu > li > a:hover{
font-size:110% !important;
box-shadow: 1px 1px 0px rgba(0,0,0,0.5) !important;
}
#community_app_menu > li.active > a{
}
html, body {

background-color: #FFC0CB !important;

background-image: url("[url="http://gickr.com/results4/anim_9bd8754e-4437-cc64-d981-1f9b16513b3f.gif?nc=1376460615"]http://gickr.com/results4/anim_9bd8754e-4437-cc64-d981-1f9b16513b3f.gif?nc=1376460615[/url]") !important;

background-position: 0px 0px;
background-attachment: fixed;
background-repeat: repeat;

}


.ipsSideBlock h3{
background:transparent url("[url="http://pokemmo.eu/images/background-header-footer.png"]http://pokemmo.eu/images/background-header-footer.png[/url]") bottom !important;
color:white !important;
font-family:'Dosis', sans-serif !important;

}


#content.clearfix{
background:rgba(255,255,255,0.5) !important;
border-radius:20px !important;

}

DIV.ipsSideBlock.clearfix.__xXrecent20topics{
border-radius:20px !important;


}

A.ipsType_small{
font-size:15px !important;
}

H3#anonymous_element_82{
border-radius:10px !important;
background:transparent url("[url="http://pokemmo.eu/images/background-header-footer.png"]http://pokemmo.eu/images/background-header-footer.png[/url]") bottom !important;
color:white !important;
}


#primary_nav.clearfix{
background:transparent url("[url="http://i.imgur.com/wgvMRSL.png"]http://i.imgur.com/wgvMRSL.png[/url]") bottom !important;
box-shadow: 0px 5px 5px rgba(0,0,0,0.5) !important;
margin-bottom:5px !important;
height:35px !important;
border-bottom-left-radius:10px !important;
border-bottom-right-radius:10px !important;

}

div.ipsBox{
background: rgba(255,255,255,0.5) !important;
}

.topic_buttons li a{
background: url("[url="http://i.imgur.com/dY1Ru0G.png"]http://i.imgur.com/dY1Ru0G.png[/url]") center !important;
border:solid 1px white !important;
box-shadow:none !important;
transition:0.3s !important;
color:pink !important;
}

.topic_buttons li a:hover{
color:gold !important;
opacity:0.9 !important;
}

td.col_f_content{
background:rgba(255,255,255,0.4) !important;
}

div.ipsFilterbar.maintitle{
background:transparent url("[url="http://pokemmo.eu/images/background-header-footer.png"]http://pokemmo.eu/images/background-header-footer.png[/url]") bottom !important;
border:none !important;
box-shadow:none !important;
border-radius:5px !important;
text-shadow:2px 2px 0px rgba(0,0,0,0.4) !important;

}[/spoiler]
astro if you're wondering, i used inspect element from opera and searched gickr on my prof page, and i knew it was there because i could see a bit of my custom pinkish background on the bottom, then copypasted the background code into stylish, got rid of the other background code, SHABAM SHABOOM!

Link to comment
  • 1 month later...
  • 4 weeks later...
  • 5 weeks later...
  • 2 years later...
  • Kizhaz changed the title to [Tutorial] Forums Redesign v2

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...

Important Information

By using this site, you agree to our Terms of Use and Privacy Policy.