Fixed dark theme issue with submit.html

This commit is contained in:
2024-10-14 04:01:29 +01:00
parent 9f4d380950
commit 8c036a5a43
10 changed files with 102 additions and 34 deletions

View File

@@ -175,60 +175,126 @@ footer {
/* Dark Mode */ /* Dark Mode */
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
/* Body Styles */
body { body {
background-color: #121212; background-color: #121212; /* Deep dark background */
color: #ffffff; color: #d1d1d1; /* Softer off-white for improved contrast */
} }
/* Link Styles */
a { a {
color: #ffa500; color: #ffa500;
text-decoration: none;
transition: color 0.3s ease;
} }
a:hover {
color: #ffcc80; /* Subtle, warmer hover color */
text-decoration: underline; /* Underline on hover for better accessibility */
}
/* Body Text */
.bodytext { .bodytext {
line-height: 21px; line-height: 1.7; /* Increased line spacing for readability */
font-size: smaller; font-size: 1rem; /* Consistent font size */
color: #ffffff; color: #e0e0e0; /* Softer white for text */
} }
/* Table, Input Fields, Textarea, Select Elements */
table, td, input.text, textarea, select { table, td, input.text, textarea, select {
background-color: #01002c11; background-color: #1a1a1a; /* Darker backgrounds for contrast */
color: #ffffff; color: #d1d1d1; /* Softer white text */
border-color: #ffa500; border-color: #ffa500; /* Keeping borders on accents */
} }
/* Submit Button */
input.button { input.button {
background-color: #ffa500; background-color: #ffa500;
color: #00000000; color: #121212; /* Darker button text for readability */
border-radius: 6px; /* Slight rounding for modern design */
padding: 8px 12px; /* Increased padding for better button size */
font-weight: bold; /* More defined button text */
transition: background-color 0.3s ease, color 0.3s ease;
} }
input.button:hover { input.button:hover {
background-color: #ff8c00; background-color: #ff8c00; /* Brighter hover color */
color: #ffffff; /* White text on hover for better contrast */
} }
/* Headers, Footer, and Other Text Elements */
.footertext, .toplinks, h2 { .footertext, .toplinks, h2 {
color: #ffa500; color: #ffa500; /* Accent color for headers */
} }
h2 {
font-size: 1.5rem; /* Larger headers for better hierarchy */
border-bottom: 2px solid #ffa500; /* Visual distinction for headers */
padding-bottom: 10px;
}
/* Quote Box Borders */
td.quote-box { td.quote-box {
border-color: #ffa500; border-color: #ffa500;
background-color: #1e1e1e; /* Subtle background for quotes */
padding: 15px; /* Improved padding for readability */
} }
/* Footer */
footer { footer {
background-color: #ffa500; background-color: #181818; /* Consistent footer background */
color: #121212; color: #d1d1d1; /* Softer text in footer */
border-top: 2px solid #ffa500; /* Accent line to separate footer */
padding: 15px;
} }
/* Pagination Links */
#pagination a { #pagination a {
border-color: #ffa500; border-color: #ffa500;
color: #ffa500; color: #ffa500;
background-color: transparent;
padding: 8px 12px; /* Larger clickable area */
border-radius: 4px; /* Rounded edges for pagination */
transition: background-color 0.3s ease, color 0.3s ease;
} }
#pagination a:hover { #pagination a:hover {
background-color: #333333; background-color: #2e2e2e; /* Slightly brighter hover */
color: #ffffff; color: #ffffff; /* White text for hover state */
} }
/* Quote ID Links */
.quote-id { .quote-id {
color: #ffa500; color: #ffa500;
font-weight: bold; /* Bold for emphasis */
transition: color 0.3s ease;
}
.quote-id:hover {
color: #ffcc80; /* Brighter hover for clarity */
}
/* Other Element Styles */
input.text, textarea, select {
border-radius: 4px;
padding: 8px;
}
input.button:disabled {
background-color: #444444; /* Disabled button appearance */
color: #aaaaaa; /* Disabled text color */
cursor: not-allowed;
}
/* Table and Layout Enhancements */
table {
background-color: #1e1e1e;
border: 1px solid #ffa500;
}
td {
padding: 15px; /* More padding for larger table cells */
} }
} }

View File

@@ -5,7 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: Browse Quotes</title> <title>ircquotes: Browse Quotes</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000"> <body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000">

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: FAQ</title> <title>ircquotes: FAQ</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000"> <body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000">

View File

@@ -5,7 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: Home</title> <title>ircquotes: Home</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000"> <body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000">

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: Admin Login</title> <title>ircquotes: Admin Login</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000"> <body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000">

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: Admin Panel</title> <title>ircquotes: Admin Panel</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000"> <body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000">

View File

@@ -5,7 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: Quote #{{ quote.id }}</title> <title>ircquotes: Quote #{{ quote.id }}</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000"> <body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000">

View File

@@ -5,7 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: Random Quote</title> <title>ircquotes: Random Quote</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000"> <body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000">

View File

@@ -4,19 +4,19 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: Search & Read</title> <title>ircquotes: Search & Read</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body> <body>
<!-- Header --> <!-- Header -->
<center> <center>
<table cellpadding="2" cellspacing="0" width="80%" border="0"> <table cellpadding="2" cellspacing="0" width="80%" class="header">
<tr> <tr>
<td bgcolor="#c08000" align="left"> <td class="header-left">
<font size="+1"><b><i>ircquotes</i></b></font> <b><i>ircquotes</i></b>
</td> </td>
<td bgcolor="#c08000" align="right"> <td class="header-right">
<font face="arial" size="+1"><b>Search & Read Quotes</b></font> <b>Search & Read Quotes</b>
</td> </td>
</tr> </tr>
</table> </table>
@@ -24,9 +24,9 @@
<!-- Navigation Bar --> <!-- Navigation Bar -->
<center> <center>
<table cellpadding="2" cellspacing="0" width="80%" border="0"> <table cellpadding="2" cellspacing="0" width="80%" class="nav-bar">
<tr> <tr>
<td align="right" bgcolor="#f0f0f0" class="toplinks" colspan="2"> <td align="right" class="toplinks" colspan="2">
<a href="/">Home</a> / <a href="/">Home</a> /
<a href="/random">Random</a> / <a href="/random">Random</a> /
<a href="/submit">Submit</a> / <a href="/submit">Submit</a> /
@@ -71,7 +71,7 @@
<b>#{{ quote.id }}</b> <b>#{{ quote.id }}</b>
</a> </a>
<a href="/vote/{{ quote.id }}/upvote" class="qa">+</a> <a href="/vote/{{ quote.id }}/upvote" class="qa">+</a>
(<font color="green">{{ quote.votes }}</font>) (<span class="votes">{{ quote.votes }}</span>)
<a href="/vote/{{ quote.id }}/downvote" class="qa">-</a> <a href="/vote/{{ quote.id }}/downvote" class="qa">-</a>
</p> </p>
<p class="qt">{{ quote.text }}</p> <p class="qt">{{ quote.text }}</p>
@@ -89,12 +89,14 @@
<!-- Footer --> <!-- Footer -->
<center> <center>
<table border="0" cellpadding="2" cellspacing="0" width="80%" bgcolor="#c08000"> <table border="0" cellpadding="2" cellspacing="0" width="80%" class="footer">
<tr> <tr>
<td class="footertext" align="right">{{ approved_count }} quotes approved; {{ pending_count }} quotes pending</td> <td class="footertext" align="right">{{ approved_count }} quotes approved; {{ pending_count }} quotes pending</td>
</tr> </tr>
</table> </table>
<font size="-1">&#169; ircquotes 2024, All Rights Reserved.</font> <div class="copyright">
&#169; ircquotes 2024, All Rights Reserved.
</div>
</center> </center>
</body> </body>

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ircquotes: Add a Quote</title> <title>ircquotes: Add a Quote</title>
<link rel="stylesheet" href="/static/css/styles.css"> <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head> </head>
<body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000" onload="document.add.newquote.focus();"> <body bgcolor="#ffffff" text="#000000" link="#c08000" vlink="#c08000" alink="#c08000" onload="document.add.newquote.focus();">
<center> <center>