standardebooks/web
1
0
Fork 0
mirror of https://github.com/standardebooks/web.git synced 2025-07-13 10:02:02 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix CSS breakpoints for various responsive issues

Browse source
This commit is contained in:
Alex Cabal 2022-07-09 12:50:36 -05:00
parent 4300619383
commit 55985b0c2f
1 changed files with 38 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

66
www/css/core.css
View file

@ -59,6 +59,7 @@
--light-button-highlight: #62bfa3; --light-button-highlight: #62bfa3;
--light-border: #222; --light-border: #222;
--light-sub-text: #777; --light-sub-text: #777;
--light-table-border: #bbb;
--light-input-hover: #000; --light-input-hover: #000;
--light-input-border: #777; --light-input-border: #777;
--light-input-outline: #000; --light-input-outline: #000;
@ -80,6 +81,7 @@
--button-highlight: var(--light-button-highlight); --button-highlight: var(--light-button-highlight);
--border: var(--light-border); --border: var(--light-border);
--sub-text: var(--light-sub-text); --sub-text: var(--light-sub-text);
--table-border: var(--light-table-border);
--body-bg: var(--light-body-bg); --body-bg: var(--light-body-bg);
--input-hover: var(--light-input-hover); --input-hover: var(--light-input-hover);
--input-border: var(--light-input-border); --input-border: var(--light-input-border);
@ -649,6 +651,7 @@ h1 + .message{
padding: 1rem; padding: 1rem;
color: #fff; color: #fff;
text-shadow: 1px 1px 0px rgba(0, 0, 0, .75); text-shadow: 1px 1px 0px rgba(0, 0, 0, .75);
box-sizing: border-box;
} }
.message.error{ .message.error{
@ -695,7 +698,10 @@ ul.download-list table td{
ul.download-list table td + td{ ul.download-list table td + td{
text-align: right; text-align: right;
white-space: nowrap; white-space: nowrap;
}
ul.download-list tbody tr:not(:last-child) td{
border-bottom: 1px dashed var(--table-border);
} }
ul.download-list tbody td + td{ ul.download-list tbody td + td{
@ -1236,18 +1242,14 @@ footer ul li{
footer ul li a, footer ul li a,
footer ul li::after{ footer ul li::after{
font-size: .9rem; font-size: .9rem;
white-space: nowrap;
} }
footer ul li::after{ footer ul li:not(:last-child)::after{
content: "\b7"; content: "\b7";
margin: 0 10px; margin: 0 10px;
} }
footer ul li:last-child::after{
content: "";
display: none;
}
footer > p:first-child{ footer > p:first-child{
line-height: 1; line-height: 1;
white-space: normal; white-space: normal;
@ -2732,6 +2734,12 @@ ul.feed p{
} }
} }
@media(max-width: 1200px){
ul.download-list{
grid-template-columns: 1fr 1fr;
}
}
@media(max-width: 1100px){ @media(max-width: 1100px){
form[action="/ebooks"]{ form[action="/ebooks"]{
grid-template-columns: auto auto auto 1fr; grid-template-columns: auto auto auto 1fr;
@ -2910,11 +2918,9 @@ ul.feed p{
font-size: 1rem; font-size: 1rem;
margin: 0; margin: 0;
} }
}
@media(max-width: 800px){ ul.download-list{
.bulk-downloads > ul{ grid-template-columns: 1fr;
grid-template-columns: 1fr 1fr;
} }
} }
@ -2965,7 +2971,8 @@ ul.feed p{
grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-columns: repeat(2, minmax(0, 1fr));
} }
footer ul li:nth-child(2)::after{ footer ul li:nth-child(2)::after,
footer ul li:nth-child(5)::after{
content: "\A"; /* This is a line break */ content: "\A"; /* This is a line break */
white-space: pre; white-space: pre;
margin: 0; margin: 0;
@ -2976,12 +2983,6 @@ ul.feed p{
white-space: normal; white-space: normal;
margin: 0 10px; margin: 0 10px;
} }
footer ul li:nth-child(5)::after{
content: "\A"; /* This is a line break */
white-space: pre;
margin: 0;
}
} }
@media(max-width: 680px){ @media(max-width: 680px){
@ -3214,8 +3215,20 @@ ul.feed p{
margin-top: 2rem; margin-top: 2rem;
} }
.bulk-downloads > ul{ footer ul li:nth-child(2)::after,
grid-template-columns: 1fr; footer ul li:nth-child(4)::after,
footer ul li:nth-child(6)::after{
content: "\A"; /* This is a line break */
white-space: pre;
margin: 0;
}
footer ul li:nth-child(1)::after,
footer ul li:nth-child(3)::after,
footer ul li:nth-child(5)::after{
content: "\b7";
white-space: normal;
margin: 0 10px;
} }
} }
@ -3242,15 +3255,6 @@ ul.feed p{
line-height: 1.4; line-height: 1.4;
} }
footer ul li{
display: block;
margin: 1rem 0;
}
footer ul li::after{
display: none;
}
.progress p.start, .progress p.start,
.progress p.target, .progress p.target,
.progress p.stretch-base{ .progress p.stretch-base{
@ -3338,6 +3342,12 @@ ul.feed p{
.masthead ol.donors.patrons{ .masthead ol.donors.patrons{
columns: 1; columns: 1;
} }
footer ul li:nth-child(7)::after{
content: "\A"; /* This is a line break */
white-space: pre;
margin: 0;
}
} }
@supports not(hyphens: auto){ @supports not(hyphens: auto){