Template:Mobile: Difference between revisions

From 118Wiki
Jump to navigation Jump to search
m (Adding functionality to hide Side-TOC on mobile & improve display on sites w/ Keegan-BG class in use.)
(magic word PAGENAME -> FULLPAGENAME in order to include namespace (e.g. user pages))
 
(2 intermediate revisions by one other user not shown)
Line 1: Line 1:
<includeonly>{{#css:
<includeonly>{{#css:
.MobileLink { display:none; }
.MobileLink { display:none; }
.Keegan-BG { background-color:#ebf5ff; padding:20px; border-radius:40px; margin-right:185px; }
.Keegan-BG { padding:20px; border-radius:40px; margin-right:185px; }
.Side-TOC { display:block; }
.Side-TOC { display:block; }


Line 7: Line 7:
  .MobileLink { display:block; }
  .MobileLink { display:block; }
  .Side-TOC  { display:none; }
  .Side-TOC  { display:none; }
  .Keegan-BG { background-color:#ebf5ff; }
  .Keegan-BG { padding:auto; border-radius:auto; margin-right:auto; }
  }
  }
}}
}}
Line 13: Line 13:
'''Page not optimized for mobile!'''<br/>
'''Page not optimized for mobile!'''<br/>
For a better experience, visit:<br/>
For a better experience, visit:<br/>
'''[[{{PAGENAME}}/Mobile|{{#if: {{{1|}}} | {{{1}}}/Mobile | {{PAGENAME}}/Mobile }}]]'''
'''[[{{FULLPAGENAME}}/Mobile|{{#if: {{{1|}}} | {{{1}}}/Mobile | {{FULLPAGENAME}}/Mobile }}]]'''
</div></includeonly>
</div></includeonly>
<noinclude>Simply insert this Template onto a page (wherever you want it) and it will generate a warning for mobile users + a redlink to create a mobile-optimized page. If you want, you can also include a single parameter to change the destination of the redlink.
<noinclude>Simply insert this Template onto a page (wherever you want it) and it will generate a warning for mobile users + a redlink to create a mobile-optimized page. If you want, you can also include a single parameter to change the destination of the redlink.

Latest revision as of 10:25, 17 November 2023

Simply insert this Template onto a page (wherever you want it) and it will generate a warning for mobile users + a redlink to create a mobile-optimized page. If you want, you can also include a single parameter to change the destination of the redlink.

Default Usage:

Let's assume we're using this on a character, named Joe Boggs', wiki page.

{{Mobile}}

Generates:

Parameter Usage:

Let's assume we're using this on a page with a complicated name (e.g. Amity Auxiliary Craft) and we want to simplify it.

Note - This will change the appearance of the redlink, but not the actual page it links to - as that could produce some broken links/pages!

{{Mobile|AmityAux}}

Generates:


Note - This template should only appear on mobile devices (small screens); If you want to force it to appear, add a parameter called "template" and set it to "true", e.g.:

{{Mobile|template=true}}
{{Mobile|AmityAux|template=true}}