moris/blog
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

css gridを一括指定

Browse source
This commit is contained in:
moris 2025-03-03 12:29:37 +09:00
parent 707bf73ef5
commit cbceb9aebe
1 changed files with 7 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/routes/(DefaultStyle)/post/[slug]/+page.svelte
View file

@ -278,24 +278,20 @@
} }
& .category { & .category {
grid-row: 1; grid-area: 1 / 1;
grid-column: 1;
} }
& .tags { & .tags {
grid-row: 1; grid-area: 1 / 3;
grid-column: 3;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@media(width<1000px) { @media(width<1000px) {
grid-row: 2; grid-area: 2 / 1 / 3 / 5;
grid-column: 1 / 5;
} }
@media(width<480px){ @media(width<480px){
display: inline-block; display: inline-block;
grid-row: 1; grid-area: 1 / 3;
grid-column: 3;
} }
} }
@ -313,22 +309,19 @@
width: 1px; width: 1px;
margin: 3px 0; margin: 3px 0;
background-color: var(--font-color); background-color: var(--font-color);
grid-row: 1; grid-area: 1 / 2;
grid-column: 2;
@media(480px<width<1000px){ @media(480px<width<1000px){
display: none; display: none;
} }
} }
& .date{ & .date{
display: flex; display: flex;
grid-row: 1;
grid-column: 4;
vertical-align: middle; vertical-align: middle;
align-items: center; align-items: center;
grid-area: 1 / 4;
@media(width<480px){ @media(width<480px){
display: inline-block; display: inline-block;
grid-row: 2; grid-area: 2 / 1 / 3 / 5;
grid-column: 1 / 5;
} }
} }
& .date svg{ & .date svg{