From f7cf27270b17cecd866c0b188094525a4052e51a Mon Sep 17 00:00:00 2001 From: Cutieguwu Date: Mon, 12 Jun 2023 07:56:05 -0400 Subject: [PATCH] Working on adding scalability --- Global_Resources/style.css | 96 ++++++++++++++++++-------------------- home.html | 78 +++++++++---------------------- 2 files changed, 66 insertions(+), 108 deletions(-) diff --git a/Global_Resources/style.css b/Global_Resources/style.css index 01c24be..278409e 100644 --- a/Global_Resources/style.css +++ b/Global_Resources/style.css @@ -36,12 +36,12 @@ p .menubar ul a { float: left; - width: 200px; - height: 40px; + width: 10vw; + height: 2vw; background-color: #5181ff; - line-height: 40px; + line-height: 2vw; text-align: center; - font-size: 20px; + font-size: 1.03vw; text-decoration: none; color: white; display: inline; @@ -58,12 +58,12 @@ p padding: 0; list-style: none; float: left; - width: 200px; - height: 40px; + width: 10vw; + height: 2vw; background-color: #8800ff; - line-height: 40px; + line-height: 2vw; text-align: center; - font-size: 20px; + font-size: 1.03vw; display: inline; } @@ -80,7 +80,8 @@ p background-color: #5181ff; } -.dropdownContent a:hover { +.dropdownContent a:hover +{ background-color: #8800ff; } @@ -91,33 +92,32 @@ p display: block; } -.menubar-side -{ - float: left; - width: 200px; - text-align: center; - color: white; - display: inline; -} - .menubar-side ul { + float: left; display: table; - margin: 0 auto; + width: 10vw; + margin-left: 2.5%; + line-height: 2vw; + display: inline; + position: relative; } .menubar-side ul a { - float: left; - width: 200px; - height: 40px; background-color: #5181ff; - line-height: 40px; text-align: center; - font-size: 20px; + font-size: 1.03vw; text-decoration: none; color: white; - display: inline; + height: 2vw; + position: relative; + display: block; +} + +.menubar-side ul a:hover +{ + background-color: #8800ff; } .global-page-subtitle @@ -125,12 +125,11 @@ p color: white; opacity: 1; text-align: center; - margin-left: 20px; - margin-bottom: 10px; width: fit-content; position: relative; border-radius: 5px; background-color: #9e84ff; + margin-left: 1.5vw; } .global-page-subtitle p @@ -144,33 +143,26 @@ p .global-page-bg { - margin-top: 50px; - margin-left: 300px; - margin-right: 250px; - max-width: 1300px; - min-width: fit-content; - align-self: center; + float: right; + margin-top: 4vw; + margin-right: 14.875%; + width: 68.25%; background-color: #84a6ff; opacity: 0.9; z-index: 1; border-radius: 10px; + position: relative; } .main-page-greet { + float: right; border-radius: 20px; background-color: #84a6ff; - color: white; opacity: 1 !important; - text-align: center; - margin-top: 50px; - margin-left: 300px; - margin-right: 250px; - max-width: 1300px; - min-width: fit-content; - padding-top: 1px; - padding-bottom: 1px; - position: relative; + margin-top: 2vw; + margin-right: 14.875%; + width: 68.25%; } .main-page-greet p @@ -189,26 +181,28 @@ p color: white; opacity: 1 !important; text-align: center; - margin-top: 20px; - margin-left: 50px; - margin-right: 50px; - max-width: 1200px; - min-width: fit-content; + margin-top: 2vw; + margin-left: auto; + margin-right: auto; padding-top: 1px; padding-bottom: 1px; position: relative; + width: 65vw; } .main-page-content { opacity: 1; - padding-top: 20px; - margin-left: 20px; - margin-right: 20px; + padding-top: 3px; + padding-bottom: 3px; + margin-left: auto; + margin-right: auto; position: relative; z-index: 2; background-color: #9e84ff; border-radius: 5px; + text-align: center; + width: 55vw; } .main-page-content p diff --git a/home.html b/home.html index 9f3d9e4..3c2f604 100644 --- a/home.html +++ b/home.html @@ -2,55 +2,34 @@ - + - - Bearock SMP - - -

A Private Survival Multiplayer Server

+ + Cutieguwu - Home + + +

Welcome to my official site! Explore my projects!

@@ -59,42 +38,27 @@
-

Welcome to the Bearock SMP website! We are a few friends who play together too much on our spare time. Some of us make content on the side, others just play peacefully (Unless they have dealings with KatieKooky... You'll see soon enough what I mean. - Bear) On this site, you can find all kinds of information. Who owns the server (Me, Bear, BTW), all of our members (Active or Otherwise), their pronouns and any other information they may want to share. You can also find out about major events and builds of each season from the Seasons tab in the menu. For information and questions about the server, that can be found under the About tab.

-

Good Luck!

+

Welcome to my [Cutieguwu's] personal website! Everywhere you look, you'll find something new and interesting that I'm spending too much time on!

+

Have Fun!!

-

~ Bearock SMP | News Feed ~

+

Latest Updates!!!

-

There's totally news here...

-

- Bear

-
-
-

There's totally news here too...

-

- Bear

+

I've started actual work on the website!

-

Website managed by Bear [Beartech]

+

Website managed by Olive [Cutieguwu]