Constellation is a powerfull admin skin for building advanced backends, both for desktop and mobile users. It provides a wide range of styles from data visualization to lists and calendars, all fluid and nestable. This skin is build on HTML5 and CSS3 , and is powered by jQuery for maximum user experience.
Updated to v1.5! See at the bottom for a detailed list of changes.
“Wonderful work on the template, it has been an absolute pleasure to work with, well documented, well designed, 10 out of 10. The best $20 I have spent in a long time” – lvismer
“Visually stunning! Love it! Very clean and easy to modify code without cluttering things up. Was easy to integrate into an existing CodeIgniter site with a horrible admin template. Thanks!” – 2bytes
“Absolutely amazing! This was more than worth the purchase! Great job, and thanks for your amazing work!” – allaspects
“Constellation is one of the most comprehensive, well-documented, well-planned projects we’ve ever seen. Cheers to great work!” – daveromero
Features
- HTML5 & CSS3 markup
- Fluid or fixed layout, based on 960 grid system
- 47+ elements styles, with multiple variations
- jQuery powered, fully functional even if JS is disabled
- Satellite backend pages are provided: login, error with report sending, 404’s…
- Mobile version included – for iPhone, Android and all webkit-based mobile browsers – compatible with main template content styles
- All elements are fluid (sizes are in EMs): resize just by adding a class
- Detailled documentation with complete styles and functions references
- 2 background colors : light and dark
Pages included in the package
- Main page with examples of all included styles:
- Favorites list
- Statistics with filters
- Week & month planning
- Control panel
- Simple and complex forms
- Advanced table block
- Data grid view
- File manager
- 4 calendars styles
- Tasks and blocks
- Toolbar
- Multiple lists styles
- Help
- Wizard and image gallery
- Login with working ajax/php script (compatible with the mobile version)
- Error page with report sending, fully fonctionnal (compatible with the mobile version)
- Error documents: 400, 401, 403, 404, 500 and 503 (compatible with the mobile version)
- Mobile pages
- Older browser ‘Please update’ notice page, with working detection
Included styles
- Navigation with infinite levels
- User status bar with breadcrumb
- Fixed edition bar, stays on top of screen
- Fixed footer buttons
- New! Modal windows
- Drop-down menu with infinite levels, embeddable in many elements
- Content box with glass border, block controls and a dedicated tabs style
- 3 nestable tabs styles
- Forms with collapsible fieldsets, visual required/validation styles and iPhone-like switches
- 5 messages styles
- User planning with timelines, milestones, breaks, unavailable periods, current time…
- Table with sort arrows
- Tiny, medium, large and list calendars with multiple events listing styles
- New! Week calendar view
- Wizard steps
- Image gallery and preview
- 20 different list styles with multiple variations:
- Bulleted list
- Keywords
- Tags
- Small pagination
- Picto list
- Simple list
- Collapsible list
- Definition list
- Accordion list
- Files tree
- Favorites
- Shortcuts
- Files list
- Grid list
- Tasks list with tags and comments
- Blocks & mini-blocks list
- Icon list
- Small files icon list
- Extended list
Functions
- Automatic setup: no extra JS needed to enable template effects, even on AJAX loaded content
- Working AJAX /php login script
- AJAX instant search-form results
- New! Flexible modal windows using existing content, ajax or iframe
- Full featured error page, with report sending form
- CSS and JS files compression system, easy to use (no server customization required)
- Nestable tabs, with content height equalization, events on show/hide to setup content and browser back button enabling
- Built-in tips system, with both CSS or JS setup
- Multiple dedicated plugins: accessibleList (long lists pagination), ajax real-time search field…
- Older browsers detection (redirect to a ‘Please update’ notice page)
- Context menu (right click) plugin, with easy building function
- Closable elements, just by adding one span inside
- Growl-like notifications and block messages in just one function call
- Ajax loading effect, with animation and Retry/cancel message on error
- New! Table sorting with DataTable plugin
- New! Date selector with DatePicker plugin
Template package content
- HTML only template
- HTML + PHP template
- All template PSD files: main, mobile, special pages, favicons and slices
- Detailled documentation with complete styles and functions references + code samples
Credits
- Fugue Icon Set
Copyright (c) 2009 Yusuke Kamiyamane – http://www.pinvoke.com/ - FineFiles Icon Set
Copyright (c) Plain Style – http://plainz.oh.land.to/download_icon.html - Flags Icon Set
Copyright (c) FamFamFam – http://www.famfamfam.com - Web Application Icon Set
Copyright (c) WebAppers.com – The icons are licensed under a Creative Commons Attribution 3.0 license. - DataTables
Copyright Allan Jardine (c) 2007-2010
DataTables is dual licensed under the GPL v2 license or a BSD (3-point) license. - jQuery DatePicker
Copyright (c) Keith Wood
Changelog
- v1.0
- Initial release
- v1.1
- Template changes:
- Several CSS bug fixes
- Added 3 new styles
- Added modal windows styles and controls
- Added -webkit-background-clip: padding-box; to styles using border radius (see http://tumble.sneak.co.nz/post/928998513/fixing-the-background-bleed)
- Added week calendar
- Added function resetTabContentHeight() to reset tabs content-blocks heights
- Fixed a bug in old-browsers.js in function getCookieParams()
- Fixed a bug in $.fn.addTemplateSetup()
- Various JS template setup functions optimizations
- Added DatePicker
- Added DataTable
- Documentation changes:
- Added changelog
- Added optimization instructions
- Added modal window documentation
- Added DataTable plugin integration example
- Added DatePicker plugin integration example
- Updated several sections
- v1.2
- Template changes:
- Add support for class .menu-opener for main nav sub-menu and H1
- Improved performance and support of .files class
- Improved tab switching to avoid screen flickering when content is smaller than the viewport
- Added support for tool-tips for switches
- Added support for input keep-logged in login script
- Enabled error_reporting level check in error reporting script
- Fixed a CSS bug when using spans and inputs in block controls
- Fixed a CSS bug causing hidden text in main menu tabs to show
- Fixed a bug in function getDefaultTabIndex() when used with jQuery 1.4.3
- Fixed a bug in function $.fn.modal()
- Fixed a bug in old-browsers.js
- Fixed a bug in error reporting sending script
- v1.5
- Added a new main menu style, without big icons and allowing a custom logo
- Added a month planning style
- Added a red style for breadcrumb
- Improved the modal window to allow using an iframe for the content
- Several other tweaks and fixes to the modal window lib
- Use of Modernizr to enable feature detection and improve compatibility (removed html5.js)
- Updated most external javascript libs to their latest version
- Improved the mobile menu to handle screen rotation/resizing
- Improved the login page message box to allow any content height
- Improved the class menu-opener to allow using the opening button as a link
- Added CSS fix to use the datepicker in modal windows
- Added a disabled style for inputs/selects/textarea
- Several new basics CSS styles
- Several minor CSS fixes
- Fixed a bug in CSS /JS minimizing
- Fixed a bug with reversed drop-down menus
- Fixed the dark background height issue