donner le fichier css du component question-list.component.ts
Here's the CSS file for the question-list.component.ts:
.container {
padding: 30px 15px;
h2 {
color: #3f51b5;
margin-bottom: 0;
font-weight: 500;
}
.text-right {
text-align: right;
}
.btn-primary {
background-color: #3f51b5;
border-color: #3f51b5;
&:hover {
background-color: #303f9f;
border-color: #303f9f;
}
i {
margin-right: 8px;
}
}
.card {
border-radius: 8px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
margin-top: 20px;
.card-header {
padding: 15px 20px;
background-color: #f8f9fa;
border-bottom: 1px solid #e0e0e0;
h5 {
margin: 0;
font-weight: 500;
color: #3f51b5;
}
}
.card-body {
padding: 20px;
}
}
.form-group {
margin-bottom: 15px;
label {
font-weight: 500;
margin-bottom: 8px;
display: block;
color: #555;
}
.form-control {
height: 40px;
border-radius: 4px;
border: 1px solid #ced4da;
&:focus {
border-color: #3f51b5;
box-shadow: 0 0 0 0.2rem rgba(63, 81, 181, 0.25);
}
}
}
.table {
margin-bottom: 0;
th {
font-weight: 500;
color: #555;
border-top: none;
}
td {
vertical-align: middle;
}
}
.badge {
padding: 5px 10px;
font-weight: 500;
border-radius: 4px;
}
.badge-success {
background-color: #4caf50;
}
.badge-warning {
background-color: #ff9800;
}
.badge-danger {
background-color: #f44336;
}
.badge-secondary {
background-color: #757575;
}
.btn-group {
.btn {
padding: 5px 10px;
margin-right: 5px;
&:last-child {
margin-right: 0;
}
i {
font-size: 14px;
}
}
.btn-primary {
background-color: #3f51b5;
border-color: #3f51b5;
&:hover {
background-color: #303f9f;
border-color: #303f9f;
}
}
.btn-danger {
background-color: #f44336;
border-color: #f44336;
&:hover {
background-color: #d32f2f;
border-color: #d32f2f;
}
}
}
.alert-info {
background-color: #e3f2fd;
color: #0d47a1;
border-color: #bbdefb;
padding: 15px;
border-radius: 4px;
margin-top: 20px;
}
.table-responsive {
overflow-x: auto;
}
@media (max-width: 768px) {
.text-right {
text-align: left;
margin-top: 15px;
}
.row {
margin-bottom: 0;
.col-md-4 {
margin-bottom: 15px;
}
}
.btn-group .btn {
padding: 4px 8px;
i {
font-size: 12px;
}
}
}
}This SCSS file provides styling for the question list component, including:
The styles follow the same design patterns as the other components in your project, maintaining consistency throughout the application.
donner le fichier css du component candidate-list.component.ts
Here's the CSS file for the candidate-list.component.ts:
.container {
padding: 30px 15px;
h2 {
color: #3f51b5;
margin-bottom: 0;
font-weight: 500;
}
.text-right {
text-align: right;
}
.btn-primary {
background-color: #3f51b5;
border-color: #3f51b5;
&:hover {
background-color: #303f9f;
border-color: #303f9f;
}
i {
margin-right: 8px;
}
}
.card {
border-radius: 8px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
margin-top: 20px;
.card-body {
padding: 20px;
}
}
.table {
margin-bottom: 0;
th {
font-weight: 500;
color: #555;
border-top: none;
}
td {
vertical-align: middle;
}
}
.btn-group {
.btn {
padding: 5px 10px;
margin-right: 5px;
&:last-child {
margin-right: 0;
}
i {
font-size: 14px;
}
}
.btn-info {
background-color: #2196f3;
border-color: #2196f3;
&:hover {
background-color: #1976d2;
border-color: #1976d2;
}
}
.btn-primary {
background-color: #3f51b5;
border-color: #3f51b5;
&:hover {
background-color: #303f9f;
border-color: #303f9f;
}
}
.btn-danger {
background-color: #f44336;
border-color: #f44336;
&:hover {
background-color: #d32f2f;
border-color: #d32f2f;
}
}
}
.alert-info {
background-color: #e3f2fd;
color: #0d47a1;
border-color: #bbdefb;
padding: 15px;
border-radius: 4px;
margin-top: 20px;
}
.table-responsive {
overflow-x: auto;
}
@media (max-width: 768px) {
.text-right {
text-align: left;
margin-top: 15px;
}
.row {
margin-bottom: 0;
}
.btn-group .btn {
padding: 4px 8px;
i {
font-size: 12px;
}
}
.table th,
.table td {
padding: 10px 8px;
}
}
}This SCSS file provides styling for the candidate list component, including:
The styles maintain consistency with the other components in your project, ensuring a unified look and feel throughout the application.
donner une autre version du fichier css du dashboard admin