1

[Cheap Logo Design]

Cheap Logo Design

#521

Hey guys awesome theme, and I am excited about my blog with this theme and it’s options. One item I am working on is trying to change the color of the slider, post titles, and widget headers from blue to red. Is there a way to do this?

[maywind]

maywind

#12768

Hi, love your theme too! Very clean and structured look. I just updated to v1.2 🙂 The only thing that does not really fit with my current header image is the blue colour of the links and the sidebar widget headers. Is there a way to change this without much effort? If I create my own css using the same tags, does it override the general one? Or do I have to create a new style.css? And which tags have to be modified?

If a colour change needs a lot of effort, please add it to the feature request list for the next update! 🙂

Kind regards

maywind

[maywind]

maywind

#12769

Ok, for the links I can use the design options in the admin module. Plus I found the discussion on the master png: https://forum.graphene-theme.com/topic/modify-sprite_masterpng (red seemed to better fit 😉 Still a bit lost with the sidebar widget headers though…

[Kim]

Kim

#12770

You got work to do!

Please read this:

https://forum.graphene-theme.com/topic/how-to-modify-the-theme-using-a-child-theme

In Graphene Child Theme “style.css” add changes and colors as needed.

Here are some of my colors: (Red color codes You find)

.sidebar h3 {

-pie-background: linear-gradient(#BABABA, #6E6E6E);

background: #BABABA;

background: linear-gradient(#BABABA, #6E6E6E);

background: -moz-linear-gradient(#BABABA, #6E6E6E) repeat scroll 0 0 transparent;

background: -webkit-gradient(linear, 0 0, 0 bottom, from(#BABABA), to(#6E6E6E));

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#BABABA', endColorstr='#6E6E6E'); /* for IE */

text-shadow: 0 -1px 0 #000000;

}

.featured_slider{

background: -moz-linear-gradient(left top , #E0E0E0, #EEEEEE) repeat scroll 0 0 transparent;

background: -webkit-gradient(linear, left top, right bottom, from(#E0E0E0), to(#EEEEEE));

background: linear-gradient(left top, #E0E0E0, #EEEEEE);

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D4D4D4', endColorstr='#EEEEEE'); /* for IE8 */

-moz-box-shadow: inset 0px 0px 1px 1px #C4C4C4;

-webkit-box-shadow: inset 0px 0px 1px 1px #C4C4C4;

box-shadow: inset 0px 0px 1px 1px #C4C4C4;

}

.featured_slider #slider_root {

-moz-box-shadow: inset 0px 0px 1px 1px #C4C4C4;

-webkit-box-shadow: inset 0px 0px 1px 1px #C4C4C4;

box-shadow: inset 0px 0px 1px 1px #C4C4C4;

background: none repeat scroll 0 0 #FFFFFF;

}

.block-button, .block-button:visited {

-moz-border-radius: 5px 5px 5px 5px;

-webkit-border-radius:5px;

border-radius:5px;

border: 1px solid #CCCCCC;

display:block;

font:bold 12px arial;

text-decoration:none;

padding:5px 15px 6px 15px;

color:#FFFFFF;

text-shadow:0 -1px 1px #000000;

margin-top:10px;

position:relative;

float:right;

-moz-box-shadow: 0 0 0px #42454A;

-webkit-box-shadow:0 0 0px #42454A;

box-shadow:0 0 0px #42454A;

background:#BABABA;

background: -moz-linear-gradient(#BABABA, #6E6E6E) repeat scroll 0 0 transparent;

background:-webkit-gradient(linear, 0 0, 0 bottom, from(#BABABA), to(#6E6E6E));

background:linear-gradient(#BABABA, #6E6E6E);

-pie-background: linear-gradient(#BABABA, #6E6E6E);

}

.block-button:hover{

text-decoration:none;

color:#FFFFFF;

cursor:pointer;

background:#D4D4D4;

background:-moz-linear-gradient(#D4D4D4, #737373);

background:-webkit-gradient(linear, 0 0, 0 bottom, from(#D4D4D4), to(#737373));

background:linear-gradient(#D4D4D4, #737373);

-pie-background: linear-gradient(#D4D4D4, #737373);

}

Happy “color” hunting:

http://www.color-hex.com/color/

[maywind]

maywind

#12771

Oh boy… Thanks, Kim! That helps me a LOT!

[Kim]

Kim

#12772

Hmm..

Try the sidebar codes in Graphene 1.2 “Custom CSS”

[Kim]

Kim

#12773

Looking at the “h1.page-title” Bar:

(Press Category or Tag)

h1.page-title {

-pie-background: linear-gradient(#BABABA, #6E6E6E);

background: #BABABA;

background: linear-gradient(#BABABA, #6E6E6E);

background: -moz-linear-gradient(#BABABA, #6E6E6E) repeat scroll 0 0 transparent;

background: -webkit-gradient(linear, 0 0, 0 bottom, from(#BABABA), to(#6E6E6E));

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#BABABA', endColorstr='#6E6E6E'); /* for IE8 */

text-shadow: 0 -1px 0 #000000;

-moz-border-radius: 0 5px 0 0;

}

[Kim]

Kim

#12774

Ultimate CSS Gradient Generator:

http://www.colorzilla.com/gradient-editor/

Great tool for playing with gradient colors.

Kim

[Safer]

Safer

#12775

First of all THX you very much guys, for all CSS codes. You help me so much, but I have one question: how can I change color of search results bar/slide. I change color to green with your codes (sidebar and slider on main page), but when I search something and the search result bar/slider is still blu. Can someone post me a code for that? Thank you

[Kim]

Kim

#12776

2 posts up:

Looking at the “h1.page-title” Bar.. 🙂

Here are my gray colors:

h1.page-title {

-pie-background: linear-gradient(#afaeae, #6E6E6E);

background: #6E6E6E;

background: linear-gradient(#afaeae, #6E6E6E);

background: -moz-linear-gradient(#afaeae, #6E6E6E) repeat scroll 0 0 transparent;

background: -webkit-gradient(linear, 0 0, 0 bottom, from(#afaeae), to(#6E6E6E));

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#afaeae', endColorstr='#6E6E6E'); /* for IE8 */

text-shadow: 0 -1px 0 #000000;

-moz-border-radius: 0 5px 0 0;

}