AowVN I bought a Solution for you
So Firstly you need to Follow Step 1, 2, 3, and 4
and ignore Step 5 and Step 6 and follow the steps below
Step 5 Add the below Css in custom CSS
@media screen and (max-width: 767px) {
.RAMmenu {
z-index: 9;
bottom: 0;
position: fixed;
flex-grow: 1;
height: 44px;
overflow: hidden;
width: 100%;
background-color: @primary-color;
}
.menu-item {
display: flex;
border-left: 2px solid white;
flex-direction: column;
background: none !important;
justify-content: center;
padding-top: 4px;
align-items: center;
flex-grow: 1;
cursor: pointer;
text-decoration: none;
&:focus,
&:hover {
outline: none;
.rameshtab {
color: #d4d4d4;
}
}
}
.NayaShruKar {
display: none;
}
.hotelkhel {
display: none;
}
.rameshtab {
display: block;
margin-bottom: 4px;
font-size: 21px;
transition: 0.25s ease;
color: white;
}
.gharkhel {
border-left: none !important;
}
.App--index {
.NayaShruKar {
display: flex !important;
}
}
.App--discussion{
.hotelkhel {
display: flex !important;
}
}
}
@media screen and (min-width: 750px) {
.RAMmenu {
display: none;
}
.menu-item {
display: none;
}
.rameshtab {
display: none;
}
}
.RAMmenu {
display: flex !important;
}
Step 6 Add the below code in Custom Footer
<script>
var divs = document.createElement("div");
divs.innerHTML = '<nav class="RAMmenu" style="display:none"><a onclick="gharchalo()" class="menu-item gharkhel"><i class="fas fa-home rameshtab"></i></a><a onclick="tagsde()" class="menu-item"><i class="fas fa-tags rameshtab"></i></a><a onclick="newDiscussRamesh()" class="menu-item NayaShruKar"><i class="fas fa-plus rameshtab"></i></a><a onclick="replykaro()" class="menu-item hotelkhel"><i class="fas fa-comment-dots rameshtab"></i></a><a onclick="settingsWala()" class="menu-item"><i class="fas fa-user-shield rameshtab"></i></a><a onclick="notifierM()" class="menu-item"><i class="fas fa-bell rameshtab"></i></a></nav>'
document.getElementById('app').appendChild(divs);
</script>
Demo https://custommobiletab.freeflarum.com/
Note : Those who are thinking this is also showing for logged-out users, So its not the truth it's only showing on free flarum as its not having logged in class extension so only freeflarum users have to compromise.
