Map connection buttons (not done yet)

app/assets/css/launcher.css

@@ -4117,12 +4117,42 @@ input:checked + .toggleSwitchSlider:before {
 
 
 /* iframe patch for full size window. */
- #iframecontainer {
+#iframecontainer {
     width: 100%;
  }
 
- #dynmapiframe {
+#dynmapiframe {
     width: 100%;
     height: 100%;
     user-select: none;
  }
+
+#mapsvg {
+    -webkit-filter: invert(100%); /* safari 6.0 - 9.0 */
+    filter: invert(100%);
+    transition: 0.25s ease;
+}
+
+/* Map icon hover effect */
+#newsButton:hover #mapsvg,
+#newsButton:focus #mapsvg {
+    filter:invert(100%) drop-shadow(0 0 0.75rem white);
+}
+
+/* Return from map button  */
+.FloatingButtonContainer {
+    position: absolute;
+    margin-left: auto;
+    margin-right: auto;
+    left: 22em;
+    right: 0;
+    text-align: center;
+}
+
+/* Return from map button style */
+#dynmapDoneButton {
+    background-color: #222222;
+    width: 100px;
+    border-radius: 0px 0px 10px 10px;
+    border-color: #333333;
+}

app/dynmap.ejs

@@ -1,9 +1,8 @@
 <div id="dynmapContainer" style="display: none;">
-    <div id="center">
+    <div class="FloatingButtonContainer" id="center">
         <div class="bot_wrapper">
             <div id="content">
                 <button id="dynmapDoneButton"> <!-- Rename all elements to dynmapEtc -->   
-                    
                     <div id="newsButtonAlert" style="display: none;"></div>
                     <svg id="newsButtonSVG" viewBox="0 0 24.87 13.97">
                         <defs>

app/landing.ejs

@@ -108,12 +108,7 @@
                     <button id="newsButton">
                         
                         <div id="newsButtonAlert" style="display: none;"></div>
-                        <svg id="newsButtonSVG" viewBox="0 0 24.87 13.97">
-                            <defs>
-                                <style>.arrowLine{fill:none;stroke:#FFF;stroke-width:2px;}</style>
-                            </defs>
-                            <polyline class="arrowLine" points="0.71 13.26 12.56 1.41 24.16 13.02"/>
-                        </svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" id="mapsvg" viewBox="0 0 24 24" width="20" height="20"><path d="M12,0A12,12,0,1,0,24,12,12.013,12.013,0,0,0,12,0ZM22,12a9.938,9.938,0,0,1-1.662,5.508l-1.192-1.193A.5.5,0,0,1,19,15.962V15a3,3,0,0,0-3-3H13a1,1,0,0,1-1-1v-.5a.5.5,0,0,1,.5-.5A2.5,2.5,0,0,0,15,7.5v-1a.5.5,0,0,1,.5-.5h1.379a2.516,2.516,0,0,0,1.767-.732l.377-.377A9.969,9.969,0,0,1,22,12Zm-19.951.963,3.158,3.158A2.978,2.978,0,0,0,7.329,17H10a1,1,0,0,1,1,1v3.949A10.016,10.016,0,0,1,2.049,12.963ZM13,21.949V18a3,3,0,0,0-3-3H7.329a1,1,0,0,1-.708-.293L2.163,10.249A9.978,9.978,0,0,1,17.456,3.63l-.224.224A.507.507,0,0,1,16.879,4H15.5A2.5,2.5,0,0,0,13,6.5v1a.5.5,0,0,1-.5.5A2.5,2.5,0,0,0,10,10.5V11a3,3,0,0,0,3,3h3a1,1,0,0,1,1,1v.962a2.516,2.516,0,0,0,.732,1.767l1.337,1.337A9.971,9.971,0,0,1,13,21.949Z"/></svg>
                         &#10;<span id="newsButtonText">MAP</span>
                     </button>
                 </div>