デザインの微調整
This commit is contained in:
parent
d8ca1bd993
commit
6bdc42257c
@ -90,7 +90,7 @@
|
|||||||
color: var(--font-color);
|
color: var(--font-color);
|
||||||
|
|
||||||
& .title {
|
& .title {
|
||||||
font-size: 1.25em;
|
font-size: 1.17em;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin: 4px 8px;
|
margin: 4px 8px;
|
||||||
}
|
}
|
||||||
|
@ -101,16 +101,18 @@
|
|||||||
<style>
|
<style>
|
||||||
#blog {
|
#blog {
|
||||||
display: flex;
|
display: flex;
|
||||||
margin: 2.5%;
|
margin: 25px 2.5%;
|
||||||
gap: 20px;
|
gap: 20px;
|
||||||
}
|
}
|
||||||
aside {
|
aside {
|
||||||
|
min-width: 280px;
|
||||||
|
max-width: 320px;
|
||||||
|
|
||||||
@media (width<1000px) {
|
@media (width<1000px) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
& #side {
|
& #side {
|
||||||
width: 280px;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
row-gap: 20px;
|
row-gap: 20px;
|
||||||
@ -132,6 +134,8 @@
|
|||||||
|
|
||||||
article {
|
article {
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
max-width: 60rem;
|
||||||
|
margin: 0 auto;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
padding: 0 20px;
|
padding: 0 20px;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
@ -144,6 +148,9 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
border-bottom: 1px solid;
|
border-bottom: 1px solid;
|
||||||
|
@media(width<480px) {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
& .thumbnail {
|
& .thumbnail {
|
||||||
display: block;
|
display: block;
|
||||||
@ -151,6 +158,7 @@
|
|||||||
max-height: 50vh;
|
max-height: 50vh;
|
||||||
}
|
}
|
||||||
& img {
|
& img {
|
||||||
|
height: 25vh;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
max-height: 100%;
|
max-height: 100%;
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
|
Loading…
Reference in New Issue
Block a user