Vaf Links

Link to article: Vaf Links.

Module Styles

• td { vertical-align: top; }
  td strong { white-space: nowrap; }
  .options table.wiki-content-table td { border: none; padding: 0.7em 1em; }

• @import url('https://fonts.googleapis.com/css?family=Berkshire+Swash');
  #page-content .navigation-links a[href="/"],
  #page-content .navigation-links a:visited[href="/"],
  #page-content .navigation-links a:hover[href="/"] {
      text-decoration: none;
      color: #2e023a;
      pointer-events: none;
      cursor: text;
  }
  .navigation-links.hub {
      display: none;
  }
  .navigation-links.first .previous {
      display: none;
  }
  .navigation-links.last .next {
      display: none;
  }

Inline Styles

• display: block;

• display: none;

Includes

• (none)

CSS Classes

• code

• options

• navigation-links

• {$position}

• previous

• next

• link-to-with

• link-to-without

Page Source

[[iftags +component]]
[[module CSS]]
td { vertical-align: top; }
td strong { white-space: nowrap; }
.options table.wiki-content-table td { border: none; padding: 0.7em 1em; }
[[/module]]

This component is used on [[[vend-a-friend|Vend-a-Friend]]] articles. It does two things:

# Add a link that turns the Wondertainment Theme on or off.
# Automate the creation of navigation links.

This component applies the [[[theme:wondertainment|Wondertainment Theme]]] to a page, and imports the Berkshire Swash font, but is not a theme itself.

Made by [[*user Croquembouche]] at the request of [[*user DarkStuff]], in 2018.

+ Usage

Wherever you want the navigation links and theme toggle to appear, add this:

[[div class="code"]]
@@[[include :scp-wiki:component:vaf-links@@
| position=middle
| previous-page=
| previous-page-name=
| next-page=
| next-page-name=
]]
[[/div]]

Any CSS that would override the Wondertainment theme must be placed below this. Other CSS can be placed anywhere.

-----

Replace the variables in this with the names of the pages that you need to link to.

[[div class="options"]]
|| **position** || The position of this page in its series. Either "first", "middle", "last" or "hub". _
//"first" will show the hub and next page links.// _
//"middle" will show the hub, previous page and next page links.// _
//"last" will show the hub and previous page links.// _
//"hub" will show no links at all.// ||
|| **previous-page** || The relative URL (or 'fullname') of the previous page in the series. _
//If there is no previous page, set **position** to "first".// ||
|| **previous-page-name** || The title of the previous page in the series. _
//If there is no previous page, set **position** to "first".// ||
|| **next-page** || The relative URL (or 'fullname') of the next page in the series. _
//If there is no next page, set **position** to "last".// ||
|| **next-page-name** || The title of the next page in the series. _
//If there is no next page, set **position** to "last".// ||
[[/div]]

If you don't want any navigation links, set **position** to "hub" and don't even include the other parameters.

If the URL of any page is set to just "/", then the link will appear as normal unclickable text and you can put whatever you want there.
[[/iftags]]

[[module CSS]]
@import url('https://fonts.googleapis.com/css?family=Berkshire+Swash');
#page-content .navigation-links a[href="/"],
#page-content .navigation-links a:visited[href="/"],
#page-content .navigation-links a:hover[href="/"] {
    text-decoration: none;
    color: #2e023a;
    pointer-events: none;
    cursor: text;
}
.navigation-links.hub {
    display: none;
}
.navigation-links.first .previous {
    display: none;
}
.navigation-links.last .next {
    display: none;
}
[[/module]]

[[div class="navigation-links {$position}"]]
[[=]]
**[[span class="previous"]]<< [[[{$previous-page}|{$previous-page-name}]]] | [[/span]][[[Vend-a-Friend|Vend-a-Friend Hub]]][[span class="next"]] | [[[{$next-page}|{$next-page-name}]]] >>[[/span]]**
[[/=]]
[[/div]]

-----

[[module ListPages fullname="="]]
[[div class="link-to-with" style="display: block;"]]
> [/%%fullname%%/offset/0 w/ Wondertainment Theme]
[[/div]]
[[div class="link-to-without" style="display: none;"]]
> [/%%fullname%%/offset/1 w/o Wondertainment Theme]
[[/div]]
[[/module]]

[[module ListPages category="component" limit="1" name="vaf-theme" offset="@URL|0"]]
%%content%%
[[/module]]