Skip to content

Commit

Permalink
Modifications
Browse files Browse the repository at this point in the history
  • Loading branch information
Bubobubobubobubo committed Oct 3, 2024
1 parent 2a25ffc commit e240386
Show file tree
Hide file tree
Showing 6 changed files with 225 additions and 113 deletions.
42 changes: 42 additions & 0 deletions src/_data/linkTree.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
[
{
"title": "Cookie Collective",
"link": "https://cookie.paris"
},
{
"title": "YouTube",
"link": "https://www.youtube.com/@cookiecollective"
},
{
"title": "Spotify",
"link": "https://open.spotify.com/artist/2EzsVF83hFQU0lITwaMiBj?si=m1KaEQOXSJKqEKMpUIqrlA"
},
{
"title": "Bandcamp",
"link": "https://cookiecollectif.bandcamp.com/music"
},
{
"title": "LiveCoding.fr",
"link": "https://livecoding.fr"
},
{
"title": "Renardo",
"link": "https://renardo.org"
},
{
"title": "qsdlfkjqsdfl",
"link": ""
},
{
"title": "qsdlfkjqsdfl",
"link": ""
},
{
"title": "qsdlfkjqsdfl",
"link": ""
},
{
"title": "qsdlfkjqsdfl",
"link": ""
}
]
2 changes: 1 addition & 1 deletion src/_includes/navigation.njk
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<div class="text-icon-combo"><a class="navlink" href="/gallery">{% phicon "folder" %} <span>Browse</span></a></div>
<div class="text-icon-combo"><a class="navlink" href="javascript:getRandomProject()">{% phicon "scribble-loop" %} <span>Wander</span></a></div>
<div class="text-icon-combo"><a class="navlink" href="/wall-of-sound">{% phicon "wall" %} <span>Wall</span></a></div>
<div class="text-icon-combo"><a class="navlink" href="/">{% phicon "film-reel" %} <span>Cinema</span></a></div>
<div class="text-icon-combo"><a class="navlink" href="/cinema">{% phicon "film-reel" %} <span>Cinema</span></a></div>
<div class="text-icon-combo"><a class="navlink" href="/fanzine">{% phicon "book-open-text" %} <span>Fanzine</span></a></div>
<div class="text-icon-combo"><a class="navlink" href="/about">{% phicon "flying-saucer" %} <span>More</span></a></div>
<div class="text-icon-combo"><a class="navlink" href="/">{% phicon "cookie" %}</a></div>
Expand Down
90 changes: 27 additions & 63 deletions src/about.njk
Original file line number Diff line number Diff line change
Expand Up @@ -4,60 +4,22 @@ title: Cookie Compilation
{%include "head.njk" %}
{%include "navigation.njk"%}


<video autoplay muted loop>
<source src="/media/ccc.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>

<div class="container">
<div class="ressource-button foreground">
<p class="button">
<a href="https://linktr.ee/cookie_collective" target="_blank">
Cookie Collective
</a>
</p>
</div>

<div class="ressource-button foreground">
<p class="button">
<a href="https://www.youtube.com/@cookiecollective" target="_blank">
Youtube
</a>
</p>
</div>

<div class="ressource-button foreground">
<p class="button">
<a href="https://open.spotify.com/artist/2EzsVF83hFQU0lITwaMiBj?si=m1KaEQOXSJKqEKMpUIqrlA" target="_blank">
Spotify
</a>
</p>
</div>

<div class="ressource-button foreground">
<p class="button">
<a href="https://cookiecollectif.bandcamp.com/music" target="_blank">
Bandcamp
</a>
</p>
</div>

<div class="ressource-button foreground">
<p class="button">
<a href="https://livecoding.fr/" target="_blank">
LiveCoding.fr
</a>
</p>
</div>

<div class="ressource-button foreground">
<p class="button">
<a href="https://renardo.org/" target="_blank">
Renardo
</a>
</p>
</div>

{% for link in linkTree -%}
<div class="ressource-button foreground">
<p class="button">
<a href="{{link.link}}" target="_blank">
{{link.title}}
</a>
</p>
</div>
{% endfor %}
</div>


Expand All @@ -68,31 +30,33 @@ title: Cookie Compilation
margin: 5%;
}
.container
{
.container {
margin: 5%;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: auto;
scrollbar-width: none; /* For Firefox */
display: flex;
flex-direction: column;
align-items: center;
}
.card {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
.container::-webkit-scrollbar {
display: none; /* For Chrome, Safari, and Opera */
}
.ressource-button {
display: flex;
justify-content: center;
width: 100%;
}
.button {
width: 85%;
width: 100%;
max-width: 600px; /* Adjust the max-width as needed */
font-size: 1.5em;
}
Expand All @@ -108,11 +72,6 @@ title: Cookie Compilation
padding: 10px;
text-decoration: none;
transition: background-color 0.3s, color 0.3s;
width: 93%;
}
.button a {
width: 100%;
text-align: center;
}
Expand All @@ -122,6 +81,11 @@ title: Cookie Compilation
z-index: 10;
}
/* Add larger margin-top for phones */
@media (max-width: 600px) {
.container {
margin-top: 12%;
}
}
</style>
85 changes: 85 additions & 0 deletions src/cinema.njk
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
{%include "head.njk" %}
{%include "navigation.njk"%}

<div class="container">
<div class="mobile-warning">
<p lang="en" class="warning">Please turn your device to landscape mode to view the video.</p>
</div>
<video class="view box-shadow borders" controls style="display: none;">
<source src="https://ccc-static.cookie.paris/ccc.mp4" type="video/mp4" />
</video>
</div>

<script>
function checkOrientation() {
const warning = document.querySelector('.mobile-warning');
const video = document.querySelector('video.view');
if (window.innerWidth > window.innerHeight) {
warning.style.display = 'none';
video.style.display = 'block';
} else {
warning.style.display = 'block';
video.style.display = 'none';
}
}
window.addEventListener('resize', checkOrientation);
window.addEventListener('load', checkOrientation);
</script>


<style>
.container {
margin-top: 7%;
margin-bottom: 0%;
padding: 0 15px;
}
.box-shadow {
box-shadow: 0px 0px 5px #111;
}
.view {
width: 100%;
height: 80%;
margin-top: 1%;
}
@media (orientation: landscape) and (max-width: 600px) {
.view {
margin-top: 1%;
}
}
@media (orientation: portrait) and (max-width: 600px) {
.view {
margin-top: 5%;
}
}
@media (max-width: 600px) {
.container {
margin-top: 5%;
padding: 0 10px;
}
.view {
width: 100%;
height: auto;
}
}
.warning {
display: flex;
justify-content: center;
align-items: center;
font-size: 2em;
color: white;
height: 100vh;
hyphens: auto;
text-align: center;
}
</style>
Loading

0 comments on commit e240386

Please sign in to comment.