You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
99 lines
1.9 KiB
99 lines
1.9 KiB
@import url(./style.css); /* Import de style.css */
|
|
@import url(./styleQuoteLittle.css);
|
|
|
|
|
|
/* Citation du jour */
|
|
|
|
.citation-du-jour {
|
|
width: 96.66vw;
|
|
padding: 0;
|
|
margin-left: 1.25vw;
|
|
overflow: hidden;
|
|
margin-bottom: 20px;
|
|
height: 150px;
|
|
transition: transform 0.3s ease;
|
|
}
|
|
|
|
/* dark-mode */
|
|
|
|
body.dark-mode .citation-du-jour {
|
|
background: var(--main-dark-gradient);
|
|
}
|
|
|
|
/* light-mode */
|
|
|
|
body.light-mode .citation-du-jour {
|
|
background: var(--main-light-gradient);
|
|
}
|
|
|
|
.citation-du-jour:hover {
|
|
transform: scale(1.02);
|
|
z-index: 5;
|
|
position: relative;
|
|
}
|
|
|
|
/* ====== PAGINATION STYLES ====== */
|
|
.pagination-container {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin: 20px 0;
|
|
}
|
|
|
|
.pagination-container select {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin: 0 10px;
|
|
padding: 5px;
|
|
font-size: 16px;
|
|
border-radius: 5px;
|
|
border: 1px solid #ccc;
|
|
}
|
|
|
|
.pagination-container button {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: var(--main-light-gradient);
|
|
border: none;
|
|
border-radius: 5px;
|
|
padding: 5px 10px;
|
|
font-size: 16px;
|
|
cursor: pointer;
|
|
transition: background 0.3s ease;
|
|
}
|
|
|
|
.pagination-container button:disabled {
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
/* Spinner style */
|
|
.spinner {
|
|
border: 4px solid rgba(0, 0, 0, 0.1);
|
|
border-left-color: #000;
|
|
border-radius: 50%;
|
|
width: 24px;
|
|
height: 24px;
|
|
animation: spin 1s linear infinite;
|
|
margin-left: 10px;
|
|
display: none;
|
|
}
|
|
|
|
@keyframes spin {
|
|
to { transform: rotate(360deg); }
|
|
}
|
|
|
|
/* Adaptation pour dark mode */
|
|
body.dark-mode .pagination-container button {
|
|
background: var(--main-dark-gradient);
|
|
color: #fff;
|
|
}
|
|
|
|
body.dark-mode .pagination-container select {
|
|
border: 1px solid #555;
|
|
background: #333;
|
|
color: #fff;
|
|
}
|