I thought it was a good idea to share this here. It's a couple of CSS modifications to place the reply button and the post new discussion button at the bottom (sticky).
The approach is very similar to how Twitter does it, where there is a pinned post button. It is much more convenient for the user when they are on mobile to have this there, and it encourages much more open discussions and replies from mobile devices.
To use it, just paste this into the custom stylesheets part of Flarum. By the way, I'm using the default Flarum theme, I don't know if it's compatible with other themes.
/* Convierte el botón de publicar en sticky */
@media @phone {
.IndexPage-nav .item-newDiscussion .Button {
background: #15191e !important;
position: fixed;
top: 80%;
right: 20px;
border-radius: 50% !important;
width: 60px;
height: 60px;
z-index: 9999;
color: #8d9caa !important;
border: solid 3px !important;
}
}
/* Cambia el botón para componer mensaje en móvil */
@media @phone {
.ReplyPlaceholder {
background: #15191e!important;
position: fixed;
top: 80%;
right: 20px;
border-radius: 50% !important;
width: 60px;
height: 60px;
z-index: 9999;
color: #8d9caa !important;
border: solid 3px !important;
}
.ReplyPlaceholder .Post-header {
display: none;
}
.ReplyPlaceholder::before {
content: "\f1d8";
font-family: "Font Awesome 5 Free";
font-size: 24px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scaleX(-1);
}
}
