Brainstorming: What do we "need" template-wise?

Skinning and designing Serendipity (CSS, HTML, Smarty)
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

judebert wrote:<wet blanket>Boy, those 50% sidebars get really big in large displays. Maybe implementing some form of maximum width for them would help?</wet blanket>
I was thinking about that, too. However, setting a maximum width is always a bit tricky - unfortunately, the appropriate css elements are only supported by newer browsers (read: IE > 6). Plus, it's kind of hard to figure out sensible values in px. Also, setting a max-width in px might cause problems with some sidebar plugins ... well, never mind. I have assigned a max-width: 300px to any sidebar in the 1-column layout. That looks sensible in my Iceweasel/Firefox from 800x600 to 1024x768 - unfortunately, I don't have a larger display at hand :?

Edit: I have just now updated sandbox and zipfile. I have also abandoned the idea to make any available layout content first, but have marked the ones that are in the lang_*.inc.php files so user who want a content first layout can choose.

Edit 2: Hm. How about giving those input and select field in the comment and contact form a max-width?

YL
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

yellowled wrote:Hm. How about giving those input and select field in the comment and contact form a max-width?
I have added that and just now uploaded a new version to the usual zipfile and sandbox locations. I also switched the default colorset to the purple one since somebody testing this mentioned he almost thought something was wrong since there was almost no styling in the default colorset.

Now, I consider this to be a "freeze" version of bulletproof. Non-developer readers should note that this is still not a release version!

We have about a month to meet our self-declared deadline, and I think we should not add any more features but concentrate on eliminating the last few bugs, finalizing the colorsets and writing documentation. I have two final things to check with Garvin for the release. I guess I'll do that via email.

YL
Don Chambers
Regular
Posts: 3652
Joined: Mon Feb 13, 2006 2:40 am
Location: Chicago, IL, USA
Contact:

Post by Don Chambers »

Well I just pulled a total bone-head move! I downloaded the latest bulletproof and unzipped it to have a look. In the process, I overwrote the css file(s) that had my bug corrections!!! I thought I had those backed up into another folder, but those other files were actually the ORIGINALS, not the modified ones!!!. So, now I have to start completely over on my bug hunt, and I don't even remember what they all were!!! :evil:

Anyway, as I look at Dave's bp site, and some of these color schemes, and match that against something I was working on before ever entering the BP development, I have a suggestion for the sidebars... I'm sure the more graphic themes will benefit from this down the road. Basically, it is putting a footer component on the sidebar items. Very simple to accomplish. Use the default sidebar.tpl, copy it to bulletproof, and add a single line:

Code: Select all

{if $is_raw_mode}
<div id="serendipity{$pluginside}SideBar">
{/if}
{foreach from=$plugindata item=item}
    <div class="serendipitySideBarItem container_{$item.class}">
        {if $item.title != ""}<h3 class="serendipitySideBarTitle {$item.class}">{$item.title}</h3>{/if}
        <div class="serendipitySideBarContent">{$item.content}</div>
        <div class="serendipitySideBarFooter"></div>
    </div>
{/foreach}
{if $is_raw_mode}
</div>
{/if}
Nothing happens without a corresponding style in css, so this is backwards compatible. Using either solid colors, borders, or full graphic backgrounds, colorsets can then have something like:

Code: Select all

.serendipitySideBarFooter {
    height: 20px;
    background: #224C03 url('{TEMPLATE_PATH}img/imagefile.jpg')
}
Anyway - just a thought. Think about some of the templates out there using rounded boxes, etc, and you will know why this thought crossed my mind. A designer could create something in photoshop, slice it into 3 pieces. Top piece can be a sidebar title background, middle becomes the background for sidebar content, and the bottom slice becomes the sidebar footer background.
=Don=
Don Chambers
Regular
Posts: 3652
Joined: Mon Feb 13, 2006 2:40 am
Location: Chicago, IL, USA
Contact:

Post by Don Chambers »

Well, after giving it some thought, the only thing I can recall clearly chasing was the sidebar title separation from the sidebar content that shows up in IE6. There was more than that, but I cannot recall what else.

Anyway, in ie6.css, there is this:

Code: Select all

.serendipitySideBarContent {
   margin-top: -17px!important;
   padding-top: 0!important;
   padding-bottom: 0!important;
}
Why, especially the negative top margin? Whatever the reason, it is part of the problem. In my own test site, I commented out that margin-top line. Chances are, the padding can go out the window too, but I didn't try that yet. Additionally, I made these changes to the green_style.css:

Code: Select all

.serendipitySideBarTitle {
/* DC */
margin: 0;
}

.serendipitySideBarContent {
/*DC */
/* margin: -13px 0 0 0; */
margin: 0;

}

/* DC new style, might want to add to style.css or base.css */
div.serendipitySideBarContent form {
    margin: 0;
    padding: 0;
}
That's it. No more separation of title from content. Obviously, my comments are not necessary, but this was a cut & paste. Anyway, whether this it truly a solution I cannot determine, because I do not remember why that negative margin existed in ie6.css in the first place.

If this is a solution, need to decide if it belongs in the colorset stylesheets or if it belongs in style.css (probably) or base.css.

And, as long as I am at it, I suggest some kind of styling for the entry icon, at minimum:

Code: Select all

img.serendipity_entryIcon {
	border: 0px;
}
This could also be an opportunity for the admin options in terms of placing it left, right, float, no float, etc.

EDIT: I'm going to retract the suggestion for adding admin options for the image icon. CSS is the better way to handle that, not in the TPL's.
=Don=
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

Don Chambers wrote:Well, after giving it some thought, the only thing I can recall clearly chasing was the sidebar title separation from the sidebar content that shows up in IE6. There was more than that, but I cannot recall what else.

Anyway, in ie6.css, there is this:

Code: Select all

.serendipitySideBarContent {
   margin-top: -17px!important;
   padding-top: 0!important;
   padding-bottom: 0!important;
}
Why, especially the negative top margin? Whatever the reason, it is part of the problem.
Hmhmhm. I remember adding this, especially because of the !important ... and I think this was meant to solve something you were after when all those events came in your way, but I can't for the life of me recall what it was ... must have something to do with the margin between content and title of a sidebar element in the green colorset, though.

Since David is still working on those colorsets, I suggest he incorporates these - I think I don't even have the latest versions of the colorset css files.
Don Chambers wrote: And, as long as I am at it, I suggest some kind of styling for the entry icon, at minimum:

Code: Select all

img.serendipity_entryIcon {
	border: 0px;
}
Added that to style.css. I also included your suggestion for a sidebar.tpl. Again, I did not include those changes to the green colorset's css, and I suggest Dave does add those to his versions of the colorset css files. Zipfile and sandbox are being updated as I type this.

YL
d_cee
Regular
Posts: 603
Joined: Wed Jan 18, 2006 6:32 pm
Location: UK
Contact:

Post by d_cee »

Hi Guys

I'll get those changes incorporated this evening along with a few final changes to all of the coloursets. I'll put the final coloursets on s9y-bulletproof when I've done. I've also started work on a 'colourset' for the website too (and a logo!). I'll maybe put that up later too if it progresses enough this evening. I'll also sort out FTP access for the site for you both.

cheers

Dave
d_cee
Regular
Posts: 603
Joined: Wed Jan 18, 2006 6:32 pm
Location: UK
Contact:

Post by d_cee »

Hi Guys

I'll get those changes incorporated this evening along with a few final changes to all of the coloursets. I'll put the final coloursets on s9y-bulletproof when I've done. I've also started work on a 'colourset' for the website too (and a logo!). I'll maybe put that up later too if it progresses enough this evening. I'll also sort out FTP access for the site for you both.

cheers

Dave
Don Chambers
Regular
Posts: 3652
Joined: Mon Feb 13, 2006 2:40 am
Location: Chicago, IL, USA
Contact:

Post by Don Chambers »

YL - it is more than just the colorset. With !important in the ie6.css, that negative margin setting is overriding the colorset margins. Obviously, a colorset can override by also using !important since that style sheet is loaded last, but if it serves no purpose, why have it at all? It might have temporarily solved something in the past, but I cannot say what for sure.

Also, the separation of sidebar title from sidebar content exists even in the default, blank scheme, so I suggest the negative margin issue be removed from ie6.css, possibly the padding too, and the margin: 0 be added where noted in style.css. Is not going to hurt any of the colorsets Dave is working on, and does, in fact, fix the default blank one.

And isn't the violet one yours (not the violet on Dave's BP site)?

And Dave - nice work so far on the new site. I'll look for your changes later, but at least I am slowly crawling back into the game!
=Don=
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

d_cee wrote:I'll put the final coloursets on s9y-bulletproof when I've done.
So I guess I can just get the colorset css files from the s9y-bulletproof templates dir via ftp, right?

YL
d_cee
Regular
Posts: 603
Joined: Wed Jan 18, 2006 6:32 pm
Location: UK
Contact:

Post by d_cee »

Hi YL

That's right, the latest versions are on there and they're the versions I'll be updating later. I'll let you know when I've changed them and which files I've altered.

cheers

Dave
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

Don Chambers wrote:It might have temporarily solved something in the past, but I cannot say what for sure.

Also, the separation of sidebar title from sidebar content exists even in the default, blank scheme, so I suggest the negative margin issue be removed from ie6.css, possibly the padding too, and the margin: 0 be added where noted in style.css. Is not going to hurt any of the colorsets Dave is working on, and does, in fact, fix the default blank one.
I can't remember this, either. Hrmpf. Okay, so I removed the sidebar fix from ie6.css and added your suggestions to style.css. Uploads are on the way, so we should probably check those out in the various browsers we have access to.

Edit: Or we can of course wait for the final colorsets. Doh. Makes much more sense, so I'll check for those later tonight and upload another update. Lots of uploading today :)
Don Chambers wrote:And isn't the violet one yours (not the violet on Dave's BP site)?
Nope, the colorset purple is Dave's - like all the bp colorsets. In fact I think (but I'm not 100% sure since I haven't gotten any colorset updates from Mr. Cummins over there for quite some time :wink:) that s9y-bulletproof.com is using the purple one right now. Dave?

YL
d_cee
Regular
Posts: 603
Joined: Wed Jan 18, 2006 6:32 pm
Location: UK
Contact:

Post by d_cee »

Hi
Nope, the colorset purple is Dave's - like all the bp colorsets. In fact I think (but I'm not 100% sure since I haven't gotten any colorset updates from Mr. Cummins over there for quite some time :wink: ) that s9y-bulletproof.com is using the purple one right now. Dave
Quite right, it is and it's my latst version. I'll only be changing the various colourset style.css files later so if you're changing any of the other css files you could do that on s9y-bulletproof.com too.

Dave
Don Chambers
Regular
Posts: 3652
Joined: Mon Feb 13, 2006 2:40 am
Location: Chicago, IL, USA
Contact:

Post by Don Chambers »

Probably do want to wait on the colorset changes from Dave. The blue and green colorsets (didn't check violett) last included in your zipfile use a negative top margin of -13px. This was overridden in ie6.css by -17px !important, but without that, the colorset.css negative margin will kick in and likely needs to be set back to zero.

I did just notice something rather annoying. Cannot seem to set the sidebars ALONE to a fixed width. Blows #content out. #content seems to need a fixed width, and the 3 must add up to #wrapper. I just barely attempted this as a test, so I'm not 100% sure, but the concept I just added for a sidebarfooter will, if graphical, require a fixed width, so I thought I would try it. Things could also get messy with all the different sidebar options. Oh well, cross that bridge when necessary.
=Don=
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Post by yellowled »

Don Chambers wrote:Cannot seem to set the sidebars ALONE to a fixed width. Blows #content out. #content seems to need a fixed width, and the 3 must add up to #wrapper. I just barely attempted this as a test, so I'm not 100% sure, but the concept I just added for a sidebarfooter will, if graphical, require a fixed width, so I thought I would try it.
Okay, first of all: Let's wait for Dave's final colorsets before we change anything else. I'll upload a "freeze" zipfile after getting the final colorset stylesheets, and that should be checked for bugs and flaws in various browsers. Any different approach would just produce more confusion :?

About that fixed width: Yes, you'll probably have to set fixed widths like you described in that case. My experience (and I think Dave - being a more graphics oriented template designer than me - will confirm it) is that it's easier to do graphical templates with fixed widths (or even heights) anyway, so that's not really a problem, is it?

YL
Don Chambers
Regular
Posts: 3652
Joined: Mon Feb 13, 2006 2:40 am
Location: Chicago, IL, USA
Contact:

Post by Don Chambers »

yellowled wrote:About that fixed width: Yes, you'll probably have to set fixed widths like you described in that case. My experience (and I think Dave - being a more graphics oriented template designer than me - will confirm it) is that it's easier to do graphical templates with fixed widths (or even heights) anyway, so that's not really a problem, is it?

YL
Not so much of a "problem"... what I thought would happen is that #content would simply take up whatever remained after sidebar widths were set. That does not appear to be the case - #content must also be defined, as must #wrapper (I think). Anyway, it was just a casual observation right now. Will not really know the full impact until I, or someone else, actually attempts a graphical template.

I'm fine going into a holding pattern right now. I do, however, suggest that BP zipfile updates continue to be downloadable from YL's sandbox, and Dave be the sole point of updating the s9y-bp site with the latest release. Not sure if some of that other FTP discussion was trying to imply otherwise. Must be evening on your side of the pond!! Lots of discussion all of a sudden!!! :)
=Don=
Post Reply