A Sneak Peak at Aristo 2 As the Cappuccino Conference in the states winds down, a sneak peak at Aristo 2 was announced over Twitter. Frequent readers will remember that Sofa designed the original theme for the Cappuccino framework - and my jQuery UI theme was based off of this.  Not only does the update refresh familiar UI components, it also includes an exciting new icon pack. From what you can see below, they’re nothing to laugh at either. A preliminary count shows 108 icons available in the same glyph style no doubt popularised by iOS and now OS X. The changes have already been reflected in the design section of Sofa’s website, but the PSD on their GitHub repository remains unchanged. You can get a more in depth view of both the UI components and the icon set by downloading the sneak peak of Aristo 2. So Will I Be Making an Aristo 2.0 jQuery UI Theme? Initially, no. I think that the original Aristo theme is still travelling along quite nicely. The design direction the new theme is taking is not entirely different enough to warrant the extra time. It’s also worth considering that a lot of the unique touches in Aristo 2 don’t translate that well to jQuery UI themes. The modal and datepicker are just different enough to cause a few cross-browser headaches. Other components like checkboxes, radio buttons and dropdowns aren’t natively supported - even if popular plugins do exist. Hats off as usual to Sofa, it’s no surprise they were acquired by Facebook.
Pop-upView Separately

A Sneak Peak at Aristo 2

As the Cappuccino Conference in the states winds down, a sneak peak at Aristo 2 was announced over Twitter. Frequent readers will remember that Sofa designed the original theme for the Cappuccino framework - and my jQuery UI theme was based off of this.  Not only does the update refresh familiar UI components, it also includes an exciting new icon pack. From what you can see below, they’re nothing to laugh at either. A preliminary count shows 108 icons available in the same glyph style no doubt popularised by iOS and now OS X.

The changes have already been reflected in the design section of Sofa’s website, but the PSD on their GitHub repository remains unchanged.

You can get a more in depth view of both the UI components and the icon set by downloading the sneak peak of Aristo 2.

So Will I Be Making an Aristo 2.0 jQuery UI Theme?

Initially, no. I think that the original Aristo theme is still travelling along quite nicely. The design direction the new theme is taking is not entirely different enough to warrant the extra time. It’s also worth considering that a lot of the unique touches in Aristo 2 don’t translate that well to jQuery UI themes. The modal and datepicker are just different enough to cause a few cross-browser headaches. Other components like checkboxes, radio buttons and dropdowns aren’t natively supported - even if popular plugins do exist.

Hats off as usual to Sofa, it’s no surprise they were acquired by Facebook.

The Aristo theme for jQuery UI nudged up 1000 followers some time yesterday. Thanks for your support and contributions!
Pop-upView Separately

The Aristo theme for jQuery UI nudged up 1000 followers some time yesterday. Thanks for your support and contributions!

Aristo 1.2 Released

The latest release of Aristo closes some long term issues, as well as those introduced in my last commit. User comments expressed a need for styled inputs and text areas. My last commit included my implementation of these, but the selectors were too generic and were not sandboxed to any particular class. This has been recitified, and you will now need to place the “ui-form” class on a root element to inherit the styles.

  • Closed duplicate bugs for submit button styling. This was a major pain and I’ve had to use browser specific fixes. Submit buttons should now look the same as other buttons in IE8, IE9, Webkit, Firefox and Opera.
  • Some CSS3 snippets only had vendor prefixes (-moz and -webkit), and were not displayed in Opera. This led to some pretty inconsistent visual effects.
  • Sandboxed the form element styles. If you would like to use the default form styles with subtle box shadows etc, you now have to place the “ui-form” class on a parent element. 

As always: Demo or Download.

Aristo in the Wild

Here’s a simple list of places I’ve noticed my Aristo jQuery UI theme popping up - or received a tip off either here or on Hacker News. Are you using Aristo somewhere exciting?

Native Implementations

Derivatives

Aristo 1.1 Released

I woke up on Saturday morning to find about 2,000 new visitors to my blog and 22 email notifications of new Twitter and Tumblr followers. It turns out Aristo made it to the front page of Hacker News for the second time in it’s short lifespan, and in turn was tweeted about by some popular Twitter users.

HN users had some great suggestions in the comments section, and most of those have been implemented and are now live on the GitHub repo and demo page. The list of changes include:

  • Styled basic input and textarea fields.
  • Button hover effects now fade with CSS3 transitions (Webkit, Firefox & Chrome).
  • Put user-select:none; on buttons to give them a more native feel.
  • Prevented empty button links from sending you to the top of a page (confusing when in a modal).
  • Fixed auto-complete versus slider z-index bug by hard coding z-index. This may cause other problems, so be on the lookout.
  • Fixed background bleed through bug for the progress bar.

I hope this keeps you satisfied for a while :)

 

Aristo Menu

It may be a bit tough to follow, not being English and all, but check out this cool Aristo-based menu script!

nahue:

Si no conocen Aristo ( diseñado por SOFA ), es una libreria grafica muy bonita para mejorar los componentes basicos que nos ofrece html para desarrollar nuestras aplicaciones. Si quieren ver el archivo fuente .PSD pueden descargarlo desde aca. Hace poco descubri una implementacion de dicha…

Aristo 0.8 + Minor Milestone

Icon courtesy: www.icondrawer.com

Aristo nudged up 250 GitHub followers recently, with the current count sitting at 254.

The 0.8 release is a minor update, fixing the buttons that were broken to a structural change to .ui-buttons in the jQuery UI 1.8.5 release. There are 3 open issues, but I haven’t had the time to look at these as of yet. I am still without internet following the big move to my new apartment, so thanks to those who pushed commits to the master.

Aristo 0.7 Released

The power of the GitHub community has proved itself once more! I’ve been far too busy of late to post any Aristo updates, so two particular members have come through with the goods. Massive props must be delivered to Muhammad Lukman, who both raised and solved four issues with the Aristo theme, and usual suspect Stefan Livens for merging the fixes in and updating the demo page.

Most importantly, I have decided to manage pull requests and forks entirely via the web interface!

Aristo 0.6 Released

Icon courtesy: www.icondrawer.com

Before I discuss what’s new in this release, I’d first like to thank the community for their interest and support in the project! The Aristo jQuery UI theme nudged over 100 followers and contributors on GitHub some time last week. So thanks again for your encouragement, issue reporting and bug fixes.

Moving on to what’s new in the 0.6 release:

  • IE6 & IE7 Button Width Fix - This was a pretty critical bug preventing Aristo from rolling out as a semi-official release. Previously, buttons were taking 100% screen width in IE7 and earlier.
    Unfortunately the fix for this is only partial, as buttons with icons inside of them push each other down sequentially because of their line-height value. I’ll blame IE’s poor support of display:inline-block; for my apathy.
  • <input type=”submit” /> - A bug brought to my attention in the comments on the 0.5 release. Calling the .button() function on a input:submit resulted in an unstyled element. A tough one to fix in all browsers, as jQuery UI does not wrap submit elements in the usual DOM, presumably to preserve form functionality.
  • Button Border Inside a Tab - Due to the nesting of classes, placing a button inside a tab panel resulted in a pretty screwy looking border being placed on it.
  • Autocomplete Jumpiness - A legacy bold class on hover states caused the demo page autocomplete to wrap  when the user hovered over “Antigua and Barbuda”.

To date, this release closes all issues raised on GitHub. If you’ve noticed any more, please raise them on GitHub. Disqus has some serious flaws in its URL tracking, so comments are probably not ideal.

Aristo 0.5 Released

Another quick update before the final exams of my academic career. jQuery UI 1.8.2 came out in the last couple of days, so updating the demo page to 1.8.2 may potentially introduce a few errors. I’m still coming to terms with Git and Github, so to all of you who continue to submit fixes to bugs that never get merged in - my sincerest apologies. To make sure everything works and gets out quickly, it’s just easiest to copy+paste to my branch and commit them from there. I’m not trying to steal all your glory.

New in this release:

  • Multi-date picker bug fix - selecting dates no longer causes the page to jump up and down by a couple of pixels.
  • Accordion fix  - many thanks go to stefanlivens for removing the reliance upon <h3> tags in the accordion headers.
  • Uses jQuery 1.8.2 - the demo page has been updated to use the latest jQuery UI release pulling from the Google CDN still.
  • Stylesheet formatting - increased readability throughout.
  • Framework icons - silly orange highlights removed, suggested by a comment on here somewhere.