Logo Logo v2.0
Image Description Image Description

No Results

  • Get Support
  • Preview Demo
Logo Logo v2.0
  • Documentation
  • Introduction
  • Getting started
  • Getting Started
  • Gulp
  • Dark Mode New
  • Customization
  • Credits
  • Changelog
  • Design & Graphics
  • Bootstrap Icons
  • Illustrations
  • Components
  • Accordion
  • Alerts
  • Avatars
  • Badge
  • Breadcrumb
  • Buttons
  • Button Group
  • Cards
  • Collapse
  • Column Divider
  • Devices
  • Divider
  • Dropdowns
  • Icons
  • List Group
  • Lists
  • Legend Indicator
  • Modal
  • Offcanvas
  • Page Header
  • Pagination
  • Popovers
  • Progress
  • Profile
  • Shapes
  • Sliding Image
  • Spinners
  • Steps
  • Tab
  • Toasts
  • Tooltips
  • Typography
  • Navbars
  • Navbar
  • Navs
  • Mega Menu
  • Navbar Vertical Aside
  • Scrollspy
  • Tables
  • Tables
  • Datatables
  • Sticky Header
  • Basic forms
  • Basic Forms
  • Checks & Switches
  • Input Group
  • Advanced Forms
  • Advanced Select
  • Datepicker (Flatpickr)
  • Date Range Picker
  • Calendar (Fullcalendar)
  • File Attachments
  • Drag’ n’ Drop File Uploads
  • WYSIWYG Editor
  • Quantity Counter
  • Copy to Clipboard
  • Input Mask
  • Step Forms (Wizards)
  • Add Field
  • Toggle Password
  • Count Characters
  • Form Search
  • Toggle Switch
  • Google reCAPTCHA
  • Charts
  • Chart.js
  • Counter
  • Circles.js (Pie Chart)
  • Others
  • Fullscreen Lightbox
  • Leaflet
  • JSVectorMap
  • SortableJS
  • Sticky Block
  • Go To
  • Utilities
  • Backgrounds
  • Borders
  • Colors
  • Links
  • Position
  • Shadows
  • Sizing
  • Spacing
  • Z-index
  • Opacity

Changelog

See what's new added, changed, fixed, improved or updated in the latest Front versions.

Read this before updating

Do not forget to backup your files and read the changelog before updating your Front copy. If you come across with any problems with Front template during the update and development processes, feel free to contact our support group at htmlstream.com/contact-us and our team will assist you within a short time.

Migrating to v2

Front Dashboard v2.0 is a major rewrite of the entire template. The most notable changes are summarized below, followed by more specific changes to relevant components. Hence, below are the breaking changes to bear in mind when moving from v1.x to v2.0 or any older version of Front.

The most notable improvements made in Front Dashboard v2.0

  • Bootstrap v5 - Built on top of the latest Bootstrap v5.
  • JavaScript - All HS libraries and scripts are fully re-written in vanilla JavaScript, except some third party libraries such as Datatables & Date Range Picker still comes with jQuery dependency.
  • HTML - classes and code structure optimized.
  • SCSS - all files and styled updated.
  • Headers (Navbars) - completely rewritten from scratch.

v2.0 - 13 February, 2022

New Dark Mode
New Landing Page
New Office Club Illustration package
New Button Group page
New Card options
New List options
New Navs options
New Shapes component
New Tables component
Enhanced Global font variable changed from Open Sans to Inter
Enhanced .card-body-centered changed to .card-centered and now placed next to a .card class, instead of a .card-body class
Enhanced .card-pinned class has
Enhanced .card-dropdown changed to .card-dropdown-btn and now given to the invoker
Enhanced .column-divider-* changed to .col-*-divider and now placed next to a .row class, instead of an individual .col-* class
Enhanced .divider divided to .divider-start, .divider-end and .divider-center classes
Enhanced Illustrations
Enhanced .opacity-xs class changed to .opacity-25
Enhanced .opacity class changed to .opacity-50
Enhanced .opacity-lg class changed to .opacity-75
Enhanced Default .card-header content between alignment is now controlled with .card-header-content-between class
Updated Bootstrap from 4.6.0 to v5.0.2
Updated Bootstrap from v1.7.1 to v1.8.1
Dropped Internet Explorer support
Dropped The-icon-of dropped in favor of Bootstrap Icons
Dropped HS Transform Tabs to Btn dropped in favor of HS Nav Scroller
Dropped FancyBox dropped in favor of Fslightbox
Dropped jQuery Validation dropped in favor of Bootstrap Validation
Dropped HS Unfold dropped in favor of Bootstrap Dropdowns
Dropped jvectormap plugin dropped in favor of new jsvectormap
Dropped Input Mask dropped in favor of imask.js
Dropped .content-centered-* dropped in favor of Bootstrap Center elements
Dropped .hs-nav-scroller-unfold dropped in favor of .nav-scroller-dropdown
Dropped .avatar-border classes dropped in favor of utility classes
Dropped .avatar-border-lg class
Dropped .avatar-border-dashed class
Dropped .badge-soft-* color palettes in favor of utility classes, like Bootstrap Badge
Dropped .breadcrumb-no-gutter class
Dropped .btn-pill dropped in favor of utility classes
Dropped .card-unfold class
Dropped .card-jvectormap class
Dropped .card-header-borderless class
Dropped .card-body-stretched class
Dropped .card-dashed-body class
Dropped .card-border-left class
Dropped .card-btn class
Dropped .close-light class
Dropped .nav-divider class
Dropped .nav-link-toggle class
Dropped .nav-indicator-icon class
Dropped .nav-*-down-break class
Dropped .navbar-brand-wrapper class
Dropped .navbar-brand-wrapper class in favor of .navbar-brand
Dropped .navbar-flush class
Dropped .navbar-nav-lg dropped in favor of .nav-lg
Dropped .navbar-nav-mega-menu-body class
Dropped .navbar-spacer-y class
Dropped .navbar-body class
Dropped .navbar-nav-mega-menu class
Dropped .navbar-dropdown-submenu-item-invoker class
Dropped .dropdown-menu-sm class
Dropped .dropdown-menu-lg class
Dropped .custom-select-pill class
Dropped .form-control-pill class
Dropped .input-group-pill class
Dropped .input-group-flush class
Dropped .custom-checkbox-card class
Dropped .custom-checkbox-bookmark class
Dropped .link-collapse class
Dropped .list-group-lg class
Dropped .sidebar dropped in favor of .offcanvas
Dropped .border-left-* classes
Dropped .shadow-soft dropped in favor of .shadow-sm
Dropped .table-column-right-aligned dropped in favor of .table-text-end

Renamed classes

Front v1.x Front v2.0
.avatar-4by3 .avatar-4x3
.column-divider-* .col-*-divider
.input-label-secondary .form-label-secondary
.input-group-*-down-break .input-group-*-vertical
.bg-img-hero .bg-img-start
.stats-progress .circles-chart
.list-unstyle-py-2 .list-py-2
.list-unstyle-py-4 .list-py-3
.stats-progress-info .circles-chart-content
.js-navbar-fix-moment .navbar-scrolled
.header-abs-top .navbar-absolute-top
.header-abs-top-inner .navbar-absolute-top-scroller
.header-sticky-top .navbar-sticky-top
.header-sticky-top-inner .navbar-sticky-top-scroller
.header-invisible .navbar-invisible
.header-moved-up .navbar-moved-up
.header-faded .navbar-faded
.header-section-hidden .navbar-section-hidden
.header-untransitioned .navbar-untransitioned
.header-fix-top .navbar-fix-top
.navbar-vertical-aside-toggle .navbar-toggler
.navbar-vertical-aside-toggle-short-align .navbar-toggler-short-align
.navbar-vertical-aside-toggle-full-align .navbar-toggler-full-align
.navbar-nav-wrap-content-left .navbar-nav-wrap-content-start
.navbar-nav-wrap-content-right .navbar-nav-wrap-content-end
.table-column-pl-0 .table-column-ps-0
.table-column-pr-0 .table-column-pe-0
.custom-file-btn .profile-cover-uploader
.custom-file-input .profile-cover-uploader-input
.custom-file-btn-label .profile-cover-uploader-label
.custom-checkbox-switch .form-check-switch
.custom-checkbox-card-label-stretched .form-check-select-stretched
.dz-dropzone-boxed .dz-dropzone-card
.left-0 .start-0
.right-0 .end-0
.z-index-* .zi-*

v1.2 - 29 March, 2021

Fixed Minor navbar fixes
Fixed Fixed loading country flags on account-settings.html page in build mode
Fixed button box-shadow issue on accessibility

List of important updated SCSS files:

  • src/assets/scss/front-dashboard/reboot/_accessibility.scss
  • src/assets/scss/front-dashboard/navbar/_navbar.scss
  • src/assets/scss/front-dashboard/navbar/_navbar-expand.scss
  • src/assets/scss/front-dashboard/navbar/_navbar-options.scss

List of important updated JSON files:

  • src/assets/json/flags.json

v1.1 - 3 December, 2020

New Ecommerce (11 pages)
New App Calendar page
New Referrals page
New Calendar (Fullcalendar) plugin
New Fullscreen Lightbox plugin
New Popover dark option (Now, by default it's light)
New Chartjs yearStamp option
New Checks & Switches outlined color options
New HS File Attach types of upload files
New HS Step Form slide to top option
New Utility classes
Enhanced Changed variables names in SCSS-files
Enhanced JS code comment section in the HTML-pages only
Enhanced hs.daterangepicker.js arrows called via JS-file now
Enhanced Extended utility classes
Enhanced .custom-control styles
Enhanced Documentation
Updated Bootstrap from v4.5.2 to v4.5.3
Fixed HS Nav Scroller incorrect display of arrows inside the card
Fixed HS Navbar Vertical Aside third level dropdown collapse issue
Fixed HS Unfold "Spacebar" keyboard issue on iPhone X

List of important updated SCSS files:

  • src/assets/scss/front-dashboard/_variables.scss
  • src/assets/scss/front-dashboard/avatar/_avatar-group-sizes.scss
  • src/assets/scss/front-dashboard/avatar/_avatar-ratio.scss
  • src/assets/scss/front-dashboard/avatar/_avatar-sizes.scss
  • src/assets/scss/front-dashboard/avatar/_avatar-status.scss
  • src/assets/scss/front-dashboard/buttons/_button-ghost.scss
  • src/assets/scss/front-dashboard/buttons/_button-icon-sizes.scss
  • src/assets/scss/front-dashboard/buttons/_button-custom.scss
  • src/assets/scss/front-dashboard/buttons/_button-soft.scss
  • src/assets/scss/front-dashboard/buttons/_button-sizes.scss
  • src/assets/scss/front-dashboard/buttons/_button-status-sizes.scss
  • src/assets/scss/front-dashboard/close/_close.scss
  • src/assets/scss/front-dashboard/forms/_form.scss
  • src/assets/scss/front-dashboard/forms/_custom-forms.scss
  • src/assets/scss/front-dashboard/forms/input-group/_input-group-flush.scss
  • src/assets/scss/front-dashboard/icon/_icon-sizes.scss
  • src/assets/scss/front-dashboard/page-header/_page-header.scss
  • src/assets/scss/front-dashboard/popover/_popover.scss
  • src/assets/scss/front-dashboard/profile/_profile-cover.scss
  • src/assets/scss/front-dashboard/card/_card-extensions.scss
  • src/assets/scss/front-dashboard/navbar/_navbar-vertical.scss
  • src/assets/scss/front-dashboard/navs/_navs.scss
  • src/assets/scss/front-dashboard/step/_step.scss
  • src/assets/scss/front-dashboard/utilities/_content-centered.scss
  • src/assets/scss/front-dashboard/utilities/_z-index.scss
  • src/assets/scss/front-dashboard/sidebar/_sidebar.scss
  • src/assets/scss/front-dashboard/vendor/_datatables.scss
  • src/assets/scss/front-dashboard/vendor/_daterangepicker.scss
  • src/assets/scss/front-dashboard/vendor/_dropzone.scss
  • src/assets/scss/front-dashboard/vendor/_flatpickr.scss
  • src/assets/scss/front-dashboard/vendor/_jvectormap.scss
  • src/assets/scss/front-dashboard/vendor/_leaflet.scss
  • src/assets/scss/front-dashboard/vendor/_select2.scss
  • src/assets/scss/front-dashboard/vendor/_tagify.scss
  • src/assets/scss/front-dashboard/vendor/_quill.scss

List of important added SCSS files:

  • src/assets/scss/front-dashboard/vendor/_fancybox.scss
  • src/assets/scss/front-dashboard/forms/checkbox/_checkbox-styles.scss

List of important updated JS files:

  • src/assets/js/hs.chartjs.js
  • src/assets/js/hs.daterangepicker.js
  • src/assets/vendor/hs-file-attach/
  • src/assets/vendor/hs-navbar-vertical-aside.js
  • src/assets/vendor/hs-step-form/
  • src/assets/vendor/hs-unfold/