SOLVED: Help needed - mainly clicky links/navigation/entry text
Hello :) First time poster here, first time ever attempting to edit a layout myself too. I've managed to make many of the changes I wanted thanks to the help given in previous posts but struggling on some aspects of the layout. I've gone through the relevant (I think) tags and tried several codes given to previous CSS virgins like me but none of them seem to have any effect on my profile /o\
The community I'm working on is here. This is just a Plus Account but once I've sorted the layout it will be transferred to another account which is Paid. Standard layout is Lovebirds for Expressive. My screencap software isn't working at the mo so hopefully I can explain my problems ok. I'm sure some of the points would be covered in ~one code but I don't know the technical names for each ~thing sorry. I also apologise for the tl;dr :p
Also, I'd want to do all this by adding CSS into the Custom stylesheet box rather than messing with layers and stuff if it's possible, as I know naff all about layers etc. And I have customised comment pages disabled so all the changes I only want to alter the layout ~outside the posts?
SOLVED! 1) All the clickable links in the navigation bar along the top I'd like to change to #000000.
SOLVED! 2) I've managed to move the navigation links but it's not really what I want. Ideally, I'd like the links below the header banner (I tried changing the top padding to 450px which is the height of my banner but they disappear altogether), but really I want them enclosed within a bar? Not sure how to explain it so I'll just say look at this journal for what I mean. Solid bar of colour beneath the banner with the nav links positioned centrally to the banner width. I don't want the bar that thick but I'd like all the same colours (bar, text, active/hover text). I'd also like the same font/text size/uppercase as the sidebar header text on the current layout like Comm Description etc.
SOLVED! 3) The tags in the sidebar are pink in original layout but when I click View my Tags page, the tags in there are a teal/turquoise colour. I'd like them to remain the same colour as in the sidebar.
SOLVED! 4) I want to change the colour of the subject titles to #22316C. I also want the 'Visible Tags' text on the tag page to be this colour also.
SOLVED! 5) I want to change the link colour within entries. I don't want Edit Entry/Edit Tags/Add to Memories etc to be affected though.
SOLVED! 6) I want tags on entries to be #FBEC5D without affecting tag colour in sidebar or on the tag page.
SOLVED! 7) I want to change the colour of the lj user/community names to #000000 that appear anywhere on the page (but not when inside a post), so those in page summary, profile icon, entry poster icon and any <*lj user"???"> text in the OP of a entry but only on recent entries etc.
I think that's everything for now. I know I'm asking for a lot but I hope someone can help me with as many as possible. I'm actually going to sleep now so won't be able to check back and try out any codes until tomorrow (later today) after work so it may take me a while to test them and see if they're working for me before replying to any comments so please bear with me :) Thanks in advance and I'll include all the existing code I already have in my CSS box incase I've done something wrong in that lol.
___________________________________________________________________________________
/* Removes the sticky posts subject title */
.asset .asset-name-hover {display: none;}
/* Replaces header image with own */
#header-inner {
background-image: url("http://i53.tinypic.com/awvqzc.png");
height: 400px;
}
/* Removes existing header image/create navigation bar beneath */
#header {
background-image: none;
background-color: #141414;
height: 423px;
}
#header-text {
position: absolute;
top: 403px;
}
/* Changes colour of navigation links */
#header .nav .item a { color: #FFFFFF; }
#header .nav .item { border-left-color: #8B8386;}
#header .nav .item a:hover { background-color: #141414; color: #8B8386; }
/* Changes layout width */
#container-inner, #header-inner {
width: 800px; /* Change the width of the header and overall container boxes */
}
#alpha {
width: 610px; /* Overall width minus sidebar width */
}
.layout-tw #alpha-inner {
width: 570px; /* Width of #alpha minus 40px margins */
}
/* Removes journal title/subtitle */
#header-name { display: none; }
#header-description { display: none; }
/* Change background image */
body {
background-image: url("http://i41.tinypic.com/xx7m.jpg");
background-repeat: repeat ;
background-attachment: fixed ;
}
/* Change subject title/visible tags text color */
.asset-name, asset-name a, .categories-widget .widget-footer a { color: #22316C; }
/* Change View my Tags page text color */
.asset-name a, .categories-widget .widget-footer a { color: #22316C; }
/* Color of links within entries */
.asset-body a:link,
.asset-body a:visited {
color : #8B8386;
}
.asset-body a:hover {
color : #F26098;
}
/* Change tag color in View my Tags page to match sidebar tags */
.lj-view-tags a { color: #F26098; }
/* Change tag color on entries */
.asset-tags-list a { color: #FBEC5D; }
.asset-tags-list a:hover { background-color: #fff; color: #FBEC5D; }
/* Change lj user/community names on main community page */
.widget .ljuser a, .user-icon .ljuser a { color: #000000; }
The community I'm working on is here. This is just a Plus Account but once I've sorted the layout it will be transferred to another account which is Paid. Standard layout is Lovebirds for Expressive. My screencap software isn't working at the mo so hopefully I can explain my problems ok. I'm sure some of the points would be covered in ~one code but I don't know the technical names for each ~thing sorry. I also apologise for the tl;dr :p
Also, I'd want to do all this by adding CSS into the Custom stylesheet box rather than messing with layers and stuff if it's possible, as I know naff all about layers etc. And I have customised comment pages disabled so all the changes I only want to alter the layout ~outside the posts?
SOLVED! 1) All the clickable links in the navigation bar along the top I'd like to change to #000000.
SOLVED! 2) I've managed to move the navigation links but it's not really what I want. Ideally, I'd like the links below the header banner (I tried changing the top padding to 450px which is the height of my banner but they disappear altogether), but really I want them enclosed within a bar? Not sure how to explain it so I'll just say look at this journal for what I mean. Solid bar of colour beneath the banner with the nav links positioned centrally to the banner width. I don't want the bar that thick but I'd like all the same colours (bar, text, active/hover text). I'd also like the same font/text size/uppercase as the sidebar header text on the current layout like Comm Description etc.
SOLVED! 3) The tags in the sidebar are pink in original layout but when I click View my Tags page, the tags in there are a teal/turquoise colour. I'd like them to remain the same colour as in the sidebar.
SOLVED! 4) I want to change the colour of the subject titles to #22316C. I also want the 'Visible Tags' text on the tag page to be this colour also.
SOLVED! 5) I want to change the link colour within entries. I don't want Edit Entry/Edit Tags/Add to Memories etc to be affected though.
SOLVED! 6) I want tags on entries to be #FBEC5D without affecting tag colour in sidebar or on the tag page.
SOLVED! 7) I want to change the colour of the lj user/community names to #000000 that appear anywhere on the page (but not when inside a post), so those in page summary, profile icon, entry poster icon and any <*lj user"???"> text in the OP of a entry but only on recent entries etc.
I think that's everything for now. I know I'm asking for a lot but I hope someone can help me with as many as possible. I'm actually going to sleep now so won't be able to check back and try out any codes until tomorrow (later today) after work so it may take me a while to test them and see if they're working for me before replying to any comments so please bear with me :) Thanks in advance and I'll include all the existing code I already have in my CSS box incase I've done something wrong in that lol.
___________________________________________________________________________________
/* Removes the sticky posts subject title */
.asset .asset-name-hover {display: none;}
/* Replaces header image with own */
#header-inner {
background-image: url("http://i53.tinypic.com/awvqzc.png");
height: 400px;
}
/* Removes existing header image/create navigation bar beneath */
#header {
background-image: none;
background-color: #141414;
height: 423px;
}
#header-text {
position: absolute;
top: 403px;
}
/* Changes colour of navigation links */
#header .nav .item a { color: #FFFFFF; }
#header .nav .item { border-left-color: #8B8386;}
#header .nav .item a:hover { background-color: #141414; color: #8B8386; }
/* Changes layout width */
#container-inner, #header-inner {
width: 800px; /* Change the width of the header and overall container boxes */
}
#alpha {
width: 610px; /* Overall width minus sidebar width */
}
.layout-tw #alpha-inner {
width: 570px; /* Width of #alpha minus 40px margins */
}
/* Removes journal title/subtitle */
#header-name { display: none; }
#header-description { display: none; }
/* Change background image */
body {
background-image: url("http://i41.tinypic.com/xx7m.jpg");
background-repeat: repeat ;
background-attachment: fixed ;
}
/* Change subject title/visible tags text color */
.asset-name, asset-name a, .categories-widget .widget-footer a { color: #22316C; }
/* Change View my Tags page text color */
.asset-name a, .categories-widget .widget-footer a { color: #22316C; }
/* Color of links within entries */
.asset-body a:link,
.asset-body a:visited {
color : #8B8386;
}
.asset-body a:hover {
color : #F26098;
}
/* Change tag color in View my Tags page to match sidebar tags */
.lj-view-tags a { color: #F26098; }
/* Change tag color on entries */
.asset-tags-list a { color: #FBEC5D; }
.asset-tags-list a:hover { background-color: #fff; color: #FBEC5D; }
/* Change lj user/community names on main community page */
.widget .ljuser a, .user-icon .ljuser a { color: #000000; }