ElkArte Community

General => Site Feedback => Topic started by: Bloc on June 17, 2013, 11:32:15 am

Title: New theme(?) with green headers..
Post by: Bloc on June 17, 2013, 11:32:15 am
Me like. :)

The green menubar looks nice, although the highlighted buttons seems a bit fuzzy on the edges. But the windowbg's and catbg's - very nice. The titlebg on info-center (among others) - not so much, it sticks out now so I would suggest changing it. And great that all the(or most of them) dropshadows were..dropped. Too much of anything isn't good for you, so they say.

The dark-grey background: also great, this theme really has some balls now. :D

Title: Re: New theme(?) with green headers..
Post by: TE on June 17, 2013, 02:51:18 pm
There's a "like" button now :P (currently hidden unter the "More...." near "Quick Edit")
Title: Re: New theme(?) with green headers..
Post by: Bloc on June 17, 2013, 04:01:55 pm
Ah, I see it. :)
Title: Re: New theme(?) with green headers..
Post by: emanuele on June 17, 2013, 06:29:51 pm
/me can't see the like button! :'(
Title: Re: New theme(?) with green headers..
Post by: Spuds on June 17, 2013, 07:03:27 pm
Looks like it was not enabled for the GM group ... I enabled that just for you  :D
Title: Re: New theme(?) with green headers..
Post by: emanuele on June 17, 2013, 07:04:28 pm
/me can likez!

Well, another button I'm not going to use... :P
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 17, 2013, 07:16:22 pm
/me cannot see teh likez button. :P

/me not that keen on likez as a feature, but is happy to test it when someone complements the new theme I made. :D

/me massive ego FTW. :P
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 17, 2013, 07:19:47 pm
Quote from: Bloc – Me like. :)

The green menubar looks nice, although the highlighted buttons seems a bit fuzzy on the edges.
I agree. Was thinking of tweaking it. That (and other gradient highlights) are going to be changed for W3 syntax CSS3 gradients anyway.

QuoteThe titlebg on info-center (among others) - not so much, it sticks out now so I would suggest changing it.
Yeah wasn't entirely happy with those, but just went with something dead basic for the moment until a better idea occurred.

I'll be throwing out a lot of remnant 2.1 alpha styling, but will probably leave most of the styling hooks in the markup, just in case anyone wants them (and because leaving them is the lazy option).

ETA: Oh and I'll be going full-on OOCSS on the menus soon anyway, so that will involve a total re-write of them. Will look at tweaking colours and borders after that. I think the drop menu system is one place where going mental on classes is worth the extra HTML. It will make styling menus a lot easier for beginners.
Title: Re: New theme(?) with green headers..
Post by: Spuds on June 17, 2013, 07:25:32 pm
Quote from: Antechinus – /me cannot see teh likez button. :P

/me not that keen on likez as a feature, but is happy to test it when someone complements the new theme I made. :D

/me massive ego FTW. :P
Should be fixed now as well
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 17, 2013, 07:30:32 pm
Yup. It works.

ETA: Ok, I'm gonna change those quickbuttons to use pseudos for the icons. They start looking like crap pretty fast with non-standard font sizes. @todo.
Title: Re: New theme(?) with green headers..
Post by: emanuele on June 17, 2013, 07:38:13 pm
Well, likes are funny, can't deny that, I'm just not used to them.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 17, 2013, 08:01:50 pm
Y'know it's currently a bit weird with the buttons, in that to like a post you have to open the "More..." droppy, but once a post has been liked there's a like button which doesn't do anything. I think this should be changed. A separate button may be the way to do it, given that likes do seem to be rather popular these days.

I was thinking about the "Quote to new topic" thing as well. Having that as a droppy under "Quote" is currently buggy with click menus enabled, since you have to click to open the droppy, and clicking quotes the post to quick reply. :D

We'll have to do a bit more thinking about the quickbuttons strip.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 17, 2013, 08:30:05 pm
May also tweak things a bit with regard to the heavier font-weights in some areas. I'm running W7 and use Firefox by preference. With that combo, font-weight: 600; adds emphasis, while still being a lot more elegant than plain bold (700). However, I've noticed that browsers other than FF seem to default to bold for those declarations. I may lighten the colour fractionally for those browsers, but it's not a priority at the moment.

Also, Opera seems to slightly bork vertical paddings/cell heights on the board index. Other browsers are all consistent.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 03:25:24 am
Hey how about something like this for the on/off icons?
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 03:27:03 am
Quote from: Bloc – The titlebg on info-center (among others) - not so much, it sticks out now so I would suggest changing it.
Btw, tweaked those on local. Dropped the font-size back to 1.1em and it's more balanced now.
Title: Re: New theme(?) with green headers..
Post by: TE on June 18, 2013, 03:50:13 am
Quote from: Antechinus – Hey how about something like this for the on/off icons?
yep, much better :)
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 04:01:38 am
I can add a fat moose to the folder. :D
Title: Re: New theme(?) with green headers..
Post by: Bloc on June 18, 2013, 05:54:14 am
On/off icons looking better. :)

Is the titlebg style updated here?
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 06:01:21 am
No it isn't. Only on local. I'll put some code in so they can play with it on GitHub.

Oh and I nicked those icons from somewhere else and then modified them to suit. License is non-commercial, so should be alright for the moment. I'll contact the maker though and see if he's cool with them being used for the release stuff. Icons are a pain to make, but I could do something like these if I had to.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 06:07:35 am
Oh and I've converted my local copy over to CSS3 gradients and ditched the images. I'm totally converted now. So easy to tweak stuff if you think it's not quite the right shade. Firefox supports diagonal/angled gradients on W3 syntax too. :D
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 06:18:01 am
Here's what the info centre looks like now.
Title: Re: New theme(?) with green headers..
Post by: TestMonkey on June 18, 2013, 07:36:31 am
QuoteOh and I nicked those icons from somewhere else and then modified them to suit. License is non-commercial, so should be alright for the moment. I'll contact the maker though and see if he's cool with them being used for the release stuff. Icons are a pain to make, but I could do something like these if I had to.
If I understand correctly, "non-commercial" means proprietary non-commercial. That is not acceptable. We don't need any custom waivers. The maker can license it open source. If they don't (which is their right), we don't use it, and we will choose other options.
Title: Re: New theme(?) with green headers..
Post by: emanuele on June 18, 2013, 08:05:42 am
What about green Tango:
http://commons.wikimedia.org/wiki/File:Folder-new.svg
http://commons.wikimedia.org/wiki/File:Document-open.svg
http://commons.wikimedia.org/wiki/File:Folder-open.svg

There are the svg available in PD, we can adjust them the way we want.

For reference: http://commons.wikimedia.org/wiki/Tango_icons

ETA: suggested because while searching for something similar to a folder those have been the first popping up.
Title: Re: New theme(?) with green headers..
Post by: Spuds on June 18, 2013, 09:31:01 am
Or perhaps we can find something from the icon libs we are already using ....

Title: Re: New theme(?) with green headers..
Post by: emanuele on June 18, 2013, 09:51:04 am
Which one is it that one? ???
Title: Re: New theme(?) with green headers..
Post by: Spuds on June 18, 2013, 01:25:30 pm
Those are Oxygen /  KDE ... I think the latest are Here (http://www.linuxfromscratch.org/blfs/view/svn/kde/oxygen-icons.html)

They are SVG as well, although the package has many / most in PNG in various sizes for easy use
Title: Re: New theme(?) with green headers..
Post by: emanuele on June 18, 2013, 02:56:58 pm
I downloaded what I thought it was the whole pack and I didn't find anything...that's why I started looking somewhere else... lol
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 05:04:20 pm
Quote from: Spuds – Or perhaps we can find something from the icon libs we are already using ....


Yeah could play with those. Didn't spot those before. Would want them in either .psd for Photoshop or layered .png for Fireworks. Plain .png or some weird Linux shiz aint no fun at all. :P

Title: Re: New theme(?) with green headers..
Post by: emanuele on June 18, 2013, 05:17:08 pm
Oh come on adobe is still supporting only his formats and nothing else? lol
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 05:20:15 pm
Point is it's common, not some weird format some nutter randomly pulled out of his backside just to confuse things. :P

GIMP will do layered .png too. That Oxygen stuff is compressed in some weird format I've never even heard of before. WTF opens it?
Title: Re: New theme(?) with green headers..
Post by: Spuds on June 18, 2013, 05:24:26 pm
You talking about the .xz extension on the archive ?
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 05:28:55 pm
Yup. :D
Title: Re: New theme(?) with green headers..
Post by: Spuds on June 18, 2013, 05:59:50 pm
7-ZIP (http://www.7-zip.org/) will decompress that and extract the tar ....  then you can use the svg's to create what format you want.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 18, 2013, 06:09:45 pm
Kthnx. WinRAR will do ordinary tar.gz and .bz2, but has never heard of .xz.

I grabbed Inkscape for the .svg's. Not that I really want to learn another gfx app right at the moment, so if someone else gets inspired to do some cool icons.................
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 19, 2013, 06:56:36 pm
Hey found a few hot contenders. One good one has a free WTF license. Another is LGPL. Another has no license at all, but I could email the author. Another is free for personal use, but asks for linkback. May be amenable to doing a deal.

So looks like no probs. One of those will work.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 19, 2013, 07:21:41 pm
Ok, got them. Now I just need to talk the author into ok'ing it.

http://www.softicons.com/free-icons/folder-icons/triganno-folders-icons-by-tongsky/folder-green-2-icon

Quote from: Readme fileThank you for downloading my icons. It's free and you may use it any way.

However, free downloads makes us all happy.
But please respect my creations and to others as well.

"Please do not claim it as your own".

I would appreciate if you consider to link me back for whatever purpose you intend to.

   Thank you so much!
       ~Tongsky
Sounds like he should be amenable to us using them if he gets some credit. Will email him and find out for sure. These are perfect. Just needed a tiny bit of Photoshoppery.

ETA: By the way, it's worth checking out this guy's gallery on DeviantArt. His icon work is insanely good.

http://tongsky.deviantart.com/gallery/
Title: Re: New theme(?) with green headers..
Post by: IchBin on June 19, 2013, 09:14:44 pm
I do like those. Some great icons for sure! A note in the credits should be fine I think.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 19, 2013, 09:28:01 pm
Much as I like the green moose, I do have to admit that these are a little more professional in appearance.
Title: Re: New theme(?) with green headers..
Post by: TestMonkey on June 20, 2013, 06:13:20 am
WTF (I suppose that's WTFPL) and LGPL are fine (strictly speaking WTFPL is not OSI-approved, but yeah, OSI-approved is not a 100% criterion).
"Free to use, but commercial use not allowed" is not fine. (http://www.softicons.com/free-icons/folder-icons/triganno-folders-icons-by-tongsky/folder-green-2-icon)
It does not match the "you may use in any way [...] as long as you respect the work and credit it appropriately.". The two are not the same: the first is proprietary-for-no-charge, the second is likely free and open source, along the lines of CC-BY.

Stray off-hand example #1: "commercial use" is to mold Elk into an online downloads for pay site, and use the icons to decorate your 'special promotion board'.
Stray off-hand example #2: "commercial use" is to make a forums hosted site, for paid memberships.
Stray off-hand example #3: "commercial use" is to make a commercial proprietary package, forked of Elk.
They're all allowed by free and open source software/design (well the proprietary bit of the latest, only by BSD/CC-BY, not by MPL/LGPL/CC-BY-SA, but that's about proprietary, not about 'commercial use').
Commercial endeavours are an endeavour like any other, free and open source software doesn't discriminate against them.

But I sort of agree that by the sound of it, the author is thinking at commercial proprietary software of some company, that include the icons and claim the whole as their own, such as compiled desktop applications.
Anyway, what we need, is for them to explicitly license it as one of the open licenses. If what they mean is this: http://files.softicons.com/download/folder-icons/triganno-folders-icons-by-tongsky/Notice.txt, then we can ask them to license CC-BY.
If they want any modifications to the icons to be licensed under the same conditions, then CC-BY-SA.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 20, 2013, 02:58:50 pm
I've messaged the guy over on DeviantArt. Waiting for him to respond. :)
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 21, 2013, 03:48:29 am
Ok, latest codedump from the Antipodes. Big pile of marsupial poo heading your way. :D

This one should fix
#517 (https://github.com/elkarte/Elkarte/issues/517), definitely fixes #565 (https://github.com/elkarte/Elkarte/issues/565), and catches the last stragglers of the quickbuttons elements' new classes that I missed earlier.

Also has lotsa other goodies, including the start of the CSS split that was
posted about here (http://www.elkarte.net/index.php?topic=439.msg3175#msg3175).

There are a couple of readmes (very short ones) tucked in the zip.

This has been checked on today's build from GitHub, so git it in there. Kthnx.

Then I can start on the next lot. :)

ETA: Oh there are some new redirect icons in the images folders. No problem with licensing those, as I made them from scratch yesterday. They'll do for now. :)
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 22, 2013, 06:11:12 am
Ok, this is a small and totally non-scary fix for Issue #573 (https://github.com/elkarte/Elkarte/issues/573).

			minHeight = options.resizeMinHeight || origHeight / 1;
maxHeight = options.resizeMaxHeight || origHeight * 20;
minWidth  = options.resizeMinWidth  || origWidth  / 1;
maxWidth  = options.resizeMaxWidth  || origWidth  * 1;

That gives plenty of maxHeight, stops the editor collapsing at all (because nobody will want it to) and also stops it expanding past the forum wrapper.

Also, did the resize handle to 25px, which is a nice and brainless size to grab without looking over the top stupid.

Code: [Select]
div.sceditor-grip {
overflow: hidden;
height: 25px;

There ya go. Easy. :)
Title: Re: New theme(?) with green headers..
Post by: Spuds on June 22, 2013, 07:54:06 am
Editing the editor script is IMO a mistake, it makes upgrading to newer revisions cumbersome.  If the editor is not right then a request should be made against that project for a change or new option if whatever you are doing can not be accomplished with a plugin.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 22, 2013, 08:16:24 am
Well how can you customise it then? There's already custom code for Elk tied in with the editor, and there's no point making a request to Sam Clark for stuff that is specific to another project. Also, the options that are edited are minor and are highly unlikely to inhbit upgrades.

Also, is anyone going to downlaod the pile of code I did? It's been sitting there for over 48 hours without being touched, but the tiny zip for the editor has already been downloaded.
Title: Re: New theme(?) with green headers..
Post by: emanuele on June 22, 2013, 08:26:54 am
options.resizeMaxHeight and the others are already ways to customize the max height and width of the editor (AFAIR).
Title: Re: New theme(?) with green headers..
Post by: Spuds on June 22, 2013, 08:41:06 am
Quote from: Antechinus – Well how can you customise it then? There's already custom code for Elk tied in with the editor, and there's no point making a request to Sam Clark for stuff that is specific to another project. Also, the options that are edited are minor and are highly unlikely to inhbit upgrades.

Also, is anyone going to downlaod the pile of code I did? It's been sitting there for over 48 hours without being touched, but the tiny zip for the editor has already been downloaded.
I see that its minor, but its still a difference, so unless someone wants to create a elk fork of the editor and maintain it and make PR's back to Elk when it changes, etc and bla bla bla personally I'd like the editor, in total, to be maintained by the Sam so upgrading is a simple file replace.  (that resize code actually changed a lot from various versions due to complications with various browsers supported)

I just downloaded the code, don't get yer knickers in a knot :P

ETA: https://github.com/elkarte/Elkarte/pull/574  But I probably missed some of the image updates
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 22, 2013, 05:16:42 pm
Quote from: emanuele – options.resizeMaxHeight and the others are already ways to customize the max height and width of the editor (AFAIR).
Ok, where are the settings for them? In the file I edited, or hiding somewhere else? If there's a better way of setting them I'm happy to use it, but I think the default behaviour doesn't really make sense.

I often want a textarea larger, often a lot larger, but I've never wanted one to collapse below its default size. It's sort of messy at the moment, and IMO would be better if the textarea was constrained so it couldn't go below its default height or width, or above its default width. It would feel more stable when dragging it to expand it.

I have sometimes wanted a textarea to expand past default width, but that only applies to tiny ones. Our editor is already sufficiently wide.

The default max-height limit makes no sense at all. That's just a PITA.


Quote from: Spuds – I just downloaded the code, don't get yer knickers in a knot :P
Yeah but I had to kick you first. :P

(http://galleryqui.files.wordpress.com/2011/01/12-arewethereyetlogo.jpg)
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 22, 2013, 10:06:18 pm
Ok cool. I found out how to do it properly. :P

Code: [Select]
		 * Max resize to height, set to null for double textarea height or -1 for unlimited
* @type {int}
*/
resizeMaxHeight: null,
/**
* Max resize to width, set to null for double textarea width or -1 for unlimited
* @type {int}
*/
resizeMaxWidth: null,
/**
* If resizing by height is enabled
* @type {Boolean}
*/
resizeHeight: true,
/**
* If resizing by width is enabled
* @type {Boolean}
*/
resizeWidth: true,

Change to:
Code: [Select]
		 * Max resize to height, set to null for double textarea height or -1 for unlimited
* @type {int}
*/
resizeMaxHeight: -1,
/**
* Max resize to width, set to null for double textarea width or -1 for unlimited
* @type {int}
*/
resizeMaxWidth: null,
/**
* If resizing by height is enabled
* @type {Boolean}
*/
resizeHeight: true,
/**
* If resizing by width is enabled
* @type {Boolean}
*/
resizeWidth: false,

That doesn't set a fixed min-height equal to default height, but does stabilise the width and allow unlimited max-height.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 23, 2013, 06:40:20 pm
Hey would that be acceptable, since it's in the options section of the file, or do you want it set somewhere else? If the options can be set where the editor is intiialised or somewhere else, I don't mind doing that before resubmitting the code. Just need to be pointed at the right bit of the right file.
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 25, 2013, 07:25:17 pm
Ok you Webkit and Presto peeps, your silly browsers wont handle numerical font-weight. They only know normal or bold. Firefox, and even IE, will do a font-weight of 600, which in many places is much better than either bold or normal.

Since I don't have to look at what Webkit and Presto do, I don't much mind which they get. If the consensus is that the bold is too heavy, I can serve them normal weight. We haz body id by browser (someone clever though of that).
Title: Re: New theme(?) with green headers..
Post by: Bloc on June 25, 2013, 08:11:24 pm
I've found a mix of color and bold/normal goes a long way in separating items and/or lowering their visibility. Different bold values seems a bit too unreliable, both on the account of the failing support in browsers(webkit as it seems) and the slight differences there will be in different systems regarding the chosen font-type. Plus the different resolutions yield different results in the anti-aliasing and rendering of said fonts. There is a noticeable difference in quality between 1080p and something like 1024px screens.

In short, it can never be 100% the same all over - thus very small differences in appearance, like bold/slightly less bold, will be less effective than other things IMHO. I've opted to NOT do browser-specific styles/adjustments even, only adding vendor-specific on certain css3 styles just to trigger the styles. That means less amount of styles to work with(less alternatives to figure out) but also a requirement that the ones I do use, must work acceptable all over, if not exactly 100% copies of each other.

But, of course, a broader palette is always nicer to work with. :)
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 25, 2013, 08:21:41 pm
600 is pretty safe, because it just defaults to bold anyway. It doesn't seem to do anything weirder than that, and it does look much better in Firefox and IE, which are a significant chunk of the target market.

Then again, I suppose I should fire up Browsershots again and check everything they've got. There might be an odd surprise lurking in some dark corner.

PS: Firefox and IE will also do a pretty good 100 weight, although it's of limited practical use (large text only, really).
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 25, 2013, 08:34:07 pm
Seems to be pretty good in just about any combo. http://browsershots.org/requests/9060392

Title: Re: New theme(?) with green headers..
Post by: emanuele on June 26, 2013, 02:58:33 am
Quote from: Antechinus – Ok you Webkit and Presto peeps, your silly browsers wont handle numerical font-weight.
Don't know if you know, but Presto is going to die with the next release of Opera that will use Webkit. ;)
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 26, 2013, 03:13:12 am
Well that will leave Webkit being the problem, but just on more browsers.
Title: Re: New theme(?) with green headers..
Post by: emanuele on June 26, 2013, 05:41:31 pm
If you have a moment in one of the next updates, consider changing the color of the numbers in the menu (for example the number of PMs), the current black is really difficult to read with the dark-green background. ;)
Title: Re: New theme(?) with green headers..
Post by: Antechinus on June 26, 2013, 06:45:12 pm
Yeah saw that yesterday. I was thinking a small pop-up link might be good. With the click menus you can see you've got a message, but you have to open a droppy before you can go to inbox.

So if I hack teh sauces a bit and make a little anchor that pop-ups and goes straight to inbox on click, that might be handy.