This commit is contained in:
nemo 2024-09-01 23:58:40 +02:00
commit 53c9cc890b
16 changed files with 300 additions and 0 deletions

13
close.svg Normal file
View File

@ -0,0 +1,13 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 26 26" xml:space="preserve">
<g>
<path style="fill:#696969;" d="M21.125,0H4.875C2.182,0,0,2.182,0,4.875v16.25C0,23.818,2.182,26,4.875,26h16.25
C23.818,26,26,23.818,26,21.125V4.875C26,2.182,23.818,0,21.125,0z M18.78,17.394l-1.388,1.387c-0.254,0.255-0.67,0.255-0.924,0
L13,15.313L9.533,18.78c-0.255,0.255-0.67,0.255-0.925-0.002L7.22,17.394c-0.253-0.256-0.253-0.669,0-0.926l3.468-3.467
L7.221,9.534c-0.254-0.256-0.254-0.672,0-0.925l1.388-1.388c0.255-0.257,0.671-0.257,0.925,0L13,10.689l3.468-3.468
c0.255-0.257,0.671-0.257,0.924,0l1.388,1.386c0.254,0.255,0.254,0.671,0.001,0.927l-3.468,3.467l3.468,3.467
C19.033,16.725,19.033,17.138,18.78,17.394z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 962 B

10
docker-compose.yml Normal file
View File

@ -0,0 +1,10 @@
version: "3"
services:
web:
container_name: "studio-siteweb"
image: "httpd"
ports:
- "6969:80"
volumes:
- ".:/usr/local/apache2/htdocs/"

BIN
email-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

59
forum-logo.svg Normal file
View File

@ -0,0 +1,59 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="464.7pt"
height="465.5pt"
viewBox="0 0 464.7 465.5"
version="1.1"
id="svg14"
sodipodi:docname="forum-logo.svg"
inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview16"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="pt"
showgrid="false"
inkscape:zoom="0.99230398"
inkscape:cx="361.7843"
inkscape:cy="281.16384"
inkscape:window-width="1912"
inkscape:window-height="1047"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg14" />
<defs
id="defs5">
<clipPath
id="clip1">
<path
d="M 355 315 L 464.699219 315 L 464.699219 458 L 355 458 Z M 355 315 "
id="path2" />
</clipPath>
</defs>
<g
id="surface1"
transform="matrix(1.6859291,0,0,1.677271,-159.33156,1.1070442)">
<path
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none"
d="M 232.49609,20.289063 349.44531,137.43359 c -1.33594,2.05078 -99.88672,100.08594 -113.21094,113.41016 -1.21875,1.21875 -2.27343,2.97266 -4.03515,3.44531 L 115.34766,137.63281 Z M 94.773438,137.33594 c 0,9.82812 7.078122,14.75781 13.289062,20.96875 l 102.77344,102.77734 c 7.22656,7.22656 11.42187,13.68359 22.15234,13.68359 8.94141,0 14.12109,-7.23437 20.57422,-13.68359 L 365.00781,149.64844 c 1.64453,-1.63282 2.47266,-3.0625 3.44141,-5.21875 5.83984,-13.01563 -5.11328,-21.0625 -11.91406,-27.86328 L 253.36328,13.394531 c -6.5,-6.5 -11.27344,-13.4843748 -21.16406,-13.4843748 -9.37891,0 -14.26563,6.9804688 -20.76953,13.4843748 L 99.785156,125.02734 c -2.742187,2.71875 -5.011718,6.98438 -5.011718,12.3086 z m 0,0"
id="path7" />
<path
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none"
d="m 208.17969,79.84375 v 144.125 c 0,0.90625 0.27343,1.17969 1.17968,1.17969 h 28.35157 v -61.82422 h 36.23047 v -29.53125 h -36.23047 v -25.59375 h 38.58984 c 1.66406,0 0.78906,-0.61328 0.78906,-1.57813 V 78.664063 h -67.73047 c -0.90625,0 -1.17968,0.273437 -1.17968,1.179687 z m 0,0"
id="path9" />
<g
clip-path="url(#clip1)"
clip-rule="nonzero"
id="g11" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

43
game.css Normal file
View File

@ -0,0 +1,43 @@
.games {
margin: 0 auto;
display: grid;
gap: 1rem;
grid-template-columns: repeat(1, 1fr);
}
@media (min-width: 600px) {
.games { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 900px) {
.games { grid-template-columns: repeat(3, 1fr); }
}
.game {
color: white;
position: relative;
}
.game p {
margin: 0;
}
.game img {
width: 100%;
height: 100%;
object-fit: contain;
}
.game-video{
opacity: 0;
transition: 0.5s ease;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.game:hover .game-video {
opacity: 1;
}

3
game0.html Normal file
View File

@ -0,0 +1,3 @@
<a href="/">acceuil</a>
<br>
<img src="https://i0.wp.com/www.cssscript.com/wp-content/uploads/2018/03/minimal-notification-popup-pure-javascript.png?fit=413%2C302&ssl=1" />

115
index.html Normal file
View File

@ -0,0 +1,115 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Bloub Bloub Studio</title>
<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="/game.css">
<link rel="icon" href="/favicon.ico" type="image/x-icon">
</head>
<body>
<script>0</script>
<h1>Bloub Bloub Studio</h1>
<nav>
<a href="/">
<img src="/forum-logo.svg" alt="forum" />
<h3>FORUM</h3>
</a>
<a href="/">
<img src="/steam-logo.png" alt="steam" />
<h3>STEAM</h3>
</a>
<a href="/">
<img src="/twitter-logo.png" alt="twitter" />
<h3>TWITTER</h3>
</a>
<a href="/">
<img src="/instagram-logo.png" alt="instagram" />
<h3>INSTAGRAM</h3>
</a>
<a href="/">
<img src="/tik-tok-logo.png" alt="tik tok" />
<h3>TIK TOK</h3>
</a>
<a href="/">
<img src="/email-logo.png" alt="email us" />
<h3>EMAIL US</h3>
</a>
<a href="/">
<img src="/mailing-list-logo.png" alt="mailing list" />
<h3>MAILING LIST</h3>
</a>
<a href="/">
<img src="/press-kit-logo.png" alt="press kit" />
<h3>PRESS KIT</h3>
</a>
</nav>
<h2>OUR GAME :</h2>
<main class="games">
<a href="/game0.html" class="game">
<img src="/miniature.png" alt="GAME 0" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game1.html" class="game">
<img src="/miniature.png" alt="GAME 1" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game2.html" class="game">
<img src="/miniature.png" alt="GAME 2" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game3.html" class="game">
<img src="/miniature.png" alt="GAME 3" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game4.html" class="game">
<img src="/miniature.png" alt="GAME 4" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game5.html" class="game">
<img src="/miniature.png" alt="GAME 5" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game6.html" class="game">
<img src="/miniature.png" alt="GAME 6" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game7.html" class="game">
<img src="/miniature.png" alt="GAME 7" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game8.html" class="game">
<img src="/miniature.png" alt="GAME 8" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
<a href="/game9.html" class="game">
<img src="/miniature.png" alt="GAME 9" />
<video class="game-video" autoplay loop muted poster="/miniature.png">
<source src="/trailer.mp4" type="video/mp4">
</video>
</a>
</main>
<div id="notif">
<img id="notif-close" src="close.svg" alt="close button" onclick="document.getElementById('notif').style.display = 'none'" />
<a href="/game0.html">BUY OUR LAST GAME NOW!</a>
</div>
</body>
</html>

BIN
instagram-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

BIN
mailing-list-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 231 KiB

BIN
miniature.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 53 KiB

BIN
press-kit-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
steam-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

57
style.css Normal file
View File

@ -0,0 +1,57 @@
html {
background-color: black;
}
h1, h2 {
color: white;
text-align: center;
}
nav {
display: flex;
flex-wrap: wrap;
color: white;
text-align: center;
}
nav a {
margin-left: auto;
margin-right: auto;
padding-left: 1rem;
padding-right: 1rem;
padding-bottom: 1rem;
}
nav a img {
width: 60px;
height: 60px;
}
nav a:hover img {
width: 75px;
height: 75px;
transition: 0.1s ease;
}
nav a h3 {
margin: 0px;
}
#notif {
position: fixed;
margin: 1rem;
padding: 0.5rem;
right: 0px;
bottom: 0px;
background-color: orange;
text-align: center;
font-size: 2rem;
}
#notif a {
text-decoration: none;
color: black;
margin-right: 1rem;
}
#notif-close {
width: 45px;
float: right;
}

BIN
tik-tok-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

BIN
trailer.mp4 Normal file

Binary file not shown.

BIN
twitter-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 KiB