Mobile logo header - Logo header trên di động XenForo 2
Bạn muốn có một header trên di động với logo như thế này?
Như bạn thấy, bạn có thể có một header trên di động, nhưng khi bạn cuộn logo sẽ hiển thị trong thanh navigation.
Để có được điều này, hãy thêm đoạn code sau đây vào template Extra.less:
Chúc các bạn thành công.
Bạn muốn có một header trên di động với logo như thế này?
Để có được điều này, hãy thêm đoạn code sau đây vào template Extra.less:
Less:
/* [cXF] Mobile logo header */
@media (max-width: @xf-responsiveMedium) {
.has-js .p-header {
display: initial;
}
.p-header-logo {
max-width: 100%;
margin: 0 auto;
}
.p-header-logo.p-header-logo--image img {
max-height: 80px;
}
.has-js .p-nav-smallLogo {
width: 0;
opacity: 0;
transition: all .25s ease;
}
.p-navSticky.is-sticky .p-nav-smallLogo {
width: 100%;
opacity: 1;
transition: all .25s ease;
}
/* to hide icons in header if you're using [cXF] Icons in Header add-on */
.cxf_icons_header_container {
display: none;
}
}
/*****/Chúc các bạn thành công.
Nguồn: xenforo.com
