new chatbox looking good

3 files changed, 13 insertions, 15 deletions

diff --git a/webAO/client.css b/webAO/client.css
index 4df9b15..dc3ddec 100644
--- a/webAO/client.css
+++ b/webAO/client.css
@@ -1,5 +1,5 @@
 body {
-	font-family: "Ace Attorney", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "Osaka", "MS Gothic", "ＭＳ Ｐゴシック", "Tahoma", Sans;
+	font-family: sans-serif;
 }
 
 img {
@@ -231,20 +231,19 @@ img {
 
 #client_chatcontainer {
 	position: absolute;
-	top: 70%;
-	height: 30%;
-	width: 98%;
-	width: calc(100% - 4px);
+	top: 73%;
+	height: 27%;
+	width: 100%;
+	background-image: url("images/chatbox.svg");
+	background-size: cover;
+ 	background-repeat: no-repeat;
 }
 
 #client_name {
 	display: none;
-	padding: 0px 6px;
+	top: 5%;
+	padding: 0px 10px;
 	height: 20%;
-	border: 1px solid rgba(255, 255, 255, 0.7);
-	background: rgba(73, 0, 254, 0.5);
-	top: 0;
-	left: 0;
 	border-radius: 3px;
 	position: absolute;
 }
@@ -255,8 +254,6 @@ img {
 	width: 100%;
 	margin: auto;
 	height: 90%;
-	border: 2px solid rgba(255, 255, 255, 0.7);
-	background-color: rgba(0, 0, 0, 0.5);
 	top: 20%;
 	border-radius: 4px;
 	position: absolute;
@@ -270,6 +267,7 @@ img {
 
 #client_chat p {
 	margin: 4px;
+	padding: 5px 10px;
 	color: white;
 }
 
diff --git a/webAO/client.js b/webAO/client.js
index daac518..bce7916 100644
--- a/webAO/client.js
+++ b/webAO/client.js
@@ -1548,10 +1548,10 @@ class Viewport {
 				}
 
 				nameBox.style.display = "block";
-				nameBox.style.fontSize = (nameBox.offsetHeight * 0.7) + "px";
+				nameBox.style.fontSize = (nameBox.offsetHeight * 0.75) + "px";
 
 				chatBox.style.display = "block";
-				chatBox.style.fontSize = (chatBox.offsetHeight * 0.25) + "px";
+				chatBox.style.fontSize = (chatBox.offsetHeight * 0.3) + "px";
 
 				if (this.chatmsg.color === 6)
 					chatBoxInner.className = "rainbow-text";
diff --git a/webAO/images/chatbox.svg b/webAO/images/chatbox.svg
index 38b80d7..90dbab7 100644
--- a/webAO/images/chatbox.svg
+++ b/webAO/images/chatbox.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="78" width="256" id="svg72"><metadata id="metadata76"/><desc id="desc2"></desc><defs id="defs4"/><rect id="chatbox" width="251" height="57" x="2.5" y="18.5" style="fill-opacity:0.7;stroke-linejoin:round;stroke-width:0.8"/><path d="m2.5 18.5v-16h61.3l10 16z" id="nametag" style="fill-opacity:0.7;fill:#230087;stroke-width:1px"/><path d="M2 2V76H254V18H74L64 2Z" id="whiteborder" style="fill:none;stroke-linejoin:round;stroke-opacity:0.8;stroke-width:1px;stroke:#c8c8c8"/><path d="M1 77C1 52 1 26 1 1c21.2 0 42 0 63.5 0 3 5 6 10 10 16 60 0 120 0 180.5 0 0 20 0 40 0 60-84 0-169 0-254 0z" id="blackborder" style="fill:none;paint-order:normal;stroke-linejoin:round;stroke-opacity:0.8;stroke-width:1px;stroke:#000"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" height="82" width="400"><desc>  Created with Raphaël 2.0.1</desc><rect width="397" height="59" x="1.5" y="21.5" style="fill-opacity:0.7;stroke-linejoin:round"/><path d="m1.5 21.5v-20h83.8l10 20z" style="fill-opacity:0.7;fill:#230087;stroke-width:1px"/><path d="M1 1V81H399V21H95.5L85.5 1Z" style="fill:none;stroke-linejoin:round;stroke-opacity:0.8;stroke-width:1px;stroke:#c8c8c8"/><path d="M0 82V0h86c5 10.6 5 8.6 10 20h304v62z" style="fill:none;paint-order:normal;stroke-linejoin:round;stroke-opacity:0.8;stroke-width:1px;stroke:#000"/></svg>
\ No newline at end of file