Undesired/cluttered calendar display

[SMiFFER]

Good day fellows,
here a question about SMF's built-in calendar:

Is there any way to have it display more "uncluttered" - what I mean is that this looks really broken:


Right beneath each other would look less broken. How can I get that done?

[Antechinus]

Yes, you can do all sorts of things with it. Is that in a portal side block? It seems to be extremely narrow.

[Illori]

looks to me to be on the calendar itself, for one day in that case the 10th.

[Antechinus]

Ok, well just off the top of my head, this should be close to what's wanted:

Code Select Expand

.calendar_table .days a:nth-of-type(2n+1) {
    float: left;
}
.calendar_table .days a:nth-of-type(2n) {
    display:block;
}

Which hasn't been tested but should work. Might need a clear in there somewhere too. Play around with it.

[SMiFFER]

Yes, you can do all sorts of things with it. Is that in a portal side block? It seems to be extremely narrow.

I do not know how to answer this - maybe I do not quite understand what you want to know.
The screenshots comes from my calendar-screen.

And where shall I put your code now?

[Xarkurai]

Put it in your css file, found in your theme's folder. There should be a subfolder named "css". The file you are looking for is named index.css.
Just scroll to the bottom in the file and paste it at the end.

[SMiFFER]

Ah thanks.

Well I did, but now it looks like this (still broken):

[Antechinus]

K, took a look at it. It's going to need a minor markup tweak in Calendar.template.php...

Code (Find) Select Expand

echo '
', $event['link'], $event['is_last'] ? '' : ', ';

Code (Replace) Select Expand

echo '
', $event['link'];

For the css, use this:

Code Select Expand

.calendar_table .days .event {
    display:block;
}
.calendar_table .days .smalltext {
    text-align: left;
padding: 4px;
}
.calendar_table .days a:nth-of-type(2n+1) {
    float: left;
padding: 2px;
}
.calendar_table .days a:nth-of-type(2n) {
    display:block;
padding: 2px;
}

Now obviously this is only one way of doing it. If you were happy to re-write the markup you might be able to end up with something better, but this does the basics with minimal template changes.

[SMiFFER]

It would be much quicker if you just posted a screenshot of how the result looks.

[Kindred]

Why would that be quicker?   You still have to do the code and possibly tweak it for your own implementation...

[Antechinus]

It would be much quicker if you just posted a screenshot of how the result looks.

You want me to write code for you, and test it for you, but can't be bothered trying it when I provide it?

You'll do well here.

[SMiFFER]

Well you cannot deny that the only one who posts screenshots is me so far...
(only to see again and again that the result does not do what is asked)

[Xarkurai]

You don't get the point here.
People try to help you with coding and that should be sufficient.
Those helping people should not be testing it all by themselves all the time, that would take waaaay too much time to help other people as well.

So all you need to do to get help in exchange is to post an update about what is going wrong.
Linking the part of your website where it goes wrong would also help a lot.

Also, provide enough information such as your SMF version, theme being used, is it a tinyportal block, ...?

Cheers.

[SMiFFER]

Thanks Xaruari, I did - but...

It would be much quicker if you just posted a screenshot of how the result looks.

You want me to write code for you, and test it for you, but can't be bothered trying it when I provide it?

You'll do well here.

@Antech
Nobody said that!
I said it would be quicker!

Is it common sense to come off so arrogant and sarcastic on this forum only because I politely ask for a screenshot?

1) Your instructions are sometimes difficult to follow for someone who is not so much into it like you.
Example: "For the css" - yes, but which exact file do you refer to there? Path? Filename?
-> So obviously trying out and applying this takes me significantly longer than you just posting a result-shot.

2) Last time I went thru this only to see that the result did not remotely do what I asked.
Undo again, find files again....post again... only because no result can be seen PRIOR to trying what did not work.

[Kindred]

Is it common sense to come off so arrogant and sarcastic on this forum only because I politely ask for a screenshot?

His comment was not arrogant, at all...

1) Your instructions are sometimes difficult to follow for someone who is not so much into it like you.
Example: "For the css" - yes, but which exact file do you refer to there? Path? Filename?
-> So obviously trying out and applying this takes me significantly longer than you just posting a result-shot.

Well, you need to learn some basic web coding...   and web coding tools, like firefox+bug or webdev or Chrome with webdev
any of those will tell you the CSS entry and file used to make a specific section appear as it does...
AND allow you to make inline edits and see the result.

2) Last time I went thru this only to see that the result did not remotely do what I asked.
Undo again, find files again....post again... only because no result can be seen PRIOR to trying what did not work.

Welcome to the world of web development. This is why you build a testbed site

[Xarkurai]

Thanks Xaruari, I did - but...

It would be much quicker if you just posted a screenshot of how the result looks.

You want me to write code for you, and test it for you, but can't be bothered trying it when I provide it?

You'll do well here.

@Antech
Nobody said that!
I said it would be quicker!

Is it common sense to come off so arrogant and sarcastic on this forum only because I politely ask for a screenshot?

1) Your instructions are sometimes difficult to follow for someone who is not so much into it like you.
Example: "For the css" - yes, but which exact file do you refer to there? Path? Filename?
-> So obviously trying out and applying this takes me significantly longer than you just posting a result-shot.

2) Last time I went thru this only to see that the result did not remotely do what I asked.
Undo again, find files again....post again... only because no result can be seen PRIOR to trying what did not work.

Manual editing is something you can learn, SMF provides a lot of information about it too. It'll always go with trial and error.
Beside that, I gave you some directions about where to find the file.
Anyway, any chance that you can link the website part that has the problem? That'll make it much faster to edit.

[Antechinus]

Well you cannot deny that the only one who posts screenshots is me so far...
(only to see again and again that the result does not do what is asked)

There hasn't been any "again and again". You have tried one option so far. One. Not a multitude.

"What is asked" is very vague. You first said you just wanted it "unclutterred", then added "Right beneath each other would look less broken. How can I get that done?"

Ok, so I gave a quick general example and said play around with it. At this stage I wasn't aware that your knowledge of coding was negligible, because you hadn't mentioned that factor.

So then you asked where to put the code, which made it clear we were dealing with a beginner. Ok, no problem. Everyone has to start somewhere.

So I fired up my local test site and went through the coding to get something clean that you could just paste into your files. I thought that was enough work on my part for the moment. I didn't see it was necessary to me to take a screenshot, process it through Photoshop, then upload it to SMF. I figured it would be quicker, for me, the bloke doing the work, if I skipped that rigmarole and just gave you the code (which is the bit you need).

The way to know if it was something you would be happy with is for you to test it live. I don't know what browsers or devices you are using. I don't know your personal preferences. I don't know if you have a particular idea in mind. All I know is you wanted it "right beneath each other".

"For the CSS" means out that code exactly where you put the first lot of CSS: at the end of your index.css file. Since you had already asked about that and been given the answer, I thought it was clear enough.

If you want help editing your files, you only have to ask and someone will help you (as long as you haven't cheesed them off too much).

2) Last time I went thru this only to see that the result did not remotely do what I asked.
Undo again, find files again....post again... only because no result can be seen PRIOR to trying what did not work.

Yes, and that applies to anyone trying to find a solution you like. They have to try stuff live to check that it works. They aren't going to just magically pull a bunny out of a hat with no effort on their part.

Which is why they might be a tad bemused if you can't be bothered trying it yourself.