chemicalcrux
/
stroll
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 11 Wiki Activity
Browse Source

Tidied up the character creation page, removed old CSS

tags/v0.7.0
Fen Dweller 7 years ago
parent
b71e3ba074
commit
4383dde385
3 changed files with 194 additions and 206 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -1
      game.js
  2. +190
    -191
      stroll.html
  3. +3
    -14
      style.css

+ 1
- 1
game.js View File

@@ -2467,7 +2467,7 @@ function startGame(e) {
let victimTypes = ["stomped","digested","stomach","ground"]; let victimTypes = ["stomped","digested","stomach","ground"];


document.getElementById("log-area").style.display = 'inline'; document.getElementById("log-area").style.display = 'inline';
document.getElementById("option-panel").style.display = 'none';
document.getElementById("custom-species").style.display = 'none';
document.getElementById("action-panel").style.display = 'flex'; document.getElementById("action-panel").style.display = 'flex';


enable_panel("body"); enable_panel("body");


+ 190
- 191
stroll.html View File

@@ -134,23 +134,22 @@
</div> </div>
</div> </div>
<div class="character-build"> <div class="character-build">
<p>Welcome to Stroll 0.5.7</p>
<p><b>This game features 18+ content</b></p>
<p><a href="https://chemicalcrux.org/stroll">Changelog</a></p>
<p><a href="https://t.me/joinchat/BSXHzUZmSqc-CXB1khkuYw">Telegram discussion group</a></p>


<div class="option-container" id="option-panel">
<p>Welcome to Stroll 0.5.7</p>
<p><b>This game features 18+ content</b></p>
<p><a href="https://chemicalcrux.org/stroll">Changelog</a></p>
<p><a href="https://t.me/joinchat/BSXHzUZmSqc-CXB1khkuYw">Telegram discussion group</a></p>
<br>
<div id="custom-species">
<button class="stat-button" id="button-dark-mode-options">Toggle Dark Mode</button>
<p>Build your Character (leave blank for defaults)</p>
<form id="custom-species-form" name="custom-species-form">
<ul class="flex-outer">
<div class="custom-category">
<div class="custom-header">Basics</div>
<li>
<label for="species">Name</label>
<input type="text" name="name" />
<div id="custom-species">
<button class="stat-button" id="button-dark-mode-options">Toggle Dark Mode</button>
<p>Build your Character (leave blank for defaults)</p>
<form id="custom-species-form" name="custom-species-form">
<ul class="flex-outer">
<div class="custom-category">
<div class="custom-header">Basics</div>
<div>
<li>
<label for="name">Name</label>
<input type="text" name="name"/>
</li> </li>
<li> <li>
<label for="species">Species</label> <label for="species">Species</label>
@@ -168,218 +167,218 @@
<label for="baseMass">Weight</label> <label for="baseMass">Weight</label>
<input type="number" name="baseMass" placeholder="135"> <input type="number" name="baseMass" placeholder="135">
</li> </li>
<br>
<li> <li>
<label for="basePawArea">Paw area</label> <label for="basePawArea">Paw area</label>
<input type="number" name="basePawArea" placeholder="0.1"><br>
<input type="number" name="basePawArea" placeholder="0.1">
</li> </li>
<li> <li>
<label for="baseHandArea">Hand area</label> <label for="baseHandArea">Hand area</label>
<input type="number" name="baseHandArea" placeholder="0.1"><br>
<input type="number" name="baseHandArea" placeholder="0.1">
</li> </li>
<li> <li>
<label for="baseAnalVoreArea">Tailhole area</label> <label for="baseAnalVoreArea">Tailhole area</label>
<input type="number" name="baseAnalVoreArea" placeholder="0.1"><br>
<input type="number" name="baseAnalVoreArea" placeholder="0.1">
</li> </li>
<li> <li>
<label for="analVore">Anal vore</label> <label for="analVore">Anal vore</label>
<input type="checkbox" checked="true" name="analVore"/><br>
<input type="checkbox" checked="true" name="analVore"/>
</li> </li>
<li> <li>
<label for="baseAssArea">Ass area</label> <label for="baseAssArea">Ass area</label>
<input type="number" name="baseAssArea" placeholder="0.4"><br>
<input type="number" name="baseAssArea" placeholder="0.4">
</li>
</div>
</div>
<div class="custom-category">
<div class="custom-header">Brutality</div>
<div>
<ul>
<li>
<input type="radio" name="brutality" id="brutality-0">
<label for="brutality-0">Non-fatal</label>
</li>
<li>
<input type="radio" name="brutality" checked="true" id="brutality-1">
<label for="brutality-1">Fatal, no gore</label>
</li>
<li>
<input type="radio" name="brutality" id="brutality-2">
<label for="brutality-2">Gory</label>
</li>
<li>
<input type="radio" name="brutality" id="brutality-3" disabled="disableD">
<label for="brutality-3">Sadistic (not implemented)</label>
</li> </li>
<br>
</ul>
</div>
</div>
<div class="custom-category">
<div class="custom-header">Misc</div>
<div>
<li> <li>
<label for="humanMode">Human victims</label>
<input type="checkbox" name="humanMode" id="humanMode"> <input type="checkbox" name="humanMode" id="humanMode">
<label for="humanMode">Human Mode (instead of furries)</label>
</li> </li>
</div>
<br>
<div class="custom-category">
<div class="custom-header">Brutality</div>
<ul>
<li>
<input type="radio" name="brutality" id="brutality-0">
<label for="brutality-0">Non-fatal</label>
</li>
<li>
<input type="radio" name="brutality" checked="true" id="brutality-1">
<label for="brutality-1">Fatal, no gore</label>
</li>
<li>
<input type="radio" name="brutality" id="brutality-2">
<label for="brutality-2">Gory</label>
</li>
<li>
<input type="radio" name="brutality" id="brutality-3" disabled="disableD">
<label for="brutality-3">Sadistic (not implemented)</label>
</li>
</ul>
</div>
<br>
<div class="custom-category">
<div class="custom-header">Misc</div>
<li> <li>
<label class="has-tooltip" for="sameSizeVore" title="Can you eat people your own size?">Same-size predator</label> <label class="has-tooltip" for="sameSizeVore" title="Can you eat people your own size?">Same-size predator</label>
<input type="checkbox" checked="true" name="sameSizeVore"/><br>
<input type="checkbox" checked="true" name="sameSizeVore"/>
</li> </li>
<li> <li>
<label class="has-tooltip" for="sameSizeStomp" title="Can you stomp and sit on people your own size?">Same-size stomper</label> <label class="has-tooltip" for="sameSizeStomp" title="Can you stomp and sit on people your own size?">Same-size stomper</label>
<input type="checkbox" checked="true" name="sameSizeStomp"/><br>
<input type="checkbox" checked="true" name="sameSizeStomp"/>
</li> </li>
<li> <li>
<label for="soulVoreEnabled">Soul vore</label> <label for="soulVoreEnabled">Soul vore</label>
<input type="checkbox" checked="true" name="soulVoreEnabled"/><br>
<input type="checkbox" checked="true" name="soulVoreEnabled"/>
</li> </li>
</div> </div>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="arousalEnabled" name="arousalEnabled"/>
<label class="custom-header" for="arousalEnabled">Arousal</label>
<div class="reveal-if-active">
</div>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="arousalEnabled" name="arousalEnabled"/>
<label class="custom-header" for="arousalEnabled">Arousal</label>
<div class="reveal-if-active">
<li>
<label class="has-tooltip" for="arousalFactor" title="Multiplies arousal gain by this much">Arousal multiplier</label>
<input type="number" name="arousalFactor" placeholder="1"/>
</li>
<li> <li>
<label class="has-tooltip" for="arousalFactor" title="Multiplies arousal gain by this much">Arousal multiplier</label>
<input type="number" name="arousalFactor" placeholder="1"/><br>
<label class="has-tooltip" for="edgeFactor" title="Multiplies edge gain by this much">Edge multiplier</label>
<input type="number" name="arousalFactor" placeholder="1"/>
</li> </li>
<li>
<label class="has-tooltip" for="edgeFactor" title="Multiplies edge gain by this much">Edge multiplier</label>
<input type="number" name="arousalFactor" placeholder="1"/><br>
</li>
</div>
</div> </div>
<br>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="hasTail" name="hasTail"/>
<label class="custom-header" for="hasTail">Tails</label>
<div class="reveal-if-active">
<li>
<label for="tailCount">Tail count</label>
<input type="number" name="tailCount" placeholder="1"/><br>
</li>
<li>
<label for="tailType">Tail type</label>
<input type="text" name="tailType" placeholder="slinky"/><br>
</li>
<li>
<label for="baseTailLength">Tail length</label>
<input type="number" name="baseTailLength" placeholder="1"/><br>
</li>
<li>
<label for="baseTailDiameter">Tail diameter</label>
<input type="number" name="baseTailDiameter" placeholder="0.3"/><br>
</li>
<li>
<label for="tailMaw">Tail maw(s)</label>
<input type="checkbox" checked="true" name="tailMaw"/><br>
</li>
</div>
</div>

<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="hasTail" name="hasTail"/>
<label class="custom-header" for="hasTail">Tails</label>
<div class="reveal-if-active">
<li>
<label for="tailCount">Tail count</label>
<input type="number" name="tailCount" placeholder="1"/>
</li>
<li>
<label for="tailType">Tail type</label>
<input type="text" name="tailType" placeholder="slinky"/>
</li>
<li>
<label for="baseTailLength">Tail length</label>
<input type="number" name="baseTailLength" placeholder="1"/>
</li>
<li>
<label for="baseTailDiameter">Tail diameter</label>
<input type="number" name="baseTailDiameter" placeholder="0.3"/>
</li>
<li>
<label for="tailMaw">Tail maw(s)</label>
<input type="checkbox" checked="true" name="tailMaw"/>
</li>
</div> </div>
<br>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="hasPouch" name="hasPouch"/>
<label class="custom-header" for="hasPouch">Pouch</label>
<div class="reveal-if-active">
<li>
It's on :D
</li>
</div>
</div>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="hasPouch" name="hasPouch"/>
<label class="custom-header" for="hasPouch">Pouch</label>
<div class="reveal-if-active">
<li>
It's on :D
</li>
</div> </div>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="maleParts" name="maleParts"/>
<label class="custom-header" for="maleParts">Male genitals</label>
<div class="reveal-if-active">
<li>
<label for="hasSheath">Sheath</label>
<input type="checkbox" name="hasSheath" checked="true" /><br>
</li>
<li>
<label for="dickType">Cock type</label>
<input type="text" name="dickType" placeholder="canine"/><br>
</li>
<li>
<label for="baseDickLength">Cock length</label>
<input type="number" name="baseDickLength" placeholder="0.3"/><br>
</li>
<li>
<label for="baseDickDiameter">Cock diameter</label>
<input type="number" name="baseDickDiameter" placeholder="0.08"/><br>
</li>
<li>
<label for="baseBallDiameter">Ball diameter</label>
<input type="number" name="baseBallDiameter" placeholder="0.05"/><br>
</li>
<li>
<label for="baseCumRatio" class="has-tooltip" title="scales how much cum is released with each shot">Orgasm cum ratio</label>
<input type="number" name="baseCumRatio" placeholder="1"/><br>
</li>
<li>
<label for="baseMass">Cum production factor</label>
<input type="number" name="cumScale" placeholder="1"/><br>
</li>
</div>
</div>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="maleParts" name="maleParts"/>
<label class="custom-header" for="maleParts">Male genitals</label>
<div class="reveal-if-active">
<li>
<label for="hasSheath">Sheath</label>
<input type="checkbox" name="hasSheath" checked="true" />
</li>
<li>
<label for="dickType">Cock type</label>
<input type="text" name="dickType" placeholder="canine"/>
</li>
<li>
<label for="baseDickLength">Cock length</label>
<input type="number" name="baseDickLength" placeholder="0.3"/>
</li>
<li>
<label for="baseDickDiameter">Cock diameter</label>
<input type="number" name="baseDickDiameter" placeholder="0.08"/>
</li>
<li>
<label for="baseBallDiameter">Ball diameter</label>
<input type="number" name="baseBallDiameter" placeholder="0.05"/>
</li>
<li>
<label for="baseCumRatio" class="has-tooltip" title="scales how much cum is released with each shot">Orgasm cum ratio</label>
<input type="number" name="baseCumRatio" placeholder="1"/>
</li>
<li>
<label for="baseMass">Cum production factor</label>
<input type="number" name="cumScale" placeholder="1"/>
</li>
</div> </div>
<br>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="hasBreasts" name="hasBreasts"/>
<label class="custom-header" for="hasBreasts">Breasts</label>
<div class="reveal-if-active">
<li>
<label for="baseBreastDiameter">Breast diameter</label>
<input type="number" name="baseBreastDiameter" placeholder="0.1"/><br>
</li>
<div>
<ul class="flex-outer">
Lactation:
<input type="checkbox" checked="true" name="lactationEnabled"/><br>
<div class="reveal-if-active">
<li>
<label for="lactationFactor" class="has-tooltip" title="scales how much milk is released with each squeeze">Lactation ratio</label>
<input type="number" name="lactationFactor" placeholder="0.25"/><br>
</li>
<li>
<label for="lactationScale">Milk production factor</label>
<input type="number" name="lactationScale" placeholder="1"/><br>
</li>
</div>
</ul>
</div>
<li>
<label for="breastVore">Breast vore</label>
<input type="checkbox" checked="true" name="breastVore"/><br>
</li>
</div>

<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="hasBreasts" name="hasBreasts"/>
<label class="custom-header" for="hasBreasts">Breasts</label>
<div class="reveal-if-active">
<li>
<label for="baseBreastDiameter">Breast diameter</label>
<input type="number" name="baseBreastDiameter" placeholder="0.1"/>
</li>
<div>
<ul class="flex-outer">
Lactation:
<input type="checkbox" checked="true" name="lactationEnabled"/>
<div class="reveal-if-active">
<li>
<label for="lactationFactor" class="has-tooltip" title="scales how much milk is released with each squeeze">Lactation ratio</label>
<input type="number" name="lactationFactor" placeholder="0.25"/>
</li>
<li>
<label for="lactationScale">Milk production factor</label>
<input type="number" name="lactationScale" placeholder="1"/>
</li>
</div>
</ul>
</div> </div>
<li>
<label for="breastVore">Breast vore</label>
<input type="checkbox" checked="true" name="breastVore"/>
</li>
</div> </div>
<br>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="femaleParts" name="femaleParts"/>
<label class="custom-header" for="femaleParts">Female genitals</label>
<div class="reveal-if-active">
<li>
<label for="baseVaginaLength">Slit length</label>
<input type="number" name="baseVaginaLength" placeholder="0.1"/><br>
</li>
<li>
<label for="baseVaginaWidth">Slit width</label>
<input type="number" name="baseVaginaWidth" placeholder="0.05"/><br>
</li>
<li>
<label for="baseFemcumRatio" class="has-tooltip" title="scales how much femcum is released with each shot">Orgasm femcum ratio</label>
<input type="number" name="baseFemcumRatio" placeholder="1"/><br>
</li>
<li>
<label for="femcumScale">Femcum production factor</label>
<input type="number" name="femcumScale" placeholder="1"/><br>
</li>
</div>
</div>
<div class="custom-category">
<input class="custom-header-checkbox" type="checkbox" checked="true" id="femaleParts" name="femaleParts"/>
<label class="custom-header" for="femaleParts">Female genitals</label>
<div class="reveal-if-active">
<li>
<label for="baseVaginaLength">Slit length</label>
<input type="number" name="baseVaginaLength" placeholder="0.1"/>
</li>
<li>
<label for="baseVaginaWidth">Slit width</label>
<input type="number" name="baseVaginaWidth" placeholder="0.05"/>
</li>
<li>
<label for="baseFemcumRatio" class="has-tooltip" title="scales how much femcum is released with each shot">Orgasm femcum ratio</label>
<input type="number" name="baseFemcumRatio" placeholder="1"/>
</li>
<li>
<label for="femcumScale">Femcum production factor</label>
<input type="number" name="femcumScale" placeholder="1"/>
</li>
</div> </div>
</ul>
</form>
<div>
<button class="option-button" id="button-reset-custom">Reset Custom Character</button>
<button class="option-button" id="button-load-custom">Load Custom Character</button>
<button class="option-button" id="button-save-custom">Save Custom Character</button>
<button class="option-button" id="button-start">Start Stroll Game</button>
</div>
</div>
</ul>
</form>
<div>
<button class="option-button" id="button-reset-custom">Reset Custom Character</button>
<button class="option-button" id="button-load-custom">Load Custom Character</button>
<button class="option-button" id="button-save-custom">Save Custom Character</button>
<button class="option-button" id="button-start">Start Stroll Game</button>
</div> </div>
</div> </div>
</div> </div>


+ 3
- 14
style.css View File

@@ -11,7 +11,6 @@
font-family: Arial; font-family: Arial;
} }



body.dark > div > div > div > form input { body.dark > div > div > div > form input {
color: #eee; color: #eee;
background: #444; background: #444;
@@ -171,12 +170,6 @@ body.dark #log {
overflow: hidden; overflow: hidden;
} }


.reveal-if-active-2 {
opacity: 0;
max-height: 0;
overflow: hidden;
}

input[type="radio"]:checked ~ .reveal-if-active, input[type="radio"]:checked ~ .reveal-if-active,
input[type="checkbox"]:checked ~ .reveal-if-active { input[type="checkbox"]:checked ~ .reveal-if-active {
opacity: 1; opacity: 1;
@@ -184,13 +177,6 @@ input[type="checkbox"]:checked ~ .reveal-if-active {
overflow: visible; overflow: visible;
} }


input.sub[type="radio"]:checked ~ .reveal-if-active-2,
input.sub[type="checkbox"]:checked ~ .reveal-if-active-2 {
opacity: 1;
max-height: 200px; /* little bit of a magic number :( */
overflow: visible;
}

.flex-outer { .flex-outer {
width: 100%; width: 100%;
display: flex; display: flex;
@@ -203,6 +189,7 @@ input.sub[type="checkbox"]:checked ~ .reveal-if-active-2 {
.custom-category { .custom-category {
text-align: center; text-align: center;
margin: 10px; margin: 10px;
width: 500px;
} }


body.light .custom-category { body.light .custom-category {
@@ -306,9 +293,11 @@ body.dark a:hover {
} }


.character-build { .character-build {
margin: 50px;
width: 90%; width: 90%;
text-align: center; text-align: center;
} }

#grow-panel { #grow-panel {
width: 100%; width: 100%;
} }


Write Preview
Loading…
Cancel
Save