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.


Introducing new powerful Gulp Toolkit.

Over the past years, we've been asked many times how to automatically prepare the optimized build package, auto path detection, passing variables over HTML and SVG files and lots of others. We are happy to introduce the new powerful Gulp Toolkit which covers all and even more. Learn more at Gulp Page for more details.

Please note, v3.3.0 comes with a new File Structure including with a few global changes to make the development process fast and scalable than ever before in Front.


v3.3.0 - 03 December, 2020

New Gulp Toolkit

New Real Estate (5 Pages).

New Jobs (9 Pages).

New Sign Up modal.

New Submit app page for the App Marketplace demo.

New Count characters plugin.

New Card no gutters option.

New HS Nav Scroller plugin.

New HS Step Form slide to top option.

New Profile cover component.

New Page Header component.

New Checkbox Bookmark component.

Updated Bootstrap from v4.5 to v4.5.3.

Updated File attach new options added.

Updated Typedjs now via data attributes.

Updated Ion Range Slider.

Updated Fancybox.

Enhanced Added new utility classes.

Enhanced Step component.

Enhanced Dropdown item hover effect.

Enhanced CSS divider.

Enhanced Blockquote styles.

Enhanced The CSS psuedo icons, now SVG based.

Enhanced JS code comment section in the HTML-pages only.

Enhanced Extended utility classes

Fixed HS Unfold "Spacebar" keyboard issue on iPhone X.

List of new js-files/folders:
  • assets/vendor/hs-nav-scroller/
  • assets/vendor/hs-count-characters/
List of new scss-files/folders:
  • assets/scss/front/blockquote/_blockquote.scss
  • assets/scss/front/hero/
  • assets/scss/front/forms/checkbox/_checkbox-bookmark.scss
  • assets/scss/front/page-header/
  • assets/scss/front/profile/
  • assets/scss/front/vendor/hs-nav-scroller/
List of dropped scss-files/folders:
  • assets/scss/front/divider/_divider-sizes.scss
  • assets/scss/front/forms/bookmark/_bookmark-checkbox.scss
List of updated js-files/folders:
  • assets/js/hs.validation.js
  • assets/js/hs.fancybox.js
  • assets/js/hs.select2.js
  • assets/js/hs.typed.js
  • assets/js/hs.chartjs.js
  • assets/vendor/hs-step-form/
  • assets/vendor/hs-file-attach/
  • src/assets/vendor/hs-unfold/
  • src/assets/vendor/chart.js.extensions/chartjs-extensions.js
List of updated scss-files/folders:
  • assets/scss/front/_variables.scss
  • assets/scss/front/avatar/_avatar.scss
  • assets/scss/front/breadcrumb/_breadcrumb.scss
  • assets/scss/front/buttons/_button-custom.scss
  • assets/scss/front/buttons/_button-soft.scss
  • assets/scss/front/dropdown/_dropdown.scss
  • assets/scss/front/headers/_header-default.scss
  • assets/scss/front/headers/_header-white-nav-links.scss
  • assets/scss/front/forms/checkbox/_checkbox-icon.scss
  • assets/scss/front/forms/states/_states.scss
  • assets/scss/front/divider/_divider.scss
  • assets/scss/front/navs/_navs.scss
  • assets/scss/front/slick/arrows/_slick-arrow.scss
  • assets/scss/front/step/_step.scss
  • assets/scss/front/step/_step-avatar.scss
  • assets/scss/front/step/_step-avatar-sizes.scss
  • assets/scss/front/step/_step-breakpoints.scss
  • assets/scss/front/step/_step-centered.scss
  • assets/scss/front/step/_step-colors.scss
  • assets/scss/front/step/_step-divider.scss
  • assets/scss/front/step/_step-icon.scss
  • assets/scss/front/step/_step-icon-sizes.scss
  • assets/scss/front/step/_step-inline.scss
  • assets/scss/front/step/_step-states.scss
  • assets/scss/front/step/_step-timeline.scss
  • assets/scss/front/utilities/_borders.scss
  • assets/scss/front/utilities/_gradients.scss
  • assets/scss/front/utilities/_gradients-overlay.scss
  • assets/scss/front/utilities/_transitions.scss
  • assets/scss/front/vendor/select2/_select2.scss
  • assets/scss/front/vendor/ion-range-slider/_select2.scss
Breaking changes:
  • .step-inline-title changed to .step-title
  • navy color changed to dark
  • dark color changed to gray-900
  • data-chartjs-options='{}' data attribute changed to data-hs-chartjs-options='{}'
Renamed classes:
Front v3.2.2 Front v3.3
.gradient-y-overlay-sm-dark .gradient-y-overlay-sm-gray-900
.gradient-x-overlay-sm-navy .gradient-x-overlay-sm-dark
.gradient-x-overlay-lg-navy .gradient-x-overlay-lg-dark
.gradient-x-overlay-lg-navy-video .gradient-x-overlay-lg-dark-video

v3.2.2 - 30 July, 2020

Fixed Unfold JS error

Fixed Privacy Page UI enhancement

Enhanced Documentation

List of updated js-files/folders:
  • assets/vendor/hs-unfold
List of updated HTML files:
  • html/pages/privacy.html

v3.2.1 - 11 June, 2020

Enhanced Account pages on mobile screen

List of updated scss-files/folders:
  • assets/scss/front/forms/_custom-form.scss
  • assets/scss/front/navbar/_navbar-vertical.scss

v3.2 - 09 June, 2020

New Account (9 Pages)

New Input mask library

New Quill library

New Select2 library

New Add Field HS library

New Text Highlight component

New Legend indicator component

New Vertical Navbar component

Updated Bootstrap from v4.4.1 to v4.5.

Updated jQuery from v3.3.1 to v3.5.1.

Updated jQuery Migrate from v3.0.1 to v3.3.0.

Updated HS File-attach

Updated HS Go-to

Updated HS Mega-menu

Updated HS Unfold

Updated HS Video-player

Enhanced Extended utility classes

Enhanced Added Avatar options

Enhanced Added White button option

Enhanced Added Cards options

Enhanced Added Breadcrumb Light option

Enhanced Added Forms options

Enhanced Added List group option

Enhanced Added Modal option

Enhanced Added Navs & Tabs options

Enhanced Added Tables options

Enhanced Extended functionalities of HS Video Player library

Enhanced Extended functionalities of HS File Attach library

Enhanced Video background in Classic Studio improved on smaller devices

Enhanced Hero in Help Desk page

Enhanced Soft Alert style link color

Fixed Video player icon moving issue on hover

Fixed Unfold JS error

Fixed Mega Menu Click event

Fixed Added missing ID to Hire Us section to OnePage SASS demo

Fixed Added missing unfold.js library to OnePage SASS and Classic Software demos

Dropped Bootstrap Select and Tagify library in favor of Select2

Dropped Summernote library in favor of Quill

Dropped Datatables, Flatpickr and Password Strength libraries as lack of use cases at the current versions of Front. However, if you need them for some reaons, you may refer to the previouse version of Front's Documentation (e.g. v3.1.1).

List of important updated HTML files:
  • html/index.html
  • html/onepage-saas.html
  • html/classic-software.html
  • html/demo-course/listing.html
  • html/demo-help-desk/index.html
  • html/demo-app-marketplace/index.html
List of updated scss-files/folders:
  • assets/scss/front/_variables.scss
  • assets/scss/front/avatar/_avatar.scss
  • assets/scss/front/avatar/_avatar-sizes.scss
  • assets/scss/front/badge/_badge-soft.scss
  • assets/scss/front/buttons/_button-custom.scss
  • assets/scss/front/breadcrumb/_breadcrumb.scss
  • assets/scss/front/card/_card.scss
  • assets/scss/front/dropdown/_dropdown.scss
  • assets/scss/front/forms/_form.scss
  • assets/scss/front/forms/_form-merge.scss
  • assets/scss/front/forms/checkbox/_checkbox-icon.scss
  • assets/scss/front/headers/_header-fullscreen-style.scss
  • assets/scss/front/links/_links.scss
  • assets/scss/front/navs/_navs.scss
  • assets/scss/front/media/_video-player.scss
  • assets/scss/front/modal/_modal.scss
  • assets/scss/front/table/_table.scss
  • assets/scss/front/utilities/_text-colors.scss
  • assets/scss/front/vendor/hs-unfold/_hs-unfold.scss
  • assets/scss/front/mixins/_alert.scss
List of new scss-files/folders:
  • assets/scss/front/forms/custom-forms/_custom-forms.scss
  • assets/scss/front/forms/checkbox/_checkbox-switch.scss
  • assets/scss/front/navbar/_navbar.scss
  • assets/scss/front/navbar/_navbar-vertical.scss
  • assets/scss/front/legend-indicator/_legend-indicator.scss
  • assets/scss/front/list/_list-group.scss
  • assets/scss/front/navs/_nav-list.scss
  • assets/scss/front/vendor/_select2.scss
  • assets/scss/front/text-highlight/_text-highlight.scss
  • assets/scss/front/mixins/_text-highlight.scss
List of new js-files (HS extended):
  • assets/js/hs.quill.js
  • assets/js/hs.select2.js
  • assets/js/hs.mask.js

v3.1.1 - 15 April, 2020

New Added Step Avatars and Last item borderless compontents

Enhanced Updated illustrations in Course, Error 404, Maintenance Mode, Coming Soon and Cart Empty pages

Enhanced Added Starter Template snippet code to Documentation Introduction page.

Enhanced hs.summernote.js and hs.dropzone.js libraries source code

Enhanced SCSS variables

Enhanced Documentation

Enhanced Snippets

List of updated scss-files/folders:
  • assets/scss/front/_variables.scss
  • assets/scss/front/breadcrumb/_breadcrumb.scss
  • assets/scss/front/buttons/_button-soft.scss
  • assets/scss/front/card/_card.scss
  • assets/scss/front/dropdown/_dropdown.scss
  • assets/scss/front/forms/_form-flush.scss
  • assets/scss/front/forms/_form-merge.scss
  • assets/scss/front/navs/_navs.scss
  • assets/scss/front/step/_step.scss
  • assets/scss/front/step/_step-icon.scss
  • assets/scss/front/vendor/datatables/_datatables.scss
  • assets/scss/front/vendor/tagify/_tagify.scss
List of new scss-files/folders:
  • assets/scss/buttons/_button-outline.scss
  • assets/scss/front/step/_step-avatar.scss
  • assets/scss/front/step/_step-avatar-sizes.scss
List of updated JS-files (HS extended):
  • assets/js/hs.dropzone.js
  • assets/js/hs.summernote-editor.js
  • Changed from assets/include/upload.html to assets/include/dropzone-upload.html

v3.1 - 31 March, 2020

New Snippets pages.

New Devices, File attach, Toggle switch, Modal, Popovers, Tabs, and Tooltips documentation pages.

New Utility classes.

Dropped .nav-borderless.

Dropped .nav-icon in favor of step components.

Enhanced HS-Unfold plugin.

Enhanced Link hover color on "Course" demo pages.

Enhanced Documentation

Fixed default .avatar border-radius.

Fixed .avatar-group alignment.

Fixed assets/js/ files JS errors when using .theme.min.js.

Breaking changes:
  • .card-shadow-on-hover changed to .card-hover-shadow
Dropped scss-files/folders:
  • assets/scss/front/sticky-footer/ folder
  • assets/css/sticky-footer.css file
List of updated scss-files/folders:
  • assets/scss/front/_variables.scss
  • assets/scss/front/navs/_navs.scss
  • assets/scss/front/avatar/_avatar.scss
  • assets/scss/front/avatar/_avatar-group.scss
  • assets/scss/front/search-forms/_search-form-slide-down.scss
  • assets/scss/front/tagify/_tagify.scss
  • assets/scss/front/utilities/_text-colors.scss
List of updated plugins:
  • assets/vendor/hs-unfold/
List of new plugins:
  • assets/vendor/hs-file-attach/

Migrating to v3

Front v3.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 v2.x to v3.0 or any older version of Front.

The most notable improvements made in Front v3.0

  • Design - almost all pages are redesigned with a new fresh look.
  • JavaScript - all scripts are fully re-written from scratch, in the last two years since Front is released we have recieved lots of feedback from users and implimented all of them making Front's JavaScript to scale in any level.
  • HTML - fully rid of BEM CSS naming convention in favor of Bootstrap naming classes to match Fronts components codes as native as Bootstrap components codes.
  • CSS/SCSS - extended components variables to make customization experience even better.

v3.0 - 19 March, 2020

New Course demo - comes with three additional inner pages.

New Nav Wrap header option that keeps secondary contents, like, "Buy Now" or search buttons always visible across all resolutions.

New Bootstrap dropdown examples that do not require hs.megamenu plugin to work.

New assets/scss/animation/ components.

New Utility classes.

Enhanced Redesigned almost all Home Pages except Home App pages

Enhanced Design of supporting pages (e.g. Portfolio, Careers, Pricing etc.)

Enhanced Design of Blog pages.

Enhanced Standardized font weight styles across pages.

Enhanced Poppins font replaced with Open-Sans.

Enhanced heading and p tags styles rewritten and enhanced.

Enhanced Switch style _custom-switch.scss changed to _toggle-switch.scss and completely rewritten.

Enhanced Font icons changed from <span></span> and <small></small> tags to the <i></i> tag.

Enhanced .btn-custom-toggle-* and .btn components.

Enhanced .card and .modal padding values.

Enhanced .nav-box and .go-to classes design.

Enhanced .box-shadow-sm class value.

Enhanced .btn-outline-secondary border color.

Enhanced custom .fadeInUp class CSS parameters.

Enhanced avatar classes grouped with a .avatar-group class.

Enhanced Step Form works without validation now.

Enhanced Video background resolution on smaller devices in the Classic Studio home page.

Enhanced Default alert style - now alerts come with 2 styles solid (default) and soft colors.

Enhanced Header completely rewritten.

Enhanced SCSS variables.

Enhanced Documentation

Fixed .search-slide-down width issue on smaller resolution.

Most noticeable dropped sources:
  • Sketch file. Due to many complains of version difference between Front HTML and Front Sketch files. This has been huge issue to maintain at the same version both Sketch and HTML version of Front since they are two different purpose products. However, we will consider adding design version (Sketch or Figma) of Front as a separate product in future.
  • design folder - logo sources can be found at assets/svg/logos/..
  • Crypto Landing demo page.
Breaking changes
  • .u- class prefix to optimize the classes with Bootstrap utility classes
  • All JS-files moved from assets/js/components to the assets/js/ path.
  • All JS-files from assets/js completely rewritten.
  • SVG elements called via .img-fluid class instead of .js-svg-injector class.
  • Bootstrap JS path updated from node_modules/bootstrap/dist/js/bootstrap.min.js to node_modules/bootstrap/dist/js/bootstrap.bundle.min.js.
  • assets/vendor/font-awesome/css/fontawesome-all.min.css changed to node_modules/@fortawesome/fontawesome-free/css/all.css.
  • slickPaging changed to counter.
  • hs-bg-video changed to hs-video-bg.
  • hs.datepickr.js changed to hs.flatpickr.js.
  • hs.range-slider.js changed to hs.ion-range-slider.js.
  • hs.char-pie.js changed to hs.circles.js.
  • hs.password-strength.js changed to hs.pwstrength.js.
Renamed classes:
Front v2.x Front v3
.min-width-3 .min-w-3rem
.min-width-4 .min-w-4rem
.min-width-8 .min-w-8rem
.min-width-21 .min-w-21rem
.max-width-3 .max-w-3rem
.max-width-4 .max-w-4rem
.max-width-5 .max-w-5rem
.max-width-6 .max-w-6rem
.max-width-7 .max-w-7rem
.max-width-8 .max-w-8rem
.max-width-9 .max-w-9rem
.max-width-10 .max-w-10rem
.max-width-11 .max-w-11rem
.max-width-13 .max-w-13rem
.max-width-15 .max-w-15rem
.max-width-19 .max-w-19rem
.max-width-23 .max-w-23rem
.max-width-27 .max-w-27rem
.max-width-33 .max-w-33rem
.max-width-35 .max-w-35rem
.max-width-40 .max-w-40rem
.max-width-50 .max-w-50rem
.height-4 .h-4rem
.height-250 .h-250rem
.height-380 .h-380rem
.min-height-270 .min-h-270rem
.min-height-300 .min-h-300rem
.min-height-380 .min-h-380rem
.min-height-4540 .min-h-4540rem
.min-height-500 .min-h-500rem
.min-height-620 .min-h-620rem
.height-md-30vh .vh-md-30
.height-md-70vh .vh-md-70
.min-height-md-100vh .min-vh-md-100
.height-lg-100vh .vh-lg-100
.min-height-lg-100vh .min-vh-lg-100
.min-height-lg-600 .min-h-lg-600rem
.link-muted .link-underline
.custom-checkbox .toggle-switch
.datepicker .flatpickr
.card-btn-arrow .card-btn-toggle
.btn__toggle-toggled .btn-toggle-toggled
.btn__toggle-default .btn-toggle-default
.gradient-overlay-half-dark-video-v1 .gradient-x-overlay-lg-dark-video
.gradient-overlay-half-indigo-v1 .gradient-x-overlay-sm-indigo
.fullscreen__submenu-list-link .fullscreen-submenu-list-link
.fullscreen__submenu-list .fullscreen-submenu-list
.fullscreen__submenu-nav-link .fullscreen-submenu-nav-link
.fullscreen__submenu .fullscreen-submenu
.fullscreen__nav-link .fullscreen-nav-link
.fullscreen__nav-list .fullscreen-nav-list
.fullscreen__nav .fullscreen-nav
.fullscreen__overlay .fullscreen-overlay
.fullscreen__container .fullscreen-container
.fullscreen--showed .fullscreen--showed
.fullscreen--toggler .fullscreen--toggler
.header--floating__inner .header-floating-inner
.header--floating-xl .header-floating-xl
.header--floating-lg .header-floating-lg
.header--floating-md .header-floating-md
.header--floating-sm .header-floating-sm
.header--floating .header-floating
.header--invulnerable-xl .header-invulnerable-xl
.header--invulnerable-lg .header-invulnerable-lg
.header--invulnerable-md .header-invulnerable-md
.header--invulnerable-sm .header-invulnerable-sm
.header--invulnerable .header-invulnerable
.header--change-appearance-xl .header-change-appearance-xl
.header--change-appearance-lg .header-change-appearance-lg
.header--change-appearance-md .header-change-appearance-md
.header--change-appearance-sm .header-change-appearance-sm
.header--change-appearance .header-change-appearance
.header--toggle-section-xl .header-toggle-section-xl
.header--toggle-section-lg .header-toggle-section-lg
.header--toggle-section-md .header-toggle-section-md
.header--toggle-section-sm .header-toggle-section-sm
.header--toggle-section .header-toggle-section
.header--abs-top-xl .header-abs-top-xl
.header--abs-top-lg .header-abs-top-lg
.header--abs-top-md .header-abs-top-md
.header--abs-top-sm .header-abs-top-sm
.header--abs-top .header-abs-top
.header--abs-sticky-top-xl .header-abs-sticky-top-xl
.header--abs-sticky-top-lg .header-abs-sticky-top-lg
.header--abs-sticky-top-md .header-abs-sticky-top-md
.header--abs-sticky-top-sm .header-abs-sticky-top-sm
.header--abs-sticky-top .header-abs-sticky-top
.header--abs-show-hide-xl .header-abs-show-hide-xl
.header--abs-show-hide-lg .header-abs-show-hide-lg
.header--abs-show-hide-md .header-abs-show-hide-md
.header--abs-show-hide-sm .header-abs-show-hide-sm
.header--abs-show-hide .header-abs-show-hide
.header--static-xl .header-static-xl
.header--static-lg .header-static-lg
.header--static-md .header-static-md
.header--static-sm .header-static-sm
.header--static .header-static
.header--change-logo .header-change-logo
.header--untransitioned .header-untransitioned
.header--moved-up .header-moved-up
.header--invisible .header-invisible
.header--faded .header-faded
.header--fix-top .header-fix-top
.header__mega-menu-position-right-fix--md .mega-menu-position-right-fix-md
.header__mega-menu-position-right-fix--xl .mega-menu-position-right-fix-xl
.header__mega-menu-wrapper .mega-menu-body
.header__mega-menu .header-mega-menu
.header--white-nav-links .header-white-nav-links
.header--navbar-bg .header-navbar-bg
.header--white-bg-on-scroll .header-white-bg-on-scroll
.header--bg-transparent .header-bg-transparent
.header--hide-topbar .header-hide-topbar
.header__hide-content .header-hide-content
.header__product-banner-content .navbar-product-banner-content
.header__product-banner .navbar-product-banner
.header__banner-content .navbar-banner-content
.header__banner .navbar-banner
.header__promo-card-footer-ver-divider .navbar-promo-card-footer-ver-divider
.header__promo-card-footer-item .navbar-promo-card-footer-item
.header__promo-card-footer .navbar-promo-card-footer
.header__promo-card-text .navbar-promo-card-text
.header__promo-card-title .navbar-promo-card-title
.header__promo-card-icon .navbar-promo-card-icon
.header__promo-card-body .navbar-promo-card-body
.header__promo-card-deck .navbar-promo-card-deck
.header__promo-card .navbar-promo-card
.header__promo-link .navbar-promo-link
.header__promo-item .navbar-promo-item
.header__promo-inner .navbar-promo-inner
.header__promo .navbar-promo
.header__nav-item .navbar-nav-item
.header-navbar-brand .navbar-brand
.header__navbar-body .navbar-body
.header__navbar-link .navbar-link
.header-navbar-brand .header-navbar-brand
.header__navbar .header-navbar
.header__nav-last-item .header-nav-last-item
.header__navbar-nav .header-navbar-nav
.header__sub-menu-nav-link-toggle .nav-link-toggle
.header__sub-menu-nav-link .header-sub-menu-nav-link
.header__sub-menu-nav-group .header-sub-menu-nav-group
.header__section--hidden .header-section-hidden
.header__section .header-section
.datatable__thead-icon .datatable-thead-icon
.datatable__trigger-icon .datatable-trigger-icon
.datatable__trigger .datatable-trigger
.datatable__content .datatable-content
.datatable__striped .datatable-striped
.content-centered-y--lg .content-centered-y-lg
.content-centered-y--md .content-centered-y-md
.stats-progress__info .stats-progress-info
.slick--pagination-modern .slick-pagination-modern
.slick-pagination-interactive__title .slick-pagination-interactive-title
.slick-pagination-interactive__text .slick-pagination-interactive-text
.slick__pagination--vertical .slick-pagination-vertical
.slick__pagination--white .slick-pagination-white
.slick__pagination .slick-pagination
.slick__counter-total .slick-counter-total
.slick__counter-divider .slick-counter-divider
.slick__counter-current .slick-counter-current
.slick-arrow-centered--y .slick-arrow-centered-y
.slick-arrow--offset .slick-arrow-offset
.slick-arrow--flat-white .slick-arrow
.slick-arrow--flat .slick-arrow-primary
.slick-arrow--white .slick-arrow-soft-white
.slick-arrow-right .slick-arrow-right
.slick-arrow-left .slick-arrow-left
.slick__arrow .slick-arrow
.slick--gutters-3 .slick-gutters-3
.slick--gutters-2 .slick-gutters-2
.slick--gutters-1 .slick-gutters-1
.slick--equal-height .slick-equal-height
.sidebar--left .sidebar-left
.sidebar__footer .sidebar-footer
.sidebar__scroller .sidebar-scroller
.sidebar__container .sidebar-container
.sidebar__content--account .sidebar-content-account
.sidebar__content .sidebar-content
.sidebar__body .sidebar-body
.search-slide-down-suggestions .search-slide-down__suggestions
.search-slide-down__input .search-slide-down-input
.search-slide-down-trigger__icon .search-slide-down-trigger-icon
.search-push-top__banner .search-push-top-banner
.search-push-top__close-btn .search-push-top-close-btn
.search-push-top__content .search-push-top-content
.page-preloader__content-centered .page-preloader-content-centered
.page-preloader__content-centered .page-preloader-content-centered
.video-player__centered .video-player-centered
.video-player__icon .video-player-icon
.video-player__btn .video-player-btn
.video-player__played .video-player-played
.video-player__preview .video-player-preview
.media-viewer-icon--active .media-viewer-icon-active
.media-viewer__container .media-viewer-container
.media-viewer__icon .media-viewer-icon
.link-muted__toggle-toggled .link-underline-toggle-toggled
.link-muted-toggle__default .link-underline-toggle-default
.link-collapse__default .link-collapse-default
.link-collapse__active .link-collapse-active
.link__icon .link-icon
.indicator-steps .step-flow
.indicator-steps__inner .step-flow-inner
.go-to__inner .go-to-inner
.checkbox-outline-input .checkbox-outline-input
.checkbox-outline-label .checkbox-outline-label
.checkbox-icon__input .checkbox-icon-input
.checkbox-icon__label .checkbox-icon-label
.file-attachment-input .file-attachment-btn
.file-attachment-btn__label .file-attachment-btn-label
.divider--text .divider-text
.divider--xs .divider-xs
.js-select .js-selectpicker
.js-range-slider .js-ion-range-slider
.slick__paging .slick-counter
.btn-icon.btn-sm .btn-icon.btn-xs
.btn-text-* .btn-ghost-*
.opacity-lg .opacity-xs
.form-label .input-label
Dropped js-files (HS extended):
  • assets/js/file-attachement.js file
  • assets/js/hs.scroll-effect.js file
  • assets/js/hs.svg-injector.js file
  • assets/js/hs.focus-state.js file
Dropped plugins/libraries:
  • assets/vendor/instafeed.js/ due to unstable API
  • assets/vendor/player.js/ in favor of assets/vendor/hs-video-player/
  • assets/vendor/malihu-custom-scrollbar-plugin/ in favor of a custom scrollbar
  • assets/vendor/chartist in favor of Chart.js
  • assets/vendor/bootstrap-tagsinput/ in favor of Tagify
  • assets/vendor/custombox/ in favor of Bootstrap modals
  • assets/vendor/animate.css library
  • assets/vendor/svg-injector/ library
  • assets/svg/components/circle-process-1.svg illustration
  • assets/svg/components/circle-process-2.svg illustration
  • assets/svg/components/circle-process-3.svg illustration
Dropped scss-files/folders:
  • assets/scss/front/quantity/
  • assets/scss/front/vendor/fileuploader/
  • assets/scss/front/badges/_badge-positions.scss
  • assets/scss/front/badges/_badge-sizes.scss
  • assets/scss/front/hamburger/ in favor of navbar-toggle
  • assets/scss/front/mockups/_browser-v1.scss
  • assets/scss/front/mockups/_devices-v1.scss
  • assets/scss/front/mockups/_devices-v2.scss
  • assets/scss/front/mockups/_devices-v3.scss
  • assets/scss/front/mockups/_devices-v4.scss
  • assets/scss/front/modal-window/
  • assets/scss/front/forms/states/_focus-state.scss
  • assets/scss/front/paging/paging-modern.scss
  • assets/scss/front/go-to-section/_go-to-modern.scss
  • assets/scss/front/go-to-section/_go-to-vertical-arrow.scss
  • assets/scss/front/go-to-section/_go-to-wave.scss
  • assets/scss/front/timeline/_timeline.scss
  • assets/scss/front/svg/_svg.scss
  • assets/scss/front/vendor/animate.css/_animate.css.scss
  • assets/scss/front/mixins/_gradients.scss in favor of Bootstrap mixins
Most noticeable dropped SCSS variables:
  • $theme-color white option
  • $primary-darker
  • $primary-lighter
  • $warning-lighter
  • $success-lighter
  • $cyan-lighter
  • $red-lighter
  • $secondary-colors
Dropped components:
  • Header - hamburger sidebars
  • Header - dropdown-menu dark
  • Header - navbar dark
  • Header - Primary
  • Header - Sticky Bottom
  • Header - Absolute Bottom
  • Header - Absolute top center aligned logo on top
  • Header - Second screen
Dropped classes:
  • Responsive text classes in favor of Bootstrap Responsive font sizes (RFS)
  • .min-height-100vh in favor of the Bootstrap utility .min-vh-100 class
  • .card-text-dark
  • .go-to-modern in favor of .btn-icon class
  • .btn-sm-wide
  • .gmap-interactive
  • .cubeportfolio-reveal
  • .svg-divider-polygon
  • .close-light
  • .blog-thumb-minimal
  • .mt-23
  • .hero-v1 in favor of utility classes.
  • .cubeportfolio in favor of .label classes.
  • .font-weight-medium
  • .gradient-overlay-half-dark-v2
  • .gradient-overlay-half-dark
  • .gradient-overlay-half-info-v1
  • .gradient-overlay-half-primary-v4
  • .gradient-overlay-half-primary-v3
  • .gradient-overlay-half-primary-v2
  • .gradient-overlay-half-primary-v1
  • .gradient-half-info-v1
  • .gradient-half-warning-v3
  • .gradient-half-warning-v2
  • .gradient-half-warning-v1
  • .gradient-half-primary-v5
  • .gradient-half-primary-v4
  • .gradient-half-primary-v3
  • .gradient-half-primary-v2
  • .gradient-half-primary-v1
  • .gradient-half-primary-body-v1
  • .gradient-overlay-half-primary-video-v1 in favor of .gradient-x-overlay-lg-dark-video
  • .clients in favor of utility classes
  • .media-player in favor of .video-player
  • .indicator-dots in favor of .step-dots
  • .indicator-vertical-dashed in favor of .step-vertical
  • .timeline in favor of .step
  • .link-white in favor of .link-underline-light
  • .btn-white in favor of .btn-light
  • .btn-outline-white in favor of .btn-outline-light
  • .btn-soft-white in favor of .btn-soft-light
  • .btn-tiny in favor of .btn-xs
  • .avatar-tiny in favor of .avatar-xs
  • .sidebar-account-holder-img in favor of .avatar
  • .sidebar-account-holder-text in favor of utility classes
  • .sidebar-account-holder in favor of utility classes
  • .sidebar-content-account in favor of utility classes
  • .sidebar-footer-account-text in favor of utility classes
  • .sidebar-footer-account in favor of utility classes
  • .sidebar-cart-footer-offset in favor of .sidebar-footer-offset
  • .sidebar-account-footer-offset in favor of .sidebar-footer-offset
  • .sidebar-account-toggle-bg-img in favor of .label-avatar-img
  • .sidebar-account-toggle-bg-text in favor of .label
  • .sidebar-account-toggle-bg in favor of .label
  • .alert-text in favor of .text-inherit
  • .hamburger in favor of data-toggle attribute
  • .slick-pagination-centered--y class in favor of utility classes
  • .vertical-divider in favor of .column-divider
  • .indicator-vertical-line in favor of .column-divider
  • .mx-gutters-* in favor of Bootstrap negative utility classes
  • .btn-bg-transparent in favor of .btn-ghost-*
  • .stop-color-* colors in favor of inline coloring
  • .stroke-* colors in favor of inline colors
  • .fill-* colors in favor of inline colors
  • .list-group extended styles in favor of .nav
  • assets/scss/front/badge/ folder in favor of avatar, and icon status classes
  • .slick__pagination--bottom-center in favor of utility classes
  • .slick-arrow--inner
  • .header-navbar-brand-text
  • .header-navbar-brand-text-white
  • .header-navbar-brand-center
  • .card-text-dark in favor of utility classes
  • .badge-pos-*
  • .badge-outline-*
  • .header-navbar-no-space
  • .header-navbar-top-space
  • .header-collapse-nav-list-no-spacer
  • .header-collapse-submenu-list-link
  • .header-collapse-submenu-list
  • .header-collapse-submenu-nav-link
  • .header-collapse-submenu-nav-link
  • .header-collapse-submenu
  • .header-collapse-submenu-nav-link
  • .header-collapse-nav-list
  • .header-collapse-nav-pointer
  • .header-collapse-nav-pointer
  • .header-collapse-nav-link
  • .header-collapse-nav
  • .header-center-aligned
  • .header-center-aligned-inner
  • .header-sub-menu-title
  • .header-sub-menu-spacer
  • .header-sub-menu
  • .slick-pagination-bottom-center
  • .slick-thumb-progress-path
  • .slick-zoom-slide
  • .sidebar-account-list
  • .sidebar-sidebar--account__list
  • .sidebar-account-toggle-text
  • .sidebar-account-toggle-bg
  • .sidebar-account-holder
  • .sidebar-account-footer-offset
  • .blog-thumb-minimal-img-wrapper
  • .blog-thumb-minimal-img
  • .modal-facebook-text
  • .modal-facebook-navbar
  • .modal-facebook-content
  • .modal-facebook-space
  • .modal-facebook-body
  • .modal-facebook
  • .video-player-icon-lg
  • .avatar avatar-lg--bordered
  • .js-text-animation

v2.9.4 - 19 January, 2019

Updated Bootstrap from v4.4 to v4.4.1.

Updated Bootstrap select from v1.13.2 to v1.13.10

Updated Clipboard from v2.0.1 to v2.0.4

Updated Flatpickr from v4.5.1 to v4.6.2

Updated jQuery Validation from v1.16.0 to v1.19.1

Updated FontAwesome from v5.9.1 to v5.12

v2.9.3 - 28 November, 2019

Updated Bootstrap from v4.3.1 to v4.4.

Updated Gulp file from v3.9.x to v4.x.

Updated package.json file.

Updated Sketch download link in the README.md file.

v2.9.2 - 19 August, 2019

Fixed assets/scss/ path in some files.

v2.9.1 - 2 August, 2019

Fixed Dropdown spacing issue of the Blogs section on the navbar on mobile devices.

Fixed $btn-font-size-sm removed from the assets/scss/front/_variables.scss file to fix the customization issue of the .btn-sm size.

List of important updated files

  • assets/scss/front/_variables.scss

v2.9 - 25 July, 2019

New Onepage Corporate home page.

New Blog - Card Style page.

New Blog - Listing page.

New Blog - Profile page.

New Blog - Single Article page.

New Light bordered table option.

New White Border style nav option.

New Utility classes.

Dropped Blog pages in favor of new Blog design pages.

Fixed hs.unfold.js ESC keyboard button functionality.

Fixed hs.scroll-nav.js double-scrolling animation when clicked to the first link of the .u-header--abs-top-*.

Fixed static button hover status in link.

Fixed active status of the Home Onepage headers.

Fixed Onscroll Animation reveal when you scroll down to it.

Fixed assets/scss/front/forms/_chechbox-bordered.scss in favor of assets/scss/front/forms/_chechbox-outline.scss.

Enhanced Account Plans Pricing table.

Enhanced App Description Pricing table.

Enhanced Account Invite friends SVG elements.

Enhanced Tooltip background color changed in favor of Dark color.

Enhanced Documentation

List of important updated files

  • assets/scss/front/_variables.scss
  • assets/scss/front/_front.scss
  • assets/scss/front/buttons/_buttons.scss
  • assets/scss/front/table/_table.scss
  • assets/scss/front/brand/_brand.scss
  • assets/scss/front/forms/_chechbox-bordered.scss
  • New assets/scss/front/forms/_chechbox-icon.scss
  • New assets/scss/front/vendor/onscroll-animation/_onscroll-animation.scss
  • html/onepage-creative.html
  • html/onepage-saas.html
  • html/account-plans.html
  • html/account-invite-friends.html
  • html/demo-app-marketplace/app-description.html
  • assets/js/components/hs.unfold.js
  • assets/js/components/hs.scroll-nav.js

v2.8 - 27 June, 2019

New App Marketplace demo page.

New Help Desk page moved to the app-marketplace/ folder as a stand-alone demo.

New Help Listing page.

New Utility classes.

Enhanced Documentation

Enhanced ajax/ and scss/ folders moved into the assets/ folder

List of important updated files

  • assets/scss/front/_variables.scss
  • assets/scss/front/utilities/_bg-soft-colors.scss
  • assets/scss/front/headers/_header-navbar-expand.scss

v2.7 - 30 May, 2019

New Classic Studio home page.

New App UI kit home page.

New About Agency inner page redesigned.

New Services Agency inner page redesigned.

New Shop Categories demo pages.

New Shop Categories sidebar demo pages.

New Shop Products grid demo pages.

New Shop Products list demo pages.

New Shop Empty cart demo pages.

New Shop Order completed demo pages.

New Background Video examples.

New Modal Window options.

New Utility classes.

New Page preloader documentation page.

Dropped About Start-up and Services Start-up pages in favor of new About and Services pages.

Fixed .btn-custom-toggle-primary border color on hover.

Enhanced Documentation.

List of important updated files

  • assets/include/scss/front/_variables.scss
  • assets/include/scss/front/card/_card.scss
  • assets/include/scss/front/dropdown/_dropdown.scss
  • assets/include/scss/front/utilities/_borders.scss
  • assets/include/scss/front/slick/paginations/_slick-pagination.scss
  • New assets/include/scss/front/svg/_svg-ie.scss
  • New assets/include/scss/front/utilities/_transform.scss
  • New assets/include/scss/front/page-preloader/_page-preloader.scss
  • html/page-about-agency.html
  • html/page-services-agency.html

v2.6 - 4 May, 2019

New Shop demo pages redesigned.

New Slick thumb progress added.

New Slick arrow option.

New Icon options added.

New Summernote options.

Removed Duplicated .dropdown-menu-*-left and .dropdown-menu-*-right classes.

Fixed Summernote double toggle arrow style.

Enhanced Documentation.

List of important updated files

  • assets/include/scss/front/_variables.scss
  • assets/include/scss/front/slick/_slick.scss
  • New assets/include/scss/front/dropdown/_dropdown.scss
  • New assets/include/scss/front/popover/_popover.scss
  • New assets/include/scss/front/vendor/summernote-editor/_summernote-editor.scss
  • assets/js/components/hs.unfold.js
  • assets/js/components/hs.slick-carousel.js
  • html/page-careers-single.html

v2.5 - 18 April, 2019

New App SaaS home page.

New App Workflow home page.

New Clipboard within modal example.

New Datatables pagination options.

New Utility classes.

Fixed Hero block mockup overlaying in Classic-consulting page.

Fixed Quotation mark in Single article classic Blog page.

Fixed SVG preloader background white color.

Enhanced SVG illustrations freshened up.

Enhanced Form shadows softened for a better look.

Enhanced Gradient colors rewritten with variables now.

Enhanced SCSS variables.

Enhanced Documentation.

List of important updated files

  • assets/include/scss/front/_variables.scss
  • assets/include/scss/front/utilities/_gradients.scss
  • assets/include/scss/front/utilities/_gradients-overlay.scss
  • assets/include/scss/front/utilities/_fill-colors.scss
  • assets/include/scss/front/utilities/_links.scss moved to assets/scss/front/links/ folder
  • assets/include/scss/front/forms/range-slider/ moved to assets/scss/vendor/ folder
  • assets/include/scss/front/avatar/_avatar-bordered.scss
  • assets/include/scss/front/badge/_badge-styles.scss
  • assets/include/scss/front/brand/_brand.scss
  • assets/include/scss/front/breadcrumb/_breadcrumb.scss
  • assets/include/scss/front/buttons/_button-custom-toggle.scss
  • assets/include/scss/front/card/_card.scss
  • assets/include/scss/front/close/_close.scss
  • assets/include/scss/front/divider/_divider.scss
  • assets/include/scss/front/divider/_divider-style.scss
  • assets/include/scss/front/divider/_divider-vertical.scss
  • assets/include/scss/front/dropdown/_dropdown.scss
  • assets/include/scss/front/forms/checkbox/_checkbox-bordered.scss
  • assets/include/scss/front/go-to-section/_go-to-vertical-arrow.scss
  • assets/include/scss/front/indicators/_indicator-dots.scss
  • assets/include/scss/front/indicators/_indicator-vertical-line.scss
  • assets/include/scss/front/indicators/_indicator-vertical-dashed.scss
  • assets/include/scss/front/navs/_navs.scss
  • assets/include/scss/front/stats/_stats-progress.scss
  • assets/include/scss/front/svg/_svg.scss
  • assets/include/scss/front/svg/_svg-ie.scss
  • assets/js/components/hs.unfold.js
  • assets/js/components/hs.summernote-editor.js
  • assets/js/components/hs.clipboard.js
  • assets/js/components/hs.datatables.js
  • html/classic-consulting.html
  • html/corporate-agency.html
  • html/corporate-start-up.html
  • html/page-contacts-agency.html
  • html/page-hire-us.html
  • html/page-pricing.html
  • html/page-careers.html
  • html/page-services-start-up.html
  • html/page-faq.html
  • html/page-terms.html
  • html/page-about-agency.html
  • html/page-about-start-up.html
  • html/page-services-agency.html
  • assets/vendor/summernote/

v2.4 - 4 April, 2019

New App Payment home page.

New App Software home page.

New Customers inner page.

New Customer story inner page.

New Search push down (Inspired by Ionic) option added.

New Background overlay option to the hs.unfold.js.

New Background soft color.

New Dropzone drag'n'drop file uploader plugin.

New Summernote editor options.

New Utility classes.

Dropped Dropped assets/scss/front/utilities/_overflow.scss file in favor of Bootstrap .overflow classes.

Enhanced Documentation.

List of important updated files

  • assets/scss/front/utilities/_sizing.scss
  • assets/scss/front/utilities/_position-spaces.scss
  • assets/scss/front/utilities/_gradients-overlay.scss
  • assets/scss/front/list/_list-group.scss
  • assets/scss/front/svg/_svg-ie.scss
  • assets/scss/front/divider/_divider.scss
  • assets/scss/front/divider/_divider-sizes.scss
  • assets/scss/front/svg/_svg-ie.scss
  • assets/svg/components/abstract-shapes-7.svg
  • assets/js/components/hs.unfold.js
  • assets/js/components/hs.slick-carousel.js
  • assets/js/components/hs.svg-injector.js
  • assets/js/components/hs.datatables.js
  • assets/js/components/hs.selectpicker.js
  • html/account-activity.html
  • html/house/property-seller.html

v2.3 - 14 March, 2019

New Status page.

New Timeline feature.

New Added a new spinner loading component.

New Added a new iOS style switch (a modifier class to our custom checkboxes).

New Added responsive .list-group-horizontal modifier classes for displaying list groups as a horizontal row.

Enhanced .custom-checkbox disabled state color.

Enhanced .btn classes in the navigation of the Account pages with the help of .text-nowrap class.

Enhanced button styles.

Enhanced Documentation.

Fixed hs.hamburger.js active class.

Fixed .badge-md line height issue.

Fixed Testimonials spacing issue on vertical Slick Carousel options.

Fixed type="" added to the buttons where it was not.

Fixed .custom-checkbox line height issue.

Fixed .form-control size style removed for the .input-group-lg class.

Fixed .btn-soft-* color issues on hover states.

Fixed hs.video-player.js autoplay option added.

Fixed hs.fancybox.js autoplay slideshow option added.

Fixed Password hint validation.

Migrating to v2.3

Moving from Front v2.2.1 to the latest v2.3 release, there are some notable changes.

Breaking changes

  • Dropped .checkbox-switch styles in favor of Bootstrap .custom-switch classes.
  • Dropped hs.video-player.js now called via data-video-id attribute rather than iframe. For more information, see Video player

List of important updated files

  • assets/include/scss/front/_variables.scss
  • assets/include/scss/front/forms/_form-sizes.scss
  • assets/include/scss/front/forms/checkbox/_checkbox-switch.scss
  • assets/include/scss/front/mixins/_buttons.scss
  • assets/include/scss/front/buttons/_button-custom.scss
  • New assets/include/scss/front/spinner/
  • New assets/include/scss/front/forms/checkbox/_custom-checkbox.scss
  • assets/include/vendor/bootstrap/
  • assets/include/vendor/font-awesome/
  • assets/js/components/hs.video-player.js
  • assets/js/components/hs.fancybox.js
  • All html/account/ pages
  • html/job/freelancers-grid.html
  • html/job/freelancers-grid-side-filter.html
  • html/job/freelancers-list.html
  • html/job/freelancers-list-side-filter.html
  • html/job/jobs-grid.html
  • html/job/jobs-grid-side-filter.html
  • html/job/jobs-list.html
  • html/job/jobs-list-side-filter.html
  • html/portfolio-agency.html
  • html/blog-business.html
  • html/blog-agency.html
  • html/onepage-creative.html
  • html/page-about-agency.html
  • html/page-careers.html

v2.2.1 - 18 February, 2019

Enhanced Documentation.

Fixed HS Megamenu collapse on small devices.

List of important updated files

  • assets/vendor/hs-mega-menu/dist/hs-mega-menu.min.js
  • assets/include/scss/front/front/vendor/animate.scss

v2.2 - 09 February, 2019

New House inner pages.

New Utility classes.

Enhanced Documentation.

Fixed Validation forms.

Fixed HS GoTo issue on iOS.

Fixed HS Unfold bug with Esc keyboard button.

Fixed HS Megamenu hideTimeOut issue.

Fixed HS Range slider bug with Charts.

List of important updated files

  • New - assets/include/scss/front/dropdown/_dropdown-sizes.scss
  • assets/include/scss/front/_variables.scss
  • assets/include/scss/front/utilities/_margin.scss
  • assets/include/scss/front/scss/arrows/_slick-arrow.scss
  • assets/include/scss/front/front/vendor/animate.scss
  • assets/js/hs.ion-range-slider.js
  • assets/js/components/hs.unfold.js
  • assets/vendor/hs-mega-menu/dist/hs-mega-menu.min.js
  • html/classic-marketing.html
  • html/corporate-start-up.html
  • html/onepage-creative.html
  • html/house/index.html
  • html/shop-classic.html
  • html/shop-masonry.html
  • html/shop-single-product.html
  • html/shop-checkout.html
  • html/account-edit-profile.html
  • html/page-about-agency.html
  • html/page-contacts-start-up.html
  • html/page-hire-us.html

v2.1.1 - 05 January, 2019

New jQuery Password Strength Bootstrap plugin

New hs.password-strength.js library

New Password strength documentation page

New Clipboard options

New Utility classes

Enhanced hs.unfold.js and added data-unfold-target-is-menu attribute.

Enhanced Documentation.

List of important updated files

  • New - node_modules/pwstrength-bootstrap/
  • New - assets/js/components/hs.password-strength.js
  • assets/js/components/hs.unfold.js
  • assets/js/components/hs.clipboard.js
  • assets/include/scss/front/utilities/_sizing.scss
  • html/account-change-password.html

v2.1 - 22 December, 2018

New Jobs inner pages.

New Header layout

New Utility classes

Enhanced Documentation.

Breaking changes

  • Dropped .u-label styles in favor of .btn classes.

Please Note!

If you do not want to integrate the breaking changes, you may keep the labels SASS file in your folder and use the old classes.

v2.0.2 - 04 December, 2018

Enhanced Documentation.

Fixed hs.megamenu.js issue on iPad devices.

Fixed Conflicting Bootstrap Select plugin with hs.unfold.js.

Fixed Bootstrap active button style on checkbox and radio buttons.

Fixed Bootstrap select copy-code snippet wrong class naming.

Fixed Some linking issues.

v2.0.1 - 15 November, 2018

Enhanced Documentation.

Enhanced hs.scroll-nav.js file.

Fixed Anchor offset issue in the Documentation pages.

Fixed onepage-saas.html Pricing block's SVG component (.ie-abstract-shapes-11) in IE browser.

v2.0 - 07 November, 2018

New 3 home pages

New Invoice page

New FAQ pages

New IE supported now

New Utility classes

New List group

New Header gradient option

New Toggle topbar Header option

New Set of new SVG Icons

New Login pages

New Player.js plugin

New SVG-injector plugin

New Range Slider plugin

Enhanced unfold.js (Dropdown) accessibility

Enhanced hs.video-player.js

Fixed Google Map degradation issue.

Fixed Bootstrap select style issue on page load

Fixed mega-menu.js click function

Fixed header-collapse not collapsing issue

Fixed hs.datatables.js pagination issue with .active state

Fixed Font size rendering

Fixed Font awesome prefix classing where fa- classes changed to fas-

Fixed hs.go-to.js plugin disappearing issue on scroll

Fixed page-contacts-agency.html horizontal scrollbar issue on icon blocks.

Fixed classic-crypto.html Blog news's image alignment issue fixed with .w-100 class to the parent.

Fixed custombox visibility issue in IE.

Fixed page-services-start-up.html pricing pagination issue.

Fixed horizontal scrolling issue in Subscribe forms.

Migrating to v2

Front v2 is a major rewrite of the entire template. The most notable changes are summarized below, followed by more specific changes to relevant components.

v2 comes with the bulk of breaking changes, hence, below are the breaking changes to bear in mind when moving from v1.3 to v2 or any older version of Front.

Breaking changes

  • Refactored nearly all components to use more un-nested class selectors instead of over-specific children selectors.
  • bootstrap.css file merged to the theme.css.
  • bootstrap.css file removed from all HTML-files.
  • Main Front SCSS file renamed to theme.scss.
  • Main Front CSS file renamed to theme.css.
  • Main Front JS file renamed to theme.js.
  • Helper JS files moved to the components folder.
  • $g- variable prefix dropped to optimize the variables with Bootstrap variables, and to avoid duplications.
  • Dropped Unfold styles in favor of Bootstrap .dropdown menu.
  • Switched from px-to-rem mixing to plain rem.
  • Dropped .u- prefix from utility classes.
  • Buttons
    • Dropped .u- prefix from button classes in favor of Bootstrap naming classes.
    • Renamed .u-button-*--air classes to .btn-*-soft.
  • Badges
    • Dropped .u- prefix from badge classes in favor of Bootstrap naming classes.
    • Improved badge positioning.
    • Renamed .u-badge-border-* classes to .badge-outline-*.
  • Forms
    • Renamed u-form-layouts in favor of Bootstrap naming classes.
    • Dropped some u-form-layouts classes and extended Bootstrap form classes.
    • Dropped .u- prefix from .u-file-attachment-* classes.
    • Dropped .u- prefix from .u-checkbox-* classes.
  • Components that are dropped in favor of .card
    • .u-pricing-v1, and .u-pricing-v2 classes
    • modal-windows
    • .u-blog-overlay-v1 class
    • .blog-masonry blocks.
    • shop-cart.html Shipment blocks
    • shop-checkout.html Order summary content
    • classic-crypto.html Bitcoin charts blocks
    • corporate-agency.html Team blocks
    • corporate-business.html Hero card blocks
    • corporate-business.html Pricing blocks
    • landing-house.html Products blocks
    • landing-job.html Hiring blocks
    • portfolio-agency.html Hire Us blocks
    • classic-marketing.html News and Features blocks
    • blog-start-up.html News blocks
    • blog-agency.html News blocks
    • Sidebar news blogs classes.
    • blog-classic News blocks.
    • blog-grid News blocks.
    • blog-list News blocks.
    • blog-masonry News blocks.
    • work-masonry News blocks.
    • work-modern News blocks.
    • landing-house.html Testimonials blocks
    • classic-consulting.html Testimonials blocks
    • blog-agency.html Testimonials blocks
    • shop-classic.html Product blocks
    • shop-masonry.html Product blocks
    • page-privacy.html content.
    • page-terms.html sticky-block nav.
    • page-help.html sticky-block nav.
    • page-services-agency.html Get Started with Front blocks.
    • shop-classic.html Testimonials blocks.
    • about-start-up.html Testimonials blocks.
    • account-members.html Members block.
    • account-members-list.html Members block.
    • account-activity.html Activity table block.
    • account-my-tasks.html Tasks table block.
    • account-plans.html Pricing blocks.
    • account-projects-list.html Projects blocks.
    • account-profile.html Sibebar blocks.
  • Components that are dropped in favor of .list-group
    • All Footers list groups.
    • account-profile.html List groups.
    • page-terms.html sticky-blocks.
    • page-help.html sticky-blocks.
  • Dropped Cubeportfolio plugin from .blog-masonry blocks.
  • Dropped .u- prefix from progress-vertical classes.
  • Dropped .u-info-v1, and .u-info-v2 classes, and replaced with .card-frame class.
  • Dropped mixins/_breakpoint.scss in favor of Bootstrap mixins.
  • Dropped list-style.scss file and replaced with Bootstrap list-groups.
  • Dropped .u-md-avatar in favor of .u-avatar class.
  • Updated hs.chart-pie.js.
  • Refactored position classes in favor of Bootstrap naming classes. See Position classes.
  • Refactored video-player blocks.
  • Refactored hs.chart-pie.js file.
  • Stats blocks in the classic-consulting.html file are not dynamic rather than static SVG.
  • Previous Front content spacing utility classes rewritten with $content-space mixins and renamed in favor of Bootstrap naming classes. See Spacing classes.
  • Renamed $midnightblue to the Bootstrap's $indigo variable.
  • Renamed $social-network-colors to $secondary-colors.
  • Renamed .u-font-size-* to .font-size-*. See Font size classes.

Global changes

  • SVG
    • Refactored SVG elements to make their classes and IDs unique to give them unique styles.
    • Plain SVG codes removed from HTMl-pages and called through img tag.
  • Dropped skippy across all HTML-pages.

Dropped

  • Dropped front.scss, front-core.scss, and front-components.scss SCSS files. All these files merged to the theme.scss file. Since there was no a reason to divide them.
  • Removed the unused _staggered-transition-delay.scss mixin. It was just extra code.
  • Dropped _space.scss file.
  • Dropped overflow: hidden; from main tag.
  • Dropped body and html tag styles to use stick to the Bootstrap Reboot.
  • Dropped _modal-window-account.scss, _modal-window-shopping-cart.scss, and _modal-window-subscribe.scss files, since their only style was width. However, their styles are now given through HTML inline style.
  • Dropped _news-blog-overlay-v1.scss class in favor of utility classes. Use Background gradient overlay classes instead now.
  • Dropped scss/front/unfold/ folder.
  • Dropped .u-icon in favor of .btn classes.
  • Dropped search-classic style in favor of utility classes.
  • Dropped shopping-cart style in favor of explicit .card classes.
  • Dropped duplicated Sidebar examples from header-layouts.html page.
  • Dropped .u-sidebar--cart and .u-sidebar__content--cart classes for simplicity's sake.
  • Dropped exit-intend plugin from blog-agency.html page.
  • Dropped forms/toggle-state/ folder.
  • Dropped forms/form-steps/ folder.
  • Dropped .u-form-steps classes in favor of .nav classes. Use Nav classes instead now.
  • Dropped Instagram plugin from demo pages due to a continuous data token error. However, the plugin is still available in the Documentation page.
  • Dropped px-to-rem mixin in favor of plain rem.
  • $accent-colors dropped.
  • Dropped @icon-elements mixin in favor of plain SCSS style.
  • Dropped .theme-color function.
  • Removed the unused .mx-gutters-5 class.
  • Dropped .u-form--modern in favor of a default form style.

Optimized

  • Moved scss/vendor/ folder to the scss/front/ folder.
  • Moved scss/vendor/bootstrap.scss file to the scss/ folder.
  • scss/mixins/_border-radius.scss optimized.
  • scss/mixins/_buttons.scss optimized.
  • Large and responsive spacing issues on small devices optimized.
  • footers optimized.
  • Moved _typo-font-sizes.scss and _typo-font-weight.scss utilities to the utilities/_text.scss file.
  • Moved scss/front/colors/ utility folder to the scss/front/utilities/ folder.
  • Moved scss/front/links/ utility folder to the scss/front/utilities/_links.scss folder.
  • Merged _height.scss utility file with _sizing.scss file.

Miscellaneous

  • Dropped data-bg-img-src JS function in favor of HTML inline style.
  • Dropped $teal-darker, $cyan-darker, $red-darker colors.
  • .u-sidebar--cart__footer-offset class renamed to .u-sidebar__cart-footer-offset.
  • Renamed scss/vendor/_border-radius.scss file to _border.scss.
  • @media breakpoint sizes are fixed according to Bootstrap's latest changes.
  • _area-chart.scss file moved to scss/front/vendor/area-chart/_area-chart.scss folder.
  • datatable/ folder moved to scss/front/vendor/ folder.
  • datepicker/ folder moved to scss/front/vendor/ folder.
  • forms/select/ folder moved to scss/front/vendor/ folder.
  • forms/summernote/-editor folder moved to scss/front/vendor/ folder.
  • forms/tagsinput/ folder moved to scss/front/vendor/ folder.
  • Replaced .u-labels on Blog pages with .btn classes.
  • Replaced SVG background .content-centered class to .content-centered-y in page-maintenance-mode.html page.
  • Replaced SVG background .content-centered class to .content-centered-y in page-privacy.html page.
  • Replaced SVG background .content-centered class to .content-centered-y in portfolio-case-studies-modern.html page.
  • Replaced Video Background's SVG background .content-centered class to .content-centered-y in page-careers.html page.
  • Replaced assets/img/64x64/ images with 100x100 images due to low quality.
  • Bootstrap's $indigo variable enabled.
  • img tags are now wrapped with .u-*-avatar classes for better usability.
  • .u-*-avatar sizes are improved to match the .btn-icon sizes.
  • Added data-adaptive-height="true" to the Pricing section to the classic-consulting.html, and page-pricing.html pages.
  • Changed .u-slick-gutters-3 from 16px to 15px.

Class changes

Front v1.x Front v2
.u-button-*--air .btn-*-soft
.u-badge-border-* .badge-outline-*
.u-font-size-14 .font-size-1
.u-font-size-20 .font-size-2
.u-font-size-32 .font-size-3
.u-font-size-48--md-down .font-size-md-down-5
.u-card-header .card-collapse
.u-select .dropdown-select
.u-toggle__toggle .link-muted__toggle and .btn-toggle
.u-checkbox-brd .checkbox-outline
.u-indicator-ver-dashed .u-indicator-vertical-dashed
.u-paging-v1 .u-paging-modern
.u-blog-thumb-v1 .u-blog-thumb-minimal
.u-gmap-v1 .u-gmap-interactive
.u-stats-v1 .u-stats-progress
.u-stats-v2 .u-area-chart
.u-slick-paging-v1 .u-slick-paging
.u-slick-pagination-testimonials-v1 .u-slick-pagination-interactive
.opacity-0_2 .opacity-xs
.u-file-attachment-v1 .u-file-attachment-link
.text-light .text-white-70
.u-bg-transparent .btn-bg-transparent
.u-checkbox-btn .btn-custom-toggle-primary
.u-icon .btn
.u-icon--xs .btn-xs.btn-icon
.u-icon--sm .btn-sm.btn-icon
.u-icon--md .btn-icon
.u-icon--lg .btn-lg.btn-icon
.u-icon__inner .btn-icon-inner
.u-icon__inner .btn-icon-inner
.u-icon__inner .btn-icon-inner-bottom-minus
.u-icon--* .btn-*
.u-icon-*--air .btn-soft-*
.z-index-minus-1 .z-index-n1
.ml-offset-2 .ml-n2
.ml-offset-3 .ml-n3
.mt-offset-1 .mt-n1
.mt-offset-5 .mt-n5
.mt-offset-6 .mt-n6
.mt-offset-9 .mt-n9
.mt-offset-23 .mt-n23
.mb-offset-3 .mb-n3
.mb-offset-9 .mb-n9

v1.3 - 05 August, 2018

New Account pages added

New Circles (Pie Charts) added

New Datatables added

New Flatpickr added

New Bootstrap Select added

New Bootstrap Tagsinput added

New Summernote WYSIWYG Editor added

New Toggle state added

New Utility classes

Removed <meta http-equiv="x-ua-compatible" content="ie=edge"> in all HTML files.

Fixed Instagram Image resolution

Fixed Header Nav Link icon rotation

Fixed .info-v2 changed to .u-info-v2 at the following pages:

  1. snippets/pricing.html
  2. snippets/info.html
  3. landing-job.html
  4. corporate business.html

Fixed Logo alignment issue at the following pages:

  1. snippets/headers/header-default-one-page-navigation.html
  2. snippets/headers/header-default-one-page-navigation-with-dropdown.html
  3. snippets/headers/header-default-one-page-navigation-with-dropdown-links.html

Fixed Scrollbar issue at the following pages:

  1. snippets/headers/header-default-floating.html
  2. snippets/headers/header-default-absolute-second-screen.html
  3. snippets/headers/header-default-absolute-bottom.html

Enhanced Scrollbar optimization stylesheets

  1. _header-floating.scss
  2. _header-absolute-position.scss

Enhanced vertical-align: baseline; added to our SVG styles.

Enhanced Bordered Badge colors in _badge-style.scss updated

Enhanced Vertical progress bar

Enhanced Bootstrap Popover enabled

v1.2 - 05 June, 2018

New Landing House Home page added

New Landing Job Home page added

New Corporate Business Home page added

New Tables documentation page added

New Utility classes added

Fixed snippets/headers/header-sidebar-right.html menu links fixed.

Fixed "Dark-to-white on scroll" wrong linking issue fixed on snippets/header-layouts.html.

Fixed confirm_password init function changed to confirmPassword.

Fixed Search Classic visibility issue fixed

Enhanced hs.go-to.js - Now you can use it as a link

Enhanced Documentation

v1.1 - 13 May, 2018

New Sketch version added

Fixed scss/dropdown/ folders and its _dropdown.scss along with _dropdown-country.scss files changed to unfold

Fixed slick-carousel-preloader-black.svg file name renamed to slick-carousel-preloader-primary.svg

Fixed Instagram API invalid token issue fixed

Fixed Wrong spelling of the .text-lu-left and .text-lu-right classes fixed at the following pages:

  1. blog-agency.html
  2. page-careers.html
  3. portfolio-case-studies-modern.html
  4. snippets/hero/snippets-hero-12.html
  5. snippets/form-layouts.html pages

Fixed data-compensation="#header" attribute removed from content "go-to" markups at the following pages:

  1. careers.html
  2. crypto.html
  3. shop-classic.html
  4. shop-masonry.html
  5. snippets/snippets-hero-2.html
  6. snippets/snippets-hero-19.html
  7. snippets/snippets-hero-33.html
  8. snippets/snippets-hero-34.html

v1.0 - Initial release.