chore: better book page mobile styles
This commit is contained in:
parent
10805b4193
commit
572d074fea
3 changed files with 36 additions and 12 deletions
10
package-lock.json
generated
10
package-lock.json
generated
|
@ -1,12 +1,12 @@
|
||||||
{
|
{
|
||||||
"name": "coryd.dev",
|
"name": "coryd.dev",
|
||||||
"version": "21.4.6",
|
"version": "21.4.7",
|
||||||
"lockfileVersion": 3,
|
"lockfileVersion": 3,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "coryd.dev",
|
"name": "coryd.dev",
|
||||||
"version": "21.4.6",
|
"version": "21.4.7",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@cdransf/api-text": "^1.4.0",
|
"@cdransf/api-text": "^1.4.0",
|
||||||
|
@ -2754,9 +2754,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/postcss": {
|
"node_modules/postcss": {
|
||||||
"version": "8.4.40",
|
"version": "8.4.41",
|
||||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.40.tgz",
|
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.41.tgz",
|
||||||
"integrity": "sha512-YF2kKIUzAofPMpfH6hOi2cGnv/HrUlfucspc7pDyvv7kGdqXrfj8SCl/t8owkEgKEuu8ZcRjSOxFxVLqwChZ2Q==",
|
"integrity": "sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"funding": [
|
"funding": [
|
||||||
{
|
{
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "coryd.dev",
|
"name": "coryd.dev",
|
||||||
"version": "21.4.6",
|
"version": "21.4.7",
|
||||||
"description": "The source for my personal site. Built using 11ty (and other tools).",
|
"description": "The source for my personal site. Built using 11ty (and other tools).",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
|
|
@ -90,18 +90,28 @@
|
||||||
|
|
||||||
& .book-display {
|
& .book-display {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
gap: var(--sizing-base);
|
gap: var(--sizing-base);
|
||||||
margin-bottom: var(--sizing-base);
|
margin-bottom: var(--sizing-base);
|
||||||
|
|
||||||
|
& .book-meta {
|
||||||
|
width: 100%;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
& p {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
& .progress-bar-wrapper {
|
||||||
|
max-width: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
margin: var(--sizing-base) 0;
|
margin: var(--sizing-base) 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
& .book-meta p {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-width: 768px) {
|
@media screen and (min-width: 768px) {
|
||||||
|
@ -115,7 +125,21 @@
|
||||||
|
|
||||||
& .progress-bar-wrapper {
|
& .progress-bar-wrapper {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
max-width: 40%;
|
max-width: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.book-focus .book-display {
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: start;
|
||||||
|
|
||||||
|
& .book-meta {
|
||||||
|
width: auto;
|
||||||
|
align-items: start;
|
||||||
|
|
||||||
|
& .progress-bar-wrapper {
|
||||||
|
max-width: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Reference in a new issue