From eff93f595c397635dc787c49054f397ad7925156 Mon Sep 17 00:00:00 2001 From: Dave Umrysh Date: Mon, 24 Jan 2022 08:02:15 -0700 Subject: [PATCH] Responsive website by programmerraja --- client/src/App.css | 61 +++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 60 insertions(+), 1 deletion(-) diff --git a/client/src/App.css b/client/src/App.css index 828c731..875444d 100644 --- a/client/src/App.css +++ b/client/src/App.css @@ -9,7 +9,7 @@ a { /* Homepage */ .Homepage { background-image: url('./assets/Landing-Page.gif'); - background-size: cover; + background-size: 100vw 100vh; margin: 0; height: 100vh; } @@ -385,3 +385,62 @@ a { .msg-receive:hover, .msg-send:hover{ opacity: .9; } +/*media query*/ +@media only screen and (max-width: 480px) +{ + + .homepage-form { + flex-direction: column; + align-items: center; + } + + .topInfo + { + flex-direction: column; + height: auto; + } + .topInfoText { + margin-top: 51px; + font-size: 18px; + } + .topInfo>h1 { + font-size: 18px; + } + .topInfo>img { + width: 40px; + } + + .material-icons + { + font-size:16px; + } + + .game-button{ + font-size: 10px; + padding: 2px 9px 6px; + } + + .playerDeckText{ + font-size: 18px; + } + + .player1Deck + { + flex-wrap: wrap; + } + + .Card + { + width: 2rem; + } + /*chat box */ + .chat-box{ + width: auto; + right: 0; + left: 0; + } + .chat-text{ + width: 100%; + position: initial; + } +} \ No newline at end of file