- Ноя
- 376
- 38
Пользователь
By registering with us, you'll be able to discuss, share and private message with other members of our community.
SignUp Now!Там разноцветный а нужен какой сейчас для вкладки пользователи чтобы переливалось как сейчасБоковая панель | CRMP ONLINE
.canvas-style(@canvas-id; @color; @fa-uid; @shadow: @color; @bg: false) when (@bg = false) { .offCanvasMenu-link[data-nav-id="@{canvas-id}"]:before { .m-faBase(@weight: 900); content: "\@{fa-uid}"; margin-right: 3px; color: @color; }...pawno-help.ru
Там разноцветный а нужен какой сейчас для вкладки пользователи чтобы переливалось как сейчас
.offCanvasMenu {
display: none;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 500;
-webkit-transition: none .5s ease;
transition: none .5s ease;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-webkit-tap-highlight-color: rgba(0,0,0,0)
}
.offCanvasMenu a {
-webkit-tap-highlight-color: initial
}
.offCanvasMenu.is-transitioning {
display: block
}
.offCanvasMenu.is-active {
display: block
}
.offCanvasMenu .offCanvasMenu-hidden {
display: none
}
.offCanvasMenu .offCanvasMenu-shown {
display: block
}
.offCanvasMenu .offCanvasMenu-closer {
float: right;
cursor: pointer;
text-decoration: none;
-webkit-tap-highlight-color: initial;
padding: 10px;
margin: -10px
}
.offCanvasMenu .offCanvasMenu-closer:hover {
text-decoration: none
}
.offCanvasMenu .offCanvasMenu-closer:after {
font-family: 'Font Awesome 5 Pro';
font-size: inherit;
font-style: normal;
font-weight: 400;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
content: "\f00d";
width: 1.28571429em;
display: inline-block;
text-align: center
}
.offCanvasMenu .block-container,.offCanvasMenu .blockMessage {
margin-left: 0;
margin-right: 0;
border-radius: 0;
border-left: none;
border-right: none
}
.offCanvasMenu-shown {
display: none
}
.offCanvasMenu-backdrop {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0,0,0,0.25);
opacity: 0;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out
}
.is-active .offCanvasMenu-backdrop {
opacity: 1
}
.offCanvasMenu-content {
position: relative;
width: 280px;
max-width: 85%;
height: 100%;
overflow: auto;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
-webkit-overflow-scrolling: touch;
box-shadow: 2px 0 5px 0 rgba(0,0,0,0.25);
-webkit-transform: translateX(-280px);
-ms-transform: translateX(-280px);
transform: translateX(-280px)
}
.has-os-ios .offCanvasMenu-content {
padding-bottom: 44px
}
.offCanvasMenu--fromOpposite .offCanvasMenu-content {
position: absolute;
right: 0;
box-shadow: -2px 0 5px 0 rgba(0,0,0,0.25);
-webkit-transform: translateX(280px);
-ms-transform: translateX(280px);
transform: translateX(280px)
}
.is-active .offCanvasMenu-content {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0)
}
.offCanvasMenu-content .p-nav-content {
margin-bottom: 96px
}
.offCanvasMenu-header {
padding: 10px;
margin: 0;
font-size: 20px;
font-weight: 400
}
.offCanvasMenu-header:before,.offCanvasMenu-header:after {
content: " ";
display: table
}
.offCanvasMenu-header:after {
clear: both
}
.offCanvasMenu-header a {
color: inherit;
text-decoration: none
}
.offCanvasMenu-header a:hover {
text-decoration: underline
}
.offCanvasMenu-header.offCanvasMenu-header--separated {
margin-bottom: 10px
}
.offCanvasMenu-row {
padding: 10px
}
.offCanvasMenu-separator {
padding: 0;
margin: 0;
border: none;
border-top: 1px solid transparent
}
.offCanvasMenu-link {
display: block;
padding: 10px;
font-size: 17px;
text-decoration: inherit
}
.offCanvasMenu-link:hover {
text-decoration: inherit
}
.offCanvasMenu-link.offCanvasMenu-link--splitToggle {
position: relative;
text-decoration: inherit
}
.offCanvasMenu-link.offCanvasMenu-link--splitToggle:before {
content: '';
position: absolute;
left: 0;
top: 6px;
bottom: 6px;
width: 0;
border-left: 1px solid currentColor
}
.offCanvasMenu-link.offCanvasMenu-link--splitToggle:after {
font-family: 'Font Awesome 5 Pro';
font-size: inherit;
font-style: normal;
font-weight: 400;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
content: "\f078";
width: .88em;
display: inline-block;
text-align: center
}
.offCanvasMenu-link.offCanvasMenu-link--splitToggle.is-active:after {
content: "\f077";
width: .88em;
display: inline-block;
text-align: center
}
.offCanvasMenu-linkHolder {
display: flex
}
.offCanvasMenu-linkHolder.is-selected a {
color: inherit
}
.offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link:first-child {
padding-left: 10px
}
.offCanvasMenu-linkHolder .offCanvasMenu-link {
flex-grow: 1
}
.offCanvasMenu-linkHolder .offCanvasMenu-link.offCanvasMenu-link--splitToggle {
flex-grow: 0
}
.offCanvasMenu-linkHolder .offCanvasMenu-link:hover {
background: none
}
.offCanvasMenu-list {
list-style: none;
margin: 0;
padding: 0
}
.offCanvasMenu-list>li {
border-top: 1px solid transparent
}
.offCanvasMenu-list:first-child>li:first-child {
border-top: none
}
.offCanvasMenu-subList {
list-style: none;
margin: 0;
padding: 0;
display: none;
opacity: 0;
-webkit-transition: all .25s ease, -xf-opacity .25s ease;
transition: all .25s ease, -xf-opacity .25s ease;
overflow-y: hidden;
height: 0;
-webkit-transition-property: all,-xf-height;
transition-property: all,-xf-height;
padding-bottom: 15px
}
.offCanvasMenu-subList.is-active {
display: block;
opacity: 1
}
.offCanvasMenu-subList.is-transitioning {
display: block
}
.offCanvasMenu-subList.is-active {
height: auto;
overflow-y: visible
}
.offCanvasMenu-subList.is-transitioning {
overflow-y: hidden
}
.offCanvasMenu-subList .offCanvasMenu-link {
padding-left: 10px;
padding-top: 6px;
padding-bottom: 6px;
font-size: 13px
}
.offCanvasMenu-installBanner {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 6px;
font-size: 17px
}
.offCanvasMenu--blocks .offCanvasMenu-content {
background: #101010;
color: #cfd3da
}
.offCanvasMenu--blocks .offCanvasMenu-header {
color: #fefefe;
background: #ffb82b;
border-bottom: 1px solid rgba(255,255,255,0.12)
}
.offCanvasMenu--blocks .offCanvasMenu-separator {
border-top-color: rgba(255,255,255,0.045)
}
.offCanvasMenu--blocks .offCanvasMenu-list>li {
border-top-color: rgba(255,255,255,0.045)
}
.offCanvasMenu--nav .offCanvasMenu-content {
color: #fefefe;
background: #1b1b1b;
border-bottom: 1px solid #292734;
display: flex;
flex-direction: column
}
.offCanvasMenu--nav .offCanvasMenu-content a {
color: inherit
}
.offCanvasMenu--nav .offCanvasMenu-header {
background: #1b1b1b;
border-bottom: 1px solid #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-list {
border-bottom: 1px solid #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-separator {
border-top-color: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before {
border-left-color: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-linkHolder {
text-decoration: none
}
.offCanvasMenu--nav .offCanvasMenu-linkHolder:hover {
background: rgba(27,27,27,0.9399999999999999)
}
.offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected {
color: #ff8e00
}
.offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before {
border-left-color: rgba(255,142,0,0.2)
}
.offCanvasMenu--nav .offCanvasMenu-subList {
background: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-subList .offCanvasMenu-link:hover {
text-decoration: none;
background: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-list>li {
border-top-color: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-installBanner {
margin-top: auto;
background: #1b1b1b;
border-top: 1px solid #1b1b1b
}
Это полный код боковой панели?CSS:.offCanvasMenu { display: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 500; -webkit-transition: none .5s ease; transition: none .5s ease; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-tap-highlight-color: rgba(0,0,0,0) } .offCanvasMenu a { -webkit-tap-highlight-color: initial } .offCanvasMenu.is-transitioning { display: block } .offCanvasMenu.is-active { display: block } .offCanvasMenu .offCanvasMenu-hidden { display: none } .offCanvasMenu .offCanvasMenu-shown { display: block } .offCanvasMenu .offCanvasMenu-closer { float: right; cursor: pointer; text-decoration: none; -webkit-tap-highlight-color: initial; padding: 10px; margin: -10px } .offCanvasMenu .offCanvasMenu-closer:hover { text-decoration: none } .offCanvasMenu .offCanvasMenu-closer:after { font-family: 'Font Awesome 5 Pro'; font-size: inherit; font-style: normal; font-weight: 400; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f00d"; width: 1.28571429em; display: inline-block; text-align: center } .offCanvasMenu .block-container,.offCanvasMenu .blockMessage { margin-left: 0; margin-right: 0; border-radius: 0; border-left: none; border-right: none } .offCanvasMenu-shown { display: none } .offCanvasMenu-backdrop { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.25); opacity: 0; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .is-active .offCanvasMenu-backdrop { opacity: 1 } .offCanvasMenu-content { position: relative; width: 280px; max-width: 85%; height: 100%; overflow: auto; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; -webkit-overflow-scrolling: touch; box-shadow: 2px 0 5px 0 rgba(0,0,0,0.25); -webkit-transform: translateX(-280px); -ms-transform: translateX(-280px); transform: translateX(-280px) } .has-os-ios .offCanvasMenu-content { padding-bottom: 44px } .offCanvasMenu--fromOpposite .offCanvasMenu-content { position: absolute; right: 0; box-shadow: -2px 0 5px 0 rgba(0,0,0,0.25); -webkit-transform: translateX(280px); -ms-transform: translateX(280px); transform: translateX(280px) } .is-active .offCanvasMenu-content { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } .offCanvasMenu-content .p-nav-content { margin-bottom: 96px } .offCanvasMenu-header { padding: 10px; margin: 0; font-size: 20px; font-weight: 400 } .offCanvasMenu-header:before,.offCanvasMenu-header:after { content: " "; display: table } .offCanvasMenu-header:after { clear: both } .offCanvasMenu-header a { color: inherit; text-decoration: none } .offCanvasMenu-header a:hover { text-decoration: underline } .offCanvasMenu-header.offCanvasMenu-header--separated { margin-bottom: 10px } .offCanvasMenu-row { padding: 10px } .offCanvasMenu-separator { padding: 0; margin: 0; border: none; border-top: 1px solid transparent } .offCanvasMenu-link { display: block; padding: 10px; font-size: 17px; text-decoration: inherit } .offCanvasMenu-link:hover { text-decoration: inherit } .offCanvasMenu-link.offCanvasMenu-link--splitToggle { position: relative; text-decoration: inherit } .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { content: ''; position: absolute; left: 0; top: 6px; bottom: 6px; width: 0; border-left: 1px solid currentColor } .offCanvasMenu-link.offCanvasMenu-link--splitToggle:after { font-family: 'Font Awesome 5 Pro'; font-size: inherit; font-style: normal; font-weight: 400; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f078"; width: .88em; display: inline-block; text-align: center } .offCanvasMenu-link.offCanvasMenu-link--splitToggle.is-active:after { content: "\f077"; width: .88em; display: inline-block; text-align: center } .offCanvasMenu-linkHolder { display: flex } .offCanvasMenu-linkHolder.is-selected a { color: inherit } .offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link:first-child { padding-left: 10px } .offCanvasMenu-linkHolder .offCanvasMenu-link { flex-grow: 1 } .offCanvasMenu-linkHolder .offCanvasMenu-link.offCanvasMenu-link--splitToggle { flex-grow: 0 } .offCanvasMenu-linkHolder .offCanvasMenu-link:hover { background: none } .offCanvasMenu-list { list-style: none; margin: 0; padding: 0 } .offCanvasMenu-list>li { border-top: 1px solid transparent } .offCanvasMenu-list:first-child>li:first-child { border-top: none } .offCanvasMenu-subList { list-style: none; margin: 0; padding: 0; display: none; opacity: 0; -webkit-transition: all .25s ease, -xf-opacity .25s ease; transition: all .25s ease, -xf-opacity .25s ease; overflow-y: hidden; height: 0; -webkit-transition-property: all,-xf-height; transition-property: all,-xf-height; padding-bottom: 15px } .offCanvasMenu-subList.is-active { display: block; opacity: 1 } .offCanvasMenu-subList.is-transitioning { display: block } .offCanvasMenu-subList.is-active { height: auto; overflow-y: visible } .offCanvasMenu-subList.is-transitioning { overflow-y: hidden } .offCanvasMenu-subList .offCanvasMenu-link { padding-left: 10px; padding-top: 6px; padding-bottom: 6px; font-size: 13px } .offCanvasMenu-installBanner { display: flex; justify-content: space-between; align-items: center; padding: 10px 6px; font-size: 17px } .offCanvasMenu--blocks .offCanvasMenu-content { background: #101010; color: #cfd3da } .offCanvasMenu--blocks .offCanvasMenu-header { color: #fefefe; background: #ffb82b; border-bottom: 1px solid rgba(255,255,255,0.12) } .offCanvasMenu--blocks .offCanvasMenu-separator { border-top-color: rgba(255,255,255,0.045) } .offCanvasMenu--blocks .offCanvasMenu-list>li { border-top-color: rgba(255,255,255,0.045) } .offCanvasMenu--nav .offCanvasMenu-content { color: #fefefe; background: #1b1b1b; border-bottom: 1px solid #292734; display: flex; flex-direction: column } .offCanvasMenu--nav .offCanvasMenu-content a { color: inherit } .offCanvasMenu--nav .offCanvasMenu-header { background: #1b1b1b; border-bottom: 1px solid #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-list { border-bottom: 1px solid #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-separator { border-top-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { border-left-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-linkHolder { text-decoration: none } .offCanvasMenu--nav .offCanvasMenu-linkHolder:hover { background: rgba(27,27,27,0.9399999999999999) } .offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected { color: #ff8e00 } .offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { border-left-color: rgba(255,142,0,0.2) } .offCanvasMenu--nav .offCanvasMenu-subList { background: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-subList .offCanvasMenu-link:hover { text-decoration: none; background: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-list>li { border-top-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-installBanner { margin-top: auto; background: #1b1b1b; border-top: 1px solid #1b1b1b }
даЭто полный код боковой панели?
ID магазина форума и правил форума не нужно вставлять?
Нужно?ID магазина форума и правил форума не нужно вставлять?
Вставил в extra.less ничего не изменилось, поэтому вернул свойCSS:.offCanvasMenu { display: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 500; -webkit-transition: none .5s ease; transition: none .5s ease; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-tap-highlight-color: rgba(0,0,0,0) } .offCanvasMenu a { -webkit-tap-highlight-color: initial } .offCanvasMenu.is-transitioning { display: block } .offCanvasMenu.is-active { display: block } .offCanvasMenu .offCanvasMenu-hidden { display: none } .offCanvasMenu .offCanvasMenu-shown { display: block } .offCanvasMenu .offCanvasMenu-closer { float: right; cursor: pointer; text-decoration: none; -webkit-tap-highlight-color: initial; padding: 10px; margin: -10px } .offCanvasMenu .offCanvasMenu-closer:hover { text-decoration: none } .offCanvasMenu .offCanvasMenu-closer:after { font-family: 'Font Awesome 5 Pro'; font-size: inherit; font-style: normal; font-weight: 400; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f00d"; width: 1.28571429em; display: inline-block; text-align: center } .offCanvasMenu .block-container,.offCanvasMenu .blockMessage { margin-left: 0; margin-right: 0; border-radius: 0; border-left: none; border-right: none } .offCanvasMenu-shown { display: none } .offCanvasMenu-backdrop { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.25); opacity: 0; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .is-active .offCanvasMenu-backdrop { opacity: 1 } .offCanvasMenu-content { position: relative; width: 280px; max-width: 85%; height: 100%; overflow: auto; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; -webkit-overflow-scrolling: touch; box-shadow: 2px 0 5px 0 rgba(0,0,0,0.25); -webkit-transform: translateX(-280px); -ms-transform: translateX(-280px); transform: translateX(-280px) } .has-os-ios .offCanvasMenu-content { padding-bottom: 44px } .offCanvasMenu--fromOpposite .offCanvasMenu-content { position: absolute; right: 0; box-shadow: -2px 0 5px 0 rgba(0,0,0,0.25); -webkit-transform: translateX(280px); -ms-transform: translateX(280px); transform: translateX(280px) } .is-active .offCanvasMenu-content { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } .offCanvasMenu-content .p-nav-content { margin-bottom: 96px } .offCanvasMenu-header { padding: 10px; margin: 0; font-size: 20px; font-weight: 400 } .offCanvasMenu-header:before,.offCanvasMenu-header:after { content: " "; display: table } .offCanvasMenu-header:after { clear: both } .offCanvasMenu-header a { color: inherit; text-decoration: none } .offCanvasMenu-header a:hover { text-decoration: underline } .offCanvasMenu-header.offCanvasMenu-header--separated { margin-bottom: 10px } .offCanvasMenu-row { padding: 10px } .offCanvasMenu-separator { padding: 0; margin: 0; border: none; border-top: 1px solid transparent } .offCanvasMenu-link { display: block; padding: 10px; font-size: 17px; text-decoration: inherit } .offCanvasMenu-link:hover { text-decoration: inherit } .offCanvasMenu-link.offCanvasMenu-link--splitToggle { position: relative; text-decoration: inherit } .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { content: ''; position: absolute; left: 0; top: 6px; bottom: 6px; width: 0; border-left: 1px solid currentColor } .offCanvasMenu-link.offCanvasMenu-link--splitToggle:after { font-family: 'Font Awesome 5 Pro'; font-size: inherit; font-style: normal; font-weight: 400; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f078"; width: .88em; display: inline-block; text-align: center } .offCanvasMenu-link.offCanvasMenu-link--splitToggle.is-active:after { content: "\f077"; width: .88em; display: inline-block; text-align: center } .offCanvasMenu-linkHolder { display: flex } .offCanvasMenu-linkHolder.is-selected a { color: inherit } .offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link:first-child { padding-left: 10px } .offCanvasMenu-linkHolder .offCanvasMenu-link { flex-grow: 1 } .offCanvasMenu-linkHolder .offCanvasMenu-link.offCanvasMenu-link--splitToggle { flex-grow: 0 } .offCanvasMenu-linkHolder .offCanvasMenu-link:hover { background: none } .offCanvasMenu-list { list-style: none; margin: 0; padding: 0 } .offCanvasMenu-list>li { border-top: 1px solid transparent } .offCanvasMenu-list:first-child>li:first-child { border-top: none } .offCanvasMenu-subList { list-style: none; margin: 0; padding: 0; display: none; opacity: 0; -webkit-transition: all .25s ease, -xf-opacity .25s ease; transition: all .25s ease, -xf-opacity .25s ease; overflow-y: hidden; height: 0; -webkit-transition-property: all,-xf-height; transition-property: all,-xf-height; padding-bottom: 15px } .offCanvasMenu-subList.is-active { display: block; opacity: 1 } .offCanvasMenu-subList.is-transitioning { display: block } .offCanvasMenu-subList.is-active { height: auto; overflow-y: visible } .offCanvasMenu-subList.is-transitioning { overflow-y: hidden } .offCanvasMenu-subList .offCanvasMenu-link { padding-left: 10px; padding-top: 6px; padding-bottom: 6px; font-size: 13px } .offCanvasMenu-installBanner { display: flex; justify-content: space-between; align-items: center; padding: 10px 6px; font-size: 17px } .offCanvasMenu--blocks .offCanvasMenu-content { background: #101010; color: #cfd3da } .offCanvasMenu--blocks .offCanvasMenu-header { color: #fefefe; background: #ffb82b; border-bottom: 1px solid rgba(255,255,255,0.12) } .offCanvasMenu--blocks .offCanvasMenu-separator { border-top-color: rgba(255,255,255,0.045) } .offCanvasMenu--blocks .offCanvasMenu-list>li { border-top-color: rgba(255,255,255,0.045) } .offCanvasMenu--nav .offCanvasMenu-content { color: #fefefe; background: #1b1b1b; border-bottom: 1px solid #292734; display: flex; flex-direction: column } .offCanvasMenu--nav .offCanvasMenu-content a { color: inherit } .offCanvasMenu--nav .offCanvasMenu-header { background: #1b1b1b; border-bottom: 1px solid #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-list { border-bottom: 1px solid #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-separator { border-top-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { border-left-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-linkHolder { text-decoration: none } .offCanvasMenu--nav .offCanvasMenu-linkHolder:hover { background: rgba(27,27,27,0.9399999999999999) } .offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected { color: #ff8e00 } .offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { border-left-color: rgba(255,142,0,0.2) } .offCanvasMenu--nav .offCanvasMenu-subList { background: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-subList .offCanvasMenu-link:hover { text-decoration: none; background: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-list>li { border-top-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-installBanner { margin-top: auto; background: #1b1b1b; border-top: 1px solid #1b1b1b }
Вставил в extra.less ничего не изменилось, поэтому вернул свой
.offCanvasMenu {
display: none;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 500;
-webkit-transition: opacity .5s ease;
transition: opacity .5s ease;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-webkit-tap-highlight-color: rgba(0,0,0,0)
}
.offCanvasMenu a {
-webkit-tap-highlight-color: initial
}
.offCanvasMenu.is-transitioning {
display: block
}
.offCanvasMenu.is-active {
display: block
}
.offCanvasMenu .offCanvasMenu-hidden {
display: none
}
.offCanvasMenu .offCanvasMenu-shown {
display: block
}
.offCanvasMenu .offCanvasMenu-closer {
float: right;
cursor: pointer;
text-decoration: none;
-webkit-tap-highlight-color: initial;
padding: 10px;
margin: -10px
}
.offCanvasMenu .offCanvasMenu-closer:hover {
text-decoration: none
}
.offCanvasMenu .offCanvasMenu-closer:after {
font-family: 'Font Awesome 5 Pro';
font-size: inherit;
font-style: normal;
font-weight: 400;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
content: "\f00d";
width: 1.28571429em;
display: inline-block;
text-align: center
}
.offCanvasMenu .block-container,.offCanvasMenu .blockMessage {
margin-left: 0;
margin-right: 0;
border-radius: 0;
border-left: none;
border-right: none
}
.offCanvasMenu-shown {
display: none
}
.offCanvasMenu-backdrop {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0,0,0,0.25);
opacity: 0;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out
}
.is-active .offCanvasMenu-backdrop {
opacity: 1
}
.offCanvasMenu-content {
position: relative;
width: 280px;
max-width: 85%;
height: 100%;
overflow: auto;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
-webkit-overflow-scrolling: touch;
box-shadow: 2px 0 5px 0 rgba(0,0,0,0.25);
-webkit-transform: translateX(-280px);
-ms-transform: translateX(-280px);
transform: translateX(-280px)
}
.has-os-ios .offCanvasMenu-content {
padding-bottom: 44px
}
.offCanvasMenu--fromOpposite .offCanvasMenu-content {
position: absolute;
right: 0;
box-shadow: -2px 0 5px 0 rgba(0,0,0,0.25);
-webkit-transform: translateX(280px);
-ms-transform: translateX(280px);
transform: translateX(280px)
}
.is-active .offCanvasMenu-content {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0)
}
.offCanvasMenu-content .p-nav-content {
margin-bottom: 96px
}
.offCanvasMenu-header {
padding: 10px;
margin: 0;
font-size: 20px;
font-weight: 400
}
.offCanvasMenu-header:before,.offCanvasMenu-header:after {
content: " ";
display: table
}
.offCanvasMenu-header:after {
clear: both
}
.offCanvasMenu-header a {
color: inherit;
text-decoration: none
}
.offCanvasMenu-header a:hover {
text-decoration: underline
}
.offCanvasMenu-header.offCanvasMenu-header--separated {
margin-bottom: 10px
}
.offCanvasMenu-row {
padding: 10px
}
.offCanvasMenu-separator {
padding: 0;
margin: 0;
border: none;
border-top: 1px solid transparent
}
.offCanvasMenu-link {
display: block;
padding: 10px;
font-size: 17px;
text-decoration: inherit
}
.offCanvasMenu-link:hover {
text-decoration: inherit
}
.offCanvasMenu-link.offCanvasMenu-link--splitToggle {
position: relative;
text-decoration: inherit
}
.offCanvasMenu-link.offCanvasMenu-link--splitToggle:before {
content: '';
position: absolute;
left: 0;
top: 6px;
bottom: 6px;
width: 0;
border-left: 1px solid currentColor
}
.offCanvasMenu-link.offCanvasMenu-link--splitToggle:after {
font-family: 'Font Awesome 5 Pro';
font-size: inherit;
font-style: normal;
font-weight: 400;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
content: "\f078";
width: .88em;
display: inline-block;
text-align: center
}
.offCanvasMenu-link.offCanvasMenu-link--splitToggle.is-active:after {
content: "\f077";
width: .88em;
display: inline-block;
text-align: center
}
.offCanvasMenu-linkHolder {
display: flex
}
.offCanvasMenu-linkHolder.is-selected a {
color: inherit
}
.offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link:first-child {
padding-left: 10px
}
.offCanvasMenu-linkHolder .offCanvasMenu-link {
flex-grow: 1
}
.offCanvasMenu-linkHolder .offCanvasMenu-link.offCanvasMenu-link--splitToggle {
flex-grow: 0
}
.offCanvasMenu-linkHolder .offCanvasMenu-link:hover {
background: none
}
.offCanvasMenu-list {
list-style: none;
margin: 0;
padding: 0
}
.offCanvasMenu-list>li {
border-top: 1px solid transparent
}
.offCanvasMenu-list:first-child>li:first-child {
border-top: none
}
.offCanvasMenu-subList {
list-style: none;
margin: 0;
padding: 0;
display: none;
opacity: 0;
-webkit-transition: max-height .25s ease, opacity .25s ease;
transition: max-height .25s ease, opacity .25s ease;
overflow: hidden;
max-height: 0;
padding-bottom: 15px
}
.offCanvasMenu-subList.is-active {
display: block;
opacity: 1;
max-height: 500px;
overflow-y: visible
}
.offCanvasMenu-subList.is-transitioning {
display: block;
overflow: hidden
}
.offCanvasMenu-subList .offCanvasMenu-link {
padding-left: 10px;
padding-top: 6px;
padding-bottom: 6px;
font-size: 13px
}
.offCanvasMenu-installBanner {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 6px;
font-size: 17px
}
.offCanvasMenu--blocks .offCanvasMenu-content {
background: #101010;
color: #cfd3da
}
.offCanvasMenu--blocks .offCanvasMenu-header {
color: #fefefe;
background: #ffb82b;
border-bottom: 1px solid rgba(255,255,255,0.12)
}
.offCanvasMenu--blocks .offCanvasMenu-separator {
border-top-color: rgba(255,255,255,0.045)
}
.offCanvasMenu--blocks .offCanvasMenu-list>li {
border-top-color: rgba(255,255,255,0.045)
}
.offCanvasMenu--nav .offCanvasMenu-content {
color: #fefefe;
background: #1b1b1b;
border-bottom: 1px solid #292734;
display: flex;
flex-direction: column
}
.offCanvasMenu--nav .offCanvasMenu-content a {
color: inherit
}
.offCanvasMenu--nav .offCanvasMenu-header {
background: #1b1b1b;
border-bottom: 1px solid #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-list {
border-bottom: 1px solid #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-separator {
border-top-color: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before {
border-left-color: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-linkHolder {
text-decoration: none
}
.offCanvasMenu--nav .offCanvasMenu-linkHolder:hover {
background: rgba(27,27,27,0.9399999999999999)
}
.offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected {
color: #ff8e00
}
.offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before {
border-left-color: rgba(255,142,0,0.2)
}
.offCanvasMenu--nav .offCanvasMenu-subList {
background: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-subList .offCanvasMenu-link:hover {
text-decoration: none;
background: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-list>li {
border-top-color: #1b1b1b
}
.offCanvasMenu--nav .offCanvasMenu-installBanner {
margin-top: auto;
background: #1b1b1b;
border-top: 1px solid #1b1b1b
}
И в чем разница?CSS:.offCanvasMenu { display: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 500; -webkit-transition: opacity .5s ease; transition: opacity .5s ease; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-tap-highlight-color: rgba(0,0,0,0) } .offCanvasMenu a { -webkit-tap-highlight-color: initial } .offCanvasMenu.is-transitioning { display: block } .offCanvasMenu.is-active { display: block } .offCanvasMenu .offCanvasMenu-hidden { display: none } .offCanvasMenu .offCanvasMenu-shown { display: block } .offCanvasMenu .offCanvasMenu-closer { float: right; cursor: pointer; text-decoration: none; -webkit-tap-highlight-color: initial; padding: 10px; margin: -10px } .offCanvasMenu .offCanvasMenu-closer:hover { text-decoration: none } .offCanvasMenu .offCanvasMenu-closer:after { font-family: 'Font Awesome 5 Pro'; font-size: inherit; font-style: normal; font-weight: 400; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f00d"; width: 1.28571429em; display: inline-block; text-align: center } .offCanvasMenu .block-container,.offCanvasMenu .blockMessage { margin-left: 0; margin-right: 0; border-radius: 0; border-left: none; border-right: none } .offCanvasMenu-shown { display: none } .offCanvasMenu-backdrop { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.25); opacity: 0; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .is-active .offCanvasMenu-backdrop { opacity: 1 } .offCanvasMenu-content { position: relative; width: 280px; max-width: 85%; height: 100%; overflow: auto; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; -webkit-overflow-scrolling: touch; box-shadow: 2px 0 5px 0 rgba(0,0,0,0.25); -webkit-transform: translateX(-280px); -ms-transform: translateX(-280px); transform: translateX(-280px) } .has-os-ios .offCanvasMenu-content { padding-bottom: 44px } .offCanvasMenu--fromOpposite .offCanvasMenu-content { position: absolute; right: 0; box-shadow: -2px 0 5px 0 rgba(0,0,0,0.25); -webkit-transform: translateX(280px); -ms-transform: translateX(280px); transform: translateX(280px) } .is-active .offCanvasMenu-content { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } .offCanvasMenu-content .p-nav-content { margin-bottom: 96px } .offCanvasMenu-header { padding: 10px; margin: 0; font-size: 20px; font-weight: 400 } .offCanvasMenu-header:before,.offCanvasMenu-header:after { content: " "; display: table } .offCanvasMenu-header:after { clear: both } .offCanvasMenu-header a { color: inherit; text-decoration: none } .offCanvasMenu-header a:hover { text-decoration: underline } .offCanvasMenu-header.offCanvasMenu-header--separated { margin-bottom: 10px } .offCanvasMenu-row { padding: 10px } .offCanvasMenu-separator { padding: 0; margin: 0; border: none; border-top: 1px solid transparent } .offCanvasMenu-link { display: block; padding: 10px; font-size: 17px; text-decoration: inherit } .offCanvasMenu-link:hover { text-decoration: inherit } .offCanvasMenu-link.offCanvasMenu-link--splitToggle { position: relative; text-decoration: inherit } .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { content: ''; position: absolute; left: 0; top: 6px; bottom: 6px; width: 0; border-left: 1px solid currentColor } .offCanvasMenu-link.offCanvasMenu-link--splitToggle:after { font-family: 'Font Awesome 5 Pro'; font-size: inherit; font-style: normal; font-weight: 400; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f078"; width: .88em; display: inline-block; text-align: center } .offCanvasMenu-link.offCanvasMenu-link--splitToggle.is-active:after { content: "\f077"; width: .88em; display: inline-block; text-align: center } .offCanvasMenu-linkHolder { display: flex } .offCanvasMenu-linkHolder.is-selected a { color: inherit } .offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link:first-child { padding-left: 10px } .offCanvasMenu-linkHolder .offCanvasMenu-link { flex-grow: 1 } .offCanvasMenu-linkHolder .offCanvasMenu-link.offCanvasMenu-link--splitToggle { flex-grow: 0 } .offCanvasMenu-linkHolder .offCanvasMenu-link:hover { background: none } .offCanvasMenu-list { list-style: none; margin: 0; padding: 0 } .offCanvasMenu-list>li { border-top: 1px solid transparent } .offCanvasMenu-list:first-child>li:first-child { border-top: none } .offCanvasMenu-subList { list-style: none; margin: 0; padding: 0; display: none; opacity: 0; -webkit-transition: max-height .25s ease, opacity .25s ease; transition: max-height .25s ease, opacity .25s ease; overflow: hidden; max-height: 0; padding-bottom: 15px } .offCanvasMenu-subList.is-active { display: block; opacity: 1; max-height: 500px; overflow-y: visible } .offCanvasMenu-subList.is-transitioning { display: block; overflow: hidden } .offCanvasMenu-subList .offCanvasMenu-link { padding-left: 10px; padding-top: 6px; padding-bottom: 6px; font-size: 13px } .offCanvasMenu-installBanner { display: flex; justify-content: space-between; align-items: center; padding: 10px 6px; font-size: 17px } .offCanvasMenu--blocks .offCanvasMenu-content { background: #101010; color: #cfd3da } .offCanvasMenu--blocks .offCanvasMenu-header { color: #fefefe; background: #ffb82b; border-bottom: 1px solid rgba(255,255,255,0.12) } .offCanvasMenu--blocks .offCanvasMenu-separator { border-top-color: rgba(255,255,255,0.045) } .offCanvasMenu--blocks .offCanvasMenu-list>li { border-top-color: rgba(255,255,255,0.045) } .offCanvasMenu--nav .offCanvasMenu-content { color: #fefefe; background: #1b1b1b; border-bottom: 1px solid #292734; display: flex; flex-direction: column } .offCanvasMenu--nav .offCanvasMenu-content a { color: inherit } .offCanvasMenu--nav .offCanvasMenu-header { background: #1b1b1b; border-bottom: 1px solid #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-list { border-bottom: 1px solid #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-separator { border-top-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { border-left-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-linkHolder { text-decoration: none } .offCanvasMenu--nav .offCanvasMenu-linkHolder:hover { background: rgba(27,27,27,0.9399999999999999) } .offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected { color: #ff8e00 } .offCanvasMenu--nav .offCanvasMenu-linkHolder.is-selected .offCanvasMenu-link.offCanvasMenu-link--splitToggle:before { border-left-color: rgba(255,142,0,0.2) } .offCanvasMenu--nav .offCanvasMenu-subList { background: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-subList .offCanvasMenu-link:hover { text-decoration: none; background: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-list>li { border-top-color: #1b1b1b } .offCanvasMenu--nav .offCanvasMenu-installBanner { margin-top: auto; background: #1b1b1b; border-top: 1px solid #1b1b1b }
Попробуйте этот код.И в чем разница?
Не помоглоПопробуйте этот код.