cotonti.com : Cotonti UI elements https://www.cotonti.com Neueste Themenbeiträge Cotonti en Fri, 08 May 2026 03:13:47 -0000 urlkiller sorry i didnt wanted to only nag. i like these set very much. its a good piece of work...
good job!

]]> Di, 07 Feb 2012 16:34:23 -0000 GHengeveld Ok, all icons use data-uris now. No more sprites.

]]> Di, 07 Feb 2012 08:11:51 -0000 urlkiller as for the icons i just had that link. the same icons are existing as regular images that you could use.


i've had a quite extensive research on the base64 stuff for a couple of weeks for a client.
from my point i can confirm that base64 encoded data uri's are fully supported starting IE7...

well, if you want to know, you even could double encode the contents in all modern versions and browsers.

besides that... do they rounded corners and gradients and all other fancy stuff work in ie6 anyway? no...

Added 3 minutes later:

also the icons in buttons seem a bit missaligned. maybe you can dead center them?

Added 49 seconds later:

also maybe add different cursors to disabled elements

Added 1 minute later:

maybe add flat tooltips. the user maybe gets confused with the button-looking tooltips you have now.

]]> Mo, 06 Feb 2012 15:54:22 -0000 GHengeveld Yes, I intend to add state styles, as used by cot_error().

Data-URIs for images aren't supported in all browsers. I've opted to implement something that works cross-browser first. The same goes for @font-face. Actually the best solution would be to use inline (base64) SVGs, but that's not supported at all. @font-face is problematic in terms of accessibility because screen readers don't know a character is actually an icon (image).

Update: I did some research into data-uris and found an interesting article on the topic. It seems it's possible to get data-uris working in most browsers, including IE6 and 7.

I recently added some more interface elements: http://dev.ghengeveld.nl/css3/buttons/

]]> Mo, 06 Feb 2012 14:51:28 -0000 urlkiller did you thought about giving it styling for errors in form fields ?
would be nice to see some red error warnings in there... or do i missed them somewhere?

bootstrap offers an error, alert, success and primary class to add to you elements to make it red, orange, green or blue

Added 1 minute later:

also if using theme.css files you could think about embeding the sprites with base64 encode into the css files.

Added 2 minutes later:

also for icons: http://www.fontsquirrel.com/fonts/iconic
well thats a font-face font but there where some of these icons as images out there.

]]> Mo, 06 Feb 2012 08:59:09 -0000 Kingsley Yes yes, cool new stuff. xD

]]> Fr, 13 Jan 2012 12:23:19 -0000 elfrenazo do not quite understand, as used??

]]> Do, 12 Jan 2012 23:32:07 -0000 Fox very coolyes

]]> Do, 12 Jan 2012 22:21:02 -0000 GHengeveld Thanks guys. It's a work in progress, I just added tooltips. I'm trying to make it flexible so you can re-use class names between elements, for example the colors are used by both the buttons and the tooltips.

The icons are indeed a sprite (4 images: white, black, 2 sizes)

]]> Do, 12 Jan 2012 20:20:22 -0000 Twiebie Good stuff, Gert!

]]> Do, 12 Jan 2012 19:42:11 -0000 Eugene I'm sorry, I maybe missed the picture for icons (I mean downloads - i think it's a sprite)...

But what I saw on preview is really cool! It will give styles for default and make things easier!

do continue with forms...

]]> Do, 12 Jan 2012 19:23:46 -0000 lukgoh Awesome stuff. The icons are a great idea. This is exactly what Cotonti needed! 

]]> Do, 12 Jan 2012 18:11:40 -0000 GHengeveld Hi people,

Recently I've been working on a new base theme for Siena. The goal is to provide a very basic HTML5 template, with enough flexibility to easily change the layout and add new elements. I also want to make it very easy to build good looking user interfaces, by providing a set of CSS3 interface element stylesheets. I've started with buttons and icons, and I intend to extend this to include other common interface elements such as form fields, dialogs and tooltips.

The buttons are more or less done now. Included features:

  • 13 colors
  • 3 sizes
  • 5 styles
  • Horizontal and vertical grouping
  • 15 icons (more to be added)

You can have a look and download the CSS here.

Let me know what you think and any suggestions you may have.

]]> Do, 12 Jan 2012 17:40:12 -0000