Skip to content
Snippets Groups Projects
Commit 222a8ff5 authored by oumaima laklouch's avatar oumaima laklouch
Browse files

Update index.html

parent a0d6d3f5
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
Showing
with 100 additions and 0 deletions
public/index.html
+ 100
− 0
View file @ 222a8ff5
...@@ -4,6 +4,106 @@ ...@@ -4,6 +4,106 @@
<title>Connect4 - Lobby</title> <title>Connect4 - Lobby</title>
<style> <style>
/* Add CSS styles for lobby */ /* Add CSS styles for lobby */
body {
margin: 0;
padding: 0;
background: linear-gradient(135deg, #2c3e50, #3498db);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
color: white;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
min-height: 100vh;
}
h1 {
margin: 30px 0 10px;
font-size: 3rem;
letter-spacing: 2px;
}
#login {
margin-bottom: 20px;
}
#nameInput {
padding: 10px 20px;
border-radius: 10px;
border: none;
font-size: 1rem;
width: 250px;
}
#rooms {
width: 80%;
max-width: 800px;
margin: 20px auto;
}
#rooms h2 {
font-size: 2rem;
margin-bottom: 10px;
}
#roomList {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 15px;
margin-top: 10px;
}
.room {
background-color: rgba(255, 255, 255, 0.1);
border-radius: 12px;
padding: 15px;
box-shadow: 0 0 10px rgba(0,0,0,0.3);
}
.room span {
display: block;
margin-bottom: 8px;
font-weight: bold;
}
.room button {
background-color: #e67e22;
border: none;
padding: 8px 16px;
border-radius: 8px;
color: white;
font-weight: bold;
cursor: pointer;
transition: background 0.3s;
}
.room button:hover {
background-color: #d35400;
}
#hall-of-fame {
margin-top: 40px;
width: 80%;
max-width: 600px;
}
#hall-of-fame h2 {
font-size: 1.8rem;
margin-bottom: 10px;
}
#hof-list {
list-style: none;
padding: 0;
}
#hof-list li {
margin: 5px 0;
background-color: rgba(255, 255, 255, 0.1);
padding: 8px 12px;
border-radius: 8px;
}
</style> </style>
</head> </head>
<body> <body>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment