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 Space copy. If you come across with any problems with Space 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.v4.1
- 06 December, 2021
New Coming Soon
New Office Club Illustration package
Enhanced
Bootstrap
.container
class width across different resolutions
Enhanced
HS Header
fixMoment
function
Enhanced
HS Step Form Validation
Enhanced
HS Step Form Ajax option
Enhanced
By default color added to the
.card-text
class
Enhanced
Tom Select input placeholder color improvements
Enhanced
min-width
of 9rem
added to the HS Quantity Counter
Fixed
HS Mega Menu on click issue
Fixed
HS Scrollspy when the content is too long before the first content to the ID
更新
Swiper from
v6.7.5
to v7.0.8
List of dropped SCSS-files
assets/scss/front/_variables.scss
assets/scss/front/card/_card.scss
assets/scss/front/nav/_nav.scss
assets/scss/front/list/_list-padding.scss
assets/scss/front/tom-select/_tom-select.scss
assets/scss/front/vendor/_quantity-counter.scss
List of updated JS-files/folders
assets/vendor/hs-header
assets/vendor/hs-mega-menu
assets/vendor/hs-scrollspy
assets/vendor/hs-step-form
Migrating to v4
Front v4.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 v3.x
to v4.0
or any older version of Front.
The most notable improvements made in Front v4.0
- Bootstrap v5 - Built on top of the latest Bootstrap v5.
- JavaScript - jQuery is fully dropped as a dependency and all libraries and
js
files are fully vanilla JS now. - HTML - classes and code structure optimized.
- SCSS - all files and styled updated.
- Headers (Navbars) - completely rewritten from scratch.
v4.0
- 20 August, 2021
New Base Components such as Lists, Cards and others
Enhanced
.blockquote
style changed to .blockquote-left-border
Enhanced
.card-body-centered
changed to .card-centered
and now placed next to a .card
class, instead of a .card-body
class
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
hs-video-bg
classes are now .video-bg
rather than utility classes
Enhanced
Illustrations
更新
Bootstrap from
4.6.0
to v5.1
Dropped
jQuery library
Dropped
Internet Explorer support
Dropped
FontAwesome dropped in favor of Bootstrap Icons
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
Dzsparallaxer library
Dropped
Cubeportfolio dropped in favor of Shuffle.js
Dropped
Slick Carousel dropped in favor of Swiper
Dropped
jQuery Countdown dropped in favor of Countdown.js
Dropped
Input Mask dropped in favor of imask.js
Dropped
Indigo color palette
Dropped
证券投资 Masonry
page
Dropped
证券投资 Modern
page
Dropped
证券投资 - Single Page List
page
Dropped
证券投资 - Single Page Masonry
page
Dropped
Footer
variant-4.html
dropped in favor of main footer
Dropped
Footer
variant-2.html
Dropped
Search Slide Down
Dropped
Search Push Down dropped in favor of new Offcanvas Search
Dropped
.avatar-border
classes dropped in favor of utility classes
Dropped
.avatar-border-lg
class
Dropped
.sidebar
dropped in favor of Bootstrap Offcanvas
Dropped
.table-heighlighted
class
Dropped
.table-light-bordered
class
Dropped
.gradient-x-overlay-sm-indigo
in favor of .gradient-x-overlay-sm-primary
Dropped
11: ($spacer * 5)
(eg., .m-11
, .p-11
and etc. classes))
Dropped
.btn-custom-toggle-*
color palettes
Dropped
.btn-group-sm
class
Dropped
.btn-wide
and .btn-sm-wide
classes
Dropped
.btn-pill
dropped in favor of utility classes
Dropped
.breadcrumb-no-gutter
class
Dropped
.breadcrumb-no-gutter
class
Dropped
.card-columns
dropped in favor of .row
class
Dropped
.card-gutters
dropped in favor of .row
class
Dropped
.card-*-count
dropped in favor of .row
class
Dropped
.card-*-gap
dropped in favor of .row
class
Dropped
.card-bg-light
dropped in favor of utility class
Dropped
.card-frame
class
Dropped
.card-hover-shadow
class
Dropped
.card-dropdown
class
Dropped
.card-no-gutters
class
Dropped
.clients
dropped in favor of .avatar
classes
Dropped
.divider-text
dropped in favor of default style
Dropped
.dropdown-menu-sm
and .dropdown-menu-lg
sizes
Dropped
.dropdown-nav-link
class
Dropped
.checkbox-icon
, .checkbox-outline
and .custom-checkbox
dropped in favor of new Form Check Card
Dropped
.file-attachment-input
class
Dropped
.custom-select-pill
class
Dropped
.form-control-pill
class
Dropped
.input-group-pill
class
Dropped
.input-group-add-field-delete
class
Dropped
.input-group-flush
class
Dropped
.link-icon
class
Dropped
.header-section
class
Dropped
.header-section-divider
class
Dropped
.left-aligned-navbar
dropped and now by default it's left aligned
Dropped
.center-aligned-navbar
class
Dropped
.navbar-navbar-toggler
dropped in favor of .navbar-toggler
Dropped
.navbar-nav-wrap-toggler
dropped in favor of .navbar-toggler
Dropped
.navbar-nav-wrap-collapse
dropped in favor of .navbar-collapse
Dropped
.navbar-nav-wrap-content
dropped in favor of .nav-wrap-secondary-content
Dropped
.navbar-nav-item
dropped in favor of .nav-item
Dropped
.navbar-nav-last-item
class
Dropped
.navbar-promo-card
dropped in favor of .navbar-dropdown-menu-promo-item
Dropped
.navbar-promo-card-deck
dropped in favor of .navbar-dropdown-menu-promo
Dropped
.navbar-promo-card-body
class
Dropped
.navbar-promo-icon
dropped in favor of .svg-icon
Dropped
.navbar-promo-title
dropped in favor of .navbar-dropdown-menu-media-title
Dropped
.navbar-promo-text
dropped in favor of .navbar-dropdown-menu-media-text
Dropped
.navbar-promo-card-footer
class
Dropped
.navbar-promo-card-footer-item
class
Dropped
.navbar-promo-card-footer-text
class
Dropped
.navbar-promo-card-footer-ver-divider
class
Dropped
.navbar-nav-wrap-content
class
Dropped
.navbar-nav-wrap-toggler
class
Dropped
.navbar-nav-wrap-collapse
class
Dropped
.header-white-bg-on-scroll
class
Dropped
.nav-*-break
dropped in favor of HS Nav Scroller
Dropped
.nav-classic
class
Dropped
.nav-list-y-1
and .nav-list-y-2
classes
Dropped
.nav-x-0
class
Dropped
.nav-x-sm
class
Dropped
.nav-y-0
class
Dropped
.nav-shadow
class
Dropped
.nav-rounded
class
Dropped
.nav-white
class
Dropped
.nav-border-white
class
Dropped
.nav-box
class
Dropped
.scrollbar
and .scrollbar-horizontal
classes
Dropped
.shadow-primary-lg
class
Dropped
.font-size-*
dropped in favor of Bootstrap .fs-*
classes
Dropped
.text-lh-*
dropped in favor of Bootstrap .lh-*
classes
Dropped
.transition-3d-hover
dropped, and replaced with .card-transition
for .card
cases and .btn-transition
for button cases
Dropped
.transition-zoom-hover
dropped in favor of .card-transition
Dropped
.border-dashed
class
Dropped
.text-hover-primary
dropped in favor of .text-inherit
Dropped
.rounded-lg-pseudo
classes
Dropped
.opacity-*
classes
Dropped
.shadow-soft
dropped in favor of .shadow-sm
Dropped
All sizing classes
Dropped
svg/components/quote.svg
dropped in favor of inline styling
Dropped
svg/components/abstract-shapes-1.svg
SVG element
Dropped
svg/components/abstract-shapes-6.svg
dropped in favor of new svg/components/card-9.svg
Dropped
svg/components/abstract-shapes-7.svg
dropped in favor of new svg/components/card-8.svg
Dropped
svg/components/abstract-shapes-8.svg
dropped in favor of svg/components/card-7.svg
Dropped
svg/components/abstract-shapes-10.svg
dropped in favor of svg/components/shape-5.svg
Dropped
svg/components/abstract-shapes-11.svg
dropped in favor of inline styling
Dropped
svg/components/abstract-shapes-16.svg
dropped in favor of svg/components/card-10.svg
Dropped
svg/components/abstract-shapes-17.svg
SVG element
Dropped
svg/components/abstract-shapes-18.svg
SVG element
Dropped
svg/components/arrow-pointer-lg-up.svg
SVG element
Dropped
svg/components/arrow-pointer-up.svg
SVG element
Dropped
svg/components/browser.svg
SVG element
Dropped
svg/components/circle-preloader.svg
SVG element
Dropped
svg/components/close.svg
SVG element
Dropped
svg/components/converge.svg
SVG element
Dropped
svg/components/dots-1.svg
dropped in favor of new svg/components/dots.svg
Dropped
svg/components/dots-2.svg
dropped in favor of new svg/components/dots.svg
Dropped
svg/components/dots-3.svg
dropped in favor of new svg/components/dots.svg
Dropped
svg/components/dots-4.svg
dropped in favor of new svg/components/dots.svg
Dropped
svg/components/graphics-10.svg
SVG element
Dropped
svg/components/graphics-11.svg
SVG element
Dropped
svg/components/half-iphone-x.svg
SVG element
Dropped
svg/components/ipad.svg
SVG element
Dropped
svg/components/ipad-horizontal.svg
SVG element
Dropped
svg/components/iphone-x.svg
SVG element
Dropped
svg/components/lines.svg
dropped in favor of Bootstrap icon
Dropped
svg/components/macbook.svg
SVG element
Dropped
svg/components/three-pointers.svg
SVG element
Renamed classes
Front v3.x | Front v4.0 |
---|---|
.js-text-animation
|
.js-typedjs
|
.js-switch-text
|
.js-toggle-switch
|
.z-index-*
|
.zi-*
|
.avatar-4by3
|
.avatar-4x3
|
.card-no-gutters
|
.card-reset
|
.column-divider-*
|
.col-*-divider
|
.custom-checkbox-bookmark
|
.form-check-bookmark
|
.input-label-secondary
|
.form-label-secondary
|
.bg-img-hero
|
.bg-img-start
|
.bg-img-hero-bottom
|
.bg-img-end
|
.bg-img-hero-center
|
.bg-img-center
|
.space-*
|
.content-space-*
|
.stats-progress
|
.circles-chart
|
.stats-progress-info
|
.circles-chart-content
|
.header-*
|
.navbar-*
|
.js-navbar-fix-moment
|
.navbar-scrolled
|
.header-hide-content
|
.navbar-topbar
|
.header-box-shadow
|
.navbar-shadow
|
.header-box-shadow-on-scroll
|
.navbar-shadow-on-scroll
|
.navbar-promo
|
.navbar-dropdown-menu-promo
|
.navbar-promo-item
|
.navbar-dropdown-menu-promo-item
|
.navbar-promo-link
|
.navbar-dropdown-menu-promo-link
|
.navbar-promo-title
|
.navbar-dropdown-menu-media-title
|
.navbar-banner
|
.navbar-dropdown-menu-banner
|
.navbar-banner-content
|
.navbar-dropdown-menu-banner-content
|
.navbar-product-banner
|
.navbar-dropdown-menu-shop-banner
|
.navbar-product-banner-content
|
.navbar-dropdown-menu-shop-banner-content
|
.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
|
.page-preloader-content-centered
|
.page-preloader-middle
|
.file-attachment-btn
|
.form-attachment-btn
|
.file-attachment-btn-label
|
.form-attachment-btn-label
|
.transform-rotate-1
|
.transform-rotate-n40deg
|
.transform-rotate-5
|
.transform-rotate-n22deg
|
.gradient-x-overlay-sm-indigo
|
.gradient-x-overlay-sm-primary
|
.hero-v1
|
.banner-half-middle-x
|
.checkbox-outline
|
.form-check-card
|
.dz-dropzone-boxed
|
.dz-dropzone-card
|
Renamed SVG-files
Front v3.x | Front v4.0 |
---|---|
svg/components/abstract-shapes-2.svg
|
svg/components/shape-2.svg
|
svg/components/abstract-shapes-3.svg
|
svg/components/shape-3.svg
|
svg/components/abstract-shapes-4.svg
|
svg/components/shape-4.svg
|
svg/components/abstract-shapes-5.svg
|
svg/components/shape-7.svg
|
svg/components/abstract-shapes-9.svg
|
svg/components/shape-5.svg
|
svg/components/abstract-shapes-12.svg
|
svg/components/card-11.svg
|
svg/components/abstract-shapes-13.svg
|
svg/components/card-7.svg
|
svg/components/abstract-shapes-14.svg
|
svg/components/card-8.svg
|
svg/components/abstract-shapes-15.svg
|
svg/components/card-9.svg
|
svg/components/abstract-shapes-19.svg
|
svg/components/shape-6.svg
|
svg/components/abstract-shapes-20.svg
|
svg/components/wave-pattern-light.svg
|
svg/components/abstract-shapes-21.svg
|
svg/components/card-1.svg
|
svg/components/dots-5.svg
|
svg/components/dots.svg
|
svg/components/graphics-1.svg
|
svg/components/card-12.svg
|
svg/components/graphics-2.svg
|
svg/components/card-13.svg
|
svg/components/graphics-3.svg
|
svg/components/card-14.svg
|
svg/components/graphics-4.svg
|
svg/components/card-6.svg
|
svg/components/graphics-5.svg
|
svg/components/card-15.svg
|
svg/components/graphics-6.svg
|
svg/components/card-4.svg
|
svg/components/graphics-7.svg
|
svg/components/card-5.svg
|
svg/components/graphics-8.svg
|
svg/components/card-16.svg
|
svg/components/graphics-9.svg
|
svg/components/card-17.svg
|
svg/components/isometric-squares.svg
|
svg/components/isometric-squares-light.svg
|
Previous updates
You can view the history of previous updates here