How can I get this mobile interface?

[deleted]

Have a look at https://discuss.infosecforge.io and let me know if this is what you are looking for. It's all CSS, and there is also a post here somewhere that has the CSS.

fakruzaruret

[deleted] Firstly thank you very much your reply, Your design is very good. Comment, vote and discuss view's position is good but category tag's location is narrow. I think it is not good for my website because I use sub categories much and I use categories more than one(up to two). I can't select just sub category. I have to select it with together its main category. for instance, There is fruits category and there apple, peach, and cherry sub catagories and I cant select just apple or cherry. System forces me to select it with together its main category fruit. So that I need more length area for category tag.

[deleted]

fakruzaruret that's not technically an issue. Still very workable with CSS.

Cathas9lives

[deleted] could you share your css codes? I think that is what I'm looking for.

[deleted]

Cathas9lives Have a look at this as a reference point
https://discuss.flarum.org/d/21092-modern-theme-for-flarum

CNMathon

fakruzaruret It likes cool! I think flarum need more theme, because it will make flarum more customized in style! 😃

Cathas9lives

[deleted] thanks !

Velany

has similar look on this site https://insurgencytr.com

fakruzaruret

Velany Yes it is similar but how can we get css code

fakruzaruret

Velany im mobile version category tags overflowing on icons of discussion and comments

[deleted]

fakruzaruret it's not hard. In your browser (I'm using Chrome here as an example) you can load the site, press F12 to open the developers console, then right click the particular element you are interested in, then choose inspect with the left mouse button.

This will allow the CSS applied to that particular element. Also, the link I posted above has a good portion of the CSS you need.

[deleted]

fakruzaruret This ought to fix that

@media (max-width: 767px) {
.TagLabel {
    padding: .1em .3em;
}
}