"ഫലകം:Listofdistricts2/styles.css" എന്ന താളിന്റെ പതിപ്പുകൾ തമ്മിലുള്ള വ്യത്യാസം
ദൃശ്യരൂപം
No edit summary |
No edit summary |
||
| വരി 1: | വരി 1: | ||
.district-items p { | |||
.district-items { | |||
display: flex; | display: flex; | ||
flex-wrap: wrap; | flex-wrap: wrap; | ||
gap: 12px; | gap: 12px; | ||
margin | margin: 0; /* remove default paragraph spacing */ | ||
} | } | ||
.district-items p a { | |||
.district-items a | flex: 1 1 calc(25% - 12px); /* 4 per row */ | ||
flex: 1 1 calc(25% - 12px); /* 4 per row | |||
box-sizing: border-box; | box-sizing: border-box; | ||
background: #ffffff; | background: #ffffff; | ||
| വരി 18: | വരി 13: | ||
border-radius: 8px; | border-radius: 8px; | ||
padding: 15px 10px; | padding: 15px 10px; | ||
text-align: center; | |||
text-decoration: none; | |||
color: #004EC3; | color: #004EC3; | ||
font-size: 1rem; | font-size: 1rem; | ||
display: flex; | display: flex; | ||
justify-content: center; | justify-content: center; | ||
align-items: center; | |||
transition: all 0.25s ease; | transition: all 0.25s ease; | ||
} | } | ||
.district-items p a:hover { | |||
.district-items a | |||
background: #81bffc; | background: #81bffc; | ||
color: #ffffff; | color: #ffffff; | ||
transform: translateY(-2px); | transform: translateY(-2px); | ||
border-color: #004ec3; | border-color: #004ec3; | ||
font-weight: bold; | font-weight: bold; | ||
} | } | ||
/* Responsive */ | |||
/* Responsive | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.district-items a | .district-items p a { | ||
flex: 1 1 calc(45% - 12px); | flex: 1 1 calc(45% - 12px); | ||
} | } | ||
} | } | ||
@media (max-width: 480px) { | @media (max-width: 480px) { | ||
.district-items a | .district-items p a { | ||
flex: 1 1 100%; | flex: 1 1 100%; | ||
} | } | ||
} | } | ||
11:30, 30 സെപ്റ്റംബർ 2025-നു നിലവിലുണ്ടായിരുന്ന രൂപം
.district-items p {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin: 0; /* remove default paragraph spacing */
}
.district-items p a {
flex: 1 1 calc(25% - 12px); /* 4 per row */
box-sizing: border-box;
background: #ffffff;
border: 2px solid #0073e6;
border-radius: 8px;
padding: 15px 10px;
text-align: center;
text-decoration: none;
color: #004EC3;
font-size: 1rem;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.25s ease;
}
.district-items p a:hover {
background: #81bffc;
color: #ffffff;
transform: translateY(-2px);
border-color: #004ec3;
font-weight: bold;
}
/* Responsive */
@media (max-width: 768px) {
.district-items p a {
flex: 1 1 calc(45% - 12px);
}
}
@media (max-width: 480px) {
.district-items p a {
flex: 1 1 100%;
}
}