FM Design
Would you like to react to this message? Create an account in a few clicks or log in to continue.

IMPORTANT

FM Design is in read-only mode, please click here for more information.

Latest topics
» Forumactif Edge - Releases
by Ange Tuteur Tue 03 Sep 2019, 11:49

» GIFActif - Giphy Button for the Editor
by Ange Tuteur Wed 08 May 2019, 17:21

» Forum Closure
by Ange Tuteur Mon 01 Jan 2018, 01:28

» Chit Chat Thread
by Valoish Sun 31 Dec 2017, 19:15

» Font/Text background color.
by Valoish Sun 31 Dec 2017, 19:11

» Forumactif Messenger - Instant Message Application for Forumotion
by Wolfuryo Sun 31 Dec 2017, 18:24

» [GAME] Count to One Million!
by brandon_g Fri 29 Dec 2017, 18:58

» Post Cards
by manikbiradar Wed 20 Dec 2017, 07:50

» [GAME] Countdown from 200,000
by Valoish Wed 13 Dec 2017, 23:22

» GeekPolice Tech Support Forums - GeekPolice.net
by Dr Jay Mon 11 Dec 2017, 19:12

» Asking about some plugin for Forumotion
by Dr Jay Mon 11 Dec 2017, 19:10

» [GAME] What are you thinking right now?
by Van-Helsing Sat 09 Dec 2017, 14:51

» Widget : Similar topics
by ranbac Wed 06 Dec 2017, 18:11

» Change the Background of the Forum and put an image and how to make prefixs?
by Clement Wed 06 Dec 2017, 15:19

» Hello from Western Australia
by SarkZKalie Wed 06 Dec 2017, 05:34

Recent Tutorials
Top posting users this month

Who is online?
In total there are 23 users online :: 0 Registered, 0 Hidden and 23 Guests :: 1 Bot

None

[ View the whole list ]


Most users ever online was 515 on Tue 14 Sep 2021, 15:24

Header Linklist Show in Mobile Only

View previous topic View next topic Go down

Dr Jay
Dr Jay

Gender : Male
Posts : 156
Points : 2929
Reputation : 35
Location : USA
Language : English (Native)
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Forumactif Edge
http://www.geekpolice.net

PostDr Jay Sat 25 Feb 2017, 16:25

Hello there,

I have a special header enabled for my forum, please see this photo:
Header Linklist Show in Mobile Only Gphead10

As you can see, I don't have the usual linklist bar going underneath this special header section, because it is not needed to display Mark all forums read, View unanswered posts, View your posts, etc. when I have the info in the Special Header section.

Here is the bar that is hidden currently:
Header Linklist Show in Mobile Only Header10


However, my special header section up there is not shown on Mobile devices due to compatibility, because I cannot get my table data to float correctly and be inline on a mobile device. Therefore, I decided to hide that on mobile. However, this disables not only the special header section, but also the linklist bar.

I have tried a couple of methods to bring back the linklist bar for mobile devices only, but it is not doing it correctly. Can anyone tell me please what I'm doing incorrectly or if I've missed anything?
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12013
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Mon 27 Feb 2017, 12:16

@Dr Jay I have a question :

Would you rather make the homepage profile responsive ( rearrange contents for smaller screens ) or do as you're suggesting ; only show the original linklist. I figured I'd ask this first, because it's completely possible to rearrange the contents of the homepage profile for mobile by using media queries.
Dr Jay
Dr Jay

Gender : Male
Posts : 156
Points : 2929
Reputation : 35
Location : USA
Language : English (Native)
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Forumactif Edge
http://www.geekpolice.net

PostDr Jay Mon 27 Feb 2017, 12:55

I would love to try it out. I'm experimenting daily with mobile interface. Smile
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12013
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Fri 03 Mar 2017, 13:06

I think the best solution would be to remove the floats on the avatar, stats, and link containers ; displaying each section on their own line. This way there will be a lot more space for each section and they wont seem as cramped on mobile. Think

I think you're using the homepage profile I made for FM way back, so I used theirs as an example for the snippet below. Go ahead and add it to your stylesheet.
Code:
@media (min-width:0px) and (max-width:768px) {

  #userProfile div[class$="Col"] {
    float:none;
    width:100%;
    margin-bottom:12px;
  }

  #userProfile div[class$="Col"] .title {
    width:100%;
  }

}

On any device below 768 pixels wide the homepage profile should look similar to this :
Header Linklist Show in Mobile Only Captur12
Dr Jay
Dr Jay

Gender : Male
Posts : 156
Points : 2929
Reputation : 35
Location : USA
Language : English (Native)
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Forumactif Edge
http://www.geekpolice.net

PostDr Jay Fri 03 Mar 2017, 13:45

Okay... I have used that version you posted long ago, but I modified it quite a bit to make it more unique, especially incorporating FA, FAE elements, etc.

I once attempted to make it hide-able; however, it did not work for various reasons... But we decided as admins not to have it be hidden due to its minimal interface and extreme usefulness for a variety of situations, especially for non-staff (especially incorporating the avatar clicking ability to edit it). Of course, nothing super brilliant... Just accessible.

I will attempt this as soon as possible. I will be out of the office today, so I will check later today and see how it appears. Smile

Thanks for your time!

P.S. - I'm helping several other administrators with the different FAE techniques... They love it! I am helping several others privately to ensure they too can accomplish their dreams. Thanks again! Very Happy

(If you are still adding affiliates, especially direct ones, I've had a partner icon up for FM Design for a few months now. I can provide a mini-icon, if you don't mind)
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12013
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Fri 03 Mar 2017, 13:58

Ah, well if you changed any selectors, the snippet of CSS I provided might not work. If that's the case, just let me know the modified code if you need any help adapting it. Wink


Yes, the affiliates page is still active, let me know your button when you get the chance, so that I may add your forum. Thumb left
Dr Jay
Dr Jay

Gender : Male
Posts : 156
Points : 2929
Reputation : 35
Location : USA
Language : English (Native)
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Forumactif Edge
http://www.geekpolice.net

PostDr Jay Sat 04 Mar 2017, 04:17

Okay... This morning... tested... and it works well! => Solved and thanks.

Button for GeekPolice Affiliate:

Header Linklist Show in Mobile Only Gp10

Shamrock
Ange Tuteur
Ange Tuteur
Administrator
Gender : Male
Posts : 4741
Points : 12013
Reputation : 2375
Location : Pennsylvania
Language : EN, JA, FR
Browser : Browser : Brave Forum Version : Forum Version : Forumactif Edge
https://sethclydesdale.github.io/ https://twitter.com/sethc1995

PostAnge Tuteur Mon 06 Mar 2017, 11:07

Good to hear ! Thanks, I added your button to our affiliate page. Wink
Dr Jay
Dr Jay

Gender : Male
Posts : 156
Points : 2929
Reputation : 35
Location : USA
Language : English (Native)
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Forumactif Edge
http://www.geekpolice.net

PostDr Jay Mon 06 Mar 2017, 12:45

You're welcome. Bow 3
Sponsored content

PostSponsored content

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

 
Permissions in this forum:
You cannot reply to topics in this forum