Initial commit

Plugins/CloudNetWebinterface/htdocs/style.css

@@ -0,0 +1,162 @@
+#container {
+    position: relative;
+    margin: 80px;
+    height: calc(100% - 50px);
+    overflow: hidden;
+    border-radius: 30px;
+}
+
+#left {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 20%;
+    height: calc(100% - 160px);
+    background-color: #4a4a4a;
+    border-bottom-left-radius: 30px;
+    overflow: hidden;
+}
+
+#right {
+    position: absolute;
+    top: 0;
+    left: 20%;
+    width: 80%;
+    height: calc(100% - 160px);
+    background-color: #151515;
+    border-bottom-right-radius: 30px;
+    overflow: hidden;
+}
+
+#buttons {
+    width: 100%;
+    height: 10%;
+    padding: 5%;
+}
+
+#players {
+    width: 100%;
+    height: 87%;
+    padding: 2%;
+}
+
+#console {
+    margin-top: 1.5%;
+    width: 100%;
+    height: 90%;
+    padding: 1.5%;
+    overflow-y: scroll;
+    color: white;
+    font-family: monospace;
+}
+
+#console::-webkit-scrollbar {
+    width: 10px;
+}
+
+#console::-webkit-scrollbar-track {
+    background: none;
+}
+
+#console::-webkit-scrollbar-thumb {
+    background: #888;
+}
+
+#console::-webkit-scrollbar-thumb:hover {
+    background: #555;
+}
+
+#console-input {
+    position: relative;
+    width: 100%;
+    height: 7%;
+    padding: 1%;
+}
+
+.buttons {
+    width: 45%;
+    height: 70%;
+    border-radius: 20px;
+    background: none;
+    border: 2px solid #2094c2;
+    color: white;
+    margin: 2%;
+    font-size: 150%;
+    transition: all 200ms;
+}
+
+.buttons:hover {
+    cursor: pointer;
+    background-color: #2094c2;
+}
+
+.player {
+    display: inline-block;
+    width: 47%;
+    height: 5%;
+    background-color: #252525;
+    margin: 1%;
+    position: relative;
+    padding: 2%;
+    border-radius: 20px;
+    overflow: hidden;
+}
+
+.player img {
+    display: inline-block;
+    width: auto;
+    height: 100%;
+    margin-left: 3%;
+    -webkit-user-drag: none;
+}
+
+.playerName {
+    position: absolute;
+    color: white;
+    top: 2%;
+    left: 30%;
+}
+
+.playerServer {
+    position: absolute;
+    color: white;
+    top: 55%;
+    left: 30%;
+    font-size: 70%;
+}
+
+#playerTitle {
+    display: block;
+    width: 100%;
+    height: 3%;
+    font-size: 170%;
+    text-align: center;
+    color: white;
+    text-decoration: underline;
+}
+
+#command {
+    top: 0;
+    width: 94%;
+    padding: 10px;
+    display: inline-block;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    box-sizing: border-box;
+    height: 100%;
+}
+
+#send {
+    width: 5%;
+    background-color: #039BE5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    transition: 200ms;
+    height: 100%;
+}
+
+#send:hover {
+    background-color: #03A9F4;
+    cursor: pointer;
+}