2191 lines
78 KiB
HTML
2191 lines
78 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<!-- Required Meta Tags Always Come First -->
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||
|
||
<!-- Title -->
|
||
<title>Changelog - Documentation | Front - Multipurpose Responsive Template</title>
|
||
|
||
<!-- Favicon -->
|
||
<link rel="shortcut icon" href="../favicon.ico">
|
||
|
||
<!-- Font -->
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">
|
||
|
||
<!-- CSS Implementing Plugins -->
|
||
<link rel="stylesheet" href="../assets/css/vendor.min.css">
|
||
<link rel="stylesheet" href="../assets/vendor/bootstrap-icons/font/bootstrap-icons.css">
|
||
|
||
<!-- CSS Front Template -->
|
||
<link rel="stylesheet" href="../assets/css/theme.min.css?v=1.0">
|
||
<link rel="stylesheet" href="../assets/css/docs.css">
|
||
</head>
|
||
|
||
<body class="navbar-sidebar-aside-lg">
|
||
<!-- ========== HEADER ========== -->
|
||
<header id="header" class="navbar navbar-expand navbar-fixed navbar-end navbar-light navbar-sticky-lg-top bg-white">
|
||
<div class="container-fluid">
|
||
<nav class="navbar-nav-wrap">
|
||
<div class="row flex-grow-1">
|
||
<!-- Default Logo -->
|
||
<div class="docs-navbar-sidebar-container d-flex align-items-center mb-2 mb-lg-0">
|
||
<a class="navbar-brand" href="../documentation/index.html" aria-label="Space">
|
||
<img class="navbar-brand-logo" src="../assets/svg/logos/logo.svg" alt="Logo">
|
||
</a>
|
||
<a href="../documentation/changelog.html">
|
||
<span class="badge bg-soft-primary text-primary">v4.1</span>
|
||
</a>
|
||
</div>
|
||
<!-- End Default Logo -->
|
||
|
||
<div class="col-md px-lg-0">
|
||
<div class="d-flex justify-content-between align-items-center px-lg-5 px-xl-10">
|
||
<div class="d-none d-md-block">
|
||
<!-- Search Form -->
|
||
<form id="docsSearch" class="position-relative"
|
||
data-hs-list-options='{
|
||
"searchMenu": true,
|
||
"keyboard": true,
|
||
"item": "searchTemplate",
|
||
"valueNames": ["component", "category", {"name": "link", "attr": "href"}],
|
||
"empty": "#searchNoResults"
|
||
}'>
|
||
<!-- Input Group -->
|
||
<div class="input-group input-group-merge navbar-input-group">
|
||
<div class="input-group-prepend input-group-text">
|
||
<i class="bi-search"></i>
|
||
</div>
|
||
|
||
<input type="search" class="search form-control form-control-sm" placeholder="Search in docs" aria-label="Search in docs">
|
||
|
||
<a class="input-group-append input-group-text" href="javascript:;">
|
||
<i id="clearSearchResultsIcon" class="bi-x" style="display: none;"></i>
|
||
</a>
|
||
</div>
|
||
<!-- End Input Group -->
|
||
|
||
<!-- List -->
|
||
<div class="list dropdown-menu navbar-dropdown-menu-borderless w-100 overflow-auto" style="max-height: 16rem;"></div>
|
||
<!-- End List -->
|
||
|
||
<!-- Empty -->
|
||
<div id="searchNoResults" style="display: none;">
|
||
<div class="text-center p-4">
|
||
<img class="mb-3" src="../assets/svg/illustrations/oc-error.svg" alt="Image Description" style="width: 10rem;">
|
||
<p class="mb-0">No Results</p>
|
||
</div>
|
||
</div>
|
||
<!-- End Empty -->
|
||
</form>
|
||
<!-- End Search Form -->
|
||
|
||
<!-- List Item Template -->
|
||
<div class="d-none">
|
||
<div id="searchTemplate" class="dropdown-item">
|
||
<a class="d-block link" href="#">
|
||
<span class="category d-block fw-normal text-muted mb-1"></span>
|
||
<span class="component text-dark"></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<!-- End List Item Template -->
|
||
</div>
|
||
|
||
<!-- Navbar -->
|
||
<ul class="navbar-nav p-0">
|
||
<li class="nav-item">
|
||
<a class="btn btn-ghost-secondary btn-sm" href="https://htmlstream.com/contact-us" target="_blank">
|
||
Get Support <i class="bi-box-arrow-up-right ms-1"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="btn btn-primary btn-sm" href="../index.html">
|
||
<i class="bi-eye me-1"></i> Preview Demo
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<!-- End Navbar -->
|
||
</div>
|
||
</div>
|
||
<!-- End Col -->
|
||
</div>
|
||
<!-- End Row -->
|
||
</nav>
|
||
</div>
|
||
</header>
|
||
<!-- ========== END HEADER ========== -->
|
||
|
||
<!-- ========== MAIN CONTENT ========== -->
|
||
<main id="content" role="main">
|
||
<!-- Navbar -->
|
||
<nav class="js-nav-scroller navbar navbar-expand-lg navbar-sidebar navbar-vertical navbar-light bg-white border-end"
|
||
data-hs-nav-scroller-options='{
|
||
"type": "vertical",
|
||
"target": ".navbar-nav .active",
|
||
"offset": 80
|
||
}'>
|
||
<!-- Navbar Toggle -->
|
||
<button type="button" class="navbar-toggler btn btn-white d-grid w-100" data-bs-toggle="collapse" data-bs-target="#navbarVerticalNavMenu" aria-label="Toggle navigation" aria-expanded="false" aria-controls="navbarVerticalNavMenu">
|
||
<span class="d-flex justify-content-between align-items-center">
|
||
<span class="h3 mb-0">Nav menu</span>
|
||
|
||
<span class="navbar-toggler-default">
|
||
<i class="bi-list"></i>
|
||
</span>
|
||
|
||
<span class="navbar-toggler-toggled">
|
||
<i class="bi-x"></i>
|
||
</span>
|
||
</span>
|
||
</button>
|
||
<!-- End Navbar Toggle -->
|
||
|
||
<!-- Navbar Collapse -->
|
||
<div id="navbarVerticalNavMenu" class="collapse navbar-collapse">
|
||
<div class="navbar-brand-wrapper border-end" style="height: auto;">
|
||
<!-- Default Logo -->
|
||
<div class="d-flex align-items-center mb-3">
|
||
<a class="navbar-brand" href="../documentation/index.html" aria-label="Space">
|
||
<img class="navbar-brand-logo" src="../assets/svg/logos/logo.svg" alt="Logo">
|
||
</a>
|
||
<a class="navbar-brand-badge" href="../documentation/changelog.html">
|
||
<span class="badge bg-soft-primary text-primary ms-2">v4.1</span>
|
||
</a>
|
||
</div>
|
||
<!-- End Default Logo -->
|
||
|
||
<!-- Nav -->
|
||
<ul class="nav nav-segment nav-fill nav-justified">
|
||
<li class="nav-item">
|
||
<a class="nav-link active" href="../documentation/index.html">Docs</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="../snippets/index.html">Snippets</a>
|
||
</li>
|
||
</ul>
|
||
<!-- End Nav -->
|
||
</div>
|
||
|
||
<div class="docs-navbar-sidebar-aside-body navbar-sidebar-aside-body">
|
||
<ul id="navbarSettings" class="navbar-nav nav nav-vertical nav-tabs nav-tabs-borderless nav-sm">
|
||
<li class="nav-item">
|
||
<span class="nav-subtitle">Documentation</span>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/index.html">Introduction</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<span class="nav-subtitle">Getting started</span>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/getting-started.html">Getting Started</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/gulp.html">Gulp</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/customization.html">Customization</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/credits.html">Credits</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link active" href="../documentation/changelog.html">Changelog</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<span class="nav-subtitle">Design & Graphics</span>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/bs-icons.html">Bootstrap Icons</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/duotone-icons.html">Duotone Icons</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/illustrations.html">Illustrations</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<span class="nav-subtitle">Components</span>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/accordion.html">Accordion</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/alerts.html">Alerts</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/avatars.html">Avatars</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/badge.html">Badge</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/breadcrumb.html">Breadcrumb</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/buttons.html">Buttons</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/cards.html">Cards</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/collapse.html">Collapse</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/column-divider.html">Column Divider</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/devices.html">Devices</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/divider.html">Divider</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/dropdowns.html">Dropdowns</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/icons.html">Icons</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/list-group.html">List Group</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/lists.html">Lists</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/legend-indicator.html">Legend Indicator</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/modal.html">Modal</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/offcanvas.html">Offcanvas</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/page-header.html">Page Header</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/pagination.html">Pagination</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/popovers.html">Popovers</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/progress.html">Progress</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/profile.html">Profile</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/shapes.html">Shapes</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/spinners.html">Spinners</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/steps.html">Steps</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/tab.html">Tab</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/tables.html">Tables</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/text-highlight.html">Text Highlight</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/toasts.html">Toasts</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/tooltips.html">Tooltips</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/typography.html">Typography</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<small class="nav-subtitle d-block">Navbars</small>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/navbar.html">Navbar</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/navs.html">Navs</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/mega-menu.html">Mega Menu</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/scrollspy.html">Scrollspy</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<small class="nav-subtitle d-block">Basic forms</small>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/basic-forms.html">Basic Forms</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/checks-and-switches.html">Checks & Switches</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/input-group.html">Input Group</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<small class="nav-subtitle">Advanced Forms</small>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/select.html">Advanced Select</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/file-attachments.html">File Attachments</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/dropzone.html">Drag’ n’ Drop File Uploads</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/quill.html">WYSIWYG Editor</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/quantity-counter.html">Quantity Counter</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/input-mask.html">Input Mask</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/step-forms.html">Step Forms (Wizards)</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/range-slider.html">Range Slider (noUiSlider)</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/add-field.html">Add Field</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/toggle-password.html">Toggle Password</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/count-characters.html">Count Characters</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/toggle-switch.html">Toggle Switch</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/toggle-state.html">Toggle State</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/switch.html">Switch</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<small class="nav-subtitle">Media</small>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/fslightbox.html">Fullscreen Lightbox</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/video-bg.html">Video Background</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/video-player.html">Video Player</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/swiper.html">Swiper</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<small class="nav-subtitle">Others</small>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/maps-leaflet.html">Maps (Leaflet)</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/chartjs.html">Chart.js</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/circles.html">Circles.js (Pie Chart)</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/sticky-block.html">Sticky Block</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/countdown.html">Countdown</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/sorting.html">Sorting (Shuffle.js)</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/go-to.html">Go To</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/show-animation.html">Show Animation</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/typedjs.html">Typed.js</a>
|
||
</li>
|
||
|
||
<li class="nav-item my-2 my-lg-5"></li>
|
||
|
||
<li class="nav-item">
|
||
<small class="nav-subtitle d-block">Utilities</small>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/backgrounds.html">Backgrounds</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/borders.html">Borders</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/colors.html">Colors</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/links.html">Links</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/position.html">Position</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/rotations.html">Rotations</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/shadows.html">Shadows</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/sizing.html">Sizing</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/spacing.html">Spacing</a>
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
<a class="nav-link " href="../documentation/z-index.html">Z-index</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<!-- End Navbar Collapse -->
|
||
</nav>
|
||
<!-- End Navbar -->
|
||
|
||
<!-- Content -->
|
||
<div class="navbar-sidebar-aside-content content-space-1 content-space-md-2 px-lg-5 px-xl-10">
|
||
<!-- Page Header -->
|
||
<div class="docs-page-header">
|
||
<div class="row align-items-center">
|
||
<div class="col-sm">
|
||
<h1 class="docs-page-header-title">Changelog</h1>
|
||
<p class="docs-page-header-text">See what's new added, changed, fixed, improved or updated in the latest Front versions.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- End Page Header -->
|
||
|
||
<!-- Alert -->
|
||
<div class="alert alert-soft-dark" role="alert">
|
||
<div class="d-flex align-items-baseline">
|
||
<div class="flex-shrink-0">
|
||
<i class="bi-info-circle me-1"></i>
|
||
</div>
|
||
|
||
<div class="flex-grow-1 ms-2">
|
||
<h3>Read this before updating</h3>
|
||
Do <span class="text-dark fw-semi-bold">not</span> forget to <span class="text-dark fw-semi-bold">backup</span> your files and <span class="text-dark fw-semi-bold">read the changelog</span> 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 <a class="link" href="https://htmlstream.com/contact-us" target="_blank">htmlstream.com/contact-us <i class="fas fa-external-link-alt fa-xs"></i></a> and our team will assist you within a short time.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- End Alert -->
|
||
|
||
<div id="version4_0_1" class="content-divider">
|
||
<h2 class="hs-docs-heading"><code>v4.1</code> - 06 December, 2021 <a class="anchorjs-link" href="#version4_0_1" aria-label="Anchor" data-anchorjs-icon="#"></a></h2>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-primary text-primary py-2 px-3 me-2">New</span> <a href="../page-coming-soon.html">Coming Soon</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-primary text-primary py-2 px-3 me-2">New</span> Office Club <a href="../documentation/illustrations.html">Illustration</a> package
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
Bootstrap <code>.container</code> class width across different resolutions
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
HS Header <code>fixMoment</code> function
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-success text-success py-2 px-3 me-2">Enhanced</span>
|
||
HS Step Form Validation
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-success text-success py-2 px-3 me-2">Enhanced</span>
|
||
HS Step Form Ajax option
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
By default color added to the <code>.card-text</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
Tom Select input placeholder color improvements
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
<code>min-width</code> of <code>9rem</code> added to the HS Quantity Counter
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-danger text-danger py-2 px-3 me-2">Fixed</span>
|
||
HS Mega Menu on click issue
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-danger text-danger py-2 px-3 me-2">Fixed</span>
|
||
HS Scrollspy when the content is too long before the first content to the ID
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Updated</span>
|
||
Swiper from <code>v6.7.5</code> to <code>v7.0.8</code>
|
||
</div>
|
||
|
||
<div class="mt-5">
|
||
<div id="version4_0_1_breaking-changes">
|
||
<h3>Breaking changes <a class="anchorjs-link" href="#version4_0_1_breaking-changes" aria-label="Anchor" data-anchorjs-icon="#"></a></h3>
|
||
</div>
|
||
|
||
<ul>
|
||
<li><code>.swiper-container</code> changed to <code>.swiper</code></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="mt-5">
|
||
<h3>List of dropped SCSS-files</h3>
|
||
|
||
<ul>
|
||
<li><code>assets/scss/front/_variables.scss</code></li>
|
||
<li><code>assets/scss/front/card/_card.scss</code></li>
|
||
<li><code>assets/scss/front/nav/_nav.scss</code></li>
|
||
<li><code>assets/scss/front/list/_list-padding.scss</code></li>
|
||
<li><code>assets/scss/front/tom-select/_tom-select.scss</code></li>
|
||
<li><code>assets/scss/front/vendor/_quantity-counter.scss</code></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="mt-5">
|
||
<h3>List of updated JS-files/folders</h3>
|
||
|
||
<ul>
|
||
<li><code>assets/vendor/hs-header</code></li>
|
||
<li><code>assets/vendor/hs-mega-menu</code></li>
|
||
<li><code>assets/vendor/hs-scrollspy</code></li>
|
||
<li><code>assets/vendor/hs-step-form</code></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="version4_0-migrating-to-v4" class="content-divider">
|
||
<h2 class="hs-docs-heading">Migrating to v4 <a class="anchorjs-link" href="#version4_0-migrating-to-v4" aria-label="Anchor" data-anchorjs-icon="#"></a></h2>
|
||
<p>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 <code>v3.x</code> to <code>v4.0</code> or any older version of Front.</p>
|
||
|
||
<p>The most notable improvements made in Front v4.0</p>
|
||
|
||
<ul class="list-py-1">
|
||
<li><span class="text-dark fw-semi-bold">Bootstrap v5</span> - Built on top of the latest Bootstrap v5.</li>
|
||
<li><span class="text-dark fw-semi-bold">JavaScript</span> - jQuery is fully dropped as a dependency and all libraries and <code>js</code> files are fully vanilla JS now.</li>
|
||
<li><span class="text-dark fw-semi-bold">HTML</span> - classes and code structure optimized.</li>
|
||
<li><span class="text-dark fw-semi-bold">SCSS</span> - all files and styled updated.</li>
|
||
<li><span class="text-dark fw-semi-bold">Headers (Navbars)</span> - completely rewritten from scratch.</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div id="version4_0" class="content-divider">
|
||
<h2 class="hs-docs-heading"><code>v4.0</code> - 20 August, 2021 <a class="anchorjs-link" href="#version4_0" aria-label="Anchor" data-anchorjs-icon="#"></a></h2>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-primary text-primary py-2 px-3 me-2">New</span> Base Components such as Lists, Cards and others
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
<code>.blockquote</code> style changed to <code>.blockquote-left-border</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
<code>.card-body-centered</code> changed to <code>.card-centered</code> and now placed next to a <code>.card</code> class, instead of a <code>.card-body</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
<code>.column-divider-*</code> changed to <code>.col-*-divider</code> and now placed next to a <code>.row</code> class, instead of an individual <code>.col-*</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
<code>.divider</code> divided to <code>.divider-start</code>, <code>.divider-end</code> and <code>.divider-center</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
<code>hs-video-bg</code> classes are now <code>.video-bg</code> rather than utility classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-info text-info py-2 px-3 me-2">Enhanced</span>
|
||
Illustrations
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-success text-success py-2 px-3 me-2">Updated</span>
|
||
Bootstrap from <code>4.6.0</code> to <code>v5.1</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
jQuery library
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Internet Explorer support
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
FontAwesome dropped in favor of <a class="link" href="../documentation/bs-icons.html">Bootstrap Icons</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
FancyBox dropped in favor of <a class="link" href="../documentation/fslightbox.html">Fslightbox</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
jQuery Validation dropped in favor of <a class="link" href="../documentation/basic-forms.html#validation-states">Bootstrap Validation</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
HS Unfold dropped in favor of <a class="link" href="../documentation/dropdowns.html">Bootstrap Dropdowns</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Dzsparallaxer library
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Cubeportfolio dropped in favor of <a class="link" href="../documentation/shufflejs.html">Shuffle.js</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Slick Carousel dropped in favor of <a class="link" href="../documentation/swiper.html">Swiper</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
jQuery Countdown dropped in favor of <a class="link" href="../documentation/countdownjs.html">Countdown.js</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Input Mask dropped in favor of <a class="link" href="../documentation/imask.html">imask.js</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Indigo color palette
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>Portfolio Masonry</code> page
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>Portfolio Modern</code> page
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>Portfolio - Single Page List</code> page
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>Portfolio - Single Page Masonry</code> page
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Footer <code>variant-4.html</code> dropped in favor of main footer
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Footer <code>variant-2.html</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Search Slide Down
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
Search Push Down dropped in favor of new <a class="link" href="../documentation/navbar.html#offcannvasSearch">Offcanvas Search</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.avatar-border</code> classes dropped in favor of utility classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.avatar-border-lg</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.sidebar</code> dropped in favor of Bootstrap Offcanvas
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.table-heighlighted</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.table-light-bordered</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.gradient-x-overlay-sm-indigo</code> in favor of <code>.gradient-x-overlay-sm-primary</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>11: ($spacer * 5)</code> (eg., <code>.m-11</code>, <code>.p-11</code> and etc. classes))
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.badge-soft-*</code> color palettes in favor of utility classes, like <a class="link" href="https://getbootstrap.com/docs/5.0/components/badge/#background-colors">Bootstrap Badge</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.btn-custom-toggle-*</code> color palettes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.btn-group-sm</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.btn-wide</code> and <code>.btn-sm-wide</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.btn-pill</code> dropped in favor of utility classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.breadcrumb-no-gutter</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.breadcrumb-no-gutter</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-columns</code> dropped in favor of <code>.row</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-gutters</code> dropped in favor of <code>.row</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-*-count</code> dropped in favor of <code>.row</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-*-gap</code> dropped in favor of <code>.row</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-bg-light</code> dropped in favor of utility class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-frame</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-hover-shadow</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-dropdown</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.card-no-gutters</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.clients</code> dropped in favor of <code>.avatar</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.divider-text</code> dropped in favor of default style
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.dropdown-menu-sm</code> and <code>.dropdown-menu-lg</code> sizes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.dropdown-nav-link</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.checkbox-icon</code>, <code>.checkbox-outline</code> and <code>.custom-checkbox</code> dropped in favor of new <a class="link" href="../documentation/checks-and-switches.html#form-check-card">Form Check Card</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.toggle-switch</code> dropped in favor of Bootstrap <a class="link" href="../documentation/checks-and-switches.html#switches">Switches</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.file-attachment-input</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.custom-select-pill</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.form-control-pill</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.input-group-pill</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.input-group-add-field-delete</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.input-group-flush</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.link-icon</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.link-underline</code> dropped in favor of <a class="link" href="../documentation/links.html">Link</a> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.link-underline-light</code> dropped in favor of <a class="link" href="../documentation/links.html">Link</a> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.link-underline-toggle</code> classes dropped in favor of new <a class="link" href="../documentation/buttons.html#btn-toggle">.btn-toggle</a> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.list-article</code> dropped in favor of new <a class="link" href="../documentation/lists.html#list-vertical-padding-spacer">.list-py-*</a> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.list-group-item-light</code> dropped in favor of new <a class="link" href="../documentation/lists.html#list-group-striped">.list-group-striped</a> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.header-section</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.header-section-divider</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.left-aligned-navbar</code> dropped and now by default it's left aligned
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.center-aligned-navbar</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-navbar-toggler</code> dropped in favor of <code>.navbar-toggler</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-nav-wrap-toggler</code> dropped in favor of <code>.navbar-toggler</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-nav-wrap-collapse</code> dropped in favor of <code>.navbar-collapse</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-nav-wrap-content</code> dropped in favor of <code>.nav-wrap-secondary-content</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-nav-item</code> dropped in favor of <code>.nav-item</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-nav-last-item</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-card</code> dropped in favor of <code>.navbar-dropdown-menu-promo-item</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-card-deck</code> dropped in favor of <code>.navbar-dropdown-menu-promo</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-card-body</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-icon</code> dropped in favor of <code>.svg-icon</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-title</code> dropped in favor of <code>.navbar-dropdown-menu-media-title</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-text</code> dropped in favor of <code>.navbar-dropdown-menu-media-text</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-card-footer</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-card-footer-item</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-card-footer-text</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-promo-card-footer-ver-divider</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-nav-wrap-content</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-nav-wrap-toggler</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.navbar-nav-wrap-collapse</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.header-white-bg-on-scroll</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.header-bg-transparent</code> dropped in favor of <a class="link" href="https://getbootstrap.com/docs/5.0/components/navbar/#color-schemes" target="_blank">Bootstrap Navbar Skins</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.header-white-nav-links</code> dropped in favor of <a class="link" href="https://getbootstrap.com/docs/5.0/components/navbar/#color-schemes" target="_blank">Bootstrap Navbar Skins</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-*-break</code> dropped in favor of <code>HS Nav Scroller</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-classic</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-list-y-1</code> and <code>.nav-list-y-2</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-x-0</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-x-sm</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-y-0</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-shadow</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-rounded</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-white</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-border-white</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.nav-box</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.scrollbar</code> and <code>.scrollbar-horizontal</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.shadow-primary-lg</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.font-size-*</code> dropped in favor of Bootstrap <code>.fs-*</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.text-lh-*</code> dropped in favor of Bootstrap <code>.lh-*</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.transition-3d-hover</code> dropped, and replaced with <code>.card-transition</code> for <code>.card</code> cases and <code>.btn-transition</code> for button cases
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.transition-zoom-hover</code> dropped in favor of <code>.card-transition</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.border-dashed</code> class
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.text-hover-primary</code> dropped in favor of <code>.text-inherit</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.rounded-lg-pseudo</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.opacity-*</code> classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.shadow-soft</code> dropped in favor of <code>.shadow-sm</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
All sizing classes
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>.content-centered-*</code> dropped in favor of Bootstrap <a class="link" href="https://getbootstrap.com/docs/5.0/utilities/position/#center-elements">Center elements</a>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/quote.svg</code> dropped in favor of inline styling
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-1.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-6.svg</code> dropped in favor of new <code>svg/components/card-9.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-7.svg</code> dropped in favor of new <code>svg/components/card-8.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-8.svg</code> dropped in favor of <code>svg/components/card-7.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-10.svg</code> dropped in favor of <code>svg/components/shape-5.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-11.svg</code> dropped in favor of inline styling
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-16.svg</code> dropped in favor of <code>svg/components/card-10.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-17.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/abstract-shapes-18.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/arrow-pointer-lg-up.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/arrow-pointer-up.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/browser.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/circle-preloader.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/close.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/converge.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/dots-1.svg</code> dropped in favor of new <code>svg/components/dots.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/dots-2.svg</code> dropped in favor of new <code>svg/components/dots.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/dots-3.svg</code> dropped in favor of new <code>svg/components/dots.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/dots-4.svg</code> dropped in favor of new <code>svg/components/dots.svg</code>
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/graphics-10.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/graphics-11.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/half-iphone-x.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/ipad.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/ipad-horizontal.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/iphone-x.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/lines.svg</code> dropped in favor of Bootstrap icon
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/macbook.svg</code> SVG element
|
||
</div>
|
||
|
||
<div class="mb-3">
|
||
<span class="badge bg-soft-dark text-dark py-2 px-3 me-2">Dropped</span>
|
||
<code>svg/components/three-pointers.svg</code> SVG element
|
||
</div>
|
||
|
||
<!-- Card -->
|
||
<div class="card mt-5">
|
||
<div class="card-header">
|
||
<h4 class="card-header-title">Renamed classes</h4>
|
||
</div>
|
||
|
||
<!-- Table -->
|
||
<div class="table-responsive">
|
||
<table class="table table-nowrap table-align-middle">
|
||
<thead class="thead-light">
|
||
<tr>
|
||
<th>Front v3.x</th>
|
||
<th>Front v4.0</th>
|
||
</tr>
|
||
</thead>
|
||
|
||
<tbody>
|
||
<tr>
|
||
<td>
|
||
<code>.js-text-animation</code>
|
||
</td>
|
||
<td>
|
||
<code>.js-typedjs</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.js-switch-text</code>
|
||
</td>
|
||
<td>
|
||
<code>.js-toggle-switch</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.z-index-*</code>
|
||
</td>
|
||
<td>
|
||
<code>.zi-*</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.avatar-4by3</code>
|
||
</td>
|
||
<td>
|
||
<code>.avatar-4x3</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.card-no-gutters</code>
|
||
</td>
|
||
<td>
|
||
<code>.card-reset</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.column-divider-*</code>
|
||
</td>
|
||
<td>
|
||
<code>.col-*-divider</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.custom-checkbox-bookmark</code>
|
||
</td>
|
||
<td>
|
||
<code>.form-check-bookmark</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.input-label-secondary</code>
|
||
</td>
|
||
<td>
|
||
<code>.form-label-secondary</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.bg-img-hero</code>
|
||
</td>
|
||
<td>
|
||
<code>.bg-img-start</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.bg-img-hero-bottom</code>
|
||
</td>
|
||
<td>
|
||
<code>.bg-img-end</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.bg-img-hero-center</code>
|
||
</td>
|
||
<td>
|
||
<code>.bg-img-center</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.space-*</code>
|
||
</td>
|
||
<td>
|
||
<code>.content-space-*</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.stats-progress</code>
|
||
</td>
|
||
<td>
|
||
<code>.circles-chart</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.stats-progress-info</code>
|
||
</td>
|
||
<td>
|
||
<code>.circles-chart-content</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-*</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-*</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.js-navbar-fix-moment</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-scrolled</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-hide-content</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-topbar</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-box-shadow</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-shadow</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-box-shadow-on-scroll</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-shadow-on-scroll</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.navbar-promo</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-dropdown-menu-promo</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.navbar-promo-item</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-dropdown-menu-promo-item</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.navbar-promo-link</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-dropdown-menu-promo-link</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.navbar-promo-title</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-dropdown-menu-media-title</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.navbar-banner</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-dropdown-menu-banner</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.navbar-banner-content</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-dropdown-menu-banner-content</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.navbar-product-banner</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-dropdown-menu-shop-banner</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.navbar-product-banner-content</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-dropdown-menu-shop-banner-content</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-abs-top</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-absolute-top</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-abs-top-inner</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-absolute-top-scroller</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-sticky-top</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-sticky-top</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-sticky-top-inner</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-sticky-top-scroller</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-invisible</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-invisible</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-moved-up</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-moved-up</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-faded</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-faded</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-section-hidden</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-section-hidden</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-untransitioned</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-untransitioned</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.header-fix-top</code>
|
||
</td>
|
||
<td>
|
||
<code>.navbar-fix-top</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.page-preloader-content-centered</code>
|
||
</td>
|
||
<td>
|
||
<code>.page-preloader-middle</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.file-attachment-btn</code>
|
||
</td>
|
||
<td>
|
||
<code>.form-attachment-btn</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.file-attachment-btn-label</code>
|
||
</td>
|
||
<td>
|
||
<code>.form-attachment-btn-label</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.transform-rotate-1</code>
|
||
</td>
|
||
<td>
|
||
<code>.transform-rotate-n40deg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.transform-rotate-5</code>
|
||
</td>
|
||
<td>
|
||
<code>.transform-rotate-n22deg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.gradient-x-overlay-sm-indigo</code>
|
||
</td>
|
||
<td>
|
||
<code>.gradient-x-overlay-sm-primary</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.hero-v1</code>
|
||
</td>
|
||
<td>
|
||
<code>.banner-half-middle-x</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.checkbox-outline</code>
|
||
</td>
|
||
<td>
|
||
<code>.form-check-card</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>.dz-dropzone-boxed</code>
|
||
</td>
|
||
<td>
|
||
<code>.dz-dropzone-card</code>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<!-- End Table -->
|
||
</div>
|
||
<!-- End Card -->
|
||
|
||
<!-- Card -->
|
||
<div class="card mt-5">
|
||
<div class="card-header">
|
||
<h4 class="card-header-title">Renamed SVG-files</h4>
|
||
</div>
|
||
|
||
<!-- Table -->
|
||
<div class="table-responsive">
|
||
<table class="table table-nowrap table-align-middle">
|
||
<thead class="thead-light">
|
||
<tr>
|
||
<th>Front v3.x</th>
|
||
<th>Front v4.0</th>
|
||
</tr>
|
||
</thead>
|
||
|
||
<tbody>
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-2.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/shape-2.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-3.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/shape-3.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-4.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/shape-4.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-5.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/shape-7.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-9.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/shape-5.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-12.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-11.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-13.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-7.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-14.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-8.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-15.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-9.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-19.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/shape-6.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-20.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/wave-pattern-light.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/abstract-shapes-21.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-1.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/dots-5.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/dots.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-1.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-12.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-2.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-13.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-3.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-14.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-4.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-6.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-5.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-15.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-6.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-4.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-7.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-5.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-8.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-16.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/graphics-9.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/card-17.svg</code>
|
||
</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td>
|
||
<code>svg/components/isometric-squares.svg</code>
|
||
</td>
|
||
<td>
|
||
<code>svg/components/isometric-squares-light.svg</code>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<!-- End Table -->
|
||
</div>
|
||
<!-- End Card -->
|
||
</div>
|
||
|
||
<div id="initial-release" class="content-divider">
|
||
<h2 class="hs-docs-heading">Previous updates <a class="anchorjs-link" href="#previuse-updates" aria-label="Anchor" data-anchorjs-icon="#"></a></h2>
|
||
<p>You can view the history of previous updates <a href="../documentation/changelog-archive.html">here <i class="bi-link-45deg"></i></a></p>
|
||
</div>
|
||
</div>
|
||
<!-- End Content -->
|
||
</main>
|
||
<!-- ========== END MAIN CONTENT ========== -->
|
||
|
||
<!-- ========== SECONDARY CONTENTS ========== -->
|
||
<!-- Go To -->
|
||
<a class="js-go-to go-to position-fixed" href="javascript:;" style="visibility: hidden;"
|
||
data-hs-go-to-options='{
|
||
"offsetTop": 700,
|
||
"position": {
|
||
"init": {
|
||
"right": "2rem"
|
||
},
|
||
"show": {
|
||
"bottom": "2rem"
|
||
},
|
||
"hide": {
|
||
"bottom": "-2rem"
|
||
}
|
||
}
|
||
}'>
|
||
<i class="bi-chevron-up"></i>
|
||
</a>
|
||
<!-- ========== END SECONDARY CONTENTS ========== -->
|
||
|
||
|
||
<!-- JS Implementing Plugins -->
|
||
<script src="../assets/js/vendor.min.js"></script>
|
||
|
||
<!-- JS Front -->
|
||
<script src="../assets/js/theme.min.js"></script>
|
||
|
||
<!-- JS Plugins Init. -->
|
||
<script>
|
||
(function() {
|
||
// INITIALIZATION OF HEADER
|
||
// =======================================================
|
||
new HSHeader('#header').init()
|
||
|
||
|
||
// INITIALIZATION OF LISTJS COMPONENT
|
||
// =======================================================
|
||
const docsSearch = HSCore.components.HSList.init('#docsSearch')
|
||
|
||
|
||
// GET JSON FILE RESULTS
|
||
// =======================================================
|
||
fetch('../assets/json/docs-search.json')
|
||
.then(response => response.json())
|
||
.then(data => {
|
||
docsSearch.getItem(0).add(data)
|
||
})
|
||
|
||
// INITIALIZATION OF GO TO
|
||
// =======================================================
|
||
new HSGoTo('.js-go-to')
|
||
})()
|
||
</script>
|
||
</body>
|
||
</html>
|