jonas/flufflparty-
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Colors

Browse Source
This commit is contained in:
brausjonas
2023-03-26 01:56:35 +01:00
parent d0e607e0da
commit 28e62f6b3c
5 changed files with 40 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.idea/workspace.xml
Generated
+2 -1
View File
@@ -47,6 +47,7 @@
}</component>
<component name="RecentsManager">
<key name="MoveFile.RECENT_KEYS">
<recent name="D:\HTML\flufflparty" />
<recent name="D:\HTML\flufflparty\Temp" />
</key>
</component>
@@ -60,7 +61,7 @@
<updated>1679674447095</updated>
<workItem from="1679674448294" duration="3278000" />
<workItem from="1679754546660" duration="3762000" />
<workItem from="1679776338023" duration="6712000" />
<workItem from="1679776338023" duration="7774000" />
</task>
<servers />
</component>
StartPage.js
+2 -2
View File
@@ -4,7 +4,7 @@ function showMobileMenuBar()
{
if(!menuActive) {
document.getElementById("mobileMenuBar").style.display = "block";
document.getElementById("mobileMenuBarButton").style.backgroundColor = "rgba(198, 119, 70, 0.5)";
document.getElementById("mobileMenuBarButton").style.backgroundColor = "#B6E2A1";
menuActive = true;
}
else
@@ -16,6 +16,6 @@ function showMobileMenuBar()
function hideMobileMenuBar()
{
document.getElementById("mobileMenuBar").style.display = "none";
document.getElementById("mobileMenuBarButton").style.backgroundColor = "rgba(198, 119, 70, 0)";
document.getElementById("mobileMenuBarButton").style.backgroundColor = "rgba(0, 0, 0, 0)";
menuActive = false;
}
index.html
+5 -75
View File
@@ -11,12 +11,12 @@
<header>
<button><a href="#mainHeader">IO Game Studios</a></button>
<button>IO Game Studios</button>
<nav>
<!-- Desktop-->
<ul>
<li class="highlighted">Home</li>
<li>Games</li>
<li>Quicklinks</li>
<li>About</li>
@@ -45,82 +45,12 @@
</div>
</menu>
<div>
<div class="contentArea">
<h1 id="mainHeader">We create games like back in the days</h1>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<div id="mainPageGames">
</div>
</div>
</body>
mainPage.css
+14 -3
View File
@@ -4,9 +4,14 @@ General
------------------------------------------------------------------------------------------
*/
body {
background-image: linear-gradient(#c67746, #88b3ae);
height: 100%;
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap');
* {
font-family: "Poppins", sans-serif;
box-sizing: border-box;
margin: 0;
padding: 0;
font-size: 16px;
}
h1 {
@@ -17,3 +22,9 @@ h1 {
color: #41423f;
}
.contentArea
{
display: flex;
flex-direction: column;
}
navigationStyle.css
+17 -34
View File
@@ -1,7 +1,8 @@
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap');
* {
font-family: "Roboto Light", sans-serif;
font-family: "Poppins", sans-serif;
box-sizing: border-box;
margin: 0;
padding: 0;
@@ -16,7 +17,7 @@ Desktop
/*basic li a and button setup*/
li, a, button {
font-weight: 500;
color: white;
color: black;
text-decoration: none;
}
@@ -28,7 +29,7 @@ header {
justify-content: space-between;
align-items: center;
padding: 10px 100px;
background-color: #41423f;
background-color: #FFFBC1;
}
/*IO Game Studios button (only navigation)*/
@@ -36,7 +37,7 @@ header button {
padding: 20px;
border-radius: 50px;
border-style: none;
background-color: #88b3ae;
background-color: #F7A4A4;
cursor: pointer;
}
@@ -49,36 +50,18 @@ nav li {
}
nav li:hover {
color: #88b3ae;
color: #B6E2A1;
}
/*Dropdown*/
nav ul li div {
display: none;
position: absolute;
background-color: #41423f;
border-radius: 50px;
padding-top: 70px;
margin-left: -50px;
padding-bottom: 10px;
}
nav ul li div ul {
display: flex;
flex-direction: column;
}
nav ul li div ul li {
padding: 0 0 10px 20px;
text-align: center;
}
nav ul li div ul li button {
padding: 20px;
}
header button:hover {
background-color: rgba(198, 119, 70, 0.5);
background-color: #B6E2A1;
}
.highlighted
{
color: #F7A4A4;
}
/*Mobile Excluded*/
@@ -118,7 +101,7 @@ Mobile
/*Style the Menu Icon*/
nav svg {
color: white;
color: black;
width: 30px;
height: 30px;
}
@@ -126,7 +109,7 @@ Mobile
menu div {
float: right;
background-color: #41423f;
background-color: #FFFBC1;
border-radius: 0 0 0 50px;
padding-bottom: 15px;
}
@@ -143,10 +126,10 @@ Mobile
margin: 5px 30px;
cursor: pointer;
border-radius: 50px;
background-color: rgba(136, 179, 174, 1);
background-color: #F7A4A4;
}
menu div ul li:hover {
background-color: rgba(198, 119, 70, 0.5);
background-color: #B6E2A1;
}
}