create-nexaui-electron
Version:
Create Nexa App - Tool untuk membuat aplikasi Nexa Electron
139 lines (121 loc) • 3.09 kB
CSS
/*pagination*/
.pagination-controls {
margin-bottom: 20px;
}
.pagination-controls select {
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
cursor: pointer;
}
/* Pagination Styling */
.nexa-pagination {
display: flex;
justify-content: left;
align-items: center;
margin: 20px 0;
flex-wrap: wrap;
gap: 5px;
}
.nexa-pagination .page-link {
padding: 8px 12px;
border: 1px solid #ddd;
text-decoration: none;
color: #333;
border-radius: 4px;
transition: all 0.3s ease;
cursor: pointer;
}
.nexa-pagination .page-link:hover {
background-color: #f5f5f5;
}
/* Menambahkan style untuk page-link active */
.nexa-pagination .page-link.active {
background-color: #007bff;
color: white;
border-color: #007bff;
cursor: default;
}
/* Style untuk page-link disabled */
.nexa-pagination .page-link.disabled {
color: #999;
cursor: not-allowed;
background-color: #f5f5f5;
}
.nexa-pagination .current {
background-color: #007bff;
color: white;
border-color: #007bff;
}
.nexa-pagination .page-ellipsis {
padding: 8px 12px;
color: #666;
}
.nx-pagination-info {
width: 100%;
text-align: center;
margin-top: 10px;
color: #666;
font-size: 0.9em;
}
/* Style untuk pagination */
.pagination {
display: flex;
padding-left: 0;
list-style: none;
border-radius: 0.25rem;
margin: 20px 0;
gap: 5px;
}
.pagination .page-item {
list-style: none;
}
.pagination .page-item.active .page-link {
background-color: #007bff;
border-color: #007bff;
color: white;
}
.pagination .page-item.disabled .page-link {
color: #6c757d;
pointer-events: none;
cursor: not-allowed;
background-color: #fff;
border-color: #dee2e6;
}
.pagination .page-link {
position: relative;
display: block;
padding: 0.5rem 0.75rem;
margin-left: -1px;
line-height: 1.25;
color: #007bff;
background-color: #fff;
border: 1px solid #dee2e6;
cursor: pointer;
text-decoration: none;
border-radius: 4px;
transition: all 0.2s ease-in-out;
}
.pagination .page-link:hover {
z-index: 2;
color: #0056b3;
text-decoration: none;
background-color: #e9ecef;
border-color: #dee2e6;
}
.pagination .page-link:focus {
z-index: 3;
outline: 0;
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
/* Style untuk mobile */
@media (max-width: 576px) {
.pagination {
flex-wrap: wrap;
justify-content: center;
}
.pagination .page-link {
padding: 0.4rem 0.6rem;
font-size: 14px;
}
}