Compare commits
No commits in common. "77080c4928e16ececf9fc015270a4dda3b462cd0" and "517143fe6073393b8a9851c7f5051e133699d340" have entirely different histories.
77080c4928
...
517143fe60
9 changed files with 51 additions and 294 deletions
Binary file not shown.
|
Before Width: | Height: | Size: 328 KiB |
|
|
@ -26,7 +26,7 @@ return function ($page, $kirby, $site) {
|
|||
})->values(),
|
||||
'contact' => [
|
||||
'email' => (string)$site->contactEmail()->value(),
|
||||
'address' => (string)$site->contactAddress()->nl2br(),
|
||||
'address' => (string)$site->contactAddress()->value(),
|
||||
'socials' => $site->socialLinks()->toStructure()->map(function($item) {
|
||||
return [
|
||||
'label' => (string)$item->label()->value(),
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
<script>
|
||||
import { onMount } from 'svelte'
|
||||
import { navigation } from '@state/navigation.svelte'
|
||||
import { locale } from '@state/locale.svelte'
|
||||
import { slides } from '@state/slides.svelte'
|
||||
|
|
@ -10,13 +9,6 @@
|
|||
const currentLang = $derived(locale.current)
|
||||
const activeId = $derived(slides.active?.id ?? 'home')
|
||||
const menuItems = $derived(slides.all.filter(s => s.id !== 'home'))
|
||||
const isScrolled = $derived(navigation.isScrolled)
|
||||
|
||||
// Reset scroll state when switching slides
|
||||
$effect(() => {
|
||||
void slides.activeIndex
|
||||
navigation.setScrolled(false)
|
||||
})
|
||||
|
||||
function getTitle(slide) {
|
||||
return slide.titles?.[currentLang] || slide.title || slide.id
|
||||
|
|
@ -25,19 +17,9 @@
|
|||
function toggleMenu() {
|
||||
navigation.toggleMenu()
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
function onScroll(e) {
|
||||
if (e.target?.classList?.contains('page-scrollable')) {
|
||||
navigation.setScrolled(e.target.scrollTop > 100)
|
||||
}
|
||||
}
|
||||
window.addEventListener('scroll', onScroll, { capture: true })
|
||||
return () => window.removeEventListener('scroll', onScroll, { capture: true })
|
||||
})
|
||||
</script>
|
||||
|
||||
<nav class="navbar" class:navbar--open={isMenuOpen} class:navbar--scrolled={isScrolled && !isMenuOpen}>
|
||||
<nav class="navbar" class:navbar--open={isMenuOpen}>
|
||||
<a href="/" class="navbar-logo">
|
||||
<img src="/assets/img/GIF_world_game_planete.gif" alt="World Game" class="wg-logo" />
|
||||
</a>
|
||||
|
|
@ -82,7 +64,6 @@
|
|||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transition: background-color 0.4s ease, backdrop-filter 0.4s ease;
|
||||
z-index: var(--z-header);
|
||||
font-family: "Danzza";
|
||||
font-size: var(--font-size-paragraph);
|
||||
|
|
@ -119,11 +100,6 @@
|
|||
display: inline;
|
||||
}
|
||||
|
||||
.navbar--scrolled {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
backdrop-filter: blur(15px);
|
||||
}
|
||||
|
||||
.navbar--open {
|
||||
background-color: transparent;
|
||||
backdrop-filter: none;
|
||||
|
|
@ -198,10 +174,6 @@
|
|||
top: 0;
|
||||
}
|
||||
|
||||
.wg-logo {
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
.navbar-item {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -234,40 +234,20 @@
|
|||
|
||||
/* Mobile — var(--breakpoint-mobile) = 700px */
|
||||
@media (max-width: 700px) {
|
||||
.menu-title {
|
||||
font-size: 1.75rem;
|
||||
margin-bottom: 2.5rem;
|
||||
}
|
||||
.menu-list {
|
||||
font-size: var(--font-size-subtitle-mobile);
|
||||
grid-area: 6/4 / span 8 / span 8;
|
||||
align-self: start;
|
||||
}
|
||||
|
||||
.menu-nav-number {
|
||||
margin-left: -15px;
|
||||
}
|
||||
.menu-nav-label {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.menu-connect {
|
||||
font-size: var(--font-size-button-mobile);
|
||||
grid-area: 8/12 / span 8 / span 8;
|
||||
text-align: left;
|
||||
align-self: start;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.menu-connect-label {
|
||||
font-size: var(--font-size-paragraph-small-mobile);
|
||||
}
|
||||
|
||||
.menu-connect-info {
|
||||
font-family: "Danzza Medium", sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.menu-connect-title {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,63 +1,51 @@
|
|||
import { locale } from "@state/locale.svelte";
|
||||
import { locale } from '@state/locale.svelte'
|
||||
|
||||
const dict = {
|
||||
// Article
|
||||
published_on: { fr: "Publié le", en: "Published on" },
|
||||
link_copied: { fr: "Lien copié !", en: "Link copied!" },
|
||||
copy_link: { fr: "Copier le lien", en: "Copy link" },
|
||||
share_article: { fr: "Partager cet article", en: "Share this article" },
|
||||
related: { fr: "Nos recommandations", en: "Our recommendations" },
|
||||
share_whatsapp: { fr: "Partager sur WhatsApp", en: "Share on WhatsApp" },
|
||||
share_x: { fr: "Partager sur X", en: "Share on X" },
|
||||
share_facebook: { fr: "Partager sur Facebook", en: "Share on Facebook" },
|
||||
share_linkedin: { fr: "Partager sur LinkedIn", en: "Share on LinkedIn" },
|
||||
'published_on': { fr: 'Publié le', en: 'Published on' },
|
||||
'link_copied': { fr: 'Lien copié !', en: 'Link copied!' },
|
||||
'copy_link': { fr: 'Copier le lien', en: 'Copy link' },
|
||||
'share_article': { fr: 'Partager cet article', en: 'Share this article' },
|
||||
'related': { fr: 'Nos recommandations', en: 'Our recommendations' },
|
||||
'share_whatsapp': { fr: 'Partager sur WhatsApp', en: 'Share on WhatsApp' },
|
||||
'share_x': { fr: 'Partager sur X', en: 'Share on X' },
|
||||
'share_facebook': { fr: 'Partager sur Facebook', en: 'Share on Facebook' },
|
||||
'share_linkedin': { fr: 'Partager sur LinkedIn', en: 'Share on LinkedIn' },
|
||||
// Blog
|
||||
loading: { fr: "Chargement…", en: "Loading…" },
|
||||
read_article: { fr: "Lire l'article", en: "Read article" },
|
||||
'loading': { fr: 'Chargement…', en: 'Loading…' },
|
||||
'read_article': { fr: "Lire l'article", en: 'Read article' },
|
||||
// Play
|
||||
play: { fr: "Jouer", en: "Play" },
|
||||
coming_soon: { fr: "Coming soon", en: "Coming soon" },
|
||||
'play': { fr: 'Jouer', en: 'Play' },
|
||||
'coming_soon': { fr: 'Coming soon', en: 'Coming soon' },
|
||||
// Header
|
||||
close_menu: { fr: "Fermer le menu", en: "Close menu" },
|
||||
open_menu: { fr: "Ouvrir le menu", en: "Open menu" },
|
||||
'close_menu': { fr: 'Fermer le menu', en: 'Close menu' },
|
||||
'open_menu': { fr: 'Ouvrir le menu', en: 'Open menu' },
|
||||
// Footer
|
||||
location: { fr: "Adresse", en: "Location" },
|
||||
contact: { fr: "Contactez-nous", en: "Contact" },
|
||||
follow_us: { fr: "Suivez-nous", en: "Follow us" },
|
||||
newsletter_heading: {
|
||||
fr: "Inscrivez-vous à notre newsletter !",
|
||||
en: "Subscribe to our newsletter!",
|
||||
},
|
||||
newsletter_placeholder: { fr: "Votre email", en: "Enter your email" },
|
||||
newsletter_submit: { fr: "S'inscrire", en: "Subscribe" },
|
||||
newsletter_success: {
|
||||
fr: "Merci pour votre inscription !",
|
||||
en: "Thank you for subscribing!",
|
||||
},
|
||||
newsletter_error: {
|
||||
fr: "Une erreur est survenue.",
|
||||
en: "An error occurred.",
|
||||
},
|
||||
copyright: {
|
||||
fr: "World Game © {year}. Tous droits réservés.",
|
||||
en: "World Game © {year}. All rights reserved.",
|
||||
},
|
||||
legal: { fr: "Mentions légales", en: "Legal notice" },
|
||||
cookies: { fr: "Préférences cookies", en: "Cookie preferences" },
|
||||
privacy: { fr: "Confidentialité", en: "Privacy" },
|
||||
'location': { fr: 'Adresse', en: 'Location' },
|
||||
'contact': { fr: 'Contact', en: 'Contact' },
|
||||
'follow_us': { fr: 'Réseaux', en: 'Follow us' },
|
||||
'newsletter_heading': { fr: 'Inscrivez-vous à notre newsletter !', en: 'Subscribe to our newsletter!' },
|
||||
'newsletter_placeholder': { fr: 'Votre email', en: 'Enter your email' },
|
||||
'newsletter_submit': { fr: "S'inscrire", en: 'Subscribe' },
|
||||
'newsletter_success': { fr: 'Merci pour votre inscription !', en: 'Thank you for subscribing!' },
|
||||
'newsletter_error': { fr: 'Une erreur est survenue.', en: 'An error occurred.' },
|
||||
'copyright': { fr: 'World Game © {year}. Tous droits réservés.', en: 'World Game © {year}. All rights reserved.' },
|
||||
'legal': { fr: 'Mentions légales', en: 'Legal notice' },
|
||||
'cookies': { fr: 'Préférences cookies', en: 'Cookie preferences' },
|
||||
'privacy': { fr: 'Confidentialité', en: 'Privacy' },
|
||||
// Menu
|
||||
menu: { fr: "MENU", en: "MENU" },
|
||||
connect: { fr: "CONNECT", en: "CONNECT" },
|
||||
address: { fr: "ADRESSE", en: "LOCATION" },
|
||||
mail: { fr: "MAIL", en: "MAIL" },
|
||||
socials: { fr: "RÉSEAUX", en: "SOCIALS" },
|
||||
};
|
||||
'menu': { fr: 'MENU', en: 'MENU' },
|
||||
'connect': { fr: 'CONNECT', en: 'CONNECT' },
|
||||
'address': { fr: 'ADRESSE', en: 'LOCATION' },
|
||||
'mail': { fr: 'MAIL', en: 'MAIL' },
|
||||
'socials': { fr: 'RÉSEAUX', en: 'SOCIALS' },
|
||||
}
|
||||
|
||||
export function t(key, vars = {}) {
|
||||
const lang = locale.current;
|
||||
let str = dict[key]?.[lang] ?? dict[key]?.fr ?? key;
|
||||
const lang = locale.current
|
||||
let str = dict[key]?.[lang] ?? dict[key]?.fr ?? key
|
||||
for (const [k, v] of Object.entries(vars)) {
|
||||
str = str.replace(`{${k}}`, v);
|
||||
str = str.replace(`{${k}}`, v)
|
||||
}
|
||||
return str;
|
||||
return str
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,15 +1,12 @@
|
|||
let isMenuOpen = $state(false)
|
||||
let isLoading = $state(false)
|
||||
let isScrolled = $state(false)
|
||||
|
||||
export const navigation = {
|
||||
get isMenuOpen() { return isMenuOpen },
|
||||
get isLoading() { return isLoading },
|
||||
get isScrolled() { return isScrolled },
|
||||
|
||||
toggleMenu: () => isMenuOpen = !isMenuOpen,
|
||||
openMenu: () => isMenuOpen = true,
|
||||
closeMenu: () => isMenuOpen = false,
|
||||
setLoading: (value) => isLoading = value,
|
||||
setScrolled: (value) => isScrolled = value,
|
||||
setLoading: (value) => isLoading = value
|
||||
}
|
||||
|
|
|
|||
|
|
@ -53,18 +53,3 @@
|
|||
grid-area: 1/16 / span 20 / span 1;
|
||||
height: 150%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 700px) {
|
||||
.mobile-only {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 700px) {
|
||||
.mobile-only {
|
||||
display: inherit;
|
||||
}
|
||||
.desktop-only {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
<script>
|
||||
import { onMount } from 'svelte'
|
||||
import { slides } from '@state/slides.svelte'
|
||||
import { navigation } from '@state/navigation.svelte'
|
||||
import { createScrollNav } from '@composables/useScrollNav.svelte.js'
|
||||
|
||||
let { data } = $props()
|
||||
|
|
@ -33,10 +32,6 @@
|
|||
const items = $derived(data?.items ?? [])
|
||||
const itemCount = $derived(items.length)
|
||||
|
||||
$effect(() => {
|
||||
if (isActive) navigation.setScrolled(currentItem > 0)
|
||||
})
|
||||
|
||||
const segmentEnds = $derived(
|
||||
itemCount > 0 && videoDuration > 0
|
||||
? Array.from({ length: itemCount }, (_, i) => videoDuration * (i + 1) / itemCount)
|
||||
|
|
@ -352,7 +347,6 @@
|
|||
/* Individual text items */
|
||||
.expertise-item {
|
||||
font-size: var(--font-size-expertise);
|
||||
font-weight: 350;
|
||||
color: var(--color-text);
|
||||
text-align: left;
|
||||
line-height: 1.4;
|
||||
|
|
@ -381,7 +375,6 @@
|
|||
|
||||
.expertise-item {
|
||||
font-size: var(--font-size-expertise-mobile);
|
||||
transform: scale(0.75) translateX(2rem);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
<script>
|
||||
import { onMount } from 'svelte'
|
||||
import { slides } from '@state/slides.svelte'
|
||||
import { navigation } from '@state/navigation.svelte'
|
||||
import { createScrollNav } from '@composables/useScrollNav.svelte.js'
|
||||
import GalleryAnimation from '@components/ui/GalleryAnimation.svelte'
|
||||
import ResponsivePicture from '@components/ui/ResponsivePicture.svelte'
|
||||
|
|
@ -18,10 +17,6 @@
|
|||
const backgroundImage = $derived(data?.backgroundImage ?? null)
|
||||
const currentProject = $derived(projects[currentIndex] ?? null)
|
||||
|
||||
$effect(() => {
|
||||
if (isActive) navigation.setScrolled(currentIndex > 0)
|
||||
})
|
||||
|
||||
// Capture du hash synchrone avant que tout effect puisse le modifier
|
||||
const initialHash = window.location.hash.slice(1)
|
||||
|
||||
|
|
@ -84,10 +79,6 @@
|
|||
})
|
||||
</script>
|
||||
|
||||
<div class="portfolio-gallery mobile-only" aria-hidden="true">
|
||||
<GalleryAnimation images={currentProject.imagesGallery} backgroundColor={currentProject.galleryBackgroundColor} />
|
||||
</div>
|
||||
|
||||
<section
|
||||
class="portfolio golden-grid"
|
||||
style={backgroundImage ? `--background-image: url('${backgroundImage}')` : ''}
|
||||
|
|
@ -104,8 +95,8 @@
|
|||
<div class="vertical-line-end" aria-hidden="true"></div>
|
||||
|
||||
{#if currentProject}
|
||||
<!-- Galerie animation (gauche desktop / plein écran mobile) -->
|
||||
<div class="portfolio-gallery desktop-only" aria-hidden="true">
|
||||
<!-- Galerie animation (gauche) -->
|
||||
<div class="portfolio-gallery" aria-hidden="true">
|
||||
<GalleryAnimation images={currentProject.imagesGallery} backgroundColor={currentProject.galleryBackgroundColor} />
|
||||
</div>
|
||||
|
||||
|
|
@ -120,7 +111,6 @@
|
|||
cls="portfolio-mockup-img"
|
||||
/>
|
||||
</div>
|
||||
<img class="content-background mobile-only" src="/assets/img/BG GAME MOBILE.408a3a253492f65d39f8.png" alt="">
|
||||
|
||||
<!-- Infos projet (droite) -->
|
||||
<div class="portfolio-text" aria-live="polite">
|
||||
|
|
@ -140,7 +130,7 @@
|
|||
</div>
|
||||
{/if}
|
||||
|
||||
<!-- Sidebar navigation -->
|
||||
<!-- Sidebar navigation (extrême droite) -->
|
||||
<nav class="portfolio-nav" aria-label="Projets">
|
||||
<ul role="list">
|
||||
{#each projects as project, i}
|
||||
|
|
@ -159,27 +149,11 @@
|
|||
{/each}
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<!-- Arrows + counter -->
|
||||
<div class="portfolio-arrows font-face-danzza" aria-label="Navigation projets">
|
||||
<button
|
||||
class="portfolio-arrow portfolio-arrow--up"
|
||||
aria-label="Projet précédent"
|
||||
disabled={currentIndex === 0}
|
||||
onclick={() => { if (currentIndex > 0) { currentIndex--; setAnchor(currentIndex) } }}
|
||||
></button>
|
||||
<button
|
||||
class="portfolio-arrow portfolio-arrow--down"
|
||||
aria-label="Projet suivant"
|
||||
disabled={currentIndex >= projects.length - 1}
|
||||
onclick={() => { if (currentIndex < projects.length - 1) { currentIndex++; setAnchor(currentIndex) } }}
|
||||
></button>
|
||||
<span class="portfolio-counter">{String(currentIndex + 1).padStart(2, '0')}/{String(projects.length).padStart(2, '0')}</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
.portfolio {
|
||||
background-color: #000;
|
||||
background-image: var(--background-image, none);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
|
|
@ -316,160 +290,28 @@
|
|||
border-radius: 8px;
|
||||
}
|
||||
|
||||
/* Arrows + counter */
|
||||
.portfolio-arrows {
|
||||
grid-area: 18/16 / span 2 / span 3;
|
||||
z-index: var(--z-content);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 4px;
|
||||
color: white;
|
||||
font-size: var(--font-size-caption);
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.portfolio-arrow {
|
||||
width: 13px;
|
||||
min-width: 13px;
|
||||
height: 13px;
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
padding: 0;
|
||||
opacity: 0.8;
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
|
||||
.portfolio-arrow:disabled {
|
||||
opacity: 0.3;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.portfolio-arrow--up {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='white' stroke-width='2'%3E%3Cpath d='M2 8L6 4L10 8'/%3E%3C/svg%3E");
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.portfolio-arrow--down {
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='white' stroke-width='2'%3E%3Cpath d='M2 4L6 8L10 4'/%3E%3C/svg%3E");
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.portfolio-counter {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* Mobile (≤ 700px) */
|
||||
@media (max-width: 700px) {
|
||||
|
||||
.portfolio {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* Gallery over background, under content */
|
||||
.portfolio-gallery {
|
||||
position: fixed;
|
||||
transform: translateX(-10vw);
|
||||
width: 120vw;
|
||||
opacity: 0.8;
|
||||
z-index: 1;
|
||||
grid-area: 1/1 / span 20 / span 20;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.content-background {
|
||||
position: fixed;
|
||||
top: -7rem;
|
||||
width: 100vw;
|
||||
height: auto;
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
/* Mockup — centered top, behind text */
|
||||
.portfolio-mockup {
|
||||
grid-area: 4/4 / span 8 / span 14;
|
||||
grid-area: 3/4 / span 8 / span 14;
|
||||
z-index: var(--z-content);
|
||||
}
|
||||
|
||||
.portfolio-mockup :global(.portfolio-mockup-img) {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Text — over mockup, centered */
|
||||
.portfolio-text {
|
||||
grid-area: 9/3 / span 7 / span 16;
|
||||
grid-area: 9/3 / span 6 / span 16;
|
||||
z-index: var(--z-content);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.portfolio-text h2 {
|
||||
font-family: "Danzza Bold";
|
||||
font-size: var(--font-size-title-section-mobile);
|
||||
}
|
||||
|
||||
.portfolio-catchphrase {
|
||||
font-size: var(--font-size-subtitle-mobile);
|
||||
}
|
||||
|
||||
.portfolio-description {
|
||||
font-size: var(--font-size-paragraph-mobile);
|
||||
}
|
||||
|
||||
/* Hide keywords on mobile */
|
||||
.portfolio-keywords {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Nav thumbnails — horizontal, compact */
|
||||
.portfolio-nav {
|
||||
grid-area: 17/4 / span 1 / span 14;
|
||||
grid-area: 17/4 / span 2 / span 14;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-right: 0;
|
||||
height: 75px;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.portfolio-nav-item:not(:last-child) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.portfolio-nav-item button {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.portfolio-nav-item.active button {
|
||||
transform: scale(1.15);
|
||||
}
|
||||
|
||||
.portfolio-nav-item:hover button {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.portfolio-nav-item img {
|
||||
width: 45px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.portfolio-nav-number {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Arrows — bottom right */
|
||||
.portfolio-arrows {
|
||||
grid-area: 18/15 / span 1 / span 3;
|
||||
font-size: var(--font-size-caption-mobile, 11px);
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablet (701px–912px) */
|
||||
@media (min-width: 701px) and (max-width: 912px) {
|
||||
.portfolio-text h2 {
|
||||
font-size: var(--font-size-title-main-tablet);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue