User:Zoombie/Sandbox

From GodWiki
Jump to navigation Jump to search

CSS Triangles :D

Arrow up

Arrow left

Arrow right

Arrow in a box

Arrow link / button (points to ideabox template testing below) Note: The triangle does not support text inside it and putting text beside it is more work than it is worth it. <span> does not render a triangle with this code.


!Hero's Diary
Let's try to make this collapsible. No, not this one. This is the default using the template. Try the one below.

Current diary entry with collapsible content:

!Introduction to the Godwiki


Welcome to the source of all Godville information.

Anybody can edit any article here, especially you!

Don't know where to get started? The Godwiki Guidebook will help you get oriented, and then you can take a look at the Creators Manual and various Guidelines for advice on creating great GodWiki content.

Why not write a short article on a particular Monster, Artifact, Skill, Tavern, Quest or piece of Equipment that's caught your eye?

You can ask for help if you'd like an assist with something you're working on — whether it's to check your spelling and grammar, or something technical about GodWiki features.

The frontpage — this one you're reading — has a Discussion page that's a good place to look for wiki-wide announcements and notes of interest to Godwiki editors. It's also where you can ask general questions that don't pertain to any specific article. (For those, use the article's own Discussion page.)

For Godville game-related questions, the forums are usually better.

Thank you for all your contributions!

My collapsible diary entry:

!Hero's Diary

Welcome to the source of all Godville information.

Anybody can edit any article here, especially you!

Don't know where to get started? The Godwiki Guidebook will help you get oriented, and then you can take a look at the Creators Manual and various Guidelines for advice on creating great GodWiki content.

Why not write a short article on a particular Monster, Artifact, Skill, Tavern, Quest or piece of Equipment that's caught your eye?

You can ask for help if you'd like an assist with something you're working on — whether it's to check your spelling and grammar, or something technical about GodWiki features.

The frontpage — this one you're reading — has a Discussion page that's a good place to look for wiki-wide announcements and notes of interest to Godwiki editors. It's also where you can ask general questions that don't pertain to any specific article. (For those, use the article's own Discussion page.)

For Godville game-related questions, the forums are usually better.

Thank you for all your contributions!

Arrow options:

!Hero's Diary
Text
!Hero's Diary
Text

Two arrows variation:

 !Hero's Diary
Text
Hero's Diary
Text
Hero's Diary
Text

Text instead of symbol:

!Hero's Diary↻ [hide]
Text
!Hero's Diary↻ [collapse]
Text

Removed other symbols:

Hero's Diary
Text
Hero's Diary
Text

Hidden toggle:

!Hero's Diary 
Text
Hero's Diary 
Text

Note: This is not advisable for use in making nested collapsibles. Weird things happen likely due to the bug stated below.


Simulating ideabox ingenious pieces (desktop version)

12
yes
32
no
34 dupes
54 in ER
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.
Category
12
yes
32
no
34 dupes
54 in ER
Text
Category

Template test:

yes = 12| no = 13| dupe = 3| er = 2| text = Test| category = Test

12
yes
13
no
3 dupes
2 in ER
Test


yes = | no = 0| dupe = 1| er = a| text =| category =

0
yes
0
no
1 dupe


yes = | no = 0| dupe = -| er = a| text = Test| category =

0
yes
0
no
Test


yes = a| no = 0| dupe = -| er = 1| text =| category = Test

0
yes
0
no
1 in ER




«
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.
»
— Some author, Somewhere
«
Hello there!
»
— Some author, Somewhere
«
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.
»
— Some author, Somewhere
«
Just testing stuff.
»
— Some author, Somewhere
«
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.
»
— Some author, Somewhere
«
Time to lorem ipsum the whole thing.
»
— Some author, Somewhere
Deities of Godville
asdf Zoombie
Example-simple.png
Hero dgdfyjjjjjjjjjjjjjjjjjjjjjjjjjrrrrrrrrrrrrrrrtttttttttthhhhhhhhhhhhhhhhhhhhhhhhhhh
Personality uior
Gender try
Motto mb
«
This quote and the one below are inside the flex div but has no flex properties specified.
»
— Some author, Somewhere
«
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.
»
— Some author, Somewhere


«
This quote and the one below are outside the flex div.
»
— Some author, Somewhere
«
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.
»
— Some author, Somewhere


Heading
Title 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.

Title 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.


Heading
Title 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.
Title 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce molestie enim at velit consectetur, sit amet accumsan turpis venenatis. Etiam purus lectus, volutpat vel enim et, faucibus consequat ligula. Sed auctor congue eleifend. Curabitur a laoreet est, at varius tortor. Nam congue metus enim, ut mollis tortor imperdiet vel. Suspendisse vitae auctor lacus, non luctus urna. Integer sit amet metus sit amet tellus tristique varius sit amet id felis. Morbi elementum maximus justo non eleifend. Duis ornare tempor commodo. Sed eu ante congue, dignissim dolor vestibulum, tristique ex. Maecenas quis vestibulum magna. Aliquam eget placerat ligula. Suspendisse sit amet commodo nisl. Vestibulum turpis felis, accumsan faucibus tempor at, auctor at ipsum. Aliquam rutrum volutpat purus, ac sagittis felis fermentum id. Ut pharetra felis a semper ornare.

Things tested:

  • Methods for nested collapsible
    1. Via div
      • Observation: Content slide on toggle (i.e. slide down(for show) or slide up (for hide)). width is the overwritten property.
    2. Via table
      • Observation: No animation on toggle. display is the overwritten/toggled property.
    • Issue/Limitation: If main collapsible is toggled to hide then toggled to show again, child collapsibles display hide even if there is no change of state. This seems to be an issue due to the old MediaWiki version GodWiki is using. Relevant link
  • Use flex to make the top part of this page responsive.
    • Observation: Quote and Usergod infobox is shown side by side on desktop and stacked on mobile.
    • Note: I can't check how it looks on tablets as I don't own one but it works on mobile and desktop.