The Style Switcher

Wondering about the style switcher? You've come to the right place.

How Does It Work?

Well, the style switcher is basically a feature that allows you to change the look of the site. You do it using the drop-down that should be located near the top of the page. The drop-down contains a selection of styles that you can pick from, and once you've selected one, BOOM! the page will refresh and the style will change. If you then browse to another section of the site, the style should remain the same, provided you have cookies enabled on your browser.

The pages of the site are given all their color and style through a CSS stylesheet, which is a kind of document that tells your browser things about what the webpage should look like. The style switcher will, through a server-side script, apply a different stylesheet to the page if you select a different style. The actual code, including the text on the page, will therefore be the same in all styles - only the stylesheet changes. There are a couple of exceptions, but they're minor, just involving a snippet of extra code for browser compatibility or other convenience.

As an extra bit of fun, some of the styles differ in the site's slogan, "Where the smallest bugs live alongside the strongest dragons." The point of the slogan (that bugs and dragons are equal) is always the same, but the presentation varies.

What Is the "ID"?

On any regular page of the site (one that shows the full layout and menu), you can add ?style=styleid (replace styleid with the ID of the style, obviously) at the end of the URL, and the page will appear in that style. This will NOT set the style cookie (meaning that if you enter another page, it will go back to the style you had before); it's thought as a previewing thing, mostly, and a quick way to link to what a particular page looks like in a particular style. For example, the style names below are linked to this page with those styles applied in this way - a good way to get a preview of each style while keeping the style you're currently using.

There is also a way to actually switch your style with a link, by visiting the page /set-style?style=styleid. There is no reason to do this normally, but if you want to use some of the deprecated styles listed near the bottom of this page, they provide links that you can use to switch to them even though they aren't in the drop-down.

What Are the Different Styles?

Currently, these are the active styles on the site:

Butterfree style (ID: butterfree): A minimalist, light purple style featuring Butterfree. It has a three-column layout on desktop browsers but falls back to a dropdown on smaller/mobile devices.
Voice of the Forest style (ID: celebi): A pleasant light green, image-based responsive style, starring Celebi. This is largely based on the Modern style layout (see below), but with different colors and tweaks. Slogan is unchanged.
Roar of Time style (ID: roaroftime): A dark blue and black style for the dark mode lovers, also based on the Modern style layout.
Modern style (ID: modern): Modern style was originally created for April Fools' Day 2015; the original version, "Daybreak Recreation & Activities Group Productions style", can be found under Deprecated Styles below. It has a white background, large near-black text, a sticky drop-down menu at the top, affiliates at the bottom, and is made to be responsive with mobile devices in mind.
Minimal Dewgong style (ID: dewgong): A simple, basic, minimal style; white with black text, three columns with the menu on the left and affiliates on the right. Starring (obviously) Dewgong.
Axe-Murderer style (ID: axe-murderer): This style has a black background and white text. It's a bit different because the affiliate bar is actually on the left and the menu is at the top in drop-down format. The slogan is also changed to "where nobody gets mercy, dragon or not". Starring Sneasel.
Scyther Slash style (ID: scyther): A Scyther-themed three-column layout, medium grayish green with black text. The slogan here is "Where the bugs don't slash up the dragons ...that much." The last two words are an addition made in this version of the style; I felt the old version (under Deprecated Styles below) needed a bit of a punchline.
Shiny Ninetales style (ID: sninetales): A lavender style with black text, inspired by the colors of a shiny Ninetales. Slogan is unchanged, and the actual layout excluding the colors and banner is yet again a simple three-column setup.
Nidoking Poison style (ID: nidoking): Dark purple background with lighter purple navigation bars on the sides. The content stretches, but the navigation bars are fixed and use background images. Unchanged slogan.
Bouncy Mew style (ID: mew): The slogan has been changed to "Where, like, everybody is nice to each other and stuff ^_^" but it keeps to the basic three-column layout of Shiny Ninetales with a couple of rather minor tweaks. It's pink, if the Mew mascot didn't tell you.
Hellfire style (ID: hellfire): A dark, fiery, image-based style with Houndoom and Houndour as the mascots. Slogan is "Where everybody is equally doomed". The navigation here is done by drop-downs at the top of the page while the affiliates are on the right.
Spectrum style (ID: spectrum): Spectrum style was made in celebration of the site's fourth birthday and is the only style to feature Pokémon from multiple different families - in fact, it features 30 different Pokémon in some way or another. It has a white background and various different colors for different purposes, as the name implies. The slogan is "Where your color matters no more than whether you are an insect or a mythical reptile", which is simply adding no discrimination by color into the equation. This style does not have any columns at all - the menu is at the top in drop-down form and the affiliates are at the bottom.
Articuno Snowflake style (ID: articuno): A light blue, wintery style that takes on the challenge of creating an image-based three-column style that nonetheless will stretch to fit any resolution or user font size within reason. I think it came out nicely, personally. The slogan has been changed to "Where the weak and strong are sheltered from the winter cold...".
Torkoal Lava style (ID: torkoal): A simple, light orange and black style that I rather like. The slogan is missing this time because I couldn't be bothered to think of one. I'll probably add it in at some point.

Easter Egg Styles

These styles are not in the actual styleswitcher drop-down, because they were made as easter eggs or jokes, such as for April Fools' Day jokes. They may look intentionally bad or otherwise not be very serious styles.

Oldie style (ID: oldie): This style is very likely to hurt your eyes. When this site started, it was called "Butterfree's Pokémon Site" and looked like this, and because of the flexibility of the styleswitcher it was possible to recreate that look almost perfectly, so I couldn't resist the opportunity to try. It's not really meant for use - more just as something to invoke nostalgia in those who visited the site way back when - but if for some ungodly reason you want to switch your style cookie to it anyway, you can do so. There is no slogan in this style, as the slogan didn't exist when the site started.
Daybreak Recreation & Activities Group Productions style [img][mod] (ID: drag): This style was forced on everyone on April 1st 2015 as part of that year's April Fools' joke. It is essentially identical to Modern style (which originated as a modified version of this style), except that its top banner is ludicrously humongous in desktop browsers and it hides the style switcher completely (after all, the joke pretended this style was going to be the only one on the site permanently). If for some reason you really like humongous top banners, you can switch your style cookie to it here, but since it's missing the style switcher, the easiest way to switch your style again may be to return to this page.
Sketch style (ID: sketch): On April 1st 2016, I claimed to be replacing all the images on the site with my own drawings, including the top banner of Modern style. This was a joke, but a lot of people liked the banner, so I decided to keep a copy of that version around. Thus, this is just Modern style but with a different banner. If you want, you can set your style cookie to it. (One neat side-effect of the different banner bit: unlike the 1.4-megabyte transparent PNG that heads Modern style, the Sketch style banner is only 89 kilobytes. If you want the site lighter on your connection, switching to Sketch style will definitely do it.)
Old-School style (ID: oldschool): A responsive three-column layout with a black background and off-white text, based on what the site looked like in 2003, created for April Fools' Day 2018. In other words, it's a joke style, so treat it accordingly - it's got things like a cursor trailer and bright red Comic Neue for the banner and menu headers. If you like it regardless, you can set it as your cookied style.
Casino style (ID: casino): An edit of Scyther Slash style made for April Fools' Day 2024, when I put up a mechanics article about the R/S/E roulette minigame and rebranded the site as "The Casino of Dragonflies" in its honor. It doesn't look amazing, but uses colors and design elements from the R/S/E roulette and has a banner featuring my own art of Shroomish and Taillow, which feature in the minigame, as well as the motto "Where the smallest birds and mushrooms will cheat for you", in reference to one of the roulette minigame's wilder mechanics. If you liked the style, you can set your cookie to it here.

Former Styles

There are older styles that were at some point in the history of the site replaced by newer styles, though they're visually distinct from their newer counterparts. Note that they are not made to be compatible with mobile phones.

Old Hellfire style (ID: houndoom): This used to be Hellfire style, but I just hated just about everything about it and later figured out how to make pretty good-looking flames in Photoshop, so I started from scratch and made a new one. Like the new Hellfire style, it has a black background and features a lot of flames, but this one is fixed-width and has a three-column layout. If you really liked this one and want to use it, you can still set it as your cookied style.
Shiny Umbreon style (ID: sumbreon): A simple three-column setup similar to Shiny Ninetales. Different shades of dark blue, basically, with light blue text, starring a shiny Umbreon. This was replaced by Roar of Time style as that is also a dark blue style; if you liked Shiny Umbreon better, you can still switch your cookie to it.
Old Scyther Slash style (ID: old-scyther): A medium green style with black text. Slogan is changed to "where the bugs don't slash up the dragons" - basically, while the slogan is normally kind of being nice to the weaker bugs, this one implies that it is being nice to the poor dragons. Starring Scyther. The style has been remade into the current Scyther Slash style; if you preferred the old one, you can change your cookie to it here.
Old Voice of the Forest style (ID: float): The old version of Voice of the Forest style, replaced with the new one when the fixed width was starting to feel painfully outdated. This version has a three-column layout with the menu on the left and affiliates on the right. If you preferred the old version, you can of course set your cookie to it.
Old Roar of Time style (ID: dialga): The old version of Roar of Time style. Black and dark blue with some gradients and wavy patterns, and menus on either side of the page, with an unchanged slogan.

Deprecated Styles

For the site's twentieth anniversary, I remade all the older styles that were still in use, in a rather conservative manner, adding mobile compatibility, spacing and larger font sizes but keeping the aesthetic of the style the same. The older versions are still available for archival purposes, if you were really attached to that 8pt font size. Like the former styles above, these old versions were not created with mobile browsers in mind.

Minimal Dewgong style (ID: old-dewgong): The pre-twentieth-anniversary version of Minimal Dewgong style. To set your style cookie to it, click here.
Axe-Murderer style (ID: nonie): The pre-twentieth-anniversary version of Axe-Murderer style. To set your style cookie to it, click here.
Scyther Slash style (ID: prev-scyther): The pre-twentieth-anniversary version of Scyther Slash style. To set your style cookie to it, click here.
Shiny Ninetales style (ID: old-sninetales): The pre-twentieth-anniversary version of Shiny Ninetales style. To set your style cookie to it, click here.
Nidoking Poison style (ID: old-nidoking): The pre-twentieth-anniversary version of Nidoking Poison style. To set your style cookie to it, click here.
Bouncy Mew style (ID: old-mew): The pre-twentieth-anniversary version of Bouncy Mew style. To set your style cookie to it, click here.
Hellfire style (ID: old-hellfire): The pre-twentieth-anniversary version of Hellfire style. To set your style cookie to it, click here.
Spectrum style (ID: onecol): The pre-twentieth-anniversary version of Spectrum style. To set your style cookie to it, click here.
Articuno Snowflake style (ID: old-articuno): The pre-twentieth-anniversary version of Articuno Snowflake style. To set your style cookie to it, click here.
Torkoal Lava style (ID: old-torkoal): The pre-twentieth-anniversary version of Torkoal Lava style. To set your style cookie to it, click here.

Page last modified April 2 2024 at 03:48 UTC

Comments

No comments on this page as of yet.

Post comment

Inflammatory or off-topic comments will be deleted; please go to the guestbook for discussion unrelated to this page. You can use BBCode (forum code) to format your messages.

[b]Bold[/b]
[i]Italic[/i]
[u]Underlined[/u]
[s]Strikethrough[/s]
[url=http://www.dragonflycave.com]Link[/url]
[spoiler]Spoiler[/spoiler]