various issues with the mobile version

[hateandbeat]

those are various issues with the mobile version. the WPLMS is great in general and I think I got everything sorted. so now I started to look into the details and I found those issue in the mobile version with the Arabic language. please look into them, I'll give each one of them a number so you can refer to each one of them by that ID ID: 01 : in the last update and post count section where word crumble together http://bit.ly/2uY3clD ID: 02 :  that button on top of the quiz title http://bit.ly/2I9xFpz ID: 03 : the strange large unknown rating and the two button on top of each other on the bottom http://bit.ly/2Z4AP2T ID: 04 : the bottom footer padding http://bit.ly/2UNGxaj ID: 05 : the unit tag and time on top of each other, and the arrows pointing to the same side http://bit.ly/2Ira2bs ID: 06 : the mark obtained text http://bit.ly/2P2NIG4 ID: 07 : text height  in the title of the quiz http://bit.ly/2Iltlmt ID: 08 : the save progress and sumbit exam http://bit.ly/2U4ttZG

[hateandbeat]

I solve ID:01, ID06 and ID08 by playing around with the translation instead of playing around with CSS. ID02 is a huge problem for me, and it's high priority.

[logan]

This reply has been marked as private.

[hateandbeat]

This reply has been marked as private.

[logan]

Hello, Please goto wp-admin >> appearance >> customize >> custom css >> paste & save. ID: 2) .rtl.page-template-start .data_stats[data-type="quiz"] { left: 0 !imporatnt; } .rtl.page-template-start .unit_content span { margin-top: -2px !important; } ID: 3) elaborate more about this page or url. i could not find this page. ID: 4) share the proper demarcation which portion do you want to decrease/increase. Refer: http://prntscr.com/nd6sg0 ID: 5) refer: http://prntscr.com/nd6zmg .rtl.page-template-start .unit_content span i.icon-printer-1 {display: block !important;} .rtl.page-template-start .unit_content span { margin-top: 0px !important;left: 0; float: left; } ID: 7) refer: http://prntscr.com/nd7755 @media (max-width: 720px) { .rtl .unit_wrap div#unit h1 { line-height: 1.6em; }}

[hateandbeat]

Hello , Thanks for fixing some of the issues. for ID:03 simply it's a course page when you scroll down a bit https://anamashro3.com/course/%D9%85%D9%82%D8%AF%D9%85%D8%A9-%D9%81%D9%8A-%D8%A5%D8%A8%D8%B1%D8%A7%D8%B2-%D8%AD%D8%AC%D9%8A%D8%A9-%D8%A7%D9%84%D9%82%D8%B1%D8%A2%D9%86-%D8%A7%D9%84%D9%83%D8%B1%D9%8A%D9%85/ forget the large unknown review word. but focus on the two buttons "the cart" and the other hamburger menu button that consists of the tabs of the course. the screenshot was taken from my Iphone 7. and for ID07 can we make the line-hight: 1.6em for the course title too in the sidebar http://bit.ly/2Iltlmt for ID04 I meant the padding in bottom footer between the social icons and all rights reserved. want it to be increased a bit. as you see in the Arabic text they're very close to each other. http://bit.ly/2UNGxaj

[Ava]

Issue 1: Fixed.

Please paste the below Custom Css code to

Wp-admin > Appearance > Customisation > Custom Css > Publish

@media screen and ( max-width:414px){

.rtl #scroll_to_course_button {

position: absolute;right: 360px;top: -1243px;margin: 0;z-index: 99;border: none;

}}

Refer: http://prntscr.com/ndpguj   Issue 2: Fixed.

Please paste the below Custom Css code to

Wp-admin > Appearance > Customisation > Custom Css > Publish

@media screen and ( max-width:414px){

.rtl course_action_points h1 {

line-height: 1.6em;

}

}     Issue 3: Fixed.

Please paste the below Custom Css code to

Wp-admin > Appearance > Customisation > Custom Css > Publish

@media screen and ( max-width:414px){

.rtl ul.socialicons li {

float: left;width: auto!important;border: none!important;margin: 0 0 0 0px;

}

Refer: http://prntscr.com/ndpkc3

[hateandbeat]

@media screen and ( max-width:720px){   .rtl .course_action_points h1 {   line-height: 1.6em; }   }   @media screen and ( max-width:720px){ .single-course #item-header #item-meta .course-star-rating, .course_reviews .show_course_reviews .reviewlist.commentlist .comment-body .comment-avatar, .assignment_students li input[type=checkbox], .course_students li input[type=checkbox], .quiz_students li input[type=checkbox], .tab-pane li img, .single-course.c2 #item-nav div.item-list-tabs#object-nav li, .single-course.c3 #item-nav div.item-list-tabs#object-nav li, .single-course.c5 #item-nav div.item-list-tabs#object-nav li { float: left; }     }   @media screen and ( max-width:414px){   .rtl ul.socialicons li {   padding-top: 10px;     } I used the previous codes to fix the issues. thanks fixing the title: https://paste.pics/826f1420edebae51eac7e8971114c513   the scrambled menu: https://paste.pics/9eca3a46bdf8e4f953d286241857b136 the bottom footer: https://paste.pics/936af7da70fba5448d21bc83511e2dcd thanks. it's actually my first time playing with CSS and wordpress customizer :D I've a new issue not related to those. should I post a new topic? or I can post it here?

[logan]

Hello, You are a legend man, keep learning keep sharing :) Styling related issues will be posted here. for other issues you can post in sub sections like how to, others , setup, updates etc. let me know if there  is any remaining styling issue.

[hateandbeat]

hi, I came back with a couple of things ID01 : whenever i add a telegram icon using elementor, it doesn't show up https://paste.pics/f803a2edbcdf3a40e0b3bb9888e4ee6f plus we want to add a telegram link in the bottom footer, but the them doesn't has that option. so how we can over these two issues? ID02: there is a responsive issue in bbpress, the profile pic should be on the right, and the two buttons in the top should be arranged properly https://paste.pics/2a01ee1de0254be74c472fc921f8485a finally I just want to pay your attention to something, that although I didn't use any elementor header, the theme somehow uses two headers, the header i chose from the settings sleek, and the other header that appears on any page that were made with elemntor in the full width template. so any page uses the elementor template will make the theme view the other header instead of the normal header, the screenshots can view that. I don't know if there is a fix for that https://paste.pics/df4a9529dfd5340f6b72370b2b08db0f https://paste.pics/f43a5fe772adf308b691e402d189ffc0 thanks in forward

[hateandbeat]

This reply has been marked as private.

[logan]

Hello, issue 1: share video of the steps you are following only then i will be able to understand the issue and provide you solutions for it. If you want to send us a video of the issue, use https://screencast-o-matic.com/ to upload and share url of the video. **yes theme does not have telegram icon. i have reported this to development team. track your card here: https://trello.com/c/ARoRpQdb solution that i can provide: choose an icon from selected list then i will share the code to replace its icon by telegram in front end. issue 2: always share page url its hard to look into your inspect element screenshot and find url. here: https://paste.pics/2a01ee1de0254be74c472fc921f8485a i could not find issue here: https://cl.ly/dec0bc issue 3: yes it is. there is only 1 header but if you dont want to show default header at homepage then you can change template with elementor full width. else with default the default layout of wplms will be applied. if you are having any issue with it share page url with proper screenshot and demarcation. i will look into this matter asap.

[hateandbeat]

Hi , thanks for your time regarding the telegram icon, can we replace the tumbler icon with the telegram icon? regarding the forum issue, you were in an empty forum with the create new topic form. so there was no content. but if you opened any already created topic you'll see the issue. and here is link: https://anamashro3.com/forums/topic/%D9%87%D8%B0%D8%A7-%D9%85%D9%82%D8%A7%D9%84-%D8%AA%D8%AC%D8%B1%D9%8A%D8%A8%D9%8A-%D8%BA%D9%8A%D8%B1-%D9%85%D8%AB%D8%A8%D8%AA/ finally regarding the headers issue. what I meant that I want the sleek header style to be applied to all pages even those with elementor full width page template, or that's not possible as using elementor full width page template will always activate the default header style for that page ?

[logan]

Hello, i have added this code in your footer. jQuery('document').ready(function(){  $('div#footer_social_icons ul.socialicons i.fa.fa-tumblr').addClass('fab fa-telegram').removeClass('fa fa-tumblr');    }); & in customizer. add_action('wp_footer',function (){     ?>           <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"/>            <?php }); and here it is: http://prntscr.com/njsfcf

[logan]

hello, use this css in your appearance >> customize >> custom css. @media (min-width: 320px) and (max-width: 420px){ .rtl.single-topic div#bbpress-forums span#subscription-toggle {position: relative; top: 28px; right: -5px;} .rtl.single-topic div#bbpress-forums span#favorite-toggle {position: relative; top: 8px; right: 50px;}   } remove cache and check effect. refer: http://prntscr.com/njsmpw  

[Author]

Posts