mettre les défilantes colonnes adjecentes au principal div
Some checks are pending
/ test (push) Waiting to run
Some checks are pending
/ test (push) Waiting to run
This commit is contained in:
parent
55bc3e6986
commit
5c81568997
2 changed files with 22 additions and 21 deletions
|
@ -19,34 +19,35 @@
|
|||
<link rel="stylesheet" href="{{ $core.RelPermalink }}">
|
||||
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
justify-content: center; /* Center the main-screen horizontally */
|
||||
align-items: stretch; /* Ensure full height */
|
||||
min-height: 100vh; /* Ensure the body takes up the full viewport height */
|
||||
}
|
||||
|
||||
.main-screen {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
padding: 0px 10px;
|
||||
gap: 2rem;
|
||||
justify-content: space-between; /* Ensure side-screens are adjacent to main-content */
|
||||
width: auto; /* Allow the width to adjust based on content */
|
||||
max-width: 100%; /* Prevent overflow */
|
||||
gap: 0;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.side-screen {
|
||||
height: 100vh;
|
||||
overflow-y: hidden;
|
||||
width: 400px;
|
||||
min-width: 400px;
|
||||
overflow-y: auto; /* Allow scrolling if content overflows */
|
||||
flex: 0 0 400px; /* Fixed width of 400px */
|
||||
}
|
||||
|
||||
.main-content {
|
||||
position: relative;
|
||||
flex-grow: 2;
|
||||
width: 100%;
|
||||
max-width: 750px;
|
||||
flex-grow: 1; /* Take up the remaining space between side-screens */
|
||||
max-width: 750px; /* Optional: Limit max width */
|
||||
margin: 0 25px;
|
||||
}
|
||||
|
||||
.site-title {
|
||||
|
@ -71,11 +72,11 @@
|
|||
|
||||
@media (max-width: 1380px) {
|
||||
.side-screen {
|
||||
display: none;
|
||||
display: none; /* Hide side-screens on smaller screens */
|
||||
}
|
||||
|
||||
.main-screen {
|
||||
justify-content: center;
|
||||
justify-content: center; /* Center main-content when side-screens are hidden */
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
- [x] Optimiser les images de la page d'accueil
|
||||
- [x] sur la page principale, ne load que les X derniers articles dans les bandes défilantes
|
||||
- [ ] make the gradient of scrolling posts on homepage responsive to theme by swithing them
|
||||
- [ ] mettre les défilantes colonnes adjecentes au principal div
|
||||
- [x] mettre les défilantes colonnes adjecentes au principal div
|
||||
- [ ] corriger le bout gris qui dépasse dans les radius des scrolling-list-item
|
||||
|
||||
### Collection
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue