Cellular :: Base Theme for Drupal 7

The Cellular base theme for Drupal 7 simplifies Drupal front-end development using the theme layer to add functionality that doesn't require heavy database interaction.

Features

• jQuery & jQuery-UI update (that doesn't break Views & simplifies UI theming)
• Mobile 1st, fluid/jello styling with SASS styling broken into logical partials
• Full menu tree display, dynamic conditional CSS, & lots of other nifty settings
• Easy favicons & apple-touch-icons (.ai files included)
• Integration with several javascript libraries (D3.js, GreenSocks Animation, Modernizr, etc.)
• Integrated social media follow & share links with custom icons

Usage

Advanced theme features require the cellular library:

http://github.com/ablank/cellular.library

Download and extract the contents to $base_path/sites/all/libraries/cellular

cd sites/all/libraries
git clone --branch master https://github.com/ablank/cellular.library.git cellular

1. Navigate to /admin/appearance and enable the Cellular theme
2. Enable & set subcellular as the default theme
3. Modify the theme Settings to suit your needs.

• Personalize : Set copyright & favicons
• Style : Add/Edit media query, remove Drupal CSS, configure breadcrumb & menu display settings, set content classes
• Javascript : Select the javascript libraries to include.
• Social Media : Select and configure the social media links to you would like to include.

Cellular uses theme functions rather than theme settings (.INFO files) to add/update/delete stylesheets and javascript, providing a simple code-based solution to add multiple elements to your theme with a high degree of control over the loading order.

Styling

• Load additional css in the order you need with cellular_add_css() - Add your stylesheets to the array $add_css in /inc/css_alter.inc

• Get rid of unnecessary stylesheets with cellular_remove_css() - Add the module => stylesheet to the array $exclude in /inc/css_alter.inc

• SASS is preconfigured & ready to watch (cd /path/to/theme, compass watch)

Scripting

• /js/script.js is ready for you to add your custom scripting.

• Load scripts in the order you need with cellular_add_js() - Add your scripts to the array $add_js in /inc/js_alter.inc

  • nice Link to a CDN script by including the ['cdn'] key. If the ['object'] & ['file'] keys are also present, a local fallback link will be automatically generated after the cdn link.

Included/Optional Javascript Libraries

• jQuery Update Update jQuery to the version of your choice (1.11.1, 1.10.2, 1.9.1, 1.8.3, 1.7.2, 1.6.4, 1.5.2, 1.4.4) without breaking Views. Loads from the Cloudflare, Google, or MS CDNs with a local fallback.

  • The jquery.migrate module is optionally loaded for versions >= 1.9.x for backward compatibility.

• jQuery Core Plugins Update Update Drupal's core jQuery plugins to the latest stable version.

  • BBQ v1.3
  • Cookie v1.4.1
  • Form v3.48
  • Once v1.2.6

• jQuery UI Update Update jQueryUI to the version of your choice (1.10.4, 1.9.2, 1.8.24).

  • Select the UI theme of your choice, or use the CUSTOM flat UI style (/sass/jquery-ui) for a lightweight theme that matches your site.

• Cellular UI UI elements (accordions, tabs, mobile menu, etc.) built for easy integration with Views.

• Modernizr Test browser feature support and load resources based on capabilities.

• D3js D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG and CSS.

• GSAP (GreenSock Animation Platform) GSAP is a suite of tools for scripted, high-performance HTML5 animations that work in all major browsers.

• THREEjs A JavaScript 3D Library which makes WebGL simpler.

• Prism Syntax Hilighter Code syntax hilighter.

• Backstretch Add a dynamically-resized, slideshow-capable background image to any page or element.

• Flowtype Dynamically resize text: font-size based on element width.

• Freetile Enables the organization of webpage content in an efficient, dynamic and responsive layout, similar to Masonry.

• Parallax A dirt simple parallax scrolling effect.

• Smoove Smoove makes it easy to implement awesome CSS3 transition effects, making your content smoothly glide into the page as your scroll down the page.

• SnapSVG The Snap.svg JavaScript library makes working with your SVG assets as easy as jQuery makes working with the DOM.