responsive fixes for /blog/29/
This commit is contained in:
parent
300992b49f
commit
8a22671f0b
@ -2612,6 +2612,12 @@ html, body {
|
||||
height: 150px;
|
||||
}
|
||||
}
|
||||
.project-lawful-ebook-blogpost {
|
||||
/* Level: 0 */
|
||||
/* Level: 1 */
|
||||
/* Level: 2 */
|
||||
/* Level: 3 */
|
||||
}
|
||||
.project-lawful-ebook-blogpost code {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
border-radius: 2px;
|
||||
@ -2678,7 +2684,42 @@ html, body {
|
||||
width: 100%;
|
||||
border: 1px solid #555;
|
||||
}
|
||||
@media (max-device-width: 767px) {
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton svg {
|
||||
width: 16px;
|
||||
}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_dl {
|
||||
display: none;
|
||||
}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_mb {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media (min-device-width: 768px) and (max-device-width: 850px) {
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton svg {
|
||||
width: 32px;
|
||||
}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_dl {
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
@media (min-device-width: 851px) and (max-device-width: 991px) {
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton svg {
|
||||
width: 48px;
|
||||
}
|
||||
}
|
||||
@media (min-device-width: 992px) and (max-device-width: 1199px) {
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton svg {
|
||||
width: 48px;
|
||||
}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_dl {
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.project-lawful-ebook-blogpost {
|
||||
/* Level: 0 - 3 */
|
||||
}
|
||||
.project-lawful-ebook-blogpost .variant.alt-variants {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -2703,6 +2744,11 @@ html, body {
|
||||
.project-lawful-ebook-blogpost .dlbtn_alt svg {
|
||||
fill: #BBB;
|
||||
}
|
||||
@media (max-device-width: 1199px) {
|
||||
.project-lawful-ebook-blogpost .dlbtn_alt svg {
|
||||
width: 16px;
|
||||
}
|
||||
}
|
||||
.project-lawful-ebook-blogpost .dlbtn_alt .span_mb {
|
||||
font-size: 0.75em;
|
||||
grid-column: 4;
|
||||
|
15
www/data/css/styles.min.css
vendored
15
www/data/css/styles.min.css
vendored
@ -506,8 +506,23 @@ html,body{margin:0;padding:0;height:100%}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_mb{font-size:.75em}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton svg{fill:#BBB}
|
||||
.project-lawful-ebook-blogpost .variant img{width:100%;border:1px solid #555}
|
||||
@media(max-device-width:767px){
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton svg{width:16px}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_dl{display:none}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_mb{display:none}
|
||||
}
|
||||
@media(min-device-width:768px) and (max-device-width:850px){
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton svg{width:32px}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_dl{font-size:1em}
|
||||
}
|
||||
@media(min-device-width:851px) and (max-device-width:991px){.project-lawful-ebook-blogpost .variant .dlbutton svg{width:48px}}
|
||||
@media(min-device-width:992px) and (max-device-width:1199px){
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton svg{width:48px}
|
||||
.project-lawful-ebook-blogpost .variant .dlbutton a .span_dl{font-size:1em}
|
||||
}
|
||||
.project-lawful-ebook-blogpost .variant.alt-variants{display:flex;flex-direction:column;gap:4px}
|
||||
.project-lawful-ebook-blogpost .dlbtn_alt{display:grid;grid-template-columns:24px auto 1fr auto;grid-column-gap:1rem;color:#ddd;background-color:#222;border:1px solid black;border-radius:4px;text-decoration:none;cursor:pointer;padding:6px;align-items:center}
|
||||
.project-lawful-ebook-blogpost .dlbtn_alt:hover{background-color:#555}
|
||||
.project-lawful-ebook-blogpost .dlbtn_alt svg{fill:#BBB}
|
||||
@media(max-device-width:1199px){.project-lawful-ebook-blogpost .dlbtn_alt svg{width:16px}}
|
||||
.project-lawful-ebook-blogpost .dlbtn_alt .span_mb{font-size:.75em;grid-column:4}
|
||||
|
@ -78,6 +78,27 @@
|
||||
width: 100%;
|
||||
border: 1px solid #555;
|
||||
}
|
||||
|
||||
@include rdmedia(0) {
|
||||
.variant .dlbutton svg { width: 16px; }
|
||||
.variant .dlbutton a .span_dl { display: none; }
|
||||
.variant .dlbutton a .span_mb { display: none; }
|
||||
}
|
||||
@include rdmedia(1) {
|
||||
.variant .dlbutton svg { width: 32px; }
|
||||
.variant .dlbutton a .span_dl { font-size: 1em; }
|
||||
.variant .dlbutton a .span_mb { }
|
||||
}
|
||||
@include rdmedia(2) {
|
||||
.variant .dlbutton svg { width: 48px; }
|
||||
.variant .dlbutton a .span_dl { }
|
||||
.variant .dlbutton a .span_mb { }
|
||||
}
|
||||
@include rdmedia(3) {
|
||||
.variant .dlbutton svg { width: 48px; }
|
||||
.variant .dlbutton a .span_dl { font-size: 1em; }
|
||||
.variant .dlbutton a .span_mb { }
|
||||
}
|
||||
}
|
||||
|
||||
.project-lawful-ebook-blogpost
|
||||
@ -113,9 +134,10 @@
|
||||
|
||||
.dlbtn_alt svg {
|
||||
fill: #BBB;
|
||||
|
||||
}
|
||||
|
||||
@include rdmedia_range(0, 3) { .dlbtn_alt svg { width: 16px; } }
|
||||
|
||||
.dlbtn_alt .span_mb {
|
||||
font-size: 0.75em;
|
||||
grid-column: 4;
|
||||
|
@ -8,7 +8,8 @@
|
||||
<li>Then I <a href="https://github.com/Mikescher/ProjectLawfulEbook">hacked together a bit of C# code</a> to generate epub files</li>
|
||||
<li>All external images (and optionally avatars) are included in the epub</li>
|
||||
<li>I went through all the avatar files and made them square images (simplified my css, and looked better - most were already squares or almost-squares)</li>
|
||||
<li>Various properties of the final file/layout can be changed, I generated the variants I found useful, but if anyone wants something special it should be enough to close the repo, edit <code>Program.cs</code> and run <code>make</code></li>
|
||||
<li>Various properties of the final file/layout can be changed, I generated the variants I found useful. <br/>
|
||||
But if anyone wants something special it should be easy enough to clone the repo, edit <code>Program.cs</code> and run <code>make</code></li>
|
||||
</ul>
|
||||
|
||||
<h2># Variants</h2>
|
||||
|
Loading…
Reference in New Issue
Block a user