Navigation
User login
Upcoming events
Recent Events
- 17 weeks 3 days ago
- 20 weeks 1 day ago
- 29 weeks 4 days ago
- 31 weeks 5 days ago
- 32 weeks 6 hours ago
Newest Games
Search
Who's online
Random posts
Tutankhamen's Pancake Breakfast
Sat, 06/19/2010 - 18:36 — h_double
You thought it would be easy working the night shift at a pancake restaurant but nobody told you there was a pharaoh convention in town!
Twine: apply CSS to passages with specific tags (Tag CSS)
Thu, 01/24/2013 - 23:07 — LUpdate: Twine 1.4 now has an easier method of using Tag CSS, so this script code is no longer necessary.
Obsolete script removed: use Twine 1.4
CSS Syntax
The selector syntax for passages with specific tags is [data-tags~=tagname].
So, if you tag a bunch of passages with "dream", you can then apply specific CSS to just those passages like this:
[data-tags~=dream] {
color: aqua;
text-shadow: aqua 0 0 3px;
}The preceding code will affect both the passage div and the body element. To select those elements separately, use syntax like this:
body[data-tags~=blood] {
background-color:red;
color: black;
}
.passage[data-tags~=blood] {
border: 5px solid white;
font-size: 110%;
width: 30em;
}Some variations on the selector syntax exists that you might find useful:[data-tags*=swamp] for a passage whose tags contain "swamp" (such as "grayswamp" or "swampfort").:not([data-tags~=gold]) for a passage which does not have the tag "gold".And, of course, you can select elements of a matching passage <div> by combining selectors with ".body", ".body .internalLink" and such:
.passage[data-tags~=cave] .body .internalLink {
color: gold;
}
Caveat: all of this won't work for passage text displayed with the << display >> macro unless you use something like addtag.
Selector recap:
* To apply CSS to the body element, use "body[data-tags~=tag]", "body:not([data-tags~=tag])" etc.
* To apply CSS to the passage-class element, use ".passage[data-tags~=tag]", ".passage:not([data-tags~=tag])" etc.
* To apply CSS to both, use "[data-tags~=tag]" etc.
If you like this code, consider using these macros that let you control tags inside the game.
*This is really just a workaround until browsers support CSS selector subjects. Ideally you could just do !body .passage[data-tags:], but alas, not this year.
Version history:
- 11/2/13 - Possibly fixed crash in situations where 'state' hadn't been initialised yet.
- 6/2/13 - Additional code to affect the <body> tag was added for both versions.
- 5/2/13 - Altered to use "data-tags" attribute rather than "tags".
- 4/2/13 - Split into two snippets for Twine 1.3.6 alpha and Twine stable versions.
- 26/1/13 - Altered to affect the Start passage.
- 25/1/13 - Initial.
Presentable Liberty
Wed, 12/31/2014 - 14:08 — Wertpol
You have been imprisoned without being told why. All you can hear day in day out is the faint ticking of a clock in your cell. That is, until the first of 5 fateful days begins.
-The amazing 'sequel' to Exoptable Money
-Much less money than in the first one
-Twice as many amazing characters
-Tick tock tick tock
-4 times as many letters
-No cat
-The Doctor would like a word with you
Ass Poke
Sun, 02/26/2012 - 08:36 — psychicparrot
INSTRUCTION: MOUSE & CLICK TO POKE DONKEY WITH BACON MAKE DUCK IN POCKET SCORE BIG!!!!!!!!
FOR MAC AND PC COMPUTERS
NOW INCLUDING QUIT BUTTON, SOUND EFFECT AND SPECIAL EFFEX FOR A HD-STYLE EXPERIENCE!
THIS VIRTUAL SMORGASBORD OF DONKEY POKE FUN!
tinypack
Sun, 09/03/2017 - 18:41 — quasiotter
the purpose of tinypack is to show appreciation to the humans referenced within.
it is also an attempt to broaden their audience so that they become rich even though i purposely chose people who put out free games. i will always encourage supporting them!!!!!!!
here are the names and twitter handles of the developers:
Adam Le Doux @adamledoux
adamgryu @adamgryu
Blueberry Soft http://blueberrysoft.ryliejamesthomas.net
clyde @cafefiction
Connor Sherlock @teg5511
Daniel Linssen @Managore
DREAMFEEL @dreamfeeel
From Smiling @fromsmiling
FCKGMDV.+++ @fuckgamedev
ihavefivehat @ihavefivehat
Ian MacLarty @muclorty
Stephen Lavelle @increpare
Jack Squires @jsqrs
Kitty Horrowshow @kittyhorrorshow
Marek Kapolka @MarekKapolka
Matthew Keff @matthewkeff
Jord Farrell @Mr_Tedders
Paws Menu @thesaveroom
Pippin Barr @pippinbarr
Protohm Johnny @ProtohmGames
Robert Yang @ radiatoryang
sean @SeanSLeBlanc
sergiocornaga @corneaga
Strangethink @Strangethink23
Terry Cavanagh @terrycavanagh
Sean Wejebe @wedgiebee
Yuliya Kozhemyako (Supr) @suprsupr
to play:
double-click tinypals.html or tinyghosts.html
it should open up in your default browser
they work best with the chrome or firefox.
controls:
arrow keys and wasd
r to restart
z to undo last move
anything that moves will only move when you do
pressing left or right to look around does not count as a turn
movement and objects exist on a grid
tinypals: you can take your time and enjoy !
tinyghosts: this is a game where you have to collect 6 items to win. if a ghost (anything that moves) moves into a space right next to you, you will start all over again. it’s more about strategy than action.
Utter Nonsense Factory: Combat Pipe Game
Sat, 04/07/2012 - 18:20 — thesycophant
You are a witch! You must collect GELS from your ENEMIES to drop them down the PIPES into the properly colored BUCKETS.
ARROW KEYS move
X jumps
Z shoots
C drops gels into pipes
DRAGON SPACE ADVENTURE OF EPICNESS
Tue, 01/10/2012 - 16:11 — Smedis2
My Second Game for the 2012 Pirate Kart.
IN THE YEAR 20XX...
A DRAGON ENTERED SPACE TO SEARCH FOR A DOCKING BAY TO LAND ON.
BUT MANY OBSTACLES WERE IN HIS PATH,SO NOW YOU HAVE TO HELP HIM SHOOT THEM DOWN.
Controlz:
Arrow Keys:Move (Noooo,really?)
Z:Fire.
(Yep,same control scheme as my last game.)
Existential Fishing Simulation
Sun, 02/26/2012 - 19:30 — atuun
Be a depressed medieval dude and try to catch fish! Move the boat left and right with the arrow keys to find that perfect spot where the fish are biting! Wait, you might say: what are the rod casting controls? There are none... possibly because the act of fishing is inherently absurd?!?!?!
Music by Erik Satie and performed by Pierre Laniau.
