Desiignn
This commit is contained in:
Generated
+2
-2
@@ -13,9 +13,9 @@
|
|||||||
<component name="FileTemplateManagerImpl">
|
<component name="FileTemplateManagerImpl">
|
||||||
<option name="RECENT_TEMPLATES">
|
<option name="RECENT_TEMPLATES">
|
||||||
<list>
|
<list>
|
||||||
<option value="HTML File" />
|
|
||||||
<option value="JavaScript File" />
|
<option value="JavaScript File" />
|
||||||
<option value="CSS File" />
|
<option value="CSS File" />
|
||||||
|
<option value="HTML File" />
|
||||||
</list>
|
</list>
|
||||||
</option>
|
</option>
|
||||||
</component>
|
</component>
|
||||||
@@ -61,7 +61,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="8024000" />
|
<workItem from="1679776338023" duration="10678000" />
|
||||||
</task>
|
</task>
|
||||||
<servers />
|
<servers />
|
||||||
</component>
|
</component>
|
||||||
|
|||||||
+62
@@ -0,0 +1,62 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>IO Game Studios | Games</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link rel="stylesheet" href="navigationStyle.css">
|
||||||
|
<link rel="stylesheet" href="mainPage.css">
|
||||||
|
</head>
|
||||||
|
<body onresize="hideMobileMenuBar()">
|
||||||
|
|
||||||
|
<header>
|
||||||
|
|
||||||
|
<button>IO Game Studios</button>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<!-- Desktop-->
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Home</a></li>
|
||||||
|
<li><a class="highlighted" href="games.html">Games</a></li>
|
||||||
|
<li><a href="quicklinks.html">Quicklinks</a></li>
|
||||||
|
<li>About</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<!--Mobile-->
|
||||||
|
<button onclick="showMobileMenuBar()" id="mobileMenuBarButton">
|
||||||
|
<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>
|
||||||
|
</button>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!--Mobile-->
|
||||||
|
<menu id="mobileMenuBar">
|
||||||
|
<div>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Home</a></li>
|
||||||
|
|
||||||
|
<li class="highlighted"><a href="games.html">Games</a></li>
|
||||||
|
|
||||||
|
<li><a href="quicklinks.html">Quicklinks</a></li>
|
||||||
|
|
||||||
|
<li>About</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</menu>
|
||||||
|
|
||||||
|
<!--Menu Ends here-->
|
||||||
|
|
||||||
|
<div class="contentArea">
|
||||||
|
|
||||||
|
|
||||||
|
<div id="mainPageGames">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script src="StartPage.js"></script>
|
||||||
|
</html>
|
||||||
+29
-7
@@ -16,9 +16,9 @@
|
|||||||
<nav>
|
<nav>
|
||||||
<!-- Desktop-->
|
<!-- Desktop-->
|
||||||
<ul>
|
<ul>
|
||||||
<li class="highlighted">Home</li>
|
<li><a class="highlighted" href="index.html">Home</a></li>
|
||||||
<li>Games</li>
|
<li><a href="games.html">Games</a></li>
|
||||||
<li>Quicklinks</li>
|
<li><a href="quicklinks.html">Quicklinks</a></li>
|
||||||
<li>About</li>
|
<li>About</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
@@ -35,11 +35,11 @@
|
|||||||
<menu id="mobileMenuBar">
|
<menu id="mobileMenuBar">
|
||||||
<div>
|
<div>
|
||||||
<ul>
|
<ul>
|
||||||
<li class="highlighted">Home</li>
|
<li class="highlighted" ><a href="index.html">Home</a></li>
|
||||||
|
|
||||||
<li>Games</li>
|
<li><a href="games.html">Games</a></li>
|
||||||
|
|
||||||
<li>Quicklinks</li>
|
<li><a href="quicklinks.html">Quicklinks</a></li>
|
||||||
|
|
||||||
<li>About</li>
|
<li>About</li>
|
||||||
</ul>
|
</ul>
|
||||||
@@ -49,10 +49,32 @@
|
|||||||
<!--Menu Ends here-->
|
<!--Menu Ends here-->
|
||||||
|
|
||||||
<div class="contentArea">
|
<div class="contentArea">
|
||||||
<h1 id="mainHeader">We create games like back in the days</h1>
|
|
||||||
|
<h1 style="color: #F7A4A4">We create games like back in the days</h1>
|
||||||
|
|
||||||
|
<h2>Have a look at our games and contents!</h2>
|
||||||
|
|
||||||
<div id="mainPageGames">
|
<div id="mainPageGames">
|
||||||
|
<div class="color3">
|
||||||
|
<h2>FlufflParty</h2>
|
||||||
|
<p>
|
||||||
|
FlufflParty is the new partygame for mobile and pc.
|
||||||
|
Play free and online with your friends. NO ADS.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<button class="color1">Visit now</button>
|
||||||
|
</div>
|
||||||
|
<div class="color1">
|
||||||
|
<h2>Characters</h2>
|
||||||
|
<p>
|
||||||
|
In FlufflParty there are witing many maps and cute characters for you!
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<button class="color2">Review</button>
|
||||||
|
</div>
|
||||||
|
<div class="color2">
|
||||||
|
<h2>Coming Soon</h2>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -26,5 +26,94 @@ h1 {
|
|||||||
{
|
{
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.color1
|
||||||
|
{
|
||||||
|
background-color: #F7A4A4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color2
|
||||||
|
{
|
||||||
|
background-color: #FEBE8C;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color3
|
||||||
|
{
|
||||||
|
background-color: #B6E2A1;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2
|
||||||
|
{
|
||||||
|
font-size: 22px;
|
||||||
|
text-align: center;
|
||||||
|
padding: 20px;
|
||||||
|
color: #41423f;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mainPageGames
|
||||||
|
{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 18cm)
|
||||||
|
{
|
||||||
|
#mainPageGames
|
||||||
|
{
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#mainPageGames div
|
||||||
|
{
|
||||||
|
min-height: 300px;
|
||||||
|
max-height: 300px;
|
||||||
|
border-radius: 50px;
|
||||||
|
margin: 10px;
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
justify-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 18.1cm)
|
||||||
|
{
|
||||||
|
#mainPageGames div
|
||||||
|
{
|
||||||
|
min-width: 30%;
|
||||||
|
max-width: 30%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 18cm)
|
||||||
|
{
|
||||||
|
#mainPageGames div
|
||||||
|
{
|
||||||
|
min-width: 80%;
|
||||||
|
max-width: 80%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
#mainPageGames p
|
||||||
|
{
|
||||||
|
color: #41423f;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mainPageGames button
|
||||||
|
{
|
||||||
|
margin-top: 20px;
|
||||||
|
border-radius: 50px;
|
||||||
|
border-style: none;
|
||||||
|
color: #41423f;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
|||||||
+1
-1
@@ -17,7 +17,7 @@ Desktop
|
|||||||
/*basic li a and button setup*/
|
/*basic li a and button setup*/
|
||||||
li, a, button {
|
li, a, button {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
color: black;
|
color: #41423f;;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,61 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>IO Game Studios</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link rel="stylesheet" href="navigationStyle.css">
|
||||||
|
<link rel="stylesheet" href="mainPage.css">
|
||||||
|
</head>
|
||||||
|
<body onresize="hideMobileMenuBar()">
|
||||||
|
|
||||||
|
<header>
|
||||||
|
|
||||||
|
<button>IO Game Studios</button>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<!-- Desktop-->
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Home</a></li>
|
||||||
|
<li><a href="games.html">Games</a></li>
|
||||||
|
<li><a class="highlighted" href="quicklinks.html">Quicklinks</a></li>
|
||||||
|
<li>About</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<!--Mobile-->
|
||||||
|
<button onclick="showMobileMenuBar()" id="mobileMenuBarButton">
|
||||||
|
<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>
|
||||||
|
</button>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!--Mobile-->
|
||||||
|
<menu id="mobileMenuBar">
|
||||||
|
<div>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Home</a></li>
|
||||||
|
|
||||||
|
<li><a href="games.html">Games</a></li>
|
||||||
|
|
||||||
|
<li class="highlighted"><a href="quicklinks.html">Quicklinks</a></li>
|
||||||
|
|
||||||
|
<li>About</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</menu>
|
||||||
|
|
||||||
|
<!--Menu Ends here-->
|
||||||
|
|
||||||
|
<div class="contentArea">
|
||||||
|
|
||||||
|
<div id="mainPageGames">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script src="StartPage.js"></script>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user