init
|
@ -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 |
|
@ -0,0 +1,10 @@
|
|||
version: "3"
|
||||
|
||||
services:
|
||||
web:
|
||||
container_name: "studio-siteweb"
|
||||
image: "httpd"
|
||||
ports:
|
||||
- "6969:80"
|
||||
volumes:
|
||||
- ".:/usr/local/apache2/htdocs/"
|
After Width: | Height: | Size: 39 KiB |
|
@ -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 |
|
@ -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;
|
||||
}
|
|
@ -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" />
|
|
@ -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>
|
After Width: | Height: | Size: 1.3 MiB |
After Width: | Height: | Size: 231 KiB |
After Width: | Height: | Size: 53 KiB |
After Width: | Height: | Size: 2.9 KiB |
After Width: | Height: | Size: 63 KiB |
|
@ -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;
|
||||
}
|
After Width: | Height: | Size: 38 KiB |
After Width: | Height: | Size: 93 KiB |