Documentation

Upgrade Guide

Version 3.0.1 to Version 4.0.0
  • Updated bootstrap to latest version 5.2.3
    • Updated src/assets/scss/hope-ui-design-system/layout-style/menu_style/_default_sidebar.scss file
    • Updated src/assets/scss/dark/layout-style/menu_style/_default_style.scss file
    • Updated src/assets/scss/dark/layout-style/menu_style/_default-sidebar.scss file
    • Updated src/assets/scss/hope-ui-design-system/layout-style/menu_style/_default_sidebar_responsive.scss file
    • Updated src/assets/scss/customizer/components/dropdown/_dropdown.scss file
    • Replace src/assets/scss/bootstrap folder
  • We have added new Variable in the dark mode src/assets/scss/dark/_dark.scss

    New Variable Add

    $menu-color:#d7dbdf;
  • We have added new classes in the header
    • "header-hover-menu left-border" which are used by-default
    • Before

      <nav class="nav navbar navbar-expand-xl navbar-light iq-navbar">

      After

      <nav class="nav navbar navbar-expand-xl navbar-light iq-navbar header-hover-menu left-border">
  • We have upgrade old dropdown menu variable src/assets/scss/hope-ui-design-system/_variable.scss
    • "Dropdown Variable"
    • Before

      $dropdown-padding-x: 0 !default;
      $dropdown-box-shadow: 0 0.625rem 1.875rem rgba($black, .1) !default;

      After

      $dropdown-padding-x: .5rem !default
      $dropdown-box-shadow: 0 10px 15px -3px rgba($black, 10%), 0 4px 6px -2px rgba($black, 5%)

Upgrade Guide

Version 1.3.0 to Version 2.0.0
  • Updated bootstrap to latest version 5.2.0
  • Removed all the mixin base scss of the sidebar and converted that into a simple way.
    • In src\assets\scss\hope-ui-design-system\layout-style\ file path has all the new sidebar scss.
    • In src\assets\scss\dark\layout-style\ file path all the dark mode new sidebar scss is given.
    • In src\assets\scss\rtl\components\menu-style\ file path all the RTL mode new sidebar scss is given.
    • Updated src\assets\scss\hope-ui-design-system\layout-style\ folder.
  • Removed all the mixin base sidebar scss code which is given bellow :
    • In src\assets\scss\hope-ui-design-system\components\menu-style folder has been removed where all the sidebar style was given
    • In src\assets\scss\hope-ui-design-system\helper\mixins\ siderbar mixin has been removed
      • _sidebar-nav-item-varient.scss (deleted)
      • _sidebar-varients.scss (deleted)
    • In src\assets\scss\dark\components\menu-style\ folder has been deleted.
  • We have added new classes in the sidebar which are
    • "sidebar sidebar-base" which are used by-default
    • Before

      <aside class="sidebar sidebar-default"></aside>

      After

      <aside class="sidebar sidebar-base"></aside>
    • Only when "left-bordered" class is used at that time "sidebar-default" class will not be used.
    • Before

      sidebar_menu_style: {
          target: '[data-toggle="main-sidebar"]',
          choices: [
          "navs-rounded",
          "navs-rounded-all",
          "navs-pill",
          "navs-pill-all",
          "left-bordered",
          "navs-full-width",
          ],
          value: "left-bordered",
      },

      After

      sidebar_menu_style: {
          target: '[data-toggle="main-sidebar"]',
          choices: [
          "sidebar-default navs-rounded",
          "sidebar-default navs-rounded-all",
          "sidebar-default navs-pill",
          "sidebar-default navs-pill-all",
          "left-bordered",
          "sidebar-default navs-full-width",
          ],
          value: "left-bordered",
      },
    • "sidebar-default" provide the background color to the selected option is the sidebar