rev3

hwpoison · Jul 1, 2018 · 4f5e5da · 4f5e5da
1 parent db0659e
commit 4f5e5da
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 15 deletions.
diff --git a/estilo.css b/estilo.css
@@ -6,9 +6,6 @@ a {
 	padding:0px
 }
 
-#notificacionEscritura {
-	font-family:Arial;
-}
 
 #entradaDeUsuario {
 	width:100%;
@@ -27,18 +24,24 @@ a {
 	margin-bottom:3px;
 	font-family:Arial; 
 	transition:0.3s;
-	background-color:#49BDF9
-}
-.mensajeAnimacion {
-	animation:fadein 1s;
+	background-color:#0067FF
 }
 
 #mensaje:hover {
 	transition:0.3;
-	background-color:#007CB9; 
+	background-color:#06A2FF; 
 	border-radius:8px 
 }
 
+#notificacionEscritura {
+	font-family:Arial;
+}
+
+
+.mensajeAnimacion {
+	animation:fadein 1s;
+}
+
 @keyframes fadein{ 
 	0%   { opacity: 0; }
 	100% { opacity: 1; }

diff --git a/index.html b/index.html
@@ -5,7 +5,9 @@
 		<title>Test</title>
 	</head>
 <body>
+<div style="width:300px">
 <div id="mbotConversacion"></div>
+</div>
 <link href="https://afeld.github.io/emoji-css/emoji.css" rel="stylesheet">
 <link rel="stylesheet" type="text/css" href="estilo.css">
 </body>

diff --git a/mbot.js b/mbot.js
@@ -277,13 +277,14 @@ function procesarMensaje(mensaje){
 
 //Añadir un mensaje en la caja de conversacion.
 function agregarMensajeACaja(nombre, color, mensaje, emoji="em em-no_mouth"){
-emoji = 		 "<div style='align:left;float:left' class='"+ emoji +"'></div>"
-mensajeFormato = "<div style='align:left;float:left' id='mensaje'><span style='position:relative;color:" + color + "'>" + nombre + ": </span>"+ mensaje +"</div>"
-msj = document.createElement("div")
-msj.innerHTML = emoji
-msj.innerHTML += mensajeFormato + "<br><br>"
-msj.className = "mensajeAnimacion"
-cajaDeMensajes.appendChild(msj)
+	nombre = ''
+	emoji = 		 "<div style='display: inline-block;' class='"+ emoji +"'></div>"
+	mensajeFormato = "<div style='display: inline-block;width:200px' id='mensaje'><span style='position:relative;color:" + color + "'>" + nombre + " </span>"+ mensaje +"</div>"
+	msj = document.createElement("div")
+	msj.innerHTML = emoji
+	msj.innerHTML += mensajeFormato
+	msj.className = "mensajeAnimacion"
+	cajaDeMensajes.appendChild(msj)
 }
 
 //Vaciar la caja de conversacion.