Skip to main content
Topic: [Theme] Storm Cloud (Read 17061 times) previous topic - next topic
0 Members and 2 Guests are viewing this topic.

[Theme] Storm Cloud

Been a bit since I put a theme together, so here is a new one.   Called it storm cloud as the greyish / blueish colors are reminiscent of that. 

It has a custom board index where I moved the info center to the right as a sidebar.  It will float below on narrow screens.  The message index has the likes, pm, posts count buttons exposed as well.   For an experiment, most of the uses of avatars have been done in a port-hole look, so they are all round using a cover property to scale them.  Has the horizontal menu and top login panel, etc.

Few other things here and there, I'm sure there are bugs, but I was in theme mood for a short bit.

https://themes.elkarte.net/creative/StormCloud.html
Last Edit: August 23, 2019, 10:21:49 am by Spuds


Re: [Theme] Storm Cloud

Reply #2

Neat!
Awesome indeed!

 emanuele goes copy the IC code. O:-)
Bugs creator.
Features destroyer.
Template killer.

Re: [Theme] Storm Cloud

Reply #3

Yes. That new IC look is really neat.

Re: [Theme] Storm Cloud

Reply #4

Thanks for sharing, nice work
sorry for my bad english

Re: [Theme] Storm Cloud

Reply #5

Great theme :) With info center inside sidebar it reminds me of IPB/XF style.

Re: [Theme] Storm Cloud

Reply #6

I found some. :D

Still playing with it. Will get back to you later.
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P

 

Re: [Theme] Storm Cloud

Reply #7

Ok, first bug is that the way the CSS is done borks code indentation in BBC code tags.

Code: [Select]
/* Panel Tab/button */
.tab {
background: #222;
border-radius: 0;
padding: 0 10px;
position: absolute;
right: 120px;
text-align: center;
z-index: 1;
white-space: nowrap;
}

The problem is that span.tab is used to do code indentation, so setting .tab to absolute throws those out of the code box and the indentation vanishes. The way to fix it is to do this:

Code: [Select]
/* Fix span.tab inside BBC code tags. */
.bbc_code > .tab {
position: static;
opacity: 0;
}

That fixes the indentation without frigging around with .tab anywhere else. :)

Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P

Re: [Theme] Storm Cloud

Reply #8

 8)  Thanks for finding that, and for the fix.

Re: [Theme] Storm Cloud

Reply #9

Hey how nuts do you want me to go on this? I have an irrational urge to clean up some markup n stuff too. You know what I'm like when I get going. :D

Incidentally, I'm wondering about the use of .tab in different places. Seems like it would be better if one of the class names was changed to prevent conflicts in future. I'm still getting back up to speed with the Elk codebase, so don't know if changing one of the class names would be practical at this stage (like are they baked into SCEditor and jQueryUI, or whatever?).
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P

Re: [Theme] Storm Cloud

Reply #10

Go as nuts as you want :D

I think there are some "fixes" that are in the lazy days theme that I should port back to this, but its mostly items around the message index avatar display and profile options not working right with them (all those darn conditionals).   Also I don't remember if the personal message template was included in this one, but it needs to be since of what I did to the avatar area on the message index needs to be in PM's as well.

Yeah .tab was probably not a great name, to generic.  I don't think there will be conflicts with UI or SCE, at least with the class names.  SCE (wizzy mode) runs in an iframe so has its "own" CSS and is pretty safe.  UI also has its own CSS files that are quite frankly maddening to me, it injects so much that I found it difficult to style.  You can see some of those problems in the profile tabs area.

Re: [Theme] Storm Cloud

Reply #11

Yeah I noticed the icons that are suppose to be under the avatar are borked in PM's. If that's what you're referring to. That should be handled by GenericMessages though, unless I'm missing something. It's just poster div stuff, right?

QuoteUI also has its own CSS files that are quite frankly maddening to me, it injects so much that I found it difficult to style.
Frameworks 101: How to make stuff really infuriating by trying to make it easy.
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P

Re: [Theme] Storm Cloud

Reply #12

Yup, thats the one ! ... I added a wrapper div to that poster area and forgot to include it for the PM area.

QuoteFrameworks 101: How to make stuff really infuriating by trying to make it easy.
QFT

Re: [Theme] Storm Cloud

Reply #13

This is as far as I've got at the moment. Can be extracted straight to the forum root on a test site. It makes some minor changes to index.template.php and adds a custom_grey.css file.
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P

Re: [Theme] Storm Cloud

Reply #14

Hey Spuds, why is there inline CSS and a pile of spans being injected into the avatar anchor? Where is that horrible pile of poo coming from?
Master of Expletives: Now with improved family f@&king friendliness! :D

Sources code: making easy front end changes difficult since 1873. :P