super rough beebee animation
|
@ -15,7 +15,7 @@
|
|||
<div id="paused">
|
||||
<div>
|
||||
paused
|
||||
<div>click anywhere to continue suffering</div>
|
||||
<div>click anywhere to continue the pain</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -33,6 +33,8 @@
|
|||
<script src="scripts/game/HP.js"></script>
|
||||
<script src="scripts/game/BG_Anxiety.js"></script>
|
||||
|
||||
<script src="scripts/intro/Intro_SceneSetup.js"></script>
|
||||
|
||||
<script src="scripts/act1/Act1_SceneSetup.js"></script>
|
||||
<script src="scripts/act1/Act1_Hong.js"></script>
|
||||
<script src="scripts/act1/Act1_Beebee.js"></script>
|
||||
|
|
|
@ -34,14 +34,20 @@ h: Thanks for citing your sources but--
|
|||
|
||||
`Game.OVERRIDE_TEXT_SPEED = 2;`
|
||||
|
||||
`bb("fear", "normal", "fear")`
|
||||
|
||||
b: Which means if you don't hang out with someone *right now* you're gonna-
|
||||
|
||||
`bb("panic")`
|
||||
|
||||
b: DIEEEEEEEEEEEEEEEEEEE
|
||||
|
||||
`HP.attackHong("20p")`
|
||||
|
||||
(...1000)
|
||||
|
||||
`bb("normal", "normal", "normal")`
|
||||
|
||||
`_.fifteencigs = true`
|
||||
|
||||
n: YOU USED *FEAR OF BEING UNLOVED*
|
||||
|
@ -56,7 +62,7 @@ h: I'd rather not get crumbs on my textbo--
|
|||
|
||||
b: If you don't study you'll be expelled from college and you'll waste your parents' money and then they'll say
|
||||
|
||||
b: “you have brought dishonor to our family now we'll all have to commit seppuku”
|
||||
b: “you have brought dishonor to our family, now we'll all have to commit seppuku”
|
||||
|
||||
`Game.OVERRIDE_TEXT_SPEED = 2.0;`
|
||||
|
||||
|
@ -90,7 +96,7 @@ b: DIEEEEEEEEEEEEEEEEEEE
|
|||
|
||||
`_.whitebread = true`
|
||||
|
||||
n: YOU USED *FEAR OF BEING HURT*
|
||||
n: YOU USED *FEAR OF BEING HARMED*
|
||||
|
||||
(#act1b)
|
||||
|
||||
|
@ -104,7 +110,7 @@ n: BUT YOU'RE NOT DONE SAVING YOUR HUMAN YET
|
|||
|
||||
n: GET YOUR HUMAN'S "WILLPOWER BAR" TO ZERO
|
||||
|
||||
n: YOUR MOVES ARE: FEAR OF *BEING HURT,* *BEING UNLOVED,* AND *BEING A BAD PERSON*
|
||||
n: YOUR MOVES ARE: FEAR OF *BEING HARMED,* *BEING UNLOVED,* AND *BEING A BAD PERSON*
|
||||
|
||||
n: (PRO TIP: TRY PLAYING THE CHOICES THAT MOST HIT YOUR DEEPEST, DARKEST FEARS!)
|
||||
|
||||
|
@ -130,7 +136,9 @@ n: ROUND ONE: *FIGHT!*
|
|||
|
||||
h: Huh. Facebook feed says there's a party happening this weekend.
|
||||
|
||||
b: Doesn't that weirdo throw a party *every* weekend? Must be some kind of underlying neurosis there.
|
||||
b: Doesn't that weirdo throw a party *every* weekend?
|
||||
|
||||
b: Must be some kind of underlying neurosis there.
|
||||
|
||||
h: Also, I got an invite?
|
||||
|
||||
|
@ -377,7 +385,9 @@ h: Shut up shut up I'll keep it as yes!
|
|||
|
||||
`Game.OVERRIDE_TEXT_SPEED = 1.5;`
|
||||
|
||||
b: Don't you know about human stampedes? In 2003 a nightclub in Rhode Island had a fire and the ensuing panic caused people to jam the exits and so 100 people were crushed or burned to death-
|
||||
b: Don't you know about human stampedes?
|
||||
|
||||
b: In 2003 a nightclub in Rhode Island had a fire and the ensuing panic caused people to jam the exits and so 100 people were crushed or burned to death-
|
||||
|
||||
`Game.OVERRIDE_TEXT_SPEED = 2.0;`
|
||||
|
||||
|
@ -520,19 +530,13 @@ b: It's too crowded. Crowds are dangerous.
|
|||
|
||||
h: Whatever. New Tinder notification.
|
||||
|
||||
h: Oh I got a match!
|
||||
h: Oh I got a match! They're cute!
|
||||
|
||||
b: Is that so, human who I should clarify is an 18+ *college* student?
|
||||
b: Is that so, human whom I should clarify is 18+?
|
||||
|
||||
h: Please, please don't ruin this for m--
|
||||
|
||||
b: DANGER-
|
||||
|
||||
b: DANGER-
|
||||
|
||||
b: DANGER-
|
||||
|
||||
b: DANGER-
|
||||
b: DANGER DANGER DANGER DANGER
|
||||
|
||||
[You're being *used* by other people.](#act1f_used_by_others)
|
||||
|
||||
|
@ -627,15 +631,15 @@ h: i'm so sick of this game.
|
|||
`Game.OVERRIDE_TEXT_SPEED = 1.5;`
|
||||
|
||||
h:
|
||||
{{if _.fifteencigs}}"loneliness will kill you"...{{/if}}
|
||||
{{if _.seppuku}}"study or your parents will hate you"...{{/if}}
|
||||
{{if _.whitebread}}"don't eat that, it'll kill you"...{{/if}}
|
||||
{{if _.subtweet}}"they're talking behind your back"...{{/if}}
|
||||
{{if _.badnews}}"the world is burning"...{{/if}}
|
||||
{{if _.hookuphole}}"you'll die alone"...{{/if}}
|
||||
{{if _.serialkiller}}"they're a serial killer"...{{/if}}
|
||||
{{if _.catmilk}}"cats can't digest milk"...{{/if}}
|
||||
{{if _.pokemon}}a crappy parody song...{{/if}}
|
||||
{{if _.fifteencigs}}"loneliness will kill you"... {{/if}}
|
||||
{{if _.seppuku}}"study or your parents will hate you"... {{/if}}
|
||||
{{if _.whitebread}}"don't eat that, it'll kill you"... {{/if}}
|
||||
{{if _.subtweet}}"they're talking behind your back"... {{/if}}
|
||||
{{if _.badnews}}"the world is burning"... {{/if}}
|
||||
{{if _.hookuphole}}"you'll die alone"... {{/if}}
|
||||
{{if _.serialkiller}}"they're a serial killer"... {{/if}}
|
||||
{{if _.catmilk}}"cats can't digest milk"... {{/if}}
|
||||
{{if _.pokemon}}a crappy parody song... {{/if}}
|
||||
|
||||
h: i just want to live my life.
|
||||
|
||||
|
|
|
@ -0,0 +1,3 @@
|
|||
# intro
|
||||
|
||||
`SceneSetup.intro();`
|
|
@ -0,0 +1,53 @@
|
|||
# act1
|
||||
|
||||
`SceneSetup.act1();`
|
||||
|
||||
`publish("scene", ["add_beebee"])`
|
||||
|
||||
n: QUICK, WARN THEM!
|
||||
|
||||
[You're eating alone for lunch! Again!](#act1a_alone)
|
||||
|
||||
# act1a_alone
|
||||
|
||||
`bb("normal", "normal", "narrow")`
|
||||
|
||||
b: Don't you know loneliness is associated with premature death as much as smoking 15 cigarettes a day?-
|
||||
|
||||
`Game.OVERRIDE_TEXT_SPEED = 2;`
|
||||
|
||||
`bb("normal", "normal", "normal_right")`
|
||||
|
||||
b: (Holt-Lunstad et al, 2010, PLoS Medicine)
|
||||
|
||||
h: Thanks for citing your sources but--
|
||||
|
||||
`Game.OVERRIDE_TEXT_SPEED = 2;`
|
||||
|
||||
`bb("fear", "normal", "fear")`
|
||||
|
||||
b: Which means if you don't hang out with someone *right now* you're gonna-
|
||||
|
||||
`bb("panic")`
|
||||
|
||||
b: DIEEEEEEEEEEEEEEEEEEE
|
||||
|
||||
`HP.attackHong("20p")`
|
||||
|
||||
(...1000)
|
||||
|
||||
`bb("normal", "normal", "normal")`
|
||||
|
||||
`_.fifteencigs = true`
|
||||
|
||||
n: YOU USED *FEAR OF BEING UNLOVED*
|
||||
|
||||
(#act1b)
|
||||
|
||||
# act1b
|
||||
|
||||
n: IT'S SUPER EFFECTIVE
|
||||
|
||||
b: I am best protector!
|
||||
|
||||
n: GOOD LUCK
|
|
@ -3,41 +3,152 @@ function Act1_Beebee(){
|
|||
var self = this;
|
||||
|
||||
// Sprite!
|
||||
self.sprite = new Sprite({
|
||||
var spriteConfig = {
|
||||
image: Library.images.act1_beebee,
|
||||
grid:{
|
||||
width: 2,
|
||||
height: 3
|
||||
width: 4,
|
||||
height: 8
|
||||
},
|
||||
frame:{
|
||||
width: 600,
|
||||
height: 400
|
||||
width: 720,
|
||||
height: 500
|
||||
},
|
||||
anchor:{
|
||||
x: 425/2,
|
||||
y: 325/2
|
||||
x: 546/2,
|
||||
y: 400/2
|
||||
},
|
||||
frameNames:[
|
||||
"normal",
|
||||
"normal_down",
|
||||
"normal_down_vexed",
|
||||
"normal_speak",
|
||||
"scream",
|
||||
"scream_2"
|
||||
|
||||
"body_normal",
|
||||
"body_fear",
|
||||
"body_point_crotch",
|
||||
"body_point_heart",
|
||||
"body_point_sing",
|
||||
|
||||
"head_normal",
|
||||
"head_normal_2",
|
||||
"head_small",
|
||||
"head_small_2",
|
||||
|
||||
"eyes_normal",
|
||||
"eyes_normal_right",
|
||||
"eyes_uncertain",
|
||||
"eyes_uncertain_right",
|
||||
"eyes_narrow",
|
||||
"eyes_narrow_eyebrow",
|
||||
"eyes_fear",
|
||||
"eyes_pretty",
|
||||
"eyes_wat",
|
||||
|
||||
"blank",
|
||||
|
||||
"body_panic",
|
||||
"body_panic_2",
|
||||
"body_scream_anger",
|
||||
"body_scream_anger_2",
|
||||
"body_scream",
|
||||
"body_scream_2",
|
||||
|
||||
"body_flail",
|
||||
"body_flail_2",
|
||||
"body_flail_3",
|
||||
"body_flail_4",
|
||||
|
||||
],
|
||||
x: 270,
|
||||
y: 405
|
||||
y: 390
|
||||
};
|
||||
|
||||
self.body = new Sprite(spriteConfig);
|
||||
self.head = new Sprite(spriteConfig);
|
||||
self.eyes = new Sprite(spriteConfig);
|
||||
|
||||
self.gotoFrames = function(bodyName, headName, eyesName){
|
||||
|
||||
// Body
|
||||
bodyName = "body_"+bodyName;
|
||||
self.body.gotoFrameByName(bodyName);
|
||||
|
||||
// Head
|
||||
headName = headName ? "head_"+headName : "blank";
|
||||
self.head.gotoFrameByName(headName); // TODO: DON'T RESET MOUTH
|
||||
|
||||
// Eyes
|
||||
eyesName = eyesName ? "eyes_"+eyesName : "blank";
|
||||
self.eyes.gotoFrameByName(eyesName);
|
||||
|
||||
};
|
||||
|
||||
self.gotoFrames("normal", "normal", "normal");
|
||||
|
||||
subscribe("bb", function(bodyName, headName, eyesName){
|
||||
self.gotoFrames(bodyName, headName, eyesName);
|
||||
});
|
||||
|
||||
/**
|
||||
|
||||
bb("point_heart", "normal_talk", "pretty")
|
||||
|
||||
**/
|
||||
|
||||
// First frame
|
||||
self.sprite.gotoFrameByName("normal");
|
||||
// self.sprite.gotoFrameByName("normal");
|
||||
|
||||
// Draw
|
||||
var ticker = 0;
|
||||
self.draw = function(ctx){
|
||||
|
||||
var fname = self.sprite.currentFrameName;
|
||||
self.body.draw(ctx);
|
||||
self.head.draw(ctx);
|
||||
self.eyes.draw(ctx);
|
||||
|
||||
// TALKING
|
||||
if(self.body.currentFrameName=="body_normal" || self.body.currentFrameName=="body_fear"){
|
||||
if(Game.WHO_IS_SPEAKING=="b"){
|
||||
|
||||
if(ticker<=0){
|
||||
if(self.head.currentFrameName=="head_normal") self.head.gotoFrameByName("head_normal_2");
|
||||
else if(self.head.currentFrameName=="head_normal_2") self.head.gotoFrameByName("head_normal");
|
||||
ticker = 10;
|
||||
}
|
||||
|
||||
ticker -= (Game.TEXT_SPEED/40) * Game.CURRENT_SPEAKING_SPEED;
|
||||
|
||||
}else{
|
||||
if(self.head.currentFrameName=="head_normal_2") self.head.gotoFrameByName("head_normal");
|
||||
ticker = 0;
|
||||
}
|
||||
if(self.head.currentFrameName=="head_normal_2"){
|
||||
self.eyes.x = 270+1;
|
||||
self.eyes.y = 390-2;
|
||||
}else{
|
||||
self.eyes.x = 270;
|
||||
self.eyes.y = 390;
|
||||
}
|
||||
}
|
||||
|
||||
// PANICKING
|
||||
if(self.body.currentFrameName=="body_panic" || self.body.currentFrameName=="body_panic_2"){
|
||||
|
||||
if(ticker<=0){
|
||||
if(self.body.currentFrameName=="body_panic") self.body.gotoFrameByName("body_panic_2");
|
||||
else if(self.body.currentFrameName=="body_panic_2") self.body.gotoFrameByName("body_panic");
|
||||
ticker = 4;
|
||||
}
|
||||
|
||||
ticker -= 1;
|
||||
|
||||
}
|
||||
|
||||
// SHIVERING
|
||||
self.body.breatheSpeed = 0.8;
|
||||
self.body.breatheAmp = 0.01;
|
||||
self.head.breatheSpeed = 0.8;
|
||||
self.head.breatheAmp = 0.01;
|
||||
self.eyes.breatheSpeed = 0.8;
|
||||
self.eyes.breatheAmp = 0.01;
|
||||
|
||||
/*
|
||||
// Normal: Breathe fast!
|
||||
if(fname.substr(0,6) == "normal"){
|
||||
self.sprite.breatheSpeed = 0.8;
|
||||
|
@ -59,13 +170,14 @@ function Act1_Beebee(){
|
|||
|
||||
// Draw me!
|
||||
self.sprite.draw(ctx);
|
||||
*/
|
||||
|
||||
};
|
||||
|
||||
// When going to frames...
|
||||
subscribe("beebee", function(fname){
|
||||
|
||||
self.sprite.gotoFrameByName(fname);
|
||||
/*self.sprite.gotoFrameByName(fname);
|
||||
|
||||
// Bounce transition
|
||||
if(fname=="normal_speak"){
|
||||
|
@ -73,7 +185,7 @@ function Act1_Beebee(){
|
|||
}
|
||||
if(fname=="scream"){
|
||||
self.sprite.bounce = 1.6;
|
||||
}
|
||||
}*/
|
||||
|
||||
});
|
||||
|
||||
|
|
|
@ -18,6 +18,11 @@ window.SceneSetup = {}; // A big ol' singleton class that just makes it easy to
|
|||
window.attack = function(){};
|
||||
window.miss = function(){};
|
||||
|
||||
// HELPER FUNCS
|
||||
window.bb = function(){
|
||||
publish("bb", arguments);
|
||||
};
|
||||
|
||||
// Init
|
||||
Game.init = function(){
|
||||
|
||||
|
@ -234,6 +239,8 @@ Game.clearText = function(){
|
|||
// Execute text! Just add it to text DOM.
|
||||
Game.TEXT_SPEED = 40;
|
||||
Game.OVERRIDE_TEXT_SPEED = 1;
|
||||
Game.WHO_IS_SPEAKING = null; // "h", "b", "n" etc...
|
||||
Game.CURRENT_SPEAKING_SPEED = 1;
|
||||
Game.executeText = function(line){
|
||||
|
||||
return new RSVP.Promise(function(resolve){
|
||||
|
@ -247,6 +254,8 @@ Game.executeText = function(line){
|
|||
// Add the bubble, with animation
|
||||
var div = document.createElement("div");
|
||||
Game.wordsDOM.appendChild(div);
|
||||
Game.WHO_IS_SPEAKING = speaker; // WHO'S SPEAKING?!
|
||||
Game.CURRENT_SPEAKING_SPEED = Game.OVERRIDE_TEXT_SPEED;
|
||||
switch(speaker){
|
||||
case "b":
|
||||
div.className = "beebee-bubble";
|
||||
|
@ -265,6 +274,11 @@ Game.executeText = function(line){
|
|||
});
|
||||
});
|
||||
|
||||
// Clear both
|
||||
var clearBoth = document.createElement("div");
|
||||
clearBoth.className = "clear-both";
|
||||
Game.wordsDOM.appendChild(clearBoth);
|
||||
|
||||
// TODO: BOLD LETTER BY LETTER...
|
||||
|
||||
// Add the text
|
||||
|
@ -272,7 +286,28 @@ Game.executeText = function(line){
|
|||
var SPEED = Math.round(Game.TEXT_SPEED / Game.OVERRIDE_TEXT_SPEED);
|
||||
if(speaker!="n"){
|
||||
|
||||
// If not narrator, add letter by letter...
|
||||
// Put in the text, each character a DIFFERENT SPAN...
|
||||
var span, chr;
|
||||
var isItalicized = false;
|
||||
for(var i=0; i<dialogue.length; i++){
|
||||
|
||||
// Is it italicized?
|
||||
chr = dialogue[i];
|
||||
if(chr=="*") isItalicized = !isItalicized; // toggle!
|
||||
|
||||
// Add letter span
|
||||
span = document.createElement("span");
|
||||
if(chr=="*"){
|
||||
// else, empty. can't NOT add span, coz screws up indexing.
|
||||
}else{
|
||||
span.innerHTML = isItalicized ? "<i>"+chr+"</i>" : chr;
|
||||
}
|
||||
span.style.opacity = 0;
|
||||
div.appendChild(span);
|
||||
|
||||
}
|
||||
|
||||
// Then REVEAL letters one-by-one
|
||||
for(var i=0; i<dialogue.length; i++){
|
||||
|
||||
var chr = dialogue[i];
|
||||
|
@ -281,11 +316,12 @@ Game.executeText = function(line){
|
|||
if(i==dialogue.length-1 && chr=="-") break;
|
||||
|
||||
// for scopin'
|
||||
(function(chr, interval){
|
||||
(function(index, interval){
|
||||
Game.setTimeout(function(){
|
||||
div.innerHTML += chr;
|
||||
div.children[index].style.opacity = 1;
|
||||
//div.innerHTML += chr;
|
||||
}, interval);
|
||||
})(chr, interval);
|
||||
})(i, interval);
|
||||
|
||||
// Bigger interval
|
||||
if(i!=dialogue.length-1){ // NOT last
|
||||
|
@ -325,39 +361,46 @@ Game.executeText = function(line){
|
|||
|
||||
}
|
||||
|
||||
// Add word by word
|
||||
// Put in the text, each word a DIFFERENT SPAN
|
||||
var span;
|
||||
var dialogueWords = dialogue.split(" ");
|
||||
for(var i=0; i<dialogueWords.length; i++){
|
||||
|
||||
// Is it an emphasized word?
|
||||
var word = dialogueWords[i];
|
||||
var bareWord = word;
|
||||
if(/\*(.*)\*/.test(bareWord)){
|
||||
bareWord = word.match(/\*(.*)\*/)[1].trim();
|
||||
if(/\*(.*)\*/.test(word)){ // is
|
||||
word = "<i>" + word.match(/\*(.*)\*/)[1].trim() + "</i>";
|
||||
}
|
||||
|
||||
// Add the span
|
||||
span = document.createElement("span");
|
||||
span.innerHTML = word+" ";
|
||||
span.style.opacity = 0;
|
||||
div.appendChild(span);
|
||||
|
||||
}
|
||||
|
||||
// Then REVEAL words one-by-one
|
||||
for(var i=0; i<dialogueWords.length; i++){
|
||||
|
||||
var word = dialogueWords[i];
|
||||
|
||||
// for scopin'
|
||||
(function(word, interval){
|
||||
(function(index, interval){
|
||||
Game.setTimeout(function(){
|
||||
|
||||
// if emphasize, emphasize!
|
||||
if(/\*(.*)\*/.test(word)){
|
||||
word = "<i>" + word.match(/\*(.*)\*/)[1].trim() + "</i>"
|
||||
}
|
||||
|
||||
// add word
|
||||
div.innerHTML += word+" ";
|
||||
|
||||
div.children[index].style.opacity = 1;
|
||||
}, interval);
|
||||
})(word, interval);
|
||||
})(i, interval);
|
||||
|
||||
// Interval
|
||||
interval += SPEED*6;
|
||||
|
||||
// Larger interval if punctuation...
|
||||
var chr = bareWord.slice(-1)
|
||||
var chr = word.slice(-1);
|
||||
if(chr=="*") chr = word[word.length-2]; // coz emphasis
|
||||
if(chr=="," || chr==":") interval += SPEED*5;
|
||||
if(chr=="." || chr=="?" || chr=="!") interval += SPEED*10;
|
||||
if(bareWord.slice(-3)=="...") interval += SPEED*15;
|
||||
if(word.slice(-3)=="...") interval += SPEED*15;
|
||||
|
||||
}
|
||||
|
||||
|
@ -370,7 +413,10 @@ Game.executeText = function(line){
|
|||
// Return promise
|
||||
var nextLineDelay = SPEED*7;
|
||||
if(dialogue.slice(-1)=="-") nextLineDelay=0; // sudden interrupt!
|
||||
Game.setTimeout(resolve, interval+nextLineDelay);
|
||||
Game.setTimeout(function(){
|
||||
Game.WHO_IS_SPEAKING = null; // DONE WITH IT.
|
||||
resolve();
|
||||
}, interval+nextLineDelay);
|
||||
|
||||
});
|
||||
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
SceneSetup.intro = function(){
|
||||
|
||||
Game.resetScene();
|
||||
|
||||
// Background
|
||||
var bg = new BG_Anxiety();
|
||||
Game.scene.children.push(bg);
|
||||
|
||||
// Hong
|
||||
var hong = new Act1_Hong();
|
||||
Game.scene.children.push(hong);
|
||||
|
||||
// Beebee
|
||||
var beebee = new Act1_Beebee();
|
||||
subscribe("scene", function(command){
|
||||
switch(command){
|
||||
case "add_beebee":
|
||||
Game.scene.children.push(beebee);
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
};
|
|
@ -1,6 +1,7 @@
|
|||
// Load assets
|
||||
Loader.addScenes([
|
||||
"scenes/act1.md"
|
||||
//"scenes/intro.md"
|
||||
"scenes/test.md"
|
||||
]);
|
||||
Loader.addImages([
|
||||
{ id:"act1_beebee", src:"sprites/act1/act1_beebee.png" },
|
||||
|
|
Before Width: | Height: | Size: 60 KiB After Width: | Height: | Size: 218 KiB |
After Width: | Height: | Size: 60 KiB |
After Width: | Height: | Size: 6.5 KiB |
After Width: | Height: | Size: 8.2 KiB |
After Width: | Height: | Size: 6.2 KiB |
After Width: | Height: | Size: 155 KiB |
After Width: | Height: | Size: 6.4 KiB |
After Width: | Height: | Size: 76 KiB |
After Width: | Height: | Size: 7.8 KiB |
After Width: | Height: | Size: 38 KiB |
After Width: | Height: | Size: 15 KiB |
After Width: | Height: | Size: 5.7 KiB |
|
@ -36,7 +36,9 @@ body{
|
|||
width: auto;
|
||||
position: relative;
|
||||
top: 80px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#paused{
|
||||
display: none;
|
||||
|
||||
|
@ -69,6 +71,10 @@ body{
|
|||
margin: 15px auto;
|
||||
}
|
||||
|
||||
.clear-both{
|
||||
clear:both;
|
||||
}
|
||||
|
||||
.narrator-bubble{
|
||||
position: relative;
|
||||
color: #FFFFFF;
|
||||
|
@ -119,11 +125,15 @@ body{
|
|||
color: #000000;
|
||||
border-radius: .4em;
|
||||
padding: 15px;
|
||||
margin: 10px 30px;
|
||||
margin: 5px 30px;
|
||||
|
||||
opacity: 0;
|
||||
left: -15px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
|
||||
display: inline-block;
|
||||
float: left;
|
||||
|
||||
}
|
||||
.hong-bubble:after {
|
||||
content: '';
|
||||
|
@ -145,11 +155,15 @@ body{
|
|||
color: #ffffff;
|
||||
border-radius: .4em;
|
||||
padding: 15px;
|
||||
margin: 10px 30px;
|
||||
margin: 5px 30px;
|
||||
|
||||
opacity: 0;
|
||||
left: 15px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
|
||||
display: inline-block;
|
||||
float: right;
|
||||
|
||||
}
|
||||
.beebee-bubble:after {
|
||||
content: '';
|
||||
|
|