banquise/website-front
13
0
Fork 0
Code Issues 2 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fix build
Some checks failed
Build / build-check (pull_request) Failing after 33s
Details

Browse Source
This commit is contained in:
Sacha VAUDEY 2025-09-14 12:10:42 +02:00
parent ff63b5958a
commit 54d419d17a
5 changed files with 79 additions and 151 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
banquise-website/app/globals.css
View File

@ -1,6 +1,23 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@import "tailwindcss";
/* Configuration Tailwind v4 via CSS custom properties */
@layer base {
:root {
--font-heading: 'Dela Gothic One', sans-serif;
--font-body: 'Roboto', sans-serif;
/* Couleurs personnalisées La Banquise */
--color-banquise-blue: 64, 180, 255; /* RGB for reuse in rgba() */
--color-banquise-blue-hex: #40B4FF;
--color-banquise-blue-dark: 31, 93, 137;
--color-banquise-blue-dark-hex: #1F5D89;
--color-banquise-blue-light: 105, 183, 226;
--color-banquise-blue-light-hex: #69B7E2;
--color-banquise-blue-lightest: 165, 240, 255;
--color-banquise-blue-lightest-hex: #A5F0FF;
--color-banquise-gray: #F6F6F6;
}
}
/* Variables CSS pour les polices et couleurs personnalisées */
:root {

2
banquise-website/app/layout.tsx
View File

@ -1,4 +1,4 @@
import './globals-test.css'
import './globals.css'
import type { ReactNode } from 'react'
export const metadata = {

55
banquise-website/app/test-tailwind/page.tsx Normal file
View File

@ -0,0 +1,55 @@
"use client"
export default function TestTailwind() {
return (
<div className="min-h-screen bg-gray-100 p-8">
<div className="max-w-2xl mx-auto">
<h1 className="text-4xl font-bold text-blue-600 mb-8">Test Tailwind CSS v4</h1>
<div className="space-y-6">
{/* Test des couleurs de base */}
<div className="bg-white p-6 rounded-lg shadow-lg">
<h2 className="text-2xl font-semibold mb-4">Couleurs de base</h2>
<div className="grid grid-cols-4 gap-4">
<div className="h-16 bg-red-500 rounded flex items-center justify-center text-white">Red</div>
<div className="h-16 bg-blue-500 rounded flex items-center justify-center text-white">Blue</div>
<div className="h-16 bg-green-500 rounded flex items-center justify-center text-white">Green</div>
<div className="h-16 bg-yellow-500 rounded flex items-center justify-center text-black">Yellow</div>
</div>
</div>
{/* Test des espacements */}
<div className="bg-white p-6 rounded-lg shadow-lg">
<h2 className="text-2xl font-semibold mb-4">Espacements</h2>
<div className="space-y-2">
<div className="p-2 bg-gray-200">p-2</div>
<div className="p-4 bg-gray-300">p-4</div>
<div className="p-6 bg-gray-400">p-6</div>
</div>
</div>
{/* Test des couleurs personnalisées */}
<div className="bg-white p-6 rounded-lg shadow-lg">
<h2 className="text-2xl font-semibold mb-4">Couleurs personnalisées Banquise</h2>
<div className="space-y-2">
<div className="text-banquise-blue p-2">Texte banquise-blue</div>
<div className="bg-banquise-blue text-white p-2 rounded">Background banquise-blue</div>
<div className="text-banquise-blue-dark p-2">Texte banquise-blue-dark</div>
<div className="bg-banquise-blue-dark text-white p-2 rounded">Background banquise-blue-dark</div>
</div>
</div>
{/* Test des animations */}
<div className="bg-white p-6 rounded-lg shadow-lg">
<h2 className="text-2xl font-semibold mb-4">Animations</h2>
<div className="space-y-4">
<div className="animate-pulse bg-blue-200 p-4 rounded">Pulse animation</div>
<div className="animate-bounce bg-green-200 p-4 rounded inline-block">Bounce animation</div>
<div className="animate-gentle-float bg-yellow-200 p-4 rounded inline-block">Custom gentle float</div>
</div>
</div>
</div>
</div>
</div>
);
}

16
banquise-website/postcss.config.js
View File

@ -1,17 +1,7 @@
module.exports = {module.exports = {module.exports = {
export default {
plugins: {
tailwindcss: {}, plugins: [ plugins: {
'@tailwindcss/postcss': {},
autoprefixer: {},
}, 'tailwindcss', '@tailwindcss/postcss': {},
},
}
'autoprefixer', autoprefixer: {},
], },
}};

134
banquise-website/tailwind.config.js
View File

@ -1,134 +0,0 @@
export default {/** @type {import('tailwindcss').Config} *//** @type {import('tailwindcss').Config} *//** @type {import('tailwindcss').Config} */
content: [
'./app/**/*.{js,ts,jsx,tsx}',module.exports = {
'./components/**/*.{js,ts,jsx,tsx}',
'./lib/**/*.{js,ts,jsx,tsx}', content: [module.exports = {export default {
],
} './app/**/*.{js,ts,jsx,tsx,mdx}',
'./pages/**/*.{js,ts,jsx,tsx,mdx}', content: [ content: [
'./components/**/*.{js,ts,jsx,tsx,mdx}',
'./lib/**/*.{js,ts,jsx,tsx,mdx}', './app/**/*.{js,ts,jsx,tsx,mdx}', './app/**/*.{ts,tsx,js,jsx}',
],
theme: { './pages/**/*.{js,ts,jsx,tsx,mdx}', './components/**/*.{ts,tsx,js,jsx}',
extend: {
fontFamily: { './components/**/*.{js,ts,jsx,tsx,mdx}', './lib/**/*.{ts,tsx,js,jsx}',
heading: ['var(--font-heading)'],
body: ['var(--font-body)'], './pages/**/*.{ts,tsx,js,jsx}',
},
colors: { // Or if using `src` directory: './src/**/*.{ts,tsx,js,jsx}',
banquise: {
blue: '#40B4FF', './src/**/*.{js,ts,jsx,tsx,mdx}', './public/index.html',
'blue-dark': '#1F5D89',
'blue-light': '#69B7E2', ], ],
'blue-lightest': '#A5F0FF',
gray: '#F6F6F6', theme: { theme: {
},
}, extend: {}, extend: {
keyframes: {
float: { }, fontFamily: {
'0%, 100%': { transform: 'translateY(0)' },
'50%': { transform: 'translateY(-10px)' }, plugins: [], heading: ['var(--font-heading)'],
},
'bubble-float-1': {} body: ['var(--font-body)'],
'0%, 100%': { transform: 'translateY(0) translateX(0)' }, },
'33%': { transform: 'translateY(-15px) translateX(5px)' }, colors: {
'66%': { transform: 'translateY(-8px) translateX(-3px)' }, banquise: {
}, blue: '#40B4FF',
'ocean-shimmer': { 'blue-dark': '#1F5D89',
'0%, 100%': { opacity: '0.3', transform: 'scale(1)' }, 'blue-light': '#69B7E2',
'50%': { opacity: '0.6', transform: 'scale(1.05)' }, 'blue-lightest': '#A5F0FF',
}, gray: '#F6F6F6',
'gentle-float': { },
'0%, 100%': { transform: 'translateY(0) rotate(0deg)' }, },
'50%': { transform: 'translateY(-15px) rotate(1deg)' }, keyframes: {
}, float: {
slideUp: { '0%, 100%': { transform: 'translateY(0)' },
'0%': { opacity: '0', transform: 'translateY(10px)' }, '50%': { transform: 'translateY(-10px)' },
'100%': { opacity: '1', transform: 'translateY(0)' }, },
}, 'bubble-float-1': {
}, '0%, 100%': { transform: 'translateY(0) translateX(0)' },
animation: { '33%': { transform: 'translateY(-15px) translateX(5px)' },
float: 'float 3s ease-in-out infinite', '66%': { transform: 'translateY(-8px) translateX(-3px)' },
'bubble-1': 'bubble-float-1 4s ease-in-out infinite', },
'ocean-shimmer': 'ocean-shimmer 2s ease-in-out infinite', 'ocean-shimmer': {
'gentle-float': 'gentle-float 6s ease-in-out infinite', '0%, 100%': { opacity: '0.3', transform: 'scale(1)' },
slideUp: 'slideUp 0.3s ease-out', '50%': { opacity: '0.6', transform: 'scale(1.05)' },
}, },
}, 'gentle-float': {
}, '0%, 100%': { transform: 'translateY(0) rotate(0deg)' },
plugins: [], '50%': { transform: 'translateY(-15px) rotate(1deg)' },
} },
slideUp: {
'0%': { opacity: '0', transform: 'translateY(10px)' },
'100%': { opacity: '1', transform: 'translateY(0)' },
},
},
animation: {
float: 'float 3s ease-in-out infinite',
'bubble-1': 'bubble-float-1 4s ease-in-out infinite',
'ocean-shimmer': 'ocean-shimmer 2s ease-in-out infinite',
'gentle-float': 'gentle-float 6s ease-in-out infinite',
slideUp: 'slideUp 0.3s ease-out',
},
},
},
};