style_system | Recent Entries

Hi. I'm modifying a transmorgified theme from here:

Titanic Layout

for a comm I am creating. I'd like to add a separate box/module directly under the nav strip (and above the entries) for the Links List. I can't seem to find the CSS snippet for the Links List, though?

Sorry, I know its a stupid question, but I'm another 88er getting used to DW coding and I can't find it in any of the CSS references for DW :(

valiha

Hi all, I'm trying to further customize a Transmogrified layout Open Skies made by

sailorptah. She's set the layout to fixed width, and I'd like to make it fluid so that it adapts both to my 22" widescreen monitor, and my 10" netbook.

I want to remove the background image so that I don't have to rely on it to separate main content from the sidebar. I thought that shouldn't be difficult with background color and borders, but I'm having trouble with the #wrap, which looks like a narrow strip behind #content and .module-section-two. I also want the footer to blend in. How do I achieve the look of the preview without images, and remove the space between #wrap and .module-section-one?

ETA there's also something strange going on here:

http://img542.imageshack.us/img542/3500/49354635.png

Current Mood: frustrated

jewelfox

I'm trying to replace the funky circles in question with a different picture, preferably superimposed over the title banner the way that the circles are normally. The current testbed is the otherwise-blank

fursona community, which is being styled to emulate the best parts of

aliaspseudonym's Tumblr. I'm just running into two problems:

One, due to the complex way that the circles are coded into the layer (as referenced in this comment on this entry, I'm not even sure how to extract and replace them completely, at least not using CSS. This comment explains how to do a custom header image, and that seems to work, but we're not going for that style of header.

Two, even replacing the background-image URL in that CSS style doesn't actually replace the background image. Does it need to be a paid account for me to do that? I'm confused.

Any help would be appreciated, even if it involves going into S2 (I've done a little of that before).

awakened

1) Is there a way I can remove the links from the date on Transmogrified?

2) I would also like to know how to remove "(no subject)" from entries and comments that do not have a subject by editing layers. (I know there is a way to do it through CSS, but I don't like the slight space it leaves behind.)

mrs260

SOLVED!

Hello,

I recently switched to Paletteable. I enabled custom reading page colours, but I'd like the custom colours to form a slightly thicker border around the userpic, particularly the "background" colour. (It's hard for me to distinguish some of my colours when the lines are this thin, particularly since I always use black as the "foreground" colour for individual users.)

I've tried to figure out on my own what I should do, but I don't even know where to start.

Thanks in advance!

jewelfox

I'm styling the pink Skittlish Dreams some more, and I decided I wanted to move the NSFW and friends-locked tags to the left of the date and time below each entry's title, as opposed to taking up a whole line between them. (You can see an example on this post, which is mildly NSFW and hence has the icon.)

Applying float: left; to .restrictions and .access-filter > img put it on the same line, but it isn't aligned with the date and time part. And I've been trying to use padding to get it to look right, but a) I feel like there should be a more elegant way to make it inline, and b) the padding won't apply no matter what. Not even adding !important does the trick.

What am I missing here, and is the better solution to just create a custom S2 layer and rearrange the placement of elements? If so, how would I go about that (and I get the feeling I'd need to do more CSS styling anyways)?

momijizukamori

Okay, so I've looked through the wiki and through the style comms I've found, and I haven't managed to find a nice clear set of guidelines for this. I'm interested in getting started on designing some new styles for submission as official ones, but before I get too deep into CSS, I want to make sure the layout conforms to the basic standards for official styles. So far I've discovered that 1) it has to have 1em as the base font size and 2) must be fluid-width. Are there any others? I'm probably mostly going to be working off of Tabula Rasa and it's descendants, if it matters.

jewelfox

I'm using Skittlish Dreams, and I had the idea that I could get rid of the "top" part of a sidebar widget (the header and background) to put Custom Text right below my Profile, and make it look like the text is part of the profile. Unfortunately, I'm not sure how to make that part disappear for just the Custom Text module.

.module-section-two .module {
     background: none;
}

makes it vanish for all of them, and I haven't been able to make it any more specific. Can anyone help? I tried putting .module-tags_list in there too and it didn't work.

Edit: Never mind, the following code works (replace module-calendar with any other module):

div.module-calendar { background:none !important; }

It's the !important that overwrites the rule handed down from higher up. Many thanks to

niya for her assistance.

dhae_knight_1

I really, really like the layout I have now, with one tiny little problem; I would really like to fix my background image so it didn't scroll and repeat, because, frankly, it sucks at tiling height-wise.

I found this: http://style-system.dreamwidth.org/22713.html, which unfortunately removes my header, but I can't find anything else.

Is it even possible? Or do I need to get creative and smush both background and header together into one massive picture and then make that one fixed?

Current Mood: confused

aryas_zehral

Hi,

I'm trying to get a header onto Brittle over at

slashing_jane. I tried it using the #canvas tag(?) but when it was centered it was out of alignment with the body and when I put it to the left I couldn't work out how to move it in until it lined up. Also I want a background image for the page but I'm not sure how to do both.

I know nothing about CSS so any help would be greatly appreciated.

Thanks,

Sayra.

sharpiefan

(Ironic, I know, given the previous post!!)

I'm using Practicality for my personal journal, and have inserted a header banner using this code:

#canvas {
background-image: url(http://i26.photobucket.com/albums/c139/Sharpiefan/Sharpebanner1.jpg);
background-repeat: no-repeat;
background-position: top center;
padding-top: 250px;
}

I want to introduce a small margin (of about 10px) at the top and bottom of my banner, to give a bit of space between the banner and the nav bar, at the top, and the header box (or whatever it's called) underneath.

How can I do this? Or can't I?

Trying to increase the padding number to 270 just moves the header box down, without shifting the banner itself down as well.

dhae_knight_1

I'm using Underworld for Crossroads, and the header is cooking my noodle. I would love to reduce the height of the header to... pretty much what's needed for the navigational elements, now I've figured out how to insert an image as title. I've checked the page source, but... either it's been way too long since I worked with CSS last, or the header elements are on an external style-sheet somewhere.

Can I do this at all, or do I need to make my very own style from scratch?

Also... I think I might like to move the navigation module to the left down just a smidgen. Anybody got pointers to that effect?

Current Mood: annoyed

marilla_pm67

Hello,

I hope this is the right place to ask.

I have a bunch of feed accounts on my friend page ... but they don't show any icons, it shouldn't be annoying, but it is for me. I would like to know if there's an override bit of code permitting to get a default icon showing up, or if there's a possibility on your end, to set up a default icon for the feed accounts? that would show up on the reading page.

Thanks in advance.

Sam.

sharpiefan

Help!!

I've just set up a mirror community for one on LJ, and I want to move the nav links (recent entries/member posts/archive/profile) to the centre, under the header box.

Is there any way of doing that? And if so, could someone talk me through it - I'm not that confident with coding-type stuff.

molotov

I really hope someone can help me!

I'm using the port of Flexible Squares, and I brought my old layout with me. The problem is that it uses images for navigation. On LJ, the active page shows in the nav module like this:

But on DW, the active page disappears from the nav, leaving me with this:

I feel like I'm overlooking something.

#header {
padding:5px 0;
text-align:right;
text-transform:lowercase;
z-index:100;}

#header:hover {margin: auto;}

ul.navheader {
list-style:none outside none;
margin: 20px auto 20px;
padding:0;
text-align: center;
z-index:100;
}

ul.navheader:hover {}

ul.navheader li {
display:inline;
list-style-type:none;
margin:0;}

.headerimage 
{
background-image:url();
background-repeat: no-repeat;
position: relative;
width: 0px;
height: 0px;
margin-left: auto;
margin-right: auto;
padding: 0px;
}

div#header a, div#header a:link, div#header a:visited {
border:0 none;
font-size:0px;
padding:4px 6px;
color:transparent;
}

div#header a:hover { 
border:0 none;
font-size:0px;
padding:4px 6px;
color:transparent;
}

div#header li.view { 
border:0 none;
font-size:0px;
padding:4px 6px;
color:transparent;
}

body.lj-view-recent div#header li.view {
background:transparent url(http://i55.tinypic.com/2wq7a69.png) no-repeat scroll 50% 0;
padding:22px 22px 0; }
body.lj-view-archive div#header li.view{ padding:25px 25px 0; background:transparent url(http://i54.tinypic.com/smayxx.png) no-repeat scroll 50% 0} 
body.lj-view-friends div#header li.view{ padding:22px 21px 0; background:transparent url(http://i55.tinypic.com/30lh0z7.png) no-repeat scroll 50% 0}

div#header a[href*=".dreamwidth.org/"] {
background:transparent url(http://i54.tinypic.com/14e8mix.jpg) no-repeat scroll 50% 0; padding:22px 22px 0; }

div#header a:hover[href*=".dreamwidth.org/"] {
background:transparent url(http://i55.tinypic.com/2wq7a69.png) no-repeat scroll 50% 0; padding:22px 22px 0; }

div#header a[href*="/archive"] {
background:transparent url(http://i51.tinypic.com/dzimja.jpg) no-repeat scroll 50% 0; padding:25px 25px 0; }

div#header a:hover[href*="/archive"] {
background:transparent url(http://i54.tinypic.com/smayxx.png) no-repeat scroll 50% 0; padding:25px 25px 0; }

div#header a[href*="/read"] {
background:transparent url(http://i54.tinypic.com/35nbzbn.jpg) no-repeat scroll 50% 0; padding:22px 21px 0; }

div#header a:hover[href*="/read"] {
background:transparent url(http://i55.tinypic.com/30lh0z7.png) no-repeat scroll 50% 0; padding:22px 21px 0; }

div#header a[href*="/profile"] {
background:transparent url(http://i53.tinypic.com/2s0h2yf.jpg) no-repeat scroll 50% 0; padding:22px 21px 0; }

div#header a:hover[href*="/profile"] {
background:transparent url(http://i52.tinypic.com/2ag3hw9.png) no-repeat scroll 50% 0; padding:22px 21px 0; }

div#header a[href*="/tag"] {
display:none }
div#header a:hover[href*="/tag"] {
display:none }
div#header a[href*="/memories"] {
display:none }
div#header a:hover[href*="/memories"] {
display:none }

Any help would be much appreciated!!

meicdon13

I'm using customized tiny icons instead of the usual tiny icons for private, filtered, etc. entries and I noticed that while the tiny icon for custom groups works fine, the tiny icons for private entries and filtered entries repeats. Ideally, the tiny bento box should only appear beside the date and time.

( Relevant code under the cut. )

My second question is, is there any way to remove the "expand all cuts" option from the sidebar?

Any help would really be appreciated.

Current Mood: confused

adalger

Just a quick post ex officio to express my warmest gratitude to everyone reading. Even when real life eats me for months at a time, you wonderful people continue to make this community everything I ever hoped it might possibly aspire to, and then some.

I'd also like to informally seek comments on the comm style. I know it's beautiful, and I totally adore

branchandroot and

dancing_serpent and their awesome design skills, but we've had the same style for a somewhat long time now. How do y'all feel about another call for our artistic community to showcase their skills and whip up some candidates for a new theme?

redcirce

Hi all, I'm another migrant from LJ. ::waves:: I hope the influx of questions isn't too annoying?

Anyway, my question is as follows: Is there a way to set up your header so that it randomly chooses one of a group of header images each time the page is loaded?

I was able to port over pretty much all of my custom journal style from LJ thanks to

starlit's super helpful entry, but I couldn't get the code I had for rotating your header image to work. Admittedly, that could be because my knowledge of CSS is pretty limited and I could have been trying to insert it in the wrong place. (It was originally on LJ's "Edit your Theme Layer" page) The custom style was written for me, and although I sort of knew how to tweak it slightly on LJ, I'm not sure how it interacts with

starlit's code and my few exploratory attempts have gone awry. Any suggestions?

Current Mood: curious

meicdon13

~~First post for 2012!~~

So I'm trying to edit the layout I'm currently using. I tweaked some of the original CSS to accomodate my new header. I set the height to 200px since the image height is exactly 200px. But I noticed that there seems to be an extra few couple of pixels and that my header repeats.

This is the relevant CSS:

#header {
background:url("http://a.random-image.net/bcdmonte/batman.jpg") repeat scroll 0 0 transparent;
border:2px dashed #2D231C;
height:200px;
text-align:right;
}

I tried removing repeat scroll 0 0 transparent from the CSS but that just resulted in the entire header (plus the border) to disappear. Help?

Current Mood: confused

misstia

hi! i freely admit i have 'the dumbz'....i don't want to import my theme/style from LJ, i am okay with the one i found here on DW....i would like to customize the header though and i have zero clue how to do that and i tried to find some info in FAQs, etc and i might have been looking wrong???? (i totally was looking wrong!)

i am using 'purple' for my journal style....

i DID find the CSS code to remove the 'recent entries' from the header but didn't want to add that yet lest it interfere with future CSS code additions.....and i know i can get rid of the 'profile module' too once i get the header sorted out.....

i'd like to put my journal name in the center and then have links under it (within the header) for: profile, friend's page (reading page), link to my domain, archive....i think this is possible??? i did buy a premium account here (sooo impressed with DW and how they value their users! :) i just don't know how and got really confused trying to find out how to do this.....maybe i need a different style?

i do know html, i know enough CSS to fiddle with it, but can't write CSS on my own....so i hoping someone can direct me somewhere as i have searched, but obviously am not searching in the right place....i saw where i can import a LJ style/theme, but i just want to customize a DW one.....

thank you in advance!!!

ETA: Resolved!! THANK YOU!!! :-)

Profile

Dreamwidth style system discussion

January 2012

S	M	T	W	T	F	S
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31

Syndicate

Page Summary

goneahead - Need to Add Link List to Transmorgified?
valiha - Customizing a transmogrified layout
jewelfox - How to change "Funky Circles" background image?
awakened - Removing links from date and removing (no subject) lines.
mrs260 - Paletteable and custom reading page colors
jewelfox - How I mine for padding?
momijizukamori - Requirements for new 'official' style layers?
jewelfox - Removing sidebar module's background on Skittlish Dreams
dhae_knight_1 - Non-scrolling background image *and* a header?
aryas_zehral - Adding a header to Brittle
sharpiefan - Increasing header height
dhae_knight_1 - Reducing header height?
marilla_pm67 - Question about Feed accounts - Solved
sharpiefan - Moving the nav links in Basic Boxes
molotov - Showing the active page in the nav module in Flexible Squares
meicdon13 - Restriction image and expand all cuts option
adalger - Welcome to 2012!
redcirce - Multiple header images?
meicdon13 - Header image size
misstia - lj refugee having 'the dumbz'....

Active Entries

Style Credit

Base style:: branchandroot
Theme:: dancing_serpent
Resources:: OpenClipart

Expand Cut Tags

No cut tags

Page generated Jan. 28th, 2012 06:12 pm

Dreamwidth style system discussion

Recent Entries

Need to Add Link List to Transmorgified?

Customizing a transmogrified layout

How to change "Funky Circles" background image?

Removing links from date and removing (no subject) lines.

Paletteable and custom reading page colors

How I mine for padding?

Requirements for new 'official' style layers?

Removing sidebar module's background on Skittlish Dreams

Non-scrolling background image and a header?

Adding a header to Brittle

Increasing header height

Reducing header height?

Question about Feed accounts - Solved

Moving the nav links in Basic Boxes

Showing the active page in the nav module in Flexible Squares

Restriction image and expand all cuts option

Welcome to 2012!

Multiple header images?

Header image size

lj refugee having 'the dumbz'....

Profile

Links

January 2012

Syndicate

Most Popular Tags

Page Summary

Active Entries

Style Credit

Expand Cut Tags