Developr - Fully Responsive Admin Skin

Developr - Fully Responsive Admin Skin

Building a web app for desktop and mobile devices? Developr is for you. Write your code once, and let it handle the magic of responsive webdesign. Developr Admin skin is a flexible responsive HTML5/CSS3 template, built on the mobile-first principle and based on the solid fundations of HTML5 Boilerplate and 320andUp, which provides a rich set of styles and features for all your needs.

Updated to v1.7! See at the bottom for a detailed list of changes.

Main features

Adaptative layout

Developr responsive layout preview

  • Fluid design with 5 different layouts ranging from smartphone to wide screen.
  • 12 columns CSS grid with the ability to set custom sizes for each responsive layout.
  • All elements are responsive too: navigation, tabs, notifications, agenda, forms, tables, content panels…
Built-in plugins

Developr custom plugins preview

  • Powerfull and highly customizable features: tooltips, modal windows, notifications, confirmation message, tabs, styled form elements, navigable and collapsible menus, content panels…
  • Most plugins allow inline configuration with classes and data attributes – no script needed.
  • Plugins are touch-screen ready
Everything you need

Developr includes many features for your webapp

  • Ready to use styles for most needed features: lists, tables, agenda, calendars, galleries, files, blocks, forms, icons, messages, sliders, progress… And much more.
  • Includes plugins for WYSIWYG editor, date picker, table sorting…
  • Large set of utility classes to build your own styles and elements in no time and without touching CSS: layout, colors, shadows, gradients, position…

More!

Styles
  • 9 colors sets with for each one a solid background color, a border color, a gradient, a hover style and an active style
  • 122 vector icons using the awesome icon webfont Entypo
  • Many visual elements to provide additional informations and customize your elements easily
  • 3 different tabs styles
  • Several columns styles
  • Agenda styles, with full-week view and automatic scrolling for smaller screens
  • New! 30 days calendar, in 4 sizes and fluid layout
  • New! files lists and icons
  • New! Images gallery
  • Events list
  • 2 tables styles, both responsive and sortable
  • 6 Error pages: 400, 401, 403, 404, 418, 500 and 503
  • Complete form styling with replacement for checkbox, radios, selects and highly customizable iOS-like switches
Features
  • Automatic template setup: all your plugins fired automatically, everywhere
  • Responsive changes events and control methods
  • Innovative size change events
  • Most plugins use inline options for shorter and smarter code
  • Navigable menus (like iOS configuration menus)
  • 6 different ways to display information to user:
    • Complete notification system, with ability to use browser’s desktop notifications when available
    • Messages styles and API
    • Powerful modal window with replacement for default alert, confirm and prompt
    • Flexible and highly customizable tooltips
    • Confirmation tooltip on links and buttons, just by adding a class
    • Information bubbles to provide help to the user
  • Custom scroll (touch compatible)
  • New! Content panels
  • Flexible and customizable sliders and progress bars, with a complete API and 70+ options
  • Auto-resizing textareas
  • WYSIWYG editor
  • Compatible with IE7+ and all modern browsers

What you get

The template package contains:

  • The template file, ready to use, with 24 examples html files
  • 3 different login pages
  • 7 error pages
  • Complete template PSD set: layout, elements, login, color themes, iOS icon kit, iOS splash screens kit, and more…
  • Comprehensive documentation: every feature is detailled with ready-to-use examples
  • Bonus! The template landing page is also included (PSD and html files)

Changelog

  • v1.0
    • Initial release
  • v1.1
    • NEW Added form validation
    • NEW Added input placeholder polyfill for older browsers
    • NEW Added fixed-size and fluid-size calendars styles and plugin
    • NEW Added files icons and lists styles
    • NEW Added images galleries styles
    • Several minor CSS fixes
    • High resolution shortcuts icons have now the correct size
    • Fixed too large radio/checkbox on login pages
    • Upgraded Modernizr to use built-in features detection for pointer-events, box-sizing and details
    • Upgraded GlDatepicker’s custom stylesheet to match the new calendar style
    • Better setup for tabs, accordions and selects
    • Fixed select replacements too small on iOS devices
    • Select replacements now open on click on the whole element
    • Number inputs get focus after each click on up/down arrows
    • Enable back keyboard focus for switches and checkbox/radio
    • Tooltips now have the option to close on click on element
    • Enable last-child support on IE8
    • Fixed viewport-width bug on iPad for the landing page
  • v1.2
    • New Added responsive content panels styles and plugin
    • New Added files explorer example layout
    • New Added mail inbox example layout
    • New Added collapsible menus plugin
    • New Added DataTables plugin support with custom styling
    • Navigable menus can now show a specific inner element at startup
    • Fixed button-groups to work also with big and huge sizes
    • Switches can now be dragged for a more natural feeling
    • Value inputs now work with mousewheel
    • Added a style for files and icons list on dark background
    • Changed file icon class file-text to file-txt to fix an interaction with the file input style
    • Added arrow-up and arrow-down styles for lists arrows
    • Added support for fixed-position title bar on mobile layout
    • Added support for form validation on selects
    • Improved custom scroll plugin to work on absolutely positioned elements and to handle when scrollbar have been removed
    • Custom scroll no allow continuous scrolling even on touch devices
    • Fixed a bug with font-icons sizes in IE8
  • v1.3
    • New Added wizard styles and plugin
    • New Added search feature for long selects
    • New Added bottom and right tabs styles
    • New Added simple style for Datatables plugin
    • Added ajax content loading for tooltips
    • Added visual styling for current element in big menus
    • Added support for optgroups
    • Improved replaced inputs tabindex detection
    • Added custom event update-select-list to force refresh of selects when changing content
    • Improved datepicker for better support in overflow:hidden elements
    • Navigable menus now trigger navigable-open and navigable-close events
    • Collapsible menus now trigger collapsible-open and collapsible-close events
    • Tabs now trigger showtab and hidetab events
    • Improved legacy browser’s features detection
    • Drop down navigation menu (on mobile layout) now closes when losing focus
    • Added syntax to style the size select when using Datatables plugin
    • Fixed a bug with selects width detection under webkit browsers
    • Selects with multiple selected values now display the correct value on load
    • Fixed a bug with responsive tables on webkit browsers
    • Fixed a bug with custom scrolling
  • v1.4
    • New Added RTL version
    • New Added CSS classes to display/hide elements depending on active media query
    • New Added support for webapp mode under iOS (links open in the app, not in Safari)
    • New Added support for one side shortcut at the bottom
    • New Added automatic positioning for info-spots bubbles
    • New Added compact and mini sizes for fields lists labels
    • New Confirm plugin now allow direct call on target element, several minor improvements also included
    • New New methods for content panels to refresh content
    • New Added custom method to reset navigable menu to main level
    • New Added method to show a specific tab
    • New Added auto-close delay option for messages plugin
    • New Added an option to display the parent menu name in the back button in navigable menus
    • New Added example page for full height content-panels layout
    • Upgraded several external libs and plugins
    • Improved fixed position support detection
    • Improved fixed title bar handling
    • Added a visual style for disabled select options
    • Added visual style for active sorting column with DataTables
    • Content panels now accept options for the ajax call
    • Added l18n number formatting options for number inputs
    • Improved styled selects on touch screens
    • Added option to pass custom classes to modal windows main element
    • Added modal drag on touch screens
    • Upgraded $.modal.prompt method and $.modal.confirm to allow more options overriding
    • Added options to change prompt and confirm modal windows buttons text
    • Added automatic fading on custom scrollbars
    • Improved support for validation plugin in wizard
    • Improved auto-resizing textareas support
    • Improved the look of some form elements
    • Splash screen now displays correctly on iPad in landscape mode
    • Fixed an issue with font-icons alignement on block-lists under some browsers
    • Fixed duplicated icon class names
    • Fixed title bar buttons position in reversed mode
    • Fixed side tabs missing hover effect in reversed mode
    • Fixed tabs redraw issue with older versions of IE when changing media query
    • Fixed issues with styled forms elements and validation plugin
    • Fixed issues with placeholders being submitted
    • Fixed issues with inputs placeholders and validation plugin
    • Fixed issues with focus detection on IE7/8
    • Fixed an issue in detection of fixed-width selects size
    • Fixed an issue when submitting form with an open drop-down select list
    • Fixed missing disabled state for multiple selects
    • Fixed an issue with text selection when using switches
    • Fixed issue with iFrame size on modals
    • Fixed issue with autospacing on slider/progress
    • Fixed duplicate buttons in wizard in some cases
    • Fixed issue with glDatePicker calendar when using static mode
    • Fixed button-icons position under Firefox
    • Added a workaround for jQuery’s inconsistency accros browsers on css() with percentage values
  • v1.5
    • New Added iPhone 5 and retina screens full support (viewport ratio and splash screens)
    • New Added fixed width for icons in inputs lists, so they line up perfectly
    • New Added a required style for labels
    • New Added a style with legends for the shortcuts sidebar
    • New Added the custom event jsautoexpand to trigger a resize with javascript on auto-resizing textareas
    • New Added ajax options editing in onStartLoad callback in content panels
    • New Improved width detection for styled selects (matches the native select size, even when it changes)
    • New Added a custom event silent-change to update styled selects/radio/checkboxes/switches without triggering the change event
    • New Form styling plugin has been completely rewritten and improved, with better touch devices support
    • New Added the option staticValue for styled selects, to specify a text to display no matter the value
    • New In the modal plugin, added the options resizeToFit and closeOnBlur
    • New In the modal plugin, added the options password for the $.modal.prompt method to use a password input
    • New Added methods lockWizard() and unlockWizard() to the wizard plugin
    • New Improved wizard validation process, and added option useValidation to disable automatic validation
    • New Added example code to enable browse history in content-panels
    • Fixed a table border style issue in some older browsers
    • Fixed the fieldset border issue when a legend is defined in IE
    • Fixed the ckeckbox issue on iPad
    • Added a max-width to extendable select lists on smaller screens
    • Fixed the columns style precedence issue
    • Fixed the fallback for the style translucid in older browsers
    • Added a black style for radios inputs
    • Added a fallback for the stripes style for older browsers
    • Fixed the button-icon position on full-width pseudo-inputs
    • Fixed a typo in some button-group styles
    • Fixed a bug in the accordion plugin which prevented size equalization
    • Added a check to prevent double initialization on content-panels
    • Added a fix for the floating values precision JS bug in number inputs
    • Added support for number inputs to methods enableInput() and disableInput()
    • Fixed the issue with disabled number inputs where button still change the value
    • Selects are no longer removed from their parent form when opened
    • Fixed keyboard navigation on styled selects: disabled options are no longer selected
    • Fixed the issue on modal windows when opening with a DOM node as content
    • Fixed the issue on modal windows where the option scrolling: false was ignored
    • Improved internal setup for navigable menus
    • Fixed an issue with navigable menus back button where the text was not set
    • Fixed the bug on sliders where a value of 0 was replaced by the default value
    • Fixed an issue with tooltips’ position when scrolling
    • Added automatic path detection for the Respond.js file
    • Improved position: fixed detection
    • Fixed the bug which caused size-related events to stop working in some cases
    • Improved webapp mode support
    • Updated jQuery to the latest version (1.9.1)
    • Updated Modernizr to the latest version (2.6.2)
    • Updated Entypo Icon Font to the latest version: 284 icons available now!
    • Updated glDatePicker to the latest version (2.0), and added a compatible Developr theme (with fluid and fixed-size variants)
    • Updated DataTables plugin to the latest version (1.9.4)
    • Updated Validation Engine to the latest version (2.6.2)
    • Updated Tinycon to the latest version (0.5)
    • Updated jQuery Details Polyfill to the latest version (0.1.0)
  • v1.6
    • NEW added support for count style in the side shortcuts
    • NEW added toggle mode for accordions
    • NEW content panels: added the content-panel-load event
    • NEW content panels: added methods setPanelNavigation() and setPanelContent() to allow custom markup injection
    • NEW improved support for custom decimal point and thousands separator in number inputs
    • NEW added an option to enable horizontal scrolling in modals
    • NEW added the custom event navigable-ajax-loaded when a navigable menu is loaded using ajax
    • NEW added onStartDrag and onEndDrag callbacks on sliders
    • NEW added support for custom decimal point and thousands separator in sliders
    • NEW added zerofill option on sliders to match desired precision
    • NEW responsive table plugin now processes empty tables
    • NEW wizard: the wizardleave event now receive a custom object with additional data
    • wizard: improved internal steps handling
    • fixed the duplicated icons issue in old IE versions
    • fixed an broken image reference in dashboard.css
    • added a fix for Firefox button size bug
    • fixed an issue with headers on DataTables with fixed headers
    • fixed the height issue on the back button of navigable menus when the menu is hidden
    • updated jQuery to 1.10.2, and added the source map file
  • v1.7
    • Upg. updated icons font to improve compatibility with IE11+
    • New toggle mode for accordions now allow all sections to be closed at first
    • New custom texts buttons for confirmation modals can now be styled
    • New custom vertical scroll bar can now be positionned on left
    • improved support for styled drop-downs with long options lists
    • improved hover detection for custom scroll bars when using both scrollbars
    • fixed an issue with the onStartLoad callback on content panels
    • added the missing 24px icon for PDF files in the fineFiles directory
    • fixed an issue with styled radios groups with no checked elements
    • improved tooltips’ hide animation
    • fixed a styling issue with the menu button on RTL version
    • button groups can now span over multiple lines