Specthor's picture
create a professional demographics dashboard that shows the number of male and female of both programs, the age tranches distribution and the population distribution too
ad3cc5c verified
Raw History Blame Contribute Delete
1.27 kB
/* Custom styles for the dashboard */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
body {
font-family: 'Inter', sans-serif;
}
/* Chart container styling */
.chart-container {
position: relative;
height: 100%;
width: 100%;
}
/* Custom scrollbar */
::-webkit-scrollbar {
width: 6px;
height: 6px;
}
::-webkit-scrollbar-track {
background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
background: #c1c1c1;
border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
background: #a8a8a8;
}
/* Table styling */
table {
border-collapse: separate;
border-spacing: 0;
}
table tr th,
table tr td {
border-right: 1px solid #e5e7eb;
border-bottom: 1px solid #e5e7eb;
}
table tr th:first-child,
table tr td:first-child {
border-left: 1px solid #e5e7eb;
}
table tr th {
border-top: 1px solid #e5e7eb;
}
/* First row styling */
table tr:first-child th:first-child {
border-top-left-radius: 0.5rem;
}
table tr:first-child th:last-child {
border-top-right-radius: 0.5rem;
}
/* Last row styling */
table tr:last-child td:first-child {
border-bottom-left-radius: 0.5rem;
}
table tr:last-child td:last-child {
border-bottom-right-radius: 0.5rem;
}