[all themes] use rems for more consistent font sizing

This commit is contained in:
Shish 2023-12-25 15:33:57 +00:00
parent 75a7b79380
commit 6d370b0aa3
15 changed files with 33 additions and 60 deletions

View file

@ -1,7 +1,7 @@
CODE { CODE {
background: #DEDEDE; background: #DEDEDE;
font-size: 0.8em; font-size: 0.8rem;
} }
BLOCKQUOTE { BLOCKQUOTE {
border: 1px solid black; border: 1px solid black;

View file

@ -13,7 +13,7 @@ class DowntimeTheme extends Themelet
{ {
$page->add_block(new Block( $page->add_block(new Block(
"Downtime", "Downtime",
"<span style='font-size: 1.5em; text-align: center;'><b>DOWNTIME MODE IS ON!</b></span>", "<span style='font-size: 1.5rem; text-align: center;'><b>DOWNTIME MODE IS ON!</b></span>",
"left", "left",
0 0
)); ));

View file

@ -1,7 +1,7 @@
#comicMain { #comicMain {
background: black; background: black;
color: white; color: white;
font-size: 3em; font-size: 3rem;
} }
#comicPageList { #comicPageList {
width: 90%; width: 90%;

View file

@ -1,10 +1,10 @@
div#front-page h1 {font-size: 4em; margin-top: 2em; margin-bottom: 0; text-align: center; border: none; background: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;} div#front-page h1 {font-size: 4rem; margin-top: 2em; margin-bottom: 0; text-align: center; border: none; background: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;}
div#front-page {text-align:center;} div#front-page {text-align:center;}
.space {margin-bottom: 1em;} .space {margin-bottom: 1em;}
div#front-page div#links a {margin: 0 0.5em;} div#front-page div#links a {margin: 0 0.5em;}
div#front-page li {list-style-type: none; margin: 0;} div#front-page li {list-style-type: none; margin: 0;}
@media (max-width: 800px) { @media (max-width: 800px) {
div#front-page h1 {font-size: 3em; margin-top: 0.5em; margin-bottom: 0.5em;} div#front-page h1 {font-size: 3rem; margin-top: 0.5em; margin-bottom: 0.5em;}
#counter {display: none;} #counter {display: none;}
} }

View file

@ -20,7 +20,7 @@ BODY.censored FOOTER {
left: 20%; left: 20%;
right: 20%; right: 20%;
text-align: center; text-align: center;
font-size: 2em; font-size: 2rem;
background: #ACE4A3; background: #ACE4A3;
border: 1px solid #7EB977; border: 1px solid #7EB977;
z-index: 9999999999999999999999; z-index: 9999999999999999999999;

View file

@ -13,7 +13,7 @@
} }
.setupblock TEXTAREA { .setupblock TEXTAREA {
width: 100%; width: 100%;
font-size: 0.75em; font-size: 0.75rem;
resize: vertical; resize: vertical;
} }

View file

@ -99,7 +99,7 @@ TABLE.zebra TR:nth-child(even) {background: var(--zebra-even);}
FOOTER { FOOTER {
clear: both; clear: both;
font-size: 0.7em; font-size: 0.7rem;
text-align: center; text-align: center;
background: var(--title); background: var(--title);
border: 1px solid var(--title-border); border: 1px solid var(--title-border);
@ -131,7 +131,7 @@ NAV {
margin-left: 16px; margin-left: 16px;
} }
NAV .blockbody { NAV .blockbody {
font-size: 0.85em; font-size: 0.85rem;
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
} }

View file

@ -26,7 +26,7 @@ H1 {
FOOTER { FOOTER {
clear: both; clear: both;
padding-top: 8px; padding-top: 8px;
font-size: 0.7em; font-size: 0.7rem;
text-align: center; text-align: center;
} }
@ -45,7 +45,7 @@ NAV {
margin-left: 16px; margin-left: 16px;
} }
NAV .blockbody { NAV .blockbody {
font-size: 0.85em; font-size: 0.85rem;
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
} }
@ -115,7 +115,7 @@ TABLE.tag_list>TBODY>TR>TD:after {
#short-wiki-description > .blockbody { #short-wiki-description > .blockbody {
padding-bottom: 15px; padding-bottom: 15px;
font-size: 1.1em; font-size: 1.1rem;
} }
#short-wiki-description h2 { #short-wiki-description h2 {
margin: 0 0 0.4em; margin: 0 0 0.4em;

View file

@ -128,16 +128,7 @@ TD {
} }
CODE { CODE {
background: #DEDEDE; background: #DEDEDE;
font-size: 0.8em; font-size: 0.8rem;
}
#subtitle {
width: 256px;
font-size: 0.75em;
margin: -16px auto auto;
text-align: center;
border: 1px solid black;
border-top: none;
background: #DDD;
} }
TABLE.zebra {border-spacing: 0; border: 2px solid #C3D2E0;} TABLE.zebra {border-spacing: 0; border: 2px solid #C3D2E0;}
@ -166,7 +157,7 @@ INPUT:hover, button:hover, TEXTAREA:hover {
FOOTER { FOOTER {
clear: both; clear: both;
padding: 8px; padding: 8px;
font-size: 0.7em; font-size: 0.7rem;
text-align: center; text-align: center;
border-top: 1px solid #C3D2E0; border-top: 1px solid #C3D2E0;
background: #E3EFFA; background: #E3EFFA;
@ -196,7 +187,7 @@ NAV {
margin-left: 16px; margin-left: 16px;
} }
NAV .blockbody { NAV .blockbody {
font-size: 0.85em; font-size: 0.85rem;
text-align: center; text-align: center;
} }
NAV TABLE { NAV TABLE {
@ -322,7 +313,7 @@ ARTICLE TABLE {
} }
.setupblock TEXTAREA { .setupblock TEXTAREA {
width: 300px; width: 300px;
font-size: 0.75em; font-size: 0.75rem;
} }
.helpable { .helpable {

View file

@ -8,7 +8,7 @@
<tr> <tr>
<form action='/post/list' method='GET' id="barbot"> <form action='/post/list' method='GET' id="barbot">
<td id="nav-toggle"> <td id="nav-toggle">
<a style="font-size: 2em;" onclick="toggleNav();">&nbsp;Sidebar&nbsp;</a> <a style="font-size: 2rem;" onclick="toggleNav();">&nbsp;Sidebar&nbsp;</a>
</td> </td>
<td id="mini-logo"> <td id="mini-logo">
<a class="vis-mobile" href="//rule34.paheal.net/post/list"><img alt="logo" src="//rule34.paheal.net/themes/rule34v2/rule34_logo_top.png" style="height: 34px;"/></a> <a class="vis-mobile" href="//rule34.paheal.net/post/list"><img alt="logo" src="//rule34.paheal.net/themes/rule34v2/rule34_logo_top.png" style="height: 34px;"/></a>

View file

@ -21,13 +21,13 @@ class CustomHomeTheme extends HomeTheme
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
$hh $hh
<style> <style>
div#front-page h1 {font-size: 4em; margin-top: 2em; margin-bottom: 0; text-align: center; border: none; background: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;} div#front-page h1 {font-size: 4rem; margin-top: 2em; margin-bottom: 0; text-align: center; border: none; background: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;}
div#front-page {text-align:center;} div#front-page {text-align:center;}
.space {margin-bottom: 1em;} .space {margin-bottom: 1em;}
div#front-page div#links a {margin: 0 0.5em;} div#front-page div#links a {margin: 0 0.5em;}
div#front-page li {list-style-type: none; margin: 0;} div#front-page li {list-style-type: none; margin: 0;}
@media (max-width: 800px) { @media (max-width: 800px) {
div#front-page h1 {font-size: 3em; margin-top: 0.5em; margin-bottom: 0.5em;} div#front-page h1 {font-size: 3rem; margin-top: 0.5em; margin-bottom: 0.5em;}
#counter {display: none;} #counter {display: none;}
} }
</style> </style>

View file

@ -10,7 +10,7 @@ a:active.menu { color: #FF0000; text-decoration: none; }
#menuh-container #menuh-container
{ {
font-size: 1em; font-size: 1rem;
float: left; float: left;
top:0; top:0;
left: 5%; left: 5%;

View file

@ -20,7 +20,7 @@ BODY {
text-align: center; text-align: center;
} }
H1 { H1 {
font-size: 5em; font-size: 5rem;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
@ -39,15 +39,6 @@ TD {
text-align: center; text-align: center;
} }
#subtitle {
width: 256px;
font-size: 0.75em;
margin: -16px auto auto;
text-align: center;
border: 1px solid black;
border-top: none;
background: #DDD;
}
#flash { #flash {
background: #FF7; background: #FF7;
display: block; display: block;
@ -57,14 +48,14 @@ TD {
} }
TABLE.zebra {background: #ACE4A3; border-collapse: collapse; border: 1px solid #7EB977;} TABLE.zebra {background: #ACE4A3; border-collapse: collapse; border: 1px solid #7EB977;}
TABLE.zebra TD {font-size: 0.8em;margin: 0; border-top: 1px solid #7EB977; padding: 2px;} TABLE.zebra TD {font-size: 0.8rem;margin: 0; border-top: 1px solid #7EB977; padding: 2px;}
TABLE.zebra TR:nth-child(odd) {background: #9CD493;} TABLE.zebra TR:nth-child(odd) {background: #9CD493;}
TABLE.zebra TR:nth-child(even) {background: #ACE4A3;} TABLE.zebra TR:nth-child(even) {background: #ACE4A3;}
FOOTER { FOOTER {
clear: both; clear: both;
padding: 8px; padding: 8px;
font-size: 0.7em; font-size: 0.7rem;
text-align: center; text-align: center;
border-top: 1px solid #7EB977; border-top: 1px solid #7EB977;
background: #ACE4A3; background: #ACE4A3;
@ -96,7 +87,7 @@ NAV {
margin-left: 16px; margin-left: 16px;
} }
NAV .blockbody { NAV .blockbody {
font-size: 0.85em; font-size: 0.85rem;
text-align: center; text-align: center;
} }
NAV TABLE { NAV TABLE {
@ -236,7 +227,7 @@ div#twitter_update_list li {
vertical-align: middle; vertical-align: middle;
} }
#bans INPUT { #bans INPUT {
font-size: 0.85em; font-size: 0.85rem;
} }
.need-del { .need-del {
@ -276,7 +267,7 @@ ul.tagit li.tagit-new {
@media (max-width: 750px) { @media (max-width: 750px) {
.atoz, #paginator { .atoz, #paginator {
font-size: 2em; font-size: 2rem;
} }
.header-sites { .header-sites {
display: none; display: none;
@ -342,7 +333,7 @@ ul.tagit li.tagit-new {
#UserBlockhead {display: block;} #UserBlockhead {display: block;}
#Loginleft {display: none;} #Loginleft {display: none;}
#Loginhead {display: block;} #Loginhead {display: block;}
.headcol {width: 250px; font-size: 0.85em;} .headcol {width: 250px; font-size: 0.85rem;}
.headbox {width: 80%; margin: auto;} .headbox {width: 80%; margin: auto;}
#big-logo {display: table-cell;} #big-logo {display: table-cell;}
#mini-logo {display: none;} #mini-logo {display: none;}
@ -360,7 +351,7 @@ ul.tagit li.tagit-new {
/* hide nav-search when header-search is sticky */ /* hide nav-search when header-search is sticky */
ARTICLE {margin-top: 0;} ARTICLE {margin-top: 0;}
#Navigationleft .blockbody {font-size: 1.5em;} #Navigationleft .blockbody {font-size: 1.5rem;}
#Navigationleft .blockbody P, #Navigationleft .blockbody P,
#Navigationleft .blockbody FORM #Navigationleft .blockbody FORM
{display: none;} {display: none;}

View file

@ -79,7 +79,7 @@ class CustomUploadTheme extends UploadTheme
protected function build_upload_block(): HTMLElement protected function build_upload_block(): HTMLElement
{ {
return A(["href" => make_link("upload"), "style" => 'font-size: 2em; display: block;'], "Upload"); return A(["href" => make_link("upload"), "style" => 'font-size: 2rem; display: block;'], "Upload");
} }
protected function h_upload_list_1(): HTMLElement protected function h_upload_list_1(): HTMLElement

View file

@ -20,7 +20,7 @@ HEADER {
text-align: center; text-align: center;
} }
H1 { H1 {
font-size: 5em; font-size: 5rem;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
@ -40,16 +40,7 @@ TD {
} }
CODE { CODE {
background: #DEDEDE; background: #DEDEDE;
font-size: 0.8em; font-size: 0.8rem;
}
#subtitle {
width: 256px;
font-size: 0.75em;
margin: -16px auto auto;
text-align: center;
border: 1px solid black;
border-top: none;
background: #DDD;
} }
TABLE.zebra {border-spacing: 0; border: 1px solid #B89F7C; } TABLE.zebra {border-spacing: 0; border: 1px solid #B89F7C; }
@ -63,7 +54,7 @@ TABLE.zebra TR:nth-child(even) {background: #DABC92;}
FOOTER { FOOTER {
clear: both; clear: both;
padding: 8px; padding: 8px;
font-size: 0.7em; font-size: 0.7rem;
text-align: center; text-align: center;
border-top: 1px solid #B89F7C; border-top: 1px solid #B89F7C;
background: #FCD9A9; background: #FCD9A9;
@ -100,7 +91,7 @@ NAV {
margin-left: 16px; margin-left: 16px;
} }
NAV .blockbody { NAV .blockbody {
font-size: 0.85em; font-size: 0.85rem;
text-align: center; text-align: center;
} }
NAV TABLE { NAV TABLE {