NW/FleetCart
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects 1 Releases Wiki Activity

first upload all files

Browse Source
This commit is contained in:
NW
2023-06-11 13:14:03 +01:00
parent f14dbc52b5
commit c08b36d1b6
1705 changed files with 106852 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
Themes/Storefront/resources/assets/public/sass/layout/header/_header-left.scss Normal file
View File

@@ -0,0 +1,110 @@
.header-column-left {
display: flex;
align-self: flex-start;
}
.sidebar-menu-icon-wrap {
display: flex;
height: 60px;
padding-left: 15px;
align-items: center;
justify-content: center;
.sidebar-menu-icon {
display: flex;
height: 30px;
width: 35px;
align-items: flex-start;
justify-content: center;
flex-direction: column;
cursor: pointer;
&:hover {
> span {
width: 20px;
background: $color-default;
background: var(--color-primary);
&:last-child {
width: 20px;
}
}
}
> span {
height: 2px;
width: 16px;
margin-bottom: 4px;
background: $color-black;
transition: $transition-primary;
&:nth-child(2) {
width: 20px;
}
&:last-child {
width: 12px;
margin-bottom: 0;
}
}
}
}
.header-logo {
display: flex;
height: 60px;
width: 266px;
padding: 0 15px;
align-items: center;
overflow: hidden;
img {
max-height: 100%;
max-width: 100%;
}
h3 {
color: $color-default;
color: var(--color-primary);
}
svg {
direction: ltr #{'/*rtl:ignore*/'};
height: 60px;
width: 245px;
#logo_f_bg,
#logo_f_text,
#logo_f_text_inner {
fill: $color-default;
fill: var(--color-primary);
}
}
}
@media screen and (max-width: $xl) {
.header-logo {
width: 200px;
}
}
@media screen and (min-width: 992px) {
.sidebar-menu-icon-wrap {
display: none;
}
}
@media screen and (max-width: $lg) {
.header-logo {
h1 {
font-size: 28px;
}
}
}
@media screen and (max-width: 391px) {
.header-logo {
width: 160px;
padding-left: 5px;
}
}

99
Themes/Storefront/resources/assets/public/sass/layout/header/_header-right.scss Normal file
View File

@@ -0,0 +1,99 @@
.header-column-right {
height: 60px;
padding: 0 15px;
.header-wishlist,
.header-cart {
display: flex;
align-items: center;
> span {
line-height: 28px;
color: $color-black;
white-space: nowrap;
transition: $transition-default;
}
}
.header-wishlist {
&:hover {
> span,
.icon-wrap > i {
color: $color-default;
color: var(--color-primary);
}
}
}
.header-cart {
margin-left: 35px;
cursor: pointer;
&:hover {
> span,
.icon-wrap > i {
color: $color-default;
color: var(--color-primary);
}
}
}
.icon-wrap {
position: relative;
margin-right: 10px;
> i {
font-size: 34px;
line-height: 36px;
color: $color-black;
transition: $transition-default;
}
> .count {
position: absolute;
font-size: 10px;
line-height: 20px;
top: 1px;
right: -6px;
height: 18px;
width: 18px;
color: $color-white;
background: $color-red;
text-align: center;
border-radius: 50%;
}
}
}
@media screen and (max-width: $xl) {
.header-column-right {
.icon-wrap {
margin-right: 6px;
}
.header-wishlist,
.header-cart {
> span {
display: none;
}
}
}
}
@media screen and (max-width: $lg) {
.header-column-right {
.header-wishlist {
display: none;
}
.header-cart {
margin-left: 0;
}
}
}
@media screen and (max-width: 391px) {
.header-column-right {
padding-left: 10px;
}
}

175
Themes/Storefront/resources/assets/public/sass/layout/header/_header-search.scss Normal file
View File

@@ -0,0 +1,175 @@
.header-search-wrap {
position: relative;
min-width: 0;
flex-grow: 1;
padding: 0 40px;
}
.header-search {
position: relative;
.header-search-lg {
position: relative;
display: flex;
border: 1px solid $border-color;
border-radius: $radius-default;
.search-input {
height: 58px;
padding-left: 30px;
border: none;
}
.header-search-right {
display: flex;
align-items: center;
margin-right: 4px;
}
.btn-search {
display: flex;
height: 50px;
width: 50px;
margin-left: 40px;
padding: 0;
align-items: center;
justify-content: center;
border-radius: 0 $radius-default $radius-default 0;
> i {
font-size: 18px;
line-height: 36px;
}
}
}
.nice-select {
display: flex;
align-items: center;
.list {
margin-top: 19px;
}
}
}
.header-search-sm-form {
position: absolute;
left: 15px;
right: 15px;
top: 0;
height: 100%;
background: $color-white;
opacity: 0;
z-index: -1;
transform: scale(0.96);
pointer-events: none;
transition: $transition-default;
&.active {
opacity: 1;
transform: scale(1);
z-index: 1;
pointer-events: auto;
}
> form {
position: relative;
display: flex;
width: 100%;
align-items: center;
> input {
height: 60px;
padding: 10px 50px;
border: none;
}
.btn-close,
.btn-search {
position: absolute;
top: 50%;
display: flex;
height: 50px;
width: 50px;
padding: 15px;
align-items: center;
justify-content: center;
cursor: pointer;
transform: translateY(-50%);
&:hover {
> i {
color: $color-default;
color: var(--color-primary);
}
}
> i {
font-size: 24px;
color: $color-gray;
transition: $transition-default;
}
}
.btn-close {
left: 0;
}
.btn-search {
right: 0;
}
}
}
@media screen and (min-width: 992px) {
.header-search {
.header-search-sm {
display: none;
}
}
.header-search-sm-form {
display: none;
}
}
@media screen and (max-width: $lg) {
.header-search-wrap {
position: static;
display: flex;
flex-grow: 0;
margin-left: auto;
padding: 0 15px;
align-items: center;
}
.header-search {
.header-search-lg {
display: none;
}
.header-search-sm {
&:hover {
> i {
color: $color-default;
color: var(--color-primary);
}
}
> i {
font-size: 34px;
line-height: 36px;
color: $color-black;
cursor: pointer;
transition: $transition-default;
}
}
}
}
@media screen and (max-width: 391px) {
.header-search-wrap {
padding: 0 10px;
}
}

191
Themes/Storefront/resources/assets/public/sass/layout/header/_search-suggestion.scss Normal file
View File

@@ -0,0 +1,191 @@
.search-suggestions {
position: absolute;
left: 41px;
top: 60px;
right: 41px;
background: $color-white;
border-bottom: 2px solid $color-default;
border-bottom: 2px solid var(--color-primary);
border-radius: 0 0 $radius-default $radius-default;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
.search-suggestions-inner {
max-height: 425px;
background: $color-white;
padding-bottom: 11px;
}
.title {
font-size: 13px;
font-weight: 400;
position: relative;
padding: 6px 20px;
color: $color-gray-dark;
background: $color-white-dark;
&:after {
position: absolute;
content: '';
left: 0;
top: 7px;
height: 15px;
width: 7px;
background: $color-default;
background: var(--color-primary);
border-top-right-radius: 12px;
border-bottom-right-radius: 12px;
}
}
.list-item {
transition: $transition-default;
&.active {
background: #f7f9fa;
}
}
}
.category-suggestion {
.title {
margin-bottom: 14px;
}
& + .product-suggestion {
margin-top: 11px;
}
}
.category-suggestion-list {
.single-item {
font-size: 14px;
line-height: 26px;
display: block;
max-width: 100%;
padding: 0 20px;
color: $color-gray;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: top;
}
}
.product-suggestion {
padding-bottom: 3px;
.title {
margin-bottom: 14px;
}
.more-results {
font-size: 14px;
display: block;
margin: 14px 0 -14px;
padding: 6px 0;
color: $color-gray-dark;
background: $color-white-dark;
text-align: center;
border-top: 1px solid $color-gray-lite;
&:hover {
color: $color-default;
color: var(--color-primary);
}
}
}
.product-suggestion-list {
.list-item {
margin-bottom: 4px;
&:last-child {
margin-bottom: 0;
}
}
.single-item {
position: relative;
display: flex;
padding: 6px 20px;
}
.product-image {
height: 50px;
width: 50px;
min-width: 50px;
border-radius: $radius-default;
overflow: hidden;
.image-placeholder {
height: 35px;
width: 35px;
}
}
.product-info {
min-width: 0;
margin-left: 20px;
flex-grow: 1;
}
.product-info-top {
display: flex;
justify-content: space-between;
}
.product-name {
font-size: 14px;
display: inline-block;
max-width: 100%;
margin-bottom: 3px;
color: $color-gray;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: top;
}
.product-badge {
position: relative;
top: auto;
right: auto;
margin: -2px 0 -1px 15px;
}
em {
font-weight: 500;
font-style: inherit;
color: $color-default;
color: var(--color-primary);
}
}
@media screen and (max-width: $lg) {
.search-suggestions {
top: 76px;
left: 15px;
right: 15px;
display: none;
.search-suggestions-inner {
max-height: 359px;
}
}
.header-wrap-inner {
&.sticky {
.search-suggestions {
top: 71px;
}
}
}
.header-search-sm-form {
&.active {
+ .search-suggestions {
display: block;
}
}
}
}

62
Themes/Storefront/resources/assets/public/sass/layout/header/_searched-keywords.scss Normal file
View File

@@ -0,0 +1,62 @@
.header-search {
.searched-keywords {
display: flex;
width: 95%;
margin: 14px auto -9px;
justify-content: center;
> label {
font-size: 14px;
line-height: 26px;
margin-bottom: 0;
color: $color-default;
color: var(--color-primary);
white-space: nowrap;
}
}
.searched-keywords-list {
height: 26px;
overflow: hidden;
li {
font-size: 14px;
line-height: 26px;
position: relative;
display: inline-block;
padding: 0 15px;
&:after {
position: absolute;
content: '';
left: -1px;
top: 4px;
height: 16px;
width: 1px;
background: $color-gray-dark;
}
&:first-child:after {
height: 0;
width: 0;
}
a {
color: $color-gray-dark;
&:hover {
color: $color-default;
color: var(--color-primary);
}
}
}
}
}
@media screen and (max-width: $lg) {
.header-search {
.searched-keywords {
display: none;
}
}
}

36
Themes/Storefront/resources/assets/public/sass/layout/header/_sticky-header.scss Normal file
View File

@@ -0,0 +1,36 @@
.header-wrap-inner {
&.sticky {
position: fixed;
left: 0;
top: -200px;
right: 0;
min-width: 320px;
padding: 10px 0;
background: $color-white;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
z-index: 150;
.row {
&.flex-nowrap {
align-items: center;
}
}
.header-logo {
height: 55px;
svg {
height: 55px;
}
}
.searched-keywords {
display: none;
}
}
&.show {
top: 0;
transition: 600ms ease;
}
}