MDB jQuery Free
MDB jQuery Pro
Newsletter
Would you like to be notified about next update ?
Subscribe to our newsletterMDB 4.20.0 - 2021-07-26
What's new?
MDB 4.20.0 comes with major updates and bug fixes
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Updated jQuery to 3.6.0
- Updated Bootstrap to 4.6.0
Select
- Fix editable functionality when there is an option chosen already
- Fix showing options which include whitespace character
- Fix showing selected option instead of a placeholder
File input
- Fix text flowing out of the input in case of long file names
Search
- Fix scroll position starting from the middle instead of the top of a dropdown
Input
- Fix input type date turning dates transparent when certain values are inserted
Datepicker
- Fix label in opened datepicker respecting
weekdaysShort
andshowWeekdaysFull
options
MDB 4.19.2 - 2020-11-30
What's new?
MDB 4.19.2 comes with bug fixes
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Updated version of 'mdbsnippets' VSCode extension (to 4.19.2) - mdbsnippets
Date picker 2
- Fix hidden input name
- Fix hidden input prefix and suffix
Time picker 2
- Fix callback functions
Date picker
- Fix month and year select
Time picker
- Fix
Cannot read property 'value' of undefined
error in Date and Time Picker
Sidenav 2
- Fix a bug creating new class instance after calling public methods
Inputs
- Fix label and placeholder in input type date with the default value
- Fix error and success validation message
Multi-range slider
- Fix
rangeLength
option creating one more range - Fix getting the value of the first range
- Fix broken Multi-range slider for Firefox
Checkbox & Radio button
- Fix styles after element focus
Material select
- Fix overlapping Material select on icon
- Fix focus select input after open
Autocomplete
- Fix select the highlighted option by pressing enter
MDB 4.19.1 - 2020-06-22
What's new?
MDB 4.19.1 comes with bug fixes
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Updated version of 'mdbsnippets' VSCode extension (to 4.19.1) - mdbsnippets
- Fix bug with "map" file causing apearing warning alerts
Select
- Fix creating extra wrappers after adding new elements to the list
- Fix the inability to remove wrappers
- Fix hiding button
- Fix selecting text
Autocomplete
- Fix blur event after typing value
- Fix arrow down and up event during looking up list
- Fix navigation through element after pressing tabulator key
- Fix label after blur event
- Fix clear button
Inputs
- Fix changing input's type from date in to text
- Fix label and placeholder in input type date
- Fix styling input type numbers on firefox
Buttons
- Fix not clickable area in fixed buttons
Pagination
- Fix double waves-effect class
Flags
- Add missing catalonia flag
Datepicker
- Fix button in date picker which fire submit event
MDB 4.19.0 - 2020-05-25
What's new?
MDB 4.19.0 comes with the new improved Sidenav, updated Bootstrap and jQuery and few bug fix
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Update Bootstrap to 4.5.0
- Update jQuery to 3.5.1
- Updated version of 'mdbsnippets' VSCode extension (to 4.19.0) - mdbsnippets
Sidenav 2
- Refreshed appearance
- More customization options
Sidenav
- Fix closing Sidenav during search on mobile devices
- Fix behavior after resize on mobile devices
- Fix Sidenav with pushed content
MDB 4.18.0 - 2020-05-11
What's new?
MDB 4.18.0 comes with the updates for Date Picker 2.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Updated version of 'mdbsnippets' VSCode extension (to 4.18.0) - mdbsnippets
Date Picker 2
- Add inline mode
MDB 4.17.0 - 2020-04-27
What's new?
MDB 4.17.0 contains updates for Dropdown and Sidenav. The new version comes also with the new improved Date Picker.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Updated version of 'mdbsnippets' VSCode extension (to 4.17.0) - mdbsnippets
Date Picker 2
- Refreshed appearance.
Updates in Dropdowns
- Fixed issue with not closing dropdowns.
Updates in Sidenav
- Resolved issue with horizontal scrollbar - slim.
- Fixed issue with overlay opening animation.
- Fixed issue with not closing on winow minimize.
- Resolved issue with Advanced Double Navigation Hamburger
- Added onOpen/onClose events.
- Fixed
.sideNav('show')
and.sideNav('hide')
MDB 4.16.0 - 2020-04-13
What's new?
MDB 4.16.0 comes with the new improved Time Picker and Datatables varsion.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Updated version of 'mdbsnippets' VSCode extension (to 4.16.0) - mdbsnippets
Time Picker 2
- Added possibility to set time steps.
- Refreshed appearance.
Datatables 2
- Added Select All functionality
- Refreshed appearance.
MDB 4.15.0 - 2020-03-30
What's new?
MDB 4.15.0 comes with the updates for Calendar plugin, Select, Inputs, Textarea.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Updated version of 'mdbsnippets' VSCode extension (to 4.15.0) - mdbsnippets
Updates in Calendar plugin
- Resolved issue related with plugin responsiveness.
Updates in Select
- Edited Select size.
Updates in Inputs
- Fixed issue with Inputs autofocus.
- Added possibility to use icons/text inside the Input.
- Resolved issue related with changing
.prefix
style on blur. - Resolved issue with too long labels.
Updates in Textarea
- Resolved issue related with changing
.prefix
style on blur. - Resolved issue with too long labels.
- Fixed issue with Textarea rows display.
MDB 4.14.1 - 2020-03-15
What's new?
MDB 4.14.1 contains updates for Multiselect, Datatables and WYSIWG.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Removed duplicate import of
_custom-styles.scss
in MDB Pro
Updates in Multiselect
- Resolved issue related with dynamic added attribute
selected
for Myltiselect options.
Updates in Datatables
- Simplified
datatables-select.js
code.
Updates in WYSIWYG
- Fixed WYSIWYG multi-initialization problem.
- Resolved issue related with broken selection of styling option.
- Fixed issue related with making changes throughout the entire document.
- Simplified WYSIWYG code.
MDB 4.14.0 - 2020-03-02
What's new?
MDB 4.14.0 comes with the updates for Material Select, Multiselect, Search, Stepper, Chips, Modals and Sidenav
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- We have add
.map
files for.js
and.css
Updates in Material Select
- Fixed options index when placeholder is present.
- Fixed options list height when first option is empty.
- Fixed label position when first option is empty.
- Fixed destroy option.
Updates in Multiselect
- Fixed options index when placeholder is present.
Updates in Stepper
- Fixed submit bug.
Updates in Chips
- Fixed chips.select event.
Updates in Modals
- Fixed styles.
Updates in Sidenav
- Fixed data-activates attribute.
MDB 4.13.0 - 2020-02-17
What's new?
MDB 4.13.0 comes with the updates for Forms, Slider, Buttons, Scrollbar, Dropdown and Sidenav.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Created Styles Customization Guide See more
- New version of 'mdbsnippets' VSCode extension - mdbsnippets
Updates in Forms
- Simplified Forms code
- Fixed date input label issue on blur event
Updates in Slider
- Resolve issue with the thumb position update
- Fixed behavior after right mouse button clicking
- Fixed thumb closing problem
Updates Scrollbar
- Updated Perfect Scrollbar to version 1.5.0
Updates Sidenav
- Resolved issue with Sidenav opening on mobile devices
Updates in Dropdown
- Fix Multi-level Dropdowns
Updates in Buttons
- Resolved issue with Warning Buttons styles on focus
MDB 4.12.0 - 2020-01-20
What's new?
MDB 4.12.0 contains updates for Multiselect, Time Picker, SmoothScroll, Treeview, Sidenav, Select, Slider, Loaders, Animations and Autocomplete.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Created Plugin Installation Guide See more
- Removed Roboto fonts and changed of attachment method to CDN links
- New version of 'mdbsnippets' VSCode extension - mdbsnippets
Updates in Material Select
- Resolved issue with first letter duplication
Updates in Time Picker
- Add min and max options
Updates SmoothScroll
- Simplified SmoothScroll code
Updates Navigations
- Simplified scrolling navbar code
Updates in Treeview
- Simplified Treeview code
Updates in Sidenav
- Add more smooth animation
Updates in Multiselect
- Fixed disappearing save button after using .attr()
- Possibility to add unique classes to Material Select elements
Updates in Slider
- Simplified Slider code
Updates in Autocomplete
- Simplified Autocomplete code
- Resolved issue with Clear Button
- Added possibility to use visibleOptions
- Added Home and End buttons handling
- Edit labels and clear button styles
Updates in Loaders
- Simplified Preloader code
Updates in Animations
- Simplified Wow code
MDB 4.11.0 - 2019-12-23
What's new?
MDB 4.11.0 comes with the integration of the latest Bootstrap (4.4.1) and with few fixes and improvements. The new version contains updates for Select, Buttons, Charts, Collapsible, File Input, Typography, Carousel and Email Templates.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- New version Bootstrap - 4.4.1
- New Charts plugin - possibility to use datalabels
- Created 'mdbsnippets' VSCode extension - mdbsnippets
Updates in Material Select
- Fixed Select behavior on focus event
Updates in Buttons
- Resolved issue with Fixed Buttons on mobile devices
- Fixed bug with `ul` height in fixed action button
Updates in Charts
- Added new plugin with datalabels option
Updates in Collapsible
- Simplified Collapsible code
Updates in File Input
- Simplified File Input code
Updates in Carousel
- Fixed bug with column in multi-item-carousel
Updates in Typography
- Added new font weight for the `strong` tag
Updates in Skins
- Added description of skins variables in our documentation
MDB 4.10.1 - 2019-12-09
What's new?
MDB 4.10.1 contains updates for Material Select, Time Picker, Sidenav, Buttons, Carousel, Inputs and Cards components.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Updates in Material Select
- Resolved issue with select filter
- Resolved issue with data-placeholder
- New attribute available: data-secondary-text
Updates in Time Picker
- Added possibility to open time picker by clicking another element
- Added possibility to use time picker and date picker together as a one component
Updates in Sidenav
- Resolved issue with overlay showing on mobile devices
- Resolved issue with scrolling on touch screens
Updates in Buttons
- Simplified Buttons code
- Resolved issue with opening menu in Fixed buttons
Updates in Carousel
- Fixed multi item carousel animation on mobile devices
Updates in Inputs
- Simplified Inputs code
- Resolved issue with input type date label animation
Updates in Cards
- Simplified Cards code
MDB 4.10.0 - 2019-11-25
What's new?
MDB 4.10.0 contains updates for Sidenav, Buttons, Sticky, Date Picker and Material Select components. The new version fixes also gulp package installation with Node 12.0.0 and higher.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Updates in Sticky
- Resolved issue with window resize
- Resolved issue on Firefox
- Simplified sticky code
Updates in Sidenav
- Simplified SideNav code
- Option
MENU_WIDTH
was renamed tomenuWidth
to make it more consistent with the other options - Improved touch events
- all options are now available through data-attributes
- Removed unnecessary parts of code
- SideNav Slim was made an option - to use it, it's necessary to add
slim: true
to the initializer
Updates in Select
- Fixed bugs with outline select filter
Updates in Date Picker
- Added possibility to open date picker by clicking another element with 'open-picker' class
Updates in MDB-gulp package
- Fixed gulp installation error in the latest Node version
- Updated gulp version to 4.0.2
Updates in Buttons
- Fixed bug with fixed action button animation
MDB 4.9.0 - 2019-11-12
What's new?
MDB 4.9.0 contains critical updates for Chips, Dropdown and Material Select components. All these improvements to facilitate the work with our library as much as possible.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Updates in Chips
- placeholder and secondaryPlaceholder - new data attributes
- fixed materialChip method
- sortAutocompleteData - new boolean for alphanumeric sorting
- autocompleteDataCompareFn - new comparing function for sorting
Updates in Dropdown
- $.fn.dropdown() - returns object with updatePosition() method
- maxHeight, resetScroll - new options
- constrain_width changes into contstrainWidth
- all options are now available through data-attributes
- new elements - $activator and $activates
- new options - easingEffectIn and easingEffectOut - all available both through data() and data-attr
Updates in Material Select
- showResetButton - shows x icon for resetting
- tab key for focusing select
- enter or alt+arrowDown keys open select
- arrow up and down keys change options without opening dropdown
- home and end keys pick first and last option
- space key selects an option
- new mdb-select-autoinit class for auto initialization
- only selects with mdb-select class are now hidden by default
- fixed issues in tabs and mobiles
Styling updates
- fixed bugs with variables for responsive typography
- fixed bugs with font color in dropdown content
- added new divider class .w-header
MDB 4.8.11 - 2019-10-21
What's new?
MDB 4.8.11 was shipped with the inportant change to the material select, new version of Font Awesome, time and date picker fixes and more.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- New version of Font Awesome - 5.11.2 with the MDB icon
- New WhatsApp social button
- Major improvements to material select component explained below
- Time picker let you pick container with atribute
What's fixed?
- Date picker with atribute editable:true scroll issue.
- WYSIWYG js code structure improvement
- Margin issues within .btn-block class
- SCSS files structure thanks to the new settings for scss-linter
What's changed in Material Select
.material_select()
support has been dropped. The new syntax is the only one supported: .materialSelect()- Changes in the options passed to .materialSelect():
- nativeID has been renamed to selectId
- BSsearchIn and BSinputText has been dropped in favor of a new option defaultMaterialInput which does the same as the two previous ones
- data-selectAllLabel attribute has been renamed to data-label-select-all
- data-optionsSelectedLabel attribute has been renamed to data-label-options-selected
- data-keyboardActiveClass attribute has been renamed to data-keyboard-active-class
- new option: placeholder - sets the placeholder for the Material Select control
- new option: visibleOptions - sets the max number of visible options in the Material Select dropdown, the rest of options will be available after scrolling; default: 5
- new option: maxSelectedOptions - affects Multiselect only; if there will be more selected options than that value, the 'X options selected' text will be displayed instead of all comma-separated options; default: 5
- new option: label.noSearchResults - affects Searchable Select only; if there will be no search results, this text will be displayed; default: 'No results'
- All options can be overriden either using JavaScript by passing them to the .materialSelect(options) function as an argument or by adding data-* attributes to the select control with the same name but in kebab-case
- The label for the Material Select does not has to be directly next to the select control anymore. If the label will have [for='select-id'] attribute, it will be displayed correctly no matter where in the document it will be placed
- you can now add a custom template to the Material Select at the bottom of the options list. If you place an elements directly after the select element and you add the .mdb-select-template-part to each element, those elements will be added at the end of the options list. Alternatively, you can place the template-elements wherever you want, but the data-mdb-select-template-part-for='select-id' is required
Known bugs fixed in Material Select
- right-click opens the Material Select dropdown
- 'Select all' option does not show up while filtering the Searchable Select
- 'Select all' selects invisible options while filtering the Searchable Select
- when there is no results in the Searchable Select then 'No results' text should appear
- there is poor accessibility support
- it's hard to change the language of the labels displayed on the Material Select (like 'X options selected', 'Select all' etc.)
- there should be a text ellipsis when the label/option/placeholder is too long to fit in the Material Select control
- the Material Select dropdown does not scroll to the selected option after closing and opening it
- the Material Select dropdown does not update its position (top/bottom) dynamically, e.x. when the options are filtered in a Searchable Select
- non-material select controls are hidden by default; one needs to add .browser-default class to make it visible (from now on, only select.mdb-select elements are hidden by default)
MDB 4.8.10 - 2019-09-16
What's new?
MDB 4.8.10 was shipped with medium changes like fixing errors with material select, textarea and added simple charts to the addons section and created new documentation for this.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Added resize option to the standard and outlin material textarea
- Added new class "form-check-label-left" that will let you have checkbox label on the left
- Simple charts moved to addon section. Now you have to add it to your project if you want to use it. Added extended documentation.
What's fixed?
- Material select opt group will work properly with predefined element with attribute selected
- Fixed padding and line-height settings for outline material select on Safari browser
- Restored the blue color instead of black one to the material select
- Removed unnecessary code for scrolling big navbar on mobile devices from fixed/sticky navbar
- Fixed responsiveness of container existing together with slim side-nav
MDB 4.8.9 - 2019-09-02
What's new?
MDB 4.8.9 was shipped with medium changes like fixing few scss errors, waves initiation that lets you include mdb.js in head of document and material select method destroy interaction.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's fixed?
- waves initiation will wait for the document to be ready. Because of this change you can link mdb.js in the head of the document.
- material select atribute destroy: true will correctly create structure from before initialization of this component.
- code structure improvement.
- restored the default behavior of Bootstrap dropdown within a navbar on small screens
- added :not(.browser-default) to the _forms.scss to prevent default input from unnecessary styles
- improved settings in SCSS for .note-primary, etc.
MDB 4.8.8 - 2019-08-12
What's new?
MDB 4.8.8 was shipped with medium changes like fixed animations or wysiwyg plugin.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's fixed?
- multi-level dropdown menu initialization added to js package.
- rewrote animations initialization script to ES5+ standard and fixed some minor bugs in their behaviour
- sidenav overlay issues
- [WYSIWYG]: Fixed issue with updating value of native textarea
MDB 4.8.7 - 2019-07-23
What's new?
MDB 4.8.7 contains all changes from the previous version plus fix pro mdb.min.js file
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
MDB 4.8.6 - 2019-07-22
What's new?
MDB 4.8.6 was shipped with medium important improvments like treeview initialization and styling changes, multi-select improvements and nw.js compatibility.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Treeview.js initialization got changed and new styles added.
- Old treeview.js got replaced
- ProgressBar.js addon removed (available in snippet)
- Select & Multiselect validation
- Select & Multiselect - adding new options
What's fixed?
- Multiselect searchable & toggle all synchro - `Select all` option now selects ONLY FILTERED OPTIONS
- Select & Multiselect full keyboard access
- Compatibility with nw.js
- Scrolling bug on IOS mobile devices
MDB 4.8.5 - 2019-07-08
What's new?
MDB 4.8.5 was shipped with high improvments like fixed minor bugs in Material Select, Datepicker and Timepicker. Also, we added new features like counter and update existing components like rating or progress bar.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Rating.js initialization got changed and new styles added.
- Old rating.js got replaced
- Counter.js new feature
- ProgressBar.js new feature
What's fixed in Material Select?
- Preselect options fix
- Searchable select fix
- Label fix
What's fixed in other places?
- Fixed label in textarea on not focus state
- Fixed live previews in our documentation
- Fixed Datepicker opening on tab change, atribute editable: true
- Fixed Timepicker closing instantly on some browsers
- Social-reveal animation transition
MDB 4.8.4 - 2019-06-24
What's new?
MDB 4.8.4 contains all changes from the previous version plus fix for chips.js
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
MDB 4.8.3 - 2019-06-24
What's new?
MDB 4.8.3 was shipped with high improvements like fixed minor bugs in preloading.js, datepicker and slim side-nav. Also, we added new options to the components like timeline and chat.
Note: this version contains bug with chips.js
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Added arrow support for autocomplete browsing
- Added timeline-light style component to timeline addon
- Added treeview animated function and styling to treeview addon
- Added new functionalities to the chat component
What's fixed?
- Fixed datepicker atribute - editable:true
- Fixed preloading.js minor bugs.
- Fixed styling for outline select
- Fixed styling for autocompliting in outline input
- Fixed text color in gradient buttons
- Fixed hamburger menu in the slim side-nav
MDB 4.8.2 - 2019-05-27
What's new?
MDB 4.8.2 was shipped with medium improvments like fixed a few bugis in material-select, updated jQuery to 4.3.1 version and Font Awesome to 5.8.2 version, added new feature to Chip component or added new small chat and others.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Added a new serach bar to Bootstrap Flag docs page
- Added new jQuery v.4.3.1
- Added new Font Awesome v.5.8.2
- Added new feature to Chip component - Autocomplete
- Added new functionality to skins (color on hover for non-collapsible element in side-nav)
- Added a new small chat addon
- Added new class
.md-selected
to select with selected options
What's fixed?
- Fixed z-index problem with label in material-select
- Fixed problem with table editor bug with added button
- Fixed problem with Full Screen Scroller on Apple devices
- Fixed problem with sidenav during scroll
- Fixed jumbotron with a
background image (added these classes:
.card
,.card-image
MDB 4.8.1 - 2019-05-13
What's new?
MDB 4.8.1 was shipped with small improvements like fixed material input server-side validation, social buttons counter and cards extended.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Added a new Bootstrap Flag docs page
- Added the Roboto font to the variable
- Added new Coworking Landing Page to the Templates Pack
What's fixed?
- Fixed material input server-side validation
- Fixed social buttons counter
- Fixed the CSS file of cards extended
- fixed bug with picker.js during bundling webpack
MDB 4.8.0 - 2019-04-29
What's new?
MDB 4.8.0 was shipped with high improvements like update version of jQuery to 3.4.0, added bs-custom-file-input, fixed a few bugs in material-select.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's new?
- Added code about bs-custom-file-input
- Added skins colors to the material select outline version
What's change?
- Updated jQuery version to 3.4.0
- Removed code about 'Improved Default File-Input'
- Change design of date picker
What's fixed?
- Fixed bug in siednav about scrolling on mobile
- Fixed bug in siednav about clicking to input search on mobile
- Fixed bug in material select while focusing material select
- Fixed bug with button text color inside a table
- Fixed masonry layout on mobile devides - a new plugin initialization is required
- Fixed input number on Safari browser
- Fixed input's label animation on Safari browser
- Fixed card footer inside card cascading
- Fixed thumbnail carousel
- Fixed product modal with thumbnail carousel
- Fixed multi item carousel advanced - one item per slide
MDB 4.7.7 - 2019-04-15
What's new?
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Updated MDB Portfolio/Saas Templetes of:
- Updated syntax of HTML
- Updated syntax of SCSS
- Updated JavaScript files
- Updated design
- Removed old code at HTML and SCSS files
What's new?
- Updated perfect scrollbar to the newest version, which means new initialization side-nav code
- Updated Material Select component:
- Added transforming label ( you have to add class
mdb-main-label
to label to work properly ). - Added new possibility to add font awesome icon to select list.
- Fixed bugs with Chrome 73.
- Fixed bugs with text displaying in input.
- Fixed bugs with selected items.
- We added also possibility add to input own ID not to create it randomly.
- We added a possibility to change material input to bootstrap input with the same possibilities.
- Added transforming label ( you have to add class
- Added hidden side-nav & fixed navbar option to navigation layout
- Added new options of treeview component
- Added multi-level menu to mega-menu components
MDB 4.7.6 - 2019-04-01
What's new?
MDB 4.7.6 was shipped with high improvements of Blog/Magazine/Ecommerce/Landing Page and we also fixed small bugs on it, cleared code HTML, improved syntax of HTML and SCSS and updated JavaScript files.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Updated MDB Blog/Magazine/Ecommerce/Landing Page Templates of:
- Updated syntax of HTML
- Updated syntax of SCSS
- Updated JavaScript files
- Updated design
- Removed old code at HTML and SCSS files
What's new?
- Updated to Font Awesome 5.8.1
- Added Bootstrap Treeview component
- Added new Material 2.0 inputs with background and animated border
- Added fix for default Chrome blue background
- Added outline Material Select
- Improved styles for disabled Material Select
- Added navigation composition with slim side-nav
- Added new 2+ Range Slider to addons-pro
- Added Page Rating Componet to addons
- Fixed mutliselect/select on chrome v.73
- Fixed sidenav with bug on second click
MDB 4.7.5 - 2019-03-22
What's new?
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Updated MDB Admin Template with new examples:
- added button with dark theme to Dashboards v.4 - v.6 and Cards
- added new charts examples
- added new forms examples
- added new tables examples
- added new tooltips examples
- added new popovers examples
- added new version of calendar
- Updated JavaScript code in MDB Admin Template - removed old JavaScript files like hammer dependecy, updated chart.js code
- Updated SCSS code in MDB Admin Template - removed unnecessary code, added variables and new style settings
- Updated syntax of HTML in MDB Admin Template - added the newest bootstrap classes, deleted old, unuseful ones
- Improved readability of all pages in MDB Admin Template - added more space, updated comments, fixed layout of HTML tags and classes
What's new?
- Added a dark theme to some of Admin Dashboard pages
- Added new options to SideNav
- Added example with default date picker to DatePicker docs
MDB Autocomplete
Rewritten MDB Autocomplete to similar component like SideNav or Material Select. There is a new class
called mdbAutocomplete
now. Functionality is the same like before.
MDB 4.7.4 - 2019-03-04
What's new?
MDB 4.7.4 was shipped with high improvements like updated Bootstrap to the newest version 4.3.1. Fixed a lot of bugs like bug with autofill, bug with hardcoded colors. Also we re-writed MDB Autocmplete and MDB Table Editor and added new options to them.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Fixed bug with input autofill
- Fixed bug with hardcoded colors of material outline inputs within skins
- Fixed small bugs with multi item carousels (both versions)
- Fixed bugs with the timelines on mobile devices
- Re-write and added new options to MDB Autocomplete
- Re-write MDB Table Editor plugin and added new options and 2 new editors.
What's new?
- Updated the package with the newest 4.3.1 version of Bootstrap
- Added Bootstrap Responsive Font Size settings
- Added perfect scrollbar to the scrolling table
- Added new double navigation layout with sidenav under navbar
- Added new classes to text utilites like:
.word-break
. - Added new border
radius
utilites like:
.rounded-sm
.rounded-lg
- Added new
.modal-dialog-scrollable
modifier class for scrolling content within a modal - Added responsive
.list-group-horizontal
modifier classes for displaying list groups as a horizontal row - Added new examples of validation forms with material select and date-picker
- Added
.stretched-link
utility to make any anchor the size of it’s nearest position: relative parent, perfect for entirely clickable cards!
Update of autocomplete
MDB Autocomplete was shipped with fixed small bugs with multiple autocompletes ( there was problem with inputs and lables) and improvments (you can style now your autocompletes) and re-write to ES6+.
To initiate
Autcomplete you can
use for now camel-case syntax like mdbAutocomplete()
. Old snake_case syntax
mdb_autocomplete()
will be disabled in the nearly future. Check our docs
about autocomplete
Update of table editor
MDB Table Editor was shipped with 2 new types of editor like : Content Editor and Bubble Editor. All
initiate function like mdbRowEditor()
are gone. For now you have to use options to initiate
each editors. To see more what change with MDB Table Editor check our docs.
MDB 4.7.3 - 2019-02-18
What's new?
MDB 4.7.3 was shipped with as a patch to freshly-released 4.7.2. It contains a small fix to Chrome's autofill which caused a huge amount of issues in non-webkit browsers.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Fixed issue with input's autofill
MDB 4.7.2 - 2019-02-18
What's new?
MDB 4.7.2 has landed with medium improvements like updated carousel animation and fixed mega-menu on mobile devices. Also, added new popovers with images, slim side-nav on click and input number.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Fixed vertical steppers to horizontal
- Fixed carousel animation
- Fixed navigations icons at live previews
- Fixed bug with color of text within button
- Fixed bug with scrolling mega-menu on mobile devices
- Fixed bug with an overlapping navbar on a header during smooth scrolling
What's new?
- Added Bootstrap Multiselect
- Added popovers with images
- Added Slim side-nav on click
- Added settings to change breakpoint for button collapse of side-nav
- Added cards package
- Added calendar card and panels card
- Added input number
MDB 4.7.1 - 2019-02-04
What's new?
MDB 4.7.1 has landed with medium improvements like updated inputs to Material 2.0 version, created slim-nav or removed hammer.js dependency from PRO package and fixed a few bugs.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Updated inputs to Material 2.0 version
- Fixed bug with overwriting text color in buttons
- Fixed dropdown in the tabs
- Removed hammer.js dependency from PRO package
- Fixed bugs in enhanced bootstrap modals with display on Safari
- Fixed display FA icons in snippets wth templates examples
- Fixed display active item in Thumbnails Carousel
- Updated FontAwesome to 5.7 version
What's new?
- Created slim side-nav
- Added new Bootstrap Masonry page to the documentation
- Created helper class for opacity
- Added new double intro to the intros section
- Added Useful Resources to MDB Free Package
MDB 4.7.0 - 2019-01-21
What's new?
MDB 4.7.0 has landed with medium improvements of MDB Editor, material select and new components and styles like new double navigation layout, card with map. Also we updated Bootstrap to the newest version.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Removed unnecessary margin from material select
- Removed old default switch and added new Bootstrap one
- Update MDB Editor plugin - rewrite it to ES6 and added possibility of having more than 6 custom columns
- Fixed bug in SASS Template on IE 11
- Changed the classes in testimonials carousel from
.carousel-item-prev
,.carousel-item-next
to.carousel-control-prev
,.carousel-control-next
(like in the newest Bootstrap)
What's new?
- New layout of double navigation - navbar overlap a side-nav
- New card with google map
- New Bootstrap Advertisement section
- New Bootstrap overflow documentation page
- New border utility
.border-pill
Updated Bootstrap files to the 4.2.1 version
- New: Added a new spinner loading component.
- New: Added new toast component for displaying notifications.
- New: Added a new iOS style switch (a modifier class to our custom checkboxes).
- New: Added touch support in our carousel component.
- New: Added
.font-weight-lighter
and.font-weight-bolder
utilities. - New: Added
.text-decoration-none
utility class. - New: Added
.modal-xl
modifier class for our modals. - New: Added new negative margin utility classes (e.g.,
.mb-n3
). These rad new classes not only allow you more control over your general spacing needs, but also allow you to create responsive grid gutters at each breakpoint. - New: Validated form fields now have feedback icons on
:invalid
and:valid
fields. Disable them with the$enable-validation-icons
boolean Sass variable (defaults totrue
). - New: Tooltips/Popovers work with Shadow DOM.
- Updated: Redesigned the custom checkboxes and radios for more obvious states.
- Updated: Changed auto columns (e.g.,
.col-auto
) frommax-width: none
tomax-width: 100%
to prevent content from causing a column to overflow the parent. - Updated: Improved rendering of custom selects, ranges, file input, and more.
MDB 4.6.1 - 2019-01-04
What's new?
MDB 4.6.1 has landed with small improvements like updated Font Awesome to latest version (5.6.3), added 1 new icon to icons list and fixed a few bugs.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
Fixed bugs at MDB Admin Template Pro such as:
- Fixed forms basic
- Alfapethic sorted the list of components in SiedNav
- Fixed diamond icons in modals
- Fixed headers
- Fixed icons at subscribtion/contact modals
- Fixed icons at sections
Changed CSS/JavaScript name of plugins files to kebab case:
MDB 4.6.0
Migration to Font Awesome 5 - change of the icon syntax
In this release we have migrated to the newest version of Font Awesome. It rings a lot of new features and hundreds of new icons. Hoverer, MDB 4.6.0. requires a migration, because the syntax of the icons has changed and it's not compatible with the previous version.
What's new?
- Over 800 new icons - at your disposal is now 1479 beautiful icons!
- New, advanced icon search
- New categories of icons
- New icon syntax
Note: If you want to start a new project with MDB 4.6.0 - you don't have to do anything about new syntax. Just browse new icons and use them.
Note 2: If you want to update an existing project to MDB 4.6.0 - you have to update syntax of the icons. If you need additional help with the migration read this tutorial.
All the documentation have been updated to MDB 4.6.0 and Font Awesome 5.
Here you can find Legacy Documentation for MDB 4.5.16.
MDB 4.5.16 - 2018-12-10
What's new?
MDB 4.5.16 has landed with medium improvements like new lists with icons, default file input, 'clear' button in time-picker, new version of multiple items carousel, new chips icons in snippets or new material tooltips and more. We also fixed a lot of bugs.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's fixed?
- Fixed warning color variable - change value for proper one.
- Fixed link in a table - removed unneccessary right margin.
- Fixed link variable - added settings for color of link on hover.
What's added?
- Added new button in Time Picker component to allow you to clear your choosed time data.
- Added new material tooltips.
- Improved default file-input - you can see which file you are picking now.
- Added lists with icons.
- Added new version of multiple items carousel.
- Added bootstrap avatar options in snippets.
- Added new colorful chips within cards options in snippets.
- Added new chips with icons in snippets.
- Added new color options for waves effect in snippets.
MDB 4.5.15
What's new?
MDB 4.5.15 has landed with small improvements like fixed bugs with textarea and buttons and two new cards.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's fixed?
- Fixed bug with DataTable and select in Admin Pro Template
- Added dynamic sortable icons to DataTable
- Updated stepper.js with more clear code
- Fixed the
.active
class for label in textarea - Fixed bugs with
.fa-lg
, etc. classes within floating buttons - Fixed button tags
What's new?
- New calendar card
- New weather card
MDB 4.5.14 - 2018-11-12
What's new?
MDB 4.5.14 has landed with medium improvements like fixed a lot of bugs, new version of Chartjs or change
design in index.html
at MDB PRO/FREE.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's fixed?
- Fixed select with attributes select and disabled.
- Fixed disabled material radio button.
- Fixed arrow in timeline imges.
- Fixed blinking streak during scrolling the page.
- Fixed .active class in material dropdown.
- Fixed bug with missing top border in responsive bordered table.
- Fixed bug with leaping border in classic tabs.
What's changed?
- New version of
Chart.js - 2.7.3
. - New exmaples of charts like: Bubble Chart and Scatter Chart.
- New 'welome page' in
index.html
at MDB PRO/FREE file. - We finished updated documentation.
- We extened documentation about Charts with explanation of legends, animations and more.
- We stopped minify bootstrap.css file with gulp and we included exactly the same minimalized file what have Bootstrap.
- Removed deprecated code of old timeline from
_depriceded.scss
in scss/pro.
Added new clases like:
md-disabled
- when you are using disabled material radio button you have to add this class to see disabled color. You can check here.md-dropdown
- when you are using select with attributes select and disabled at the same time you have to add this class to have transparent background. You can check here.
MDB 4.5.13
What's new?
MDB 4.5.13 has landed with huge improvements of sticky component, grid usage and fixed bugs.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Fixed problems with adding shadow classes to cards
- Fixed 'undefined' bug in Bar Chart in Admin Dashboard Free Template
- Moved Extended Cards, Timeline styles to the 'addons' catalog in the package
Changed syntax
- Timeline - added one new class
.timeline-basic
and added.timeline
class to each version of timeline
With this update, we've also rewritten another of our components. Re-factored Sticky.js was rewritten from the scratch and it's fully compatible with previous versions of MDB.
- Sticky.js was rewritten from the scratch. As of MDB 4.5.13, we use our own plugin instead of 3rd party plugin from Andrew Henderson
- Made the code of Sticky plugin cleaner and improved its readability
- Improved usage with Bootstrap grid. While the old plugin had some issues with Bootstrap's grid, a new version of Sticky works well with Bootstrap's flexbox-based grid.
Added two new functions:
minWidth
allows specifying the minimal width of the viewport to take effect of StickystartScrolling
lets to decide on which moment the Sticky will take effect. This can be set totop
(default) orbottom
Deprecated - these settings will be stored only by one version yet
- Previous syntax of timeline
MDB 4.5.12 - 2018-10-08
What's new?
MDB 4.5.12 has landed with a huge improvements like new steppers, new dropdown with search and fixed bugs.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Fixed displaying of 'Cards with panel' on small devices.
- Fixed displaying of css code in breadcrumbs documentation.
- Fixed JavaScirpt code about colors in the Line charts and Radar Chart
- Fixed bugs with not working "back-to-top" button.
- Changed syntax in the Rotating Card and in the Jumbotron - additional examples.
What's new?
Added new dropdown with search field.
Added new dynamic steppers . With this new components coming new amenities and changes like:
- Stepper "Horizontal steppers" is available in MDB Free.
- Stepper "Vertical steppers" is available in MDB Free.
- Timelines code css are in MDB Pro package now.
- Stepper "Registration form with steps" is removed from MDB Pro and will be removed from MDB in future
releases.
Also "Registration form with steps" is available on our snippets. - Stepper "Vertical registration form steps" is removed from MDB Pro and will be removed from MDB in
future releases.
Also "Vertical registration form steps" is available on our snippets. - Stepper "Steps within form" is removed from MDB Pro and will be removed from MDB in
future releases.
Also "Steps within form" is available on our snippets.
MDB Lite
With 4.5.12, we'd like to introduce MDB Lite. MDB Lite, it's a lean version of MDB where the less-important modules were separated. By removing these modules we've reduced the size of our CSS and JS files. Our MDB Pro and MDB Free packages now include two versions of MDB: Standard and Lite. Packages that were removed from MDB Lite still can be used by attaching an appropriate file from "modules" directory.
From now on you can either still use MDB in the same way as before - by loading mdb.css / mdb.js:
Example:
<!-- MDB JavaScript -->
<link href="css/mdb.min.css" rel="stylesheet">
<!-- MDB Modules (optional) -->
<script type="text/javascript" src="js/mdb.min.js"></script>
Or load only a core modules by loading mdb.lite.css / mdb.lite.js, and add modules you need:
Example:
<!-- Material Design Bootstrap Lite -->
<link href="css/mdb.lite.min.css" rel="stylesheet">
<!-- MDB Modules (optional) -->
<link href="css/modules/accordion-extended.min.css" rel="stylesheet">
<link href="css/modules/animations-extended.min.css" rel="stylesheet">
<link href="css/modules/cards-extended.min.css" rel="stylesheet">
<link href="css/modules/charts.min.css" rel="stylesheet">
<link href="css/modules/lightbox.min.css" rel="stylesheet">
<link href="css/modules/megamenu.min.css" rel="stylesheet">
<link href="css/modules/parallax.min.css" rel="stylesheet">
<!-- MDB JavaScript light -->
<script type="text/javascript" src="js/mdb.lite.min.js"></script>
<!-- MDB Modules (optional) -->
<script type="text/javascript" src="js/modules/chart.js"></script>
<script type="text/javascript" src="js/modules/chips.js"></script>
<script type="text/javascript" src="js/modules/jarallax.js"></script>
<script type="text/javascript" src="js/modules/jarallax-video.js"></script>
<script type="text/javascript" src="js/modules/jquery.easypiechart.js"></script>
<script type="text/javascript" src="js/modules/lightbox.js"></script>
<script type="text/javascript" src="js/modules/picker.js"></script>
<script type="text/javascript" src="js/modules/picker-date.js"></script>
<script type="text/javascript" src="js/modules/picker-time.js"></script>
MDB 4.5.11 - 2018-09-24
What's new?
MDB 4.5.11 has landed with a few small improvements, two updates and new styles for carousel and gradients.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Updated popper.js to the newest version - 1.14.4
- Updated jarallax.js to the newest version - 1.10.4
- Created new carousel - Carousel with lightbox
- Fixed bug with YouTube video in SAAS Template - home-video page
- Fixed problems with not centered tooltips
- Fixed problems with color of search input within skins
- Moved colors loops from the
_colors.scss
file to the_global.scss
file - Added new free gradients
Changed syntax
-
Text color replaced
.default-text
,.primary-text
,.secondary-text
,.success-text
,.danger-text
,.warning-text
,.info-text
classes with Bootstrap ones:.text-default
,.text-primary
,.text-secondary
,.text-success
,.text-danger
,.text-warning
,.text-info
Deprecated - these settings will be stored only by one version yet
-
.default-text
,.primary-text
,.secondary-text
,.success-text
,.danger-text
,.warning-text
,.info-text
classes
We removed these classes from the package as we wrote in previous changelogs:
.full-bg-img
.full-height
.side-nav .double-navbar .bc-min
.no-padding
.ql-modal, .product-panel
.no-radius
.section-blog-fw
.personal-sm
.classic-tabs (previous syntax not classic tabs at all)
.naked-card
.pricing-card .heading .card-overlay
MDB 4.5.10
What's new?
MDB 4.5.10 has landed with medium improvements and new components - like new cards, animations and also fixed a lot of bugs.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Added new cards: presenting combination of colors
- Added new class
.darker-striped
to _pricing.scss - Align height of our inputs - standard one, select, file input, time picker, date picker
- Fixed bug with not loading files names in file input
- Fixed bug with links in a list inside fixed action button
- Fixed animation card
- Fixed accordion gradient background
- Fixed color of text in light badge
- Fixed bug with shadow in simple and images timeline
- Fixed bug with animation filed-in in checkboxes
- Fixed bug with bootstrap slider depend value on MDB slider
- Updated animations to the newest version. New classes have been added, such as:
.slow
,.slower
,.fast
,.faster
,.delay-1s
,.delay-2s
,.delay-3s
,.delay-4s
,.delay-5s
and the new animation.heartBeat
- Deleted unnecessary code in DataTable HTML
- Changed display of table on mobile and tablet devices in Ecommerce Template Pro
Changed syntax
- Select - added
.md-form
class to the<select>
tag
Also few bugs in Material Select has been fixed:
- Changing properties of
<options>
was crashing the browser. The problem was withMutationObserver
which weren't disconnected before re-rendering the select and they were multiplicating exponentially on each select change - The "Toggle all" option in the multiselect was setting wrong values and submitting a form wasn't working as expected
- If the Material Select was marked as
[required]
in the form, each change was resulting in duplicating the styles of the native<select>
element
MDB 4.5.9
What's new?
MDB 4.5.9 has landed with big improvements and new components - completely rewritten material select and fixed its bugs, updated Bootstrap to the newest version, fixed some small bugs in mdb package and updated documentation.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Added new cards: promoting-card, weather-card, gradient-card, booking-card, chart-card
- Splited premium
.accordion
and.cards
SCSS files to basic and extended ones - Added new class
.bs-switch
and new free switch styles withinfree/_switch.scss
file - Fixed an img path variable which means fixed masks and lightbox arrows
- Removed
@extend .white-text
from placeholder mixin in_sidenav.scss
file - Added new premium
.collapse-content
class within_msc.scss
file - Added
.z-depth-1
class to the.chip
class - Added 6 new accordion styles to the package within
_accordion-extended.scss
file - Added new
.mml-1
class for left margin to_helpers.scss
file - Fixed full height modal - added
min-height
settings
Changed syntax
- Accordion - changed premium class
.accordion
to.md-accordion
- Tabs - changed premium class
.nav-tabs
do.md-tabs
- Progress - changed premium class
.progress
to.md-progress
- Range - wrapped all range
styles within
.range-field
class - Megamenu - removed class
.news-title-2
and created new_megamenu.scss
file with premium styles
Updated Bootstrap files to the 4.1.3 version
- Pay attention to the change to
.form-control
s which adds a new fixedheight
. - Fixed: Moved the browserslist config from our
package.json
to a separate file to avoid unintended inherited browser settings across npm projects. - Fixed: Removed the
:not(:root)
selector from oursvg
Reboot styles, resolving an issue that caused all inline SVGs ignorevertical-align
styles via single class due to higher specificity. - Fixed: Buttons in custom file inputs are once again clickable when focused.
- Improved: Bootstrap’s plugins can now be imported separately in any contexts because they are now UMD ready.
- Improved:
.form-control
s now have a fixedheight
to compensate for differences in computed height across differenttype
s. This also fixes some IE alignment issues. - Improved: Added
Noto Color Emoji
to our system font stack for better rendering in Linux OSes.
Big update of material select
- It has been rewritten from scratch. The code is far more cleaner and straight. Similar to the
SideNav
component, there is a class calledMaterialSelect
thanks to which the whole code is more simple and easier to customize if needed. - When you set the value of the material select, the native
change
event is emitted which allows you to capture it either byjQuery.on()
orElement.addEventListener()
. The change is that previously the event was triggered byjQuery.trigger()
method and this is why the native event wasn't emitted and it was impossible to detect achange
in VanillaJS. Currently, theKeyboardEvent
is dispatched on the native select element and it is fully possible to capture it using mentioned methods. - Each change in
<option>
's attributes or subtree of the native select is observed and when detected, the material select is re-rendered so there is no need of doing it manually anymore. We useMutationObserver
to observe all the changes made toattributes
,childList
,characterData
orsubtree
and when the change qualifies for refresh- it happens, so the view is always updated. Also, since value cannot be observed, the prototype of thejQuery.val()
method has been extended so setting a value manually also will re-render the select. - If the select is marked as
[required]
and put into<form>
, the browser will validate it when the form is submitted- when no value is selected, the submission will be stopped. It was impossible previously because the native select hasdisplay:none;
property meaning it was non-focusable for the browser and as such, it wasn't validated. Now, when the native select is marked as required it is "squeezed" so that it is still invisible for the user and also cannot be activated using tab key but hasdisplay:inline
property so the browser can validate it. - Keyboard support is now working as expected. You can switch to the material select using tab key, you can select options using arrow keys and confirm the selection using Enter. Also, you can search an option in regular select using letter keys (the first matching option will be selected).
- There is also two new attributes which are supported:
data-stop-refresh
- controls auto refresh of the material select. As auto refreshing of the material select is a big change in the way you work with it, we introduced the way to stop new behaviour. If you don't want it to be refreshed on each change as described above, you can adddata-stop-refresh="true"
to the select or calljQuery.data('stop-refresh', true);
. The first way stops the select from refreshing for the whole page load time. The second option allows you to control auto refreshing on demand (meaning, you can disable it and enable during script execution). Default is set tofalse
.data-inherit-tabindex
- controls copying thetabindex
attribute from the native select. While most of the time, you will want to copy the attribute to the material select, there may be cases when such behavior is not wanted (an example case is described above when we're talking about validation). If you don't want it to be copied to the material select, you can adddata-inherit-tabindex="false"
to the select or calljQuery.data('inherit-tabindex', false);
. The first way stops copying the attribute for the whole page load time. The second options allows you to control copying it on demand (meaning, you can disable it and enable during script execution). Default is set totrue
.
- The "Toggle all" option has been added to the mutliselect.
- When you select more that 4 options in the multiselect, the "X options selected" is shown instead of all selected options.
- Known bugs has been fixed:
- The select with a lot of options does not close when clicked in the scrollbar and does not stay opened when an option is selected
- Multiselect with
optgroups
is displaying checkboxes correctly and correct options are selected - Pre-selected options are also selected after material select rendering and have
active
class - When an option has long description it does not overflow on the caret
- When you hold the mousedown for a while, the dropdown does not close
- When the material select is opened, its width is responsive and changes along with the resolution
- The select with icons has been fixed
Depreciated
- Components Material Select and Chips use right now camelCase syntax. Old syntax still works, but it will be removed in the third releases.
MDB 4.5.8
What's new?
MDB 4.5.8 has landed with small improvements
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
What's changed?
- Brought back checkboxes to Material Select multiple
- Decreased transition time on Material Select
- Fixed Multiple Select's closing issues on iOS
- Fixed npm free installation issues
MDB 4.5.7 - 2018-07-16
What's new?
MDB 4.5.7 brings huge quality improvements of MDBootstrap JavaScript code.
Another important change is the integration with powerful Datatables.
We have also created a few new generators - table, buttons and modals.
See the details below. All the changes are backward compatible.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
1. What's changed?
- Rewritten modules to ES6 using best practices
- Took care of code readability
- Removed VelocityJS as a dependency from Buttons.js and Cards.js
2. Improved
- Added
aria-busy
to preloading script - Updated VelocityJS
- Replaced unnecessary comments with more descriptive names
3. Fixed
- Linter validation errors
4. Changed syntax
-
material_chip
was renamed tomaterialChip
5. Tables
- Improved documentation of basic tables
- New tables examples & customization options
- New options of responsive tables
- Datatables integration
- Datatables tutorial
- Fully functional table pagination
- Fully functional table search
- Fully functional table sorting
- New options of table scroll
6. Generators
MDB 4.5.6 - 2018-07-03
What's new?
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
1. Changed syntax
- Magazine section version 3 (little changes in the texts)
- Team section version 3
- Social section versions 2 and 5 (fixed flat button and paragraph)
- Contact form
- Intros (only CSS code)
2. Main fixes
- Fixed alignment in the blockquotes
- Fixed inputs with success and error labels
- Fixed bug with date-picker inside tabs
- Fixed bug with z-index in classic tabs
- Fixed navbar color in the intros
3. New components and styles
- Updated Bootstrap to 4.1.1 version and added missed mixins
- Upadated CSS and Javascript code of Waves
- Added new color of line chart in Admin Dashboard
- Added custom Bootstrap form validation
- Added indeterminate checkbox
MDB 4.5.5 - 2018-06-18
What's new?
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
2. Main fixes
- Fixed issues with autocomplete within navbar
- Fixed shaking of parallax on Firefox browser
- Fixed issues with cursor on hover in file input
- Fixed bugs with open modals and inputs
3. New components and styles
- Possibility of adding YouTube movies to the parallax effect
- Added a lot of new options to the parallax effect
- Added new version of navbar with centered logo
MDB 4.5.4 - 2018-06-05
What's new?
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
1. Changed syntax
- Cascading cards
- Classic tabs
- Ecommerce components
- Product sections
- Blog components
- Blog section v.4
- Table with panel
2. Main fixes
- Fixed appearance of Bootstrap custom forms in MDB package
- Fixed appearance of carousel with thumbnails on mobile devices
- Added hover effects and waves to the chips
- Fixed nesting ordinary cards inside cascading cards
- Added possibility of adding a mask and a picture to the sidenav without the skin
- Fixed material menu styles in
.dropup
,.dropleft
,.dropright
variations
3. New components and styles
- Added new blog components
- Added outline buttons to the skin styles
- Added new checkout panel
- Added one line with a mask to the sidenav
4. Deprecated - these settings will be stored only by one version yet
.personal-sm
class.comments-list
,.reply-form
classes in blog components.classic-tabs
class in this lineul class="nav classic-tabs tabs-cyan" role="tablist"
, now.classic-tabs
class is a wrapper for tabs
MDB 4.5.3 - 2018-05-21
What's new?
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
1. Changed syntax
2. Main fixes
- Updated our packages to jQuery 3.3.1 version
- Added possibility to have both versions of input group - Bootstrap or MDB one
- Fixed issues with search input and input group within navbar
- Fixed issues in modal with tabs within MDB Free version
- Added new animation - Jack In The Box (you can find it within "attention seekers" select, Jack In The Box is the last one animation in this select)
- Fixed issues with rounded corners of card within classic tabs
MDB 4.5.2
What's new?
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
1. Changed syntax
- Navbar (only inputs within navbar)
- Carousel (only cards in multi-item carousel)
- Blog sections
- Magazine sections
- Project sections
- E-commerce sections
- Contact sections
- Feature sections
- Social sections
- Team sections
- Testimonial sections
2. Main fixes
Integration with Bootstrap 4.1.0 version
- Added new
.w-responsive
class which adds margins to the section description - Errors in compiling Bootstrap and MDB colors variables solved
- Added
margin-bottom
to the.md-form
class - Added
_custom-variables.scss
and_custom-skin.scss
files - Described in the documentation how to add custom skin
- Added a list of things which change under the influence of skins
- Bug with video within modal fixed
- Example code of
.table-responsive
in the documentation fixed - Added possibility to change
box-shadow
of.card
- Bug with border radius within pricing cards fixed
3. New and deprecated classes (Bootstrap ones)
- Added new
.carousel-fade
modifier to switch carousel from horizontal sliding to crossfade. - Added new
.dropdown-item-text
for plaintext dropdown items. - Added new
.flex-fill
,.flex-grow-*
, and.flex-shrink-*
utilities. - Added new
.table-borderless
variant for tables. - Added new
.text-monospace
utility. - Added new
.text-body
(default body color),.text-black-50
(50% opacity black), and.text-white-50
(50% opacity white) utilities. - Deprecated
.text-hide
—you’ll see a warning during compilation—as it’s a dated and undocumented feature.
4. Deprecated - these settings will be stored only by one version yet
.heading
,.card-overlay
,.naked-card
classes within.pricing-card
class.no-radius
class.section-blog-fw
class
MDB 4.5.1 - 2018-04-17
What's new?
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
1. Changed syntax
2. Main fixes
- Added the class
.card-img-top
to theimg
tag within.card
class, which set border-radius and width - Bug 'magp-get' fixed
- Added '!default' flag to all our variables and objects
- Removed function from make-button and make-badge mixins
- Removed min-height and background settings from
.jarallax
class - Saved all our material colors as variables
- An image path in variables and masks files fixed
- Added material color versions of
.bg-*
classes - Horizontal steppers on small screens fixed
- Improved overwriting button icons with
.fa-2x .fa-3x
etc. - Neccessary to use e.g.
.text-secondary
with.card-text
class to change color - Added
.card-header-title
class (which add font-weight: 500) within.gradient-card-header
class - Added margins to help text for inputs with prefix (to the
.form-text
class) - Added
.form-header
class to the forms - Removed
.no-padding
class from ecommerce components - Added
figcaption
to the pictures in the lightbox - Removed unnecessary settings from
.avatar
class - Restored
.waves-effect
to the.nav-tabs
- Possibility of adding custom skin
3. Deprecated - these settings will be stored only by one version yet
.full-bg-img
class.full-height
class.double-navbar .bc-min
classes (Button Collapse Without Navbar).ql-modal
and.product-panel
classes.no-padding
class- Settings for
.parallax
class BUT ONLY IN SCSS files. This class still exists for javascript settings. If you need the scss settings, please, uncomment the class in deprecated.scss file and recompile it.
MDB 4.5.0
Note: Clear your browser cache to provide a proper functioning for updated mdbootstrap.com
Warning: Read carefully before update
MDB 4.5.0 can cause incompatibility with the previous versions.
We have refactored most of the components for better performance, design, and functionality. Now they are lighter and faster.
However, this implies some change in syntax, therefore some of components are not backward compatible
Below you can find a list of components with changed syntax. Read it carefully before updating your project to MDB 4.5.0
MDB Pro package
If you use MDB Pro package - this time within your package you will find 2 packages: MDB 4.5.0 (newest version) and MDB 4.4.5 (previous version).
For the new projects, we recommend using newest version 4.5.0.
If you want to use newest version 4.5.0 in existing projects - it will require a migration. If you don't want to do it - use MDB 4.4.5.
Legacy docs for MDB 4.4.5
Here you can find a legacy documentation for MDB 4.4.5
Main goal of MDB 4.5.0 release and future plans
Main goal of this release was to rewrite and improve our SASS code. We'll continue to work on our sass to provide maximum flexibility and customizability. Our goal is to allow you to use almost every component and functionalities separately and create your own package strict adjusted to your needs.
Goals for the next releases stay similar - to make MDB lighter, faster, easier and more flexible.
What's new?
1. Changed syntax
2. Main fixes
- Range input bugs fixed
- Material select z-index bug fixed
- Checkbox & radio buttons
.active
class bug fixed - Waves effect bugs fixed
- Multiselect bugs fixed
- Updated charts
- Fixed bug "Uncaught TypeError: Cannot read property 'top' of undefined"
- Dotted scrollspy bug fixed
- Time picker bug fixed
- Sort table bugs fixed
- Modals bugs fixed
- Preloaders bugs fixed
- Social buttons bugs fixed
- Collapse bugs fixed
- Gulp package bugs fixed
3. Updated & improved
- Animations
- Colors
- Gradient
- Hover Effects
- Masks
- Parallax
- Shadows
- Skins
- E-mail Templates
- Background Image
- Text Color
- Code
- Figures
- Icons Usage
- Icons List
- Images
- Tables
- Table Responsive
- Table Sort
- Table Search
- Table Scroll
- Table Pagination
- Table Editable
- Typography
- Card Layout
- Equal Height Columns
- Grid Examples
- Grid Usage
- Layout Overview
- Media Object
- Navigation
- Utilities for Layout
- Media Queries
- Borders
- Clearfix
- Close Icon
- Display
- Embeds
- Float
- Flexbox
- Image Replacement
- Position
- Screenreaders
- Sizing
- Spacing
- Text
- Vertical Align
- Visibility
- Blog components
- Breadcrumb
- Buttons
- Button Group
- Button Icon
- Cards
- Card Animation
- Checkbox
- Contact Form
- Dropdowns
- Edge Header
- E-commerce Components
- File Input
- Flipping Cards
- Footer
- Footers
- Forms
- Hamburger Menu
- IFrame
- Inputs
- Input Group
- Jumbotron
- List Group
- Mega menu
- Navbar
- Navs
- Pagination
- Panels
- Pills
- Progress Bar
- Radio Button
- Search
- Social Buttons
- Slider
- Steps (stepper)
- Streak
- Switch
- Tabs and Pills
- Textarea
- Timeline
- Video
- Notifications
- Chat
- Autocomplete
- Accordion
- Alerts
- Carousel
- Charts
- Collapse
- Date Picker
- Gallery
- Google Map
- LightBox
- Material Select
- Mobile
- Modals Core Docs
- Modal Events
- Modal Form
- Modal Styles
- Modal Templates & Examples
- Multiselect
- Popovers
- ScrollSpy
- SideNav
- SmoothScroll and ScrollBar
- StickyContent
- Time Picker
- Tooltips
- Waves Effect
4. Deprecated
- Input alternate
-
.font-bold
,fold-light
,fold-up
- Instead of this we use standard bootstrap text utilities
MDB 4.4.5
What's new?
MDB 4.4.5 comes up with integration with Bootstrap 4.0.0 (stable version) and some improvements
It's fully compatible with the previous version and guarantees no breaking changes
Read detailed info about Bootstrap 4.0.0 (Stable Version)
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
-
Integration with Bootstrap 4.0.0 (stable version)
Major changes:
-
Added responsive .order-0 and .order-last classes
-
Added gulp file
What's new:
-
.input-group-addon
was renamed to.input-group-text
-
Improved design performance for buttons
What's changed
MDB 4.4.4
What's new?
With this small update we've made MDBootstrap even more stable
In MDB 4.4.4 you can notice integration with the latest version of Bootstrap and some various fixes
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
-
Integration with Bootstrap 4 beta-3
-
Removed unnecessary outline from buttons
-
Fixed search in material select
-
Update popper.js to the latest version
-
Improved scrolling navbar
-
Improved buttons
-
Fixed positioning in alerts
What we've changed:
MDB 4.4.3
What's new?
Just a small update with various bug fixes
MDB 4.4.3 comes with the integration of the newest Bootstrap and with few fixes and improvements.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
-
Changed sideNav construction
-
Fixed waves effect in buttons
What we've changed:
MDB 4.4.2
What's new?
Recently, Bootstrap 4 beta 2 has been released.
MDB 4.4.2 comes with the integration of the newest Bootstrap and with few fixes and improvements.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
-
Integration with Bootstrap 4 beta-2
-
Fixed Scrolling Navbar (MDB Free)
-
Improved buttons
-
Updated Autocomplete component
-
Fixed fade effect in Carousel
-
Removed default background color from footer
-
Fixed select in Date Picker
-
Fixed dropdown alignment
-
Fixed SideNav in White Skin
-
Fixed nested tabs
-
Improved wow effect on Internet Explorer/Edge
-
Improved SideNav on Internet Explorer/Edge
-
Dropped support for Bower
What we've changed:
-
Restored `.offset-*` classes
-
Switched Breadcrumbs from `float` to Flexbox
-
Dropped support for Bower
What's new in Bootstrap 4 beta-2:
MDB 4.4.1 stable version
What's new?
MDB 4.4.1 brings one major change - integration with freshly released Bootstra 4 beta.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Note 1: If you already use MDB 4.4 beta, there are no breaking changes for you. You can update your project to 4.4.1 without fear of conflict. Backward compatibility is provided.
Note 2: If you use version MDB 4.3.2 or lower - read carefully the detailed list of changes in MDB 4.4 release note. These changes apply to MDB 4.4 and Bootstrap 4 beta as well.
MDB 4.4 Beta version
What's new?
That's the most significant update in the history of MDBootstrap. Together with the newest Bootstrap, we introduce you a brand new, completely rewritten MDB.
We took a lot of effort to provide a backward compatibility with the previous versions. Nonetheless, some syntax changes are inevitable (mostly caused by Bootstrap changes).
We've prepared a detailed list of syntax changes. The process of migration won't be painful, don't worry. However, we recommend you to read carefully a detailed list of changes. You can find it below.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Note 1: For MDB 4.4 beta we use an experimental version of Bootstrap 4 beta, not published yet. You can find a documentation for this Bootstrap version here.
Note 2: If you wish you can still download a stable version of MDB Free 4.3.2 here. Legacy documentation for MDB 4.3.2 is available here.
Note 3: If you are MDB Pro User and you whish to download MDB Pro 4.3.2 version write us on email: contact@mdbootstrap.com .
Note 4: To provide a proper rendering of our website we recommend to clear the browser cache.
-
BrandFlow - powerful and free marketing automation and analytics software for Bootstrap projects
-
Completely rewritten, with the highest standards, SASS code
-
Updated and improved JS plugins
-
Unified and simplified syntax
-
Updated jQuery to 3.2.1
-
Customization made easier
-
Improved design
-
Replaced Tether.js with Popper.js
-
Dropped wow.js for our custom library (no syntax changes and fully backward compatibility)
-
New, improved and extended documentation
-
New tutorials updated to MDB 4.4 and Bootstrap Beta
Most important changes (backward compatibility provided):
-
Removed unused variables and classes
-
New, better parallax
-
Updated colors
-
Changed sidenav breakpoint from 910px to 992px
-
Added _custom.scss file for easier sass customization
-
Added new contact forms
-
Added new progress bars
-
Added reset buttons for inputs
-
Introduced gradients
-
Dropped _prefixes.scss for autoprefixer
-
Dropped Normalize.css for Reboot.css (which is actually built upon Normalize.css)
-
Added new cards
-
Improved existing cards
-
Improved enhanced bootstrap modals
-
Improved pricings sections
-
Recreated intros
-
Improved dotted scrollspy
-
Improved sidenav
-
Added new versions of streaks
-
Improved accordion
-
Social list moved to deprecated
-
Improved overlay cards
-
Improved charts
-
Improved charts
Other changes (backward compatibility provided) :
-
.navbar-expand
instead of.navbar-toggleable
-
Removed offset classes, so you should replace offset-*-* class with ml-*-auto. Read more in the new Grid Documentation
-
Changed values of spacing utilities
-
.card-body
instead of.card-block
-
Removed nearly all
.hidden-*
classes in favor of our newer.d-*
display utilities -
Renamed
.navbard-dark
to.navbar-dark
-
.btn-sm
and.btn-lg instead
of.btn-small
and.btn-large
for.btn-floating
-
Droped cascading jumbotron for
cascading card reverse
for sake of syntax simplification and unification. -
Renamed .btn-mdb to .btn-mdb-color for better naming scheme
Changes that can cause issues to project built with previous versions of MDB:
-
MDB Angular Admin Dashboard
-
MDB React
-
MDB Vue
Coming soon:
Beta Disclaimer
It is up to you to take precaution against damages resulting from this beta software. Software in beta testing should for example not be used on sensitive and/or valuable data. The usage of beta software is at your own risk and may void the warranty on your products. If you are not an experienced user, or otherwise in any doubt of your capabilities to make such a decision, please user our stable release MDB 4.3.2. In no event the software provider shall be liable to you for any damages, including damages arising out of the use or inability to use the beta software.
MDB 4.3.2
What's new?
MDB 4.3.2 brings 2 huge improvements - Enhanced Bootstrap Modals plugin and BrandFlow Software
EBM (Enhanced Bootstrap Modals) is a powerful plugin which extends functionality and features of the standard Bootstrap plugin.
Static UI elements aren't enough in modern web development. Enhanced Bootstrap Modals lets you create a dynamic and reactive environment similarly to the websites and apps of the biggest companies.
It can enhance UI of your projects and let you create Automated Rule and Scoring system, Related Content system, Shopping Carts Recovery system and much more.
Read more about Enhanced Bootstrap Modals
Note: Enhanced Bootstrap Modals are part of both MDB Free and MBD Pro.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Note 2: MDB 4.3.2 is fully compatible with MDB 4.3.1 and you can update it without fear of any conflict.
BrandFlow is a free tool which will automate your Bootstrap project and help you manage your modals.
Read more about BrandFlow
What else?:
MDB 4.3.1
What's new?
MDBootstrap 4.3.1 is just a small update with many bugs fixes.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Fixed:
- Dropdowns & dropdowns animations
- Horizontal steppers bug
- Navbar items padding
- Split buttons
- Hamburger fix for Firefox
Read our Flexbox tutorial.
MDB 4.3.0
What's new?
MDBootstrap 4.3.0 is here! It is one of the biggest updates of Material Design for Bootstrap.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Most important: Integration with Bootstrap 4 alpha-6 and Flexbox
Fixed:
- Navbars
- Removed gradients for IE
- Accordion
- Product Cards
- Tabs
Improved:
- Smooth Scroll
- Free and pro templates
- Coding performance
- Text inputs
- Carousel
- Design performance
- Dropped IE9 Support
- Forms
- Flexbox grid
- Progress bars
New components:
Syntax changes:
- Dropped
-xs
infix -
.tag
renamed to.badge
-
.collapse.show
instead of.collapse.in
-
.show > .dropdown-menu
instead of.open > .dropdown-menu
MDB 4.2.0
What's new?
MDBootstrap 4.2.0 has arrived two months after MDB 4.1.1 with new components, major improvements, and bugs fixes.
You can download the new version of MDB Free on our website and for MDB Pro from your account page.
Most important: Integration with Bootstrap 4 alpha-5 and jQuery 3.1.1
Fixed:
- Blinking cursor within Material Select on iOS
- Added width to group list
Improved:
- Lightbox
- Skins
- Sidenav
- Free and pro templates
- Buttons
- Code performance
- Shadows
- Font styles
New components:
- Steppers
- Dotted scrollspy
- Classic tabs
- Streaks
- Stack Overflow button
- Edge Headers
- New gallery
- Vertical-align utilities with
.align-top
,.align-middle
, and more - New skins: pink, light gray
Syntax changes:
-
.btn-outline-*
instead of.btn-*-outline
- Simpler margin and padding syntax (e.g.
.mx-auto
instead ofm-x-auto
) -
.rounded
and.rounded-circle
instead of.img-rounded
and.img-circle
-
.float-*-*
instead of.pull-*-*
MDB 4.1.1
What's new?
It's small but important update which integrates MDB with the latest version of Bootstrap 4.
You can download the new version of MDB Free on our HomePage and for MDB Pro from your account page.
Most important: Integration with Bootstrap 4 alpha-3
Fixed:
- Bug with dropdown colors inside the Navbar
Improved:
-
.mobile-nofixed
class to keep Fixed Navbar fixed only on large screens
New components:
- Tags
- Parallax
Syntax changes:
-
.offset-*-*
instead ofcol-*-offset-*
- New markup for breadcrumb
-
.tag
instead oflabel
MDB 4.1.0
What's new?
Kicking off an exciting summer with another Material Design for Bootstrap 4.1.0 software update.
Our tech team tinker away daily to develop new features, fix bugs, and make sure we’re delivering the best possible quality. While we believe all our updates are important, some are more ‘sexier’ than others. Release 4.1.0 is definitely one of them. The upgrade makes it significantly easier (yeah, we also didn't believe that can be possible until now ;)) to develop your websites and apps. With separate bugs fixes, 10 improvements, 500+ new components categories and brand new elements like 42 new sections, 10 fresh templates, and 17 documentation chapters will make August really exciting.
Note: Please read carefully entire release notes. Please DO NOT UPDATE your production environments without testing changes on your development/test environments as new updates bring a lot of changes within syntax. Unfortunately, some of them were not able to make them backward compatible, therefore, please read carefully the following post to verify whether changes may affect your project directly.
You can download new version of MDB Free on our HomePage and for MDB Pro from your account.
Fixed:
- Prevent collapse of accordion menu in sidenav on page load
- btn-block alignment
- "word-wrap" for buttons with long text
Improved:
- Waves effect for nav icons
- Typography responsivness
- Multi-item carousel responsivness
- Better DataPicker
- Better Material Select
- Better SideNav
- Better DoubleNavigation
- Better Navbars
- Better Accordion
- Many small design improvements
New components:
- Page layouts
- Skins
- Regular buttons
- Social buttons
- E-commerce
- Blog
- Forms
- Overlay cards
- Cascading cards
- New dropdowns
- New Navbars
- New Tabs & Pills
- New Pagination
- New Material Selects
New sections ( we've replaced "sets" with "sections"):
- 4 Blog listings
- 2 Contact sections
- 5 Product sections
- 5 pricing sections
- 4Features sections
- 7 Intros
- 3 Magazine newsfeeds
- 4 Projects sections
- 4 Team sections
- 4 Testimonials section
New templates:
- E-commerce HomePage
- Product Page
- Blog HomePage
- Blog Post
- 7 new Landing Pages
New documentation:
- Bootstrap grid
- Page layouts
- E-commerce components
- Blog components
- Inputs
- Forms
- Pagination
- Footers
- Material select
- Intros sections
- Blog sections
- Magazine sections
- E-commerce sections
- Features sections
- Testimonials sections
- Team sections
- Contact sections
MDB 4.0.1
What's new?
This is the first update for MDB4 and Bootstrap 4. You can download the new version of MDB Free on our HomePage and for MDB Pro from your account.
Fixed:
- SideNav issue with draging-out on mobile
- Fixed action button issue on mobile
- Input button transparency issue
- Material select issue with flickering on Firefox
- Multiple DatePickers issue
- Waves effect in Navbar's links issue
- _footer.scss and _variables.scss file issue with sass to css compilation
Added:
- Preloading script
Improved:
- Video background
- Removed blue buttons outline added by default by Google Chrome
- Changed property
overflow: hidden
tooverflow: visible
for.card
- Changed html markup for reveal animations in Card
- Improved padding and animation in Rotating Card
- Updated script for touch gestures