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

dsfdf

Browse Source
This commit is contained in:
brausjonas
2023-03-25 23:01:48 +01:00
parent c9dc079fa2
commit 6758531526
4 changed files with 43 additions and 324 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.idea/workspace.xml
Generated
+1 -1
View File
@@ -60,7 +60,7 @@
<updated>1679674447095</updated> <updated>1679674447095</updated>
<workItem from="1679674448294" duration="3278000" /> <workItem from="1679674448294" duration="3278000" />
<workItem from="1679754546660" duration="3762000" /> <workItem from="1679754546660" duration="3762000" />
<workItem from="1679776338023" duration="5167000" /> <workItem from="1679776338023" duration="5301000" />
</task> </task>
<servers /> <servers />
</component> </component>
Temp/Style.css
-213
View File
@@ -1,213 +0,0 @@
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alkatra&family=Delicious+Handrawn&family=Roboto:wght@300&display=swap');
* {
font-family: "Roboto Light", sans-serif;
box-sizing: border-box;
margin: 0;
padding: 0;
}
li, a, button {
font-weight: 500;
font-size: 16px;
color: #ecf0f1;
text-decoration: none;
}
@media only screen and (max-width: 18cm) {
li, a, button {
font-size: 20px;
}
.hideOnMobile {
display: none;
}
}
header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30px 10%;
background-color: #24242A;
}
.navLinks {
list-style: none;
}
@media only screen and (max-width: 18cm) {
.navLinks {
display: none;
}
}
.navLinks li {
cursor: pointer;
display: inline-block;
padding: 0px 20px;
}
.navLinks li a {
transition: all 0.5s ease 0s;
}
.navLinks li a:hover, .navLinks li:hover {
color: #0088a9;
}
button {
padding: 9px 25px;
background-color: rgba(0, 136, 169, 1);
border: none;
border-radius: 50px;
cursor: pointer;
transition: all 0.5s ease 0s;
}
button:hover {
background-color: rgba(0, 136, 169, 0.3);
}
nav {
order: 1;
}
h1 {
text-align: center;
font-size: 50px;
color: white;
}
@media only screen and (max-width: 18cm) {
h1 {
text-align: center;
font-size: 30px;
color: white;
}
}
.margin-top {
margin-top: 50px;
}
body {
width: 100vw;
height: 100vh;
background-size: cover;
background-color: #31313a;
}
.dropdown div {
display: none;
position: absolute;
padding: 20px;
margin-left: -90px;
background-color: #24242A;
border-radius: 50px
}
.dropdown div ul li {
margin-top: 10px;
margin-bottom: 10px;
text-align: center;
}
@media only screen and (max-width: 18cm) {
.dropdown div ul li {
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
padding: 0;
}
.dropdown div ul li {
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
padding: 0;
}
.dropdown div {
right: 150px;
border-radius: 0px;
top: 10px;
}
}
.dropdown:hover div ul, .dropdown:hover div {
display: flex;
flex-direction: column;
}
.mobileMenuButton {
background-color: rgba(0, 0, 0, 0);
display: none;
}
@media only screen and (max-width: 18cm) {
.mobileMenuButton {
display: inline-block;
transition: all 0.5s ease 0s;
}
}
.mobileMenuButton svg {
width: 50px;
height: 50px;
position: absolute;
right: 30px;
top: 30px;
color: white;
}
.mobileMenuButton svg:hover {
color: #0088a9;
}
.mobileMenuDropDown {
display: none;
background-color: #24242A;
transition: all 0.5s ease 0s;
}
.mobileMenuDropDown li
{
list-style: none;
margin-top: 10px;
margin-bottom: 10px;
text-align: center;
padding: 20px;
}
.mobileMenuDropDown2 div
{
display: none;
}
.mobileMenuDropDown2:hover div
{
display: inherit;
}
.mobileMenuDropDown2:hover div li
{
padding: 5px;
}
.mobileMenuButton:hover .mobileMenuDropDown {
display: flex;
flex-direction: column;
position: absolute;
right: 0;
height: 100vh;
margin-top: 10%;
}
Temp/index.html
-74
View File
@@ -1,74 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>IO Game Studios</title>
<link rel="stylesheet" href="Style.css">
</head>
<body>
<header>
<nav>
<ul class="navLinks">
<li class="dropdown">
Games
<div>
<ul>
<li>
<button>FlufflParty</button>
</li>
<li>
<button>More</button>
</li>
</ul>
</div>
</li>
<li><a href="#">Quicklinks</a></li>
<li><a href="#">About Us</a></li>
</ul>
</nav>
<a href="#">
<button>IO Game Studios</button>
</a>
<div class="mobileMenuButton">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-list"
viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z"/>
</svg>
<div class="mobileMenuDropDown">
<ul>
<li class="mobileMenuDropDown2">
Games
<div>
<ul>
<li>
<button>FlufflParty</button>
</li>
<li>
<button>More</button>
</li>
</ul>
</div>
</li>
<hr/>
<li><a href="#">Quicklinks</a></li>
<hr/>
<li><a href="#">About Us</a></li>
</ul>
</div>
</div>
</header>
<h1 class="margin-top">
We create games like back in the days
</h1>
</body>
</html>
index.html
+42 -36
View File
@@ -8,51 +8,56 @@
</head> </head>
<body> <body>
<header> <header>
<button>IO Game Studios</button> <button><a href="#mainHeader">IO Game Studios</a></button>
<nav> <nav>
<!-- Desktop--> <!-- Desktop-->
<ul> <ul>
<li class="menuDropdownDesktop"> <li class="menuDropdownDesktop">
Games Games
<div> <div>
<ul> <ul>
<li><button>FlufflParty</button></li> <li>
<li><button>Other</button></li> <button>FlufflParty</button>
</ul> </li>
</div> <li>
</li> <button>Other</button>
<li>Quicklinks</li> </li>
<li>About</li> </ul>
</ul> </div>
</li>
<li>Quicklinks</li>
<li>About</li>
</ul>
<!--Mobile--> <!--Mobile-->
<button onclick="showMobileMenuBar()"> <button onclick="showMobileMenuBar()">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-three-dots" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-three-dots"
<path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/> viewBox="0 0 16 16">
</svg> <path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/>
</button> </svg>
</nav> </button>
</header> </nav>
</header>
<!--Mobile--> <!--Mobile-->
<menu id="mobileMenuBar"> <menu id="mobileMenuBar">
<div> <div>
<ul> <ul>
<li>Games</li> <li>Games</li>
<li>Quicklinks</li> <li>Quicklinks</li>
<li>About</li> <li>About</li>
</ul> </ul>
</div> </div>
</menu> </menu>
<div> <div>
<h1>We create games like back in the days</h1> <h1 id="mainHeader">We create games like back in the days</h1>
<br/> <br/>
<br/> <br/>
@@ -127,6 +132,7 @@
<br/> <br/>
<br/> <br/>
</div> </div>
</body> </body>