Weather App Project JavaScript | CodingNepal /* CSS styles */ * { margin: 0; padding: 0; box-sizing: border-box; font-family: ‘Segoe UI’, Tahoma, Geneva, Verdana, sans-serif; } body { background-color: #f7f7f7; /* Light gray background */ color: #333; /* Dark text color */ } .container { max-width: 800px; margin: auto; padding: 20px; } .weather-cards { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: space-between; } .card { background-color: #fff; /* White background for cards */ border-radius: 10px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); padding: 20px; margin-bottom: 20px; min-width: calc(33% - 20px); text-align: center; transition: transform 0.3s ease; } .card:hover { transform: translateY(-10px); } .card h3 { font-size: 1.2rem; margin-bottom: 10px; } .card img { display: block; margin: 0 auto 10px; width: 60px; } .card h6 { margin: 10px 0; font-size: 1rem; } @media screen and (max-width: 768px) { .card { min-width: calc(50% - 20px); } } @media screen and (max-width: 480px) { .card { min-width: calc(100% - 20px); } }
الطقس في دبي
آخر تعديل: 12/12/2024
الكاتب: user