remove modiletitle class and replace it with h3

This commit is contained in:
HF 2022-08-15 21:56:11 +02:00
parent 63bf9b15ff
commit 680cd4327e
15 changed files with 58 additions and 51 deletions

View File

@ -104,7 +104,7 @@ function Admintools() {
)}
<div>
<br />
<h3 className="modaltitle">{t`IP Actions`}</h3>
<h3>{t`IP Actions`}</h3>
<p className="modalcotext">
{t`Do stuff with IPs (one IP per line)`}
</p>
@ -153,7 +153,7 @@ function Admintools() {
</button>
<br />
<div className="modaldivider" />
<h3 className="modaltitle">{t`Manage Moderators`}</h3>
<h3>{t`Manage Moderators`}</h3>
<p className="modalcotext">
{t`Remove Moderator`}
</p>

View File

@ -83,19 +83,19 @@ const BanInfo = ({ close }) => {
))}
{(reason) && (
<React.Fragment key="rea">
<h3 className="modaltitle">{t`Reason`}:</h3>
<h3>{t`Reason`}:</h3>
<p className="modaltext">{reason}</p>
</React.Fragment>
)}
{(mod) && (
<React.Fragment key="mod">
<h3 className="modaltitle">{t`By Mod`}:</h3>
<h3>{t`By Mod`}:</h3>
<p className="modaltext">{mod}</p>
</React.Fragment>
)}
{(expireTs > 0) && (
<React.Fragment key="exp">
<h3 className="modaltitle">{t`Duration`}:</h3>
<h3>{t`Duration`}:</h3>
<p className="modaltext">
{t`Your ban expires at `}
<span style={{ fontWeight: 'bold' }}>{expire}</span>
@ -110,7 +110,7 @@ const BanInfo = ({ close }) => {
)}
{(expireTs < 0) && (
<React.Fragment key="nb">
<h3 className="modaltitle">{t`Unbanned`}:</h3>
<h3>{t`Unbanned`}:</h3>
<p className="modaltext">{t`Now that you have seen this message, you are no longer banned.`}</p>
</React.Fragment>
)}

View File

@ -22,8 +22,8 @@ const CanvasItem = ({
alt="preview"
src={`/preview${canvasId}.png`}
/>
<p className="modalcvtext">
<span className="modaltitle">{canvas.title}</span><br />
<div className="modalcvtext">
<h4>{canvas.title}</h4>
{(online) && (
<React.Fragment key="online">
{t`Online Users`}:&nbsp;
@ -67,7 +67,7 @@ const CanvasItem = ({
? <span key="voxsize"> x {THREE_CANVAS_HEIGHT} Voxels</span>
: <span key="pxlsize"> Pixels</span>}
</span>
</p>
</div>
</div>
);

View File

@ -213,7 +213,7 @@ function Converter() {
}
</select>
</div>
<h3 className="modaltitle">{t`Palette Download`}</h3>
<h3>{t`Palette Download`}</h3>
<div className="modalcotext">
{jt`Palette for ${gimpLink}`}:&nbsp;
<button
@ -233,7 +233,7 @@ function Converter() {
Download
</button>
</div>
<h3 className="modaltitle">{t`Image Converter`}</h3>
<h3>{t`Image Converter`}</h3>
<p className="modalcotext">{t`Convert an image to canvas colors`}</p>
<input
type="file"

View File

@ -252,7 +252,7 @@ function ModCanvastools() {
</select>
</p>
<div className="modaldivider" />
<h3 className="modaltitle">{t`Image Upload`}</h3>
<h3>{t`Image Upload`}</h3>
<p className="modalcotext">{t`Upload images to canvas`}</p>
<p className="modalcotext">
{t`File`}:&nbsp;
@ -316,7 +316,7 @@ function ModCanvastools() {
<br />
<div className="modaldivider" />
<h3 className="modaltitle">{t`Pixel Protection`}</h3>
<h3>{t`Pixel Protection`}</h3>
<p className="modalcotext">
{t`Set protection of areas \
(if you need finer grained control, \
@ -399,7 +399,7 @@ function ModCanvastools() {
<div>
<br />
<div className="modaldivider" />
<h3 className="modaltitle">{t`Rollback to Date`}</h3>
<h3>{t`Rollback to Date`}</h3>
<p className="modalcotext">
{t`Rollback an area of the canvas to a set date (00:00 UTC)`}
</p>
@ -474,7 +474,7 @@ function ModCanvastools() {
)}
<br />
<div className="modaldivider" />
<h3 className="modaltitle">{t`Canvas Cleaner`}</h3>
<h3>{t`Canvas Cleaner`}</h3>
<p className="modalcotext">
{t`Apply a filter to clean trash in large canvas areas.`}
</p>

View File

@ -49,7 +49,7 @@ function ModIIDtools() {
return (
<div style={{ textAlign: 'center', paddingLeft: '5%', paddingRight: '5%' }}>
<h3 className="modaltitle">{t`IID Actions`}</h3>
<h3>{t`IID Actions`}</h3>
<select
value={iIDAction}
onChange={(e) => {

View File

@ -27,15 +27,14 @@ const SocialSettings = ({ done }) => {
margin: 10,
}}
>
<span
<h3
style={{
flex: 'auto',
textAlign: 'left',
}}
className="modaltitle"
>
{t`Block all Private Messages`}
</span>
</h3>
<MdToggleButton
value={blockDm}
onToggle={() => {
@ -46,13 +45,12 @@ const SocialSettings = ({ done }) => {
/>
</div>
<div className="modaldivider" />
<p
<h3
style={{
textAlign: 'left',
marginLeft: 10,
}}
className="modaltitle"
>{t`Unblock Users`}</p>
>{t`Unblock Users`}</h3>
{
(blocked.length) ? (
<span

View File

@ -17,7 +17,7 @@ const Archive = () => (
Those canvases can get boring after a while and after weeks of no major change and if they really aren't worth being kept active, we decide to remove them.`}<br />
{t`Here we collect those canvases to archive them in a proper way (which is currently just one).`}
</p>
<p className="modaltitle">{t`Political Compass Canvas`}</p>
<h3>{t`Political Compass Canvas`}</h3>
<img
style={imageStyle}
alt="political-compass"

View File

@ -49,15 +49,15 @@ pixels and 7s on already set pixels.`}<br />
</p>
<p>Guilded ({t`recommended`}): <a href="./guilded" target="_blank" rel="noopener noreferrer">pixelplanet.fun/guilded</a></p>
<p>{t`Source on `}<a href="https://git.pixelplanet.fun" target="_blank" rel="noopener noreferrer">git.pixelplanet.fun</a></p>
<p className="modaltitle">{t`Map Data`}</p>
<h3>{t`Map Data`}</h3>
<p className="modaltext">{t`The bare map data that we use, together with converted OpenStreetMap tiles for orientation, \
can be downloaded from mega.nz here: `}<a href="https://mega.nz/#!JpkBwAbJ!EnSLlZmKv3kEBE0HDhakTgAZZycD3ELjduajJxPGaXo">pixelplanetmap.zip</a> (422MB)</p>
<p className="modaltitle">{t`Banned? Detected as Proxy?`}</p>
<h3>{t`Banned? Detected as Proxy?`}</h3>
<div className="modaltext">
<p>{jt`If you got detected as proxy, but you are none, or think that you got wrongfully banned, please go to our ${guildedLink} or send us an e-mail to ${mailLink} and include the following IID:`}</p>
<GetIID />
</div>
<h3 className="modaltitle">2D {t`Controls`}</h3>
<h3>2D {t`Controls`}</h3>
<div className="modaltext" style={{ lineHeight: 1.8 }}>
{t`Click a color in palette to select it`}<br />
{jt`Press ${bindG} to toggle grid`}<br />
@ -74,7 +74,7 @@ can be downloaded from mega.nz here: `}<a href="https://mega.nz/#!JpkBwAbJ!EnSLl
{jt`${mouseSymbol} Left click or ${touchSymbol} tap to place a pixel`}<br />
{jt`Click ${mouseSymbol} middle mouse button or ${touchSymbol} long-tap to select current hovering color`}<br />
</div>
<h3 className="modaltitle">3D {t`Controls`}</h3>
<h3>3D {t`Controls`}</h3>
<div className="modaltext" style={{ lineHeight: 1.8 }}>
{jt`Press ${bindW}, ${bindA}, ${bindS}, ${bindD} to move`}<br />
{jt`Press ${bindAUp}, ${bindALeft}, ${bindADown}, ${bindARight} to move`}<br />
@ -86,7 +86,7 @@ can be downloaded from mega.nz here: `}<a href="https://mega.nz/#!JpkBwAbJ!EnSLl
{jt`${mouseSymbol} Right click or ${touchSymbol} double-tap to remove a pixel`}<br />
{jt`Click ${mouseSymbol} middle mouse button or ${touchSymbol} long-tap to select current hovering color`}<br />
</div>
<h3 className="modaltitle">Palette Credits</h3>
<h3>Palette Credits</h3>
<div className="modaltext">
{jt`We thanks those artists very much, they offered their palettes to the public on`}&nbsp;
<a href="https://lospec.com/">lospec.com</a>

View File

@ -87,7 +87,7 @@ const Register = ({ windowId }) => {
<p key={error} className="errormessage"><span>{t`Error`}</span>
:&nbsp;{error}</p>
))}
<p className="modaltitle">{t`Name`}:</p>
<h3>{t`Name`}:</h3>
<input
name="name"
className="reginput"
@ -95,7 +95,7 @@ const Register = ({ windowId }) => {
type="text"
placeholder={t`Name`}
/>
<p className="modaltitle">{t`Email`}:</p>
<h3>{t`Email`}:</h3>
<input
name="email"
className="reginput"
@ -103,7 +103,7 @@ const Register = ({ windowId }) => {
type="text"
placeholder={t`Email`}
/>
<p className="modaltitle">{t`Password`}:</p>
<h3>{t`Password`}:</h3>
<input
name="password"
className="reginput"
@ -111,7 +111,7 @@ const Register = ({ windowId }) => {
type="password"
placeholder={t`Password`}
/>
<p className="modaltitle">{t`Confirm Password`}:</p>
<h3>{t`Confirm Password`}:</h3>
<input
name="confirmpassword"
className="reginput"
@ -119,7 +119,7 @@ const Register = ({ windowId }) => {
type="password"
placeholder={t`Confirm Password`}
/>
<p className="modaltitle">{t`Captcha`}:</p>
<h3>{t`Captcha`}:</h3>
<Captcha autoload={false} width={60} key={captKey} />
<button type="submit">
{(submitting) ? '...' : t`Submit`}

View File

@ -52,7 +52,7 @@ const SettingsItemSelect = ({
}) => (
<div style={itemStyles}>
<div style={rowStyles}>
<h3 style={titleStyles} className="modaltitle">{title}</h3>
<h3 style={titleStyles}>{title}</h3>
{(icon) && <img alt="" src={icon} />}
<select
value={selected}
@ -85,7 +85,6 @@ const SettingsItem = React.memo(({
<div style={rowStyles}>
<h3
style={titleStyles}
className="modaltitle"
>
{title} {keyBind && <kbd>{keyBind}</kbd>}
</h3>
@ -222,7 +221,7 @@ function Settings() {
{(window.ssv && navigator.cookieEnabled && window.ssv.langs) && (
<div style={itemStyles}>
<div style={rowStyles}>
<h3 style={titleStyles} className="modaltitle">
<h3 style={titleStyles}>
{t`Select Language`}
</h3>
<LanguageSelect />

View File

@ -176,6 +176,28 @@ h2 {
margin-top: 12px;
}
h3 {
color: #4f545c;
font-weight: 500;
font-size: 16px;
line-height: 24px;
margin-left: 0;
margin-right: 10px;
overflow: hidden;
word-wrap: break-word;
margin-bottom: 0;
}
h4 {
color: #4f545c;
font-weight: 500;
font-size: 15px;
line-height: 22px;
overflow: hidden;
word-wrap: break-word;
margin: 2px 10px 0 0;
}
tr:nth-child(even) {
background-color: #dddddd;
}
@ -541,18 +563,6 @@ tr:nth-child(even) {
padding: 0;
}
.modaltitle {
color: #4f545c;
font-weight: 500;
font-size: 16px;
line-height: 24px;
margin-left: 0;
margin-right: 10px;
overflow: hidden;
word-wrap: break-word;
margin-bottom: 0;
}
.modaldesc {
box-sizing: border-box;
flex: 1 1 auto;

View File

@ -103,7 +103,7 @@ tr:nth-child(even) {
color: #f4f4f4;
}
.modaltitle {
h3, h4 {
color: #d7e5fb;
}

View File

@ -108,7 +108,7 @@ tr:nth-child(even) {
color: #f8f8f8;
}
.modaltitle {
h3, h4 {
color: #f38826;
}

View File

@ -74,7 +74,7 @@ tr:nth-child(even) {
color: #f4f4f4;
}
.modaltitle {
h3, h4 {
color: #d7e5fb;
}