summaryrefslogtreecommitdiff
path: root/webcards/styles/client/desktop.css
diff options
context:
space:
mode:
authorKyle Gunger <corechg@gmail.com>2020-02-27 17:48:00 -0500
committerKyle Gunger <corechg@gmail.com>2020-02-27 17:48:00 -0500
commitea8f308bc00330b5378eb2b8f16d9cc348719c9a (patch)
tree34a9074b4687beefd3bf046d68374ef307f178da /webcards/styles/client/desktop.css
parent62cfd4f23993e04602aa15adf4fc71e6eb48c376 (diff)
Init WebCards
Diffstat (limited to 'webcards/styles/client/desktop.css')
-rw-r--r--webcards/styles/client/desktop.css134
1 files changed, 134 insertions, 0 deletions
diff --git a/webcards/styles/client/desktop.css b/webcards/styles/client/desktop.css
new file mode 100644
index 0000000..46dc83d
--- /dev/null
+++ b/webcards/styles/client/desktop.css
@@ -0,0 +1,134 @@
+@media (min-width: 600px) and (min-height: 501px) {
+ body {
+ display: flex;
+
+ align-items: center;
+ justify-content: center;
+ }
+
+ /*
+ TopBar rules
+ */
+
+ button.top-button {
+ transition-duration: 0.2s;
+ }
+
+ button.top-button:hover {
+ background-color: #ddd;
+ }
+
+ button#newgame:before{
+ content: "Create Game";
+ }
+
+ button#settings {
+ display: none;
+ }
+
+ button#reset:before{
+ content: "Reset Connection";
+ }
+
+ /*
+ Lobby rules
+ */
+ div.lobby {
+ min-width: 70vw;
+ min-height: 70vh;
+
+ display: flex;
+ text-align: center;
+ flex-direction: column;
+
+ align-items: center;
+ }
+
+ div.server {
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ margin-bottom: 10px;
+ box-sizing: border-box;
+ }
+
+ span.status {
+ box-sizing: border-box;
+ font-size: larger;
+
+ margin-right: 10px;
+ padding: 10px;
+ border-radius: 10px;
+ flex-basis: content;
+ }
+
+ span.addr {
+ font-size: larger;
+ padding: 10px;
+ border-radius: 10px;
+
+ background-color: #ddd;
+
+ flex: 1;
+ }
+
+ div.content {
+ min-width: 70vw;
+ min-height: 70vh;
+
+ display: flex;
+ flex-direction: row;
+
+ box-sizing: border-box;
+ }
+
+ div.info {
+ display: flex;
+ text-align: center;
+ flex-direction: column;
+
+ flex: 1;
+
+ margin-left: 10px;
+
+ box-sizing: border-box;
+ }
+
+ div.games {
+ box-sizing: border-box;
+ overflow-y: auto;
+ overflow-x: hidden;
+ padding: 10px;
+ border-radius: 10px;
+ background-color: #ddd;
+ flex: 4;
+
+ border: 5px solid #ddd;
+ }
+
+ div.stats, div.settings {
+ border-radius: 10px;
+ background-color: #ddd;
+
+ box-sizing: border-box;
+
+ flex: 1;
+
+ height: auto;
+ width: 100%;
+
+ text-align: left;
+ }
+
+ div.settings {
+ margin-top: 10px;
+ }
+
+ div.game {
+ height: 20%;
+ }
+
+ /*
+ Table rules
+ */
+}