Yahoo Pure.CSS Framework

Demo to see how the theme looks in a sample Drupal site Apply theme

Yahoo Pure.CSS framework is an advanced responsive, mobile-first, HTML5, base-theme developed by Dr. Radut, with layout and style configuration options built in that you can easily control through Drupal's UI. The framework includes two fine-tuned, fully featured, end-user themes. It uses Yahoo Pure.css, a powerful responsive CSS framework and also fully supports right to left languages. Pure is ridiculously tiny, being the fastest framework around.

The theme validates HTML5, it is cross-browser compatible, it complies with WAVE and FAE, and it was designed with mobile and SEO in mind: compatible, light and fast.

Framework's features

  • CSS with a minimal footprint. Pure is ridiculously tiny. The entire set of modules clocks in at 4.0KB* minified and gzipped.
  • A responsive grid that can be customized to your needs: 1, 2, or 3 column layout with customizable widths. Pure is responsive out of the box, so elements look great on all screen sizes.
  • The Pure Grid system comes in two flavors: Standard and Responsive.
  • Pure has several prebuilt common elements as grids, forms, buttons, tables, paginators and CSS Dropdown menu.
  • All modules in Pure build on top of Normalize.css, a well-known open source project that renders elements more consistently and in line with modern standards and also works in older browsers.
  • Advanced SEO optimization;
  • 16 block regions;
  • Helpful body classes (unique classes for each page, term, website section, theme settings, etc.);
  • Multi-level drop-down menus (Multilingual support);
  • Possibility to change "Submitted by" display on all nodes;
  • Flexslider (Responsive Slider);
  • Social links integration;
  • Bi-directional right to left (RTL) theming;
  • All the theme settings are multilingual variables.

Advanced theme settings

Pure grid settings

  • Responsive CSS files served from Yahoo CDN or locally;
  • Layout with fluid or custom fixed width;
  • Customizable width for First and Second sidebars;
  • Responsive or Non-responsive layout;
  • Feature to choose the blocks visibility on mobile devices.

Layout and other settings

  • Different font sizes;
  • Main Drop-down menu and secondary menu can be positioned (center, left, right);
  • Show Dropdown;
  • Duplicate the Main Menu at the bottom of the page;
  • No-followed login/register links;
  • Full breadcrumb;
  • Round corners for page elements and menus;
  • Page icons;
  • Possibility to change "Submitted by" display;
  • Advanced SEO optimization;
  • Flexslider (Responsive Slider);
  • Social links - Display various social links at the bottom of the page.

Theme development settings

  • Rebuild theme registry on every page, during theme development;
  • Adjust layout's top margin;
  • Site ID body class - useful in a multi-site environment.

Pure.CSS sub-themes

Pure.MOBI

Being light and fast this theme is ideal to be used on high traffic websites or as a separate mobile theme together with the mobile theme module.

Pure.THEME

Pure.THEME is a fully featured advanced theme that can be used in every web project. The layout is responsive and do not require JavaScript (except for certain menu interactions). It reproduces some of the features presented in Yahoo's Pure.CSS layout section.

Here you can try a live demo of Pure.THEME and play with the theme's settings.

Resources:

Themes built on Yahoo Pure.CSS framework: Zero Point.

 

Want to customize this theme in a unique way for your website, we are here to help you!

We also build custom Drupal themes

 

Get a custom theme