Bug in the mobile View after update 3.1

[nolls]

Hi,
after updating Kleo to 3.1 there is a bug in the mobile view.
The “Alternate” area is not shown correctly.

[sharmstr]

Can you be specific? Here’s a demo page that utilizes the alternate area (weekly section half way down) and its displaying fine: http://seventhqueen.com/themes/kleo/news-magazine/

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[nolls]

Have a look on the screenshots, there you can see the changes.
It’s only on smartphone devices.

Attachments:

You must be logged in to view attached files.

[nolls]

Ok I’ve tested it. I use the following additional Code in CSS.
If I delete the code, the bug is gone.

COPY CODE

body.buddypress.is-user-profile div#item-header {
min-height: 600px;
}

img.wp-smiley,
img.emoji{
height: 1.5em!important; 
max-height: 1.5em!important;
width: 1.5em!important;
}
@media (max-width:650px) {

.kleo-main-header.header-normal {
    position: fixed !important;
    clear: both !important;
}
#main {
	
	margin-top: 40px !important;
}
}
.sidebar.sidebar-main.col-sm-3.sidebar-right { overflow-y: scroll; height: 1300px; }

/* Activity Stream  */

#buddypress { height: 1000px !important; overflow-y: scroll !important; }

body.activity .kleo-transform .one-by-one-animated .start-animation .el-appear, body.activity .kleo-transform .kleo-thumbs-animated.th-appear img.start-animation, .kleo-transform .start-animation.el-appear {
-webkit-animation: none;
-o-animation: none;
animation: none;
opacity: 1;
-moz-transform: none;
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity:1 !important;
}

body.activity .kleo-transform .animated.animate-when-visible, .kleo-transform .animated.animate-when-almost-visible, .cul {
opacity: 1;
}

/*For Members Directory */
div#members-dir-list { height: 1300px; overflow-y: scroll; overflow-x: hidden;}

body.directory.members .kleo-transform .one-by-one-animated .start-animation .el-appear, body.directory.members .kleo-transform .kleo-thumbs-animated.th-appear img.start-animation, .kleo-transform .start-animation.el-appear {
-webkit-animation: none;
-o-animation: none;
animation: none;
opacity: 1;
-moz-transform: none;
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity:1 !important;
}

body.directory.members .kleo-transform .animated.animate-when-visible, .kleo-transform .animated.animate-when-almost-visible, .cul {
opacity: 1;
}

/* Group Activity */
div#groups-dir-list { height: 1000px; overflow-y: scroll; overflow-x: hidden; }

body.directory.groups .kleo-transform .one-by-one-animated .start-animation .el-appear, body.directory.members .kleo-transform .kleo-thumbs-animated.th-appear img.start-animation, .kleo-transform .start-animation.el-appear {
-webkit-animation: none;
-o-animation: none;
animation: none;
opacity: 1;
-moz-transform: none;
-webkit-transform: none;
-o-transform: none;
transform: none;
opacity:1 !important;
}

body.directory.groups .kleo-transform .animated.animate-when-visible, .kleo-transform .animated.animate-when-almost-visible, .cul {
opacity: 1;
}

[nolls]

margin-top: 40px !important;

thats the bug, rise to 80px and it works.

Sorry for irritation

[Author]

Posts