test / style.css
yaxyo's picture
Update style.css
cefd52a verified
Raw
History Blame Contribute Delete
2.18 kB
/* Asosiy sozlamalar */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Poppins", sans-serif;
}
body {
background-color: #0d0d0d;
color: #f1f1f1;
min-height: 100vh;
}
/* Header (yuqori menyu) */
header {
display: flex;
align-items: center;
justify-content: space-between;
background: #1a1a1a;
padding: 15px 40px;
box-shadow: 0 0 10px #6a0dad;
position: sticky;
top: 0;
z-index: 10;
}
.logo {
display: flex;
align-items: center;
gap: 10px;
}
.logo img {
width: 45px;
height: 45px;
border-radius: 10px;
}
.logo h1 {
color: #a855f7;
font-size: 24px;
}
/* Navigatsiya menyusi */
.nav-links {
list-style: none;
display: flex;
gap: 20px;
}
.nav-links a {
text-decoration: none;
color: #e0e0e0;
font-weight: 500;
transition: 0.3s;
}
.nav-links a:hover {
color: #a855f7;
text-shadow: 0 0 10px #a855f7;
}
/* Til tanlash menyusi */
.language-select select {
background: #262626;
color: #f1f1f1;
border: 1px solid #a855f7;
border-radius: 8px;
padding: 5px 10px;
cursor: pointer;
}
/* Asosiy qism */
main {
padding: 50px 80px;
}
.anime-list h2 {
font-size: 28px;
color: #a855f7;
margin-bottom: 20px;
text-shadow: 0 0 10px #a855f7;
}
/* Anime kartochkalari */
.anime-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 25px;
}
.anime-card {
background: #1a1a1a;
border: 1px solid #3b3b3b;
border-radius: 15px;
padding: 10px;
text-align: center;
transition: transform 0.3s, box-shadow 0.3s;
}
.anime-card:hover {
transform: translateY(-10px);
box-shadow: 0 0 20px #a855f7;
}
.anime-card img {
width: 100%;
border-radius: 10px;
}
.anime-card h3 {
margin: 10px 0;
color: #f1f1f1;
}
.anime-card button {
background: #a855f7;
border: none;
border-radius: 8px;
color: white;
padding: 8px 15px;
cursor: pointer;
font-weight: 600;
transition: 0.3s;
}
.anime-card button:hover {
background: #9333ea;
box-shadow: 0 0 15px #a855f7;
}
/* Footer */
footer {
text-align: center;
padding: 15px;
background: #1a1a1a;
color: #a0a0a0;
border-top: 1px solid #3b3b3b;
margin-top: 40px;
}