From 148b240bb72d2f2ccf0c46d52b5dc4472e277648 Mon Sep 17 00:00:00 2001 From: el-yazide mohamed Date: Fri, 28 Mar 2025 16:57:12 +0100 Subject: [PATCH] assets index.html loop --- assets/index.html | 33 +++++++++++++++ assets/script.js | 1 + assets/styles.css | 104 ++++++++++++++++++++++++++++++++++++++++++++++ server.js | 3 +- 4 files changed, 140 insertions(+), 1 deletion(-) create mode 100644 assets/index.html create mode 100644 assets/script.js create mode 100644 assets/styles.css diff --git a/assets/index.html b/assets/index.html new file mode 100644 index 0000000..81a88a0 --- /dev/null +++ b/assets/index.html @@ -0,0 +1,33 @@ + + + + + + + LOOP + + + + + + +
+ +
+ +

Let your favorite songs play on LOOP.

+ + +
+ + + +
+ +

Don't have an account ? Sign up now.

+ + + + + + diff --git a/assets/script.js b/assets/script.js new file mode 100644 index 0000000..b8d1d52 --- /dev/null +++ b/assets/script.js @@ -0,0 +1 @@ +console.log( 'hello') \ No newline at end of file diff --git a/assets/styles.css b/assets/styles.css new file mode 100644 index 0000000..d53a573 --- /dev/null +++ b/assets/styles.css @@ -0,0 +1,104 @@ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap'); +*{ + margin: 0; + padding: 0; + font-family: 'Poppins', sans-serif; + box-sizing: border-box; + +} + + @media (min-width: 768px) { /* Écran plus large (tablette, PC) */ + .container { + flex-direction: row; + justify-content: space-around; + } + } + + /* Par défaut, style mobile */ + body { + font-size: 16px; + background: linear-gradient(to bottom, #ffa600, #dd3000); + display: grid; + place-items: center; /* Centre horizontalement et verticalement */ + height: 100vh; + margin: 0; + } + + /* Quand l'écran est large (ex : tablette ou ordinateur) */ + @media (min-width: 768px) { + body { + font-size: 18px; + } + } + + + +.logo{ + margin-top: 40px; + max-width: 180px; +} + +.container { + display: flex; + flex-direction: column; + align-items: center; + } + +h1 { + color: #ffffff; + font-size: 70%; +} + +h2 { + color: #ffffff; + font-size: 40%; +} + +.orange { + color: #ffa600; + text-decoration: none; +} + +.orange:hover { + text-decoration: underline; +} + +.login-container { + background: white; + padding: 20px; + border-radius: 30px; + box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); + width: 300px; + height: 400px; + text-align: center +} + +/* Champs de texte */ +.login-container input { + width: 100%; + padding: 10px; + margin: 10px 0; + border: 1px solid #ccc; + border-radius: 50px; + font-size: 16px; +} + +/* Bouton */ +.login-container button { + width: 100%; + padding: 10px; + background-color:#ffa600; + color: white; + border: none; + border-radius: 50px; + font-size: 18px; + cursor: pointer; + transition: background 0.3s ease; +} + +.login-container button:hover { + background-color: #dd3000; +} + + + \ No newline at end of file diff --git a/server.js b/server.js index a57883c..cb5c096 100644 --- a/server.js +++ b/server.js @@ -15,7 +15,8 @@ app.use(express.static('assets')) app.get('/', (req, res) => { // res.send('Hello World!') - res.render('index', { title: 'Hey', message: 'Hello there PUG!' }) + // res.render('index', { title: 'Hey', message: 'Hello there PUG!' }) + res.sendFile('index.html'); }) io.on('connection', (socket) => {