This commit is contained in:
Nyx 2025-04-06 05:24:48 -05:00
parent ab2e28532c
commit 9376d47c0b
5 changed files with 128 additions and 292 deletions

View file

@ -14,6 +14,10 @@ app = Flask(__name__)
def home(): def home():
return render_template('index.j2', server="everypizza.im dictd 1.13.3/rf on Linux 6.13.7-arch1-1") return render_template('index.j2', server="everypizza.im dictd 1.13.3/rf on Linux 6.13.7-arch1-1")
@app.route('/about')
def about():
return send_from_directory('static', 'about.xht')
@app.route('/define/<word>') @app.route('/define/<word>')
def define(word): def define(word):
client = rfc2229.RFC2229Client() client = rfc2229.RFC2229Client()

31
app/static/about.xht Normal file
View file

@ -0,0 +1,31 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>WebDICT</title>
<link href="/style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
<center>
<div
class="bg-white dark:bg-gray-950 place-content-center content-center justify-center place-items-center min-h-screen">
<div class="bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500 inline-block items-center text-4xl rounded-lg">
WebDICT
</div>
<div class="text-white dark:text-gray-200">
WebDICT is a web-based dictionary application that allows users to search for definitions of words. It is designed to
be user-friendly and accessible from any device with an internet connection. Unlike most online dictionaries, WebDICT
is completely open-source and has no ads, nor does it plan to ad such.
</div>
<a href="/">
<button type="button"
class="text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700">Back</button>
</a>
</div>
</center>
</body>
</html>

View file

@ -12,7 +12,9 @@
--color-blue-600: oklch(54.6% 0.245 262.881); --color-blue-600: oklch(54.6% 0.245 262.881);
--color-blue-700: oklch(48.8% 0.243 264.376); --color-blue-700: oklch(48.8% 0.243 264.376);
--color-blue-800: oklch(42.4% 0.199 265.638); --color-blue-800: oklch(42.4% 0.199 265.638);
--color-indigo-500: oklch(58.5% 0.233 277.117);
--color-indigo-600: oklch(51.1% 0.262 276.966); --color-indigo-600: oklch(51.1% 0.262 276.966);
--color-purple-500: oklch(62.7% 0.265 303.9);
--color-pink-500: oklch(65.6% 0.241 354.308); --color-pink-500: oklch(65.6% 0.241 354.308);
--color-gray-50: oklch(98.5% 0.002 247.839); --color-gray-50: oklch(98.5% 0.002 247.839);
--color-gray-100: oklch(96.7% 0.003 264.542); --color-gray-100: oklch(96.7% 0.003 264.542);
@ -25,7 +27,6 @@
--color-gray-800: oklch(27.8% 0.033 256.848); --color-gray-800: oklch(27.8% 0.033 256.848);
--color-gray-900: oklch(21% 0.034 264.665); --color-gray-900: oklch(21% 0.034 264.665);
--color-gray-950: oklch(13% 0.028 261.692); --color-gray-950: oklch(13% 0.028 261.692);
--color-black: #000;
--color-white: #fff; --color-white: #fff;
--spacing: 0.25rem; --spacing: 0.25rem;
--breakpoint-xl: 80rem; --breakpoint-xl: 80rem;
@ -45,7 +46,6 @@
--text-6xl: 3.75rem; --text-6xl: 3.75rem;
--text-6xl--line-height: 1; --text-6xl--line-height: 1;
--font-weight-medium: 500; --font-weight-medium: 500;
--font-weight-bold: 700;
--font-weight-extrabold: 800; --font-weight-extrabold: 800;
--tracking-tight: -0.025em; --tracking-tight: -0.025em;
--radius-md: 0.375rem; --radius-md: 0.375rem;
@ -229,12 +229,6 @@
.start-0 { .start-0 {
inset-inline-start: calc(var(--spacing) * 0); inset-inline-start: calc(var(--spacing) * 0);
} }
.col-start-1 {
grid-column-start: 1;
}
.row-start-1 {
grid-row-start: 1;
}
.m-4 { .m-4 {
margin: calc(var(--spacing) * 4); margin: calc(var(--spacing) * 4);
} }
@ -250,15 +244,9 @@
.me-4 { .me-4 {
margin-inline-end: calc(var(--spacing) * 4); margin-inline-end: calc(var(--spacing) * 4);
} }
.mt-2 {
margin-top: calc(var(--spacing) * 2);
}
.mt-3 { .mt-3 {
margin-top: calc(var(--spacing) * 3); margin-top: calc(var(--spacing) * 3);
} }
.mr-2 {
margin-right: calc(var(--spacing) * 2);
}
.mb-2 { .mb-2 {
margin-bottom: calc(var(--spacing) * 2); margin-bottom: calc(var(--spacing) * 2);
} }
@ -268,34 +256,21 @@
.flex { .flex {
display: flex; display: flex;
} }
.grid { .inline-block {
display: grid; display: inline-block;
}
.inline-flex {
display: inline-flex;
} }
.table { .table {
display: table; display: table;
} }
.size-5 {
width: calc(var(--spacing) * 5);
height: calc(var(--spacing) * 5);
}
.h-4 { .h-4 {
height: calc(var(--spacing) * 4); height: calc(var(--spacing) * 4);
} }
.h-5 {
height: calc(var(--spacing) * 5);
}
.min-h-screen { .min-h-screen {
min-height: 100vh; min-height: 100vh;
} }
.w-4 { .w-4 {
width: calc(var(--spacing) * 4); width: calc(var(--spacing) * 4);
} }
.w-5 {
width: calc(var(--spacing) * 5);
}
.w-full { .w-full {
width: 100%; width: 100%;
} }
@ -305,33 +280,12 @@
.max-w-sm { .max-w-sm {
max-width: var(--container-sm); max-width: var(--container-sm);
} }
.min-w-0 {
min-width: calc(var(--spacing) * 0);
}
.flex-shrink {
flex-shrink: 1;
}
.shrink-0 {
flex-shrink: 0;
}
.flex-grow {
flex-grow: 1;
}
.grow {
flex-grow: 1;
}
.border-collapse { .border-collapse {
border-collapse: collapse; border-collapse: collapse;
} }
.resize { .resize {
resize: both; resize: both;
} }
.appearance-none {
appearance: none;
}
.grid-cols-1 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.flex-wrap { .flex-wrap {
flex-wrap: wrap; flex-wrap: wrap;
} }
@ -353,18 +307,9 @@
.place-self-center { .place-self-center {
place-self: center; place-self: center;
} }
.self-center {
align-self: center;
}
.justify-self-end {
justify-self: flex-end;
}
.rounded-lg { .rounded-lg {
border-radius: var(--radius-lg); border-radius: var(--radius-lg);
} }
.rounded-md {
border-radius: var(--radius-md);
}
.border { .border {
border-style: var(--tw-border-style); border-style: var(--tw-border-style);
border-width: 1px; border-width: 1px;
@ -372,9 +317,6 @@
.border-blue-700 { .border-blue-700 {
border-color: var(--color-blue-700); border-color: var(--color-blue-700);
} }
.border-gray-200 {
border-color: var(--color-gray-200);
}
.border-gray-300 { .border-gray-300 {
border-color: var(--color-gray-300); border-color: var(--color-gray-300);
} }
@ -387,25 +329,23 @@
.bg-white { .bg-white {
background-color: var(--color-white); background-color: var(--color-white);
} }
.bg-linear-to-r { .bg-gradient-to-r {
--tw-gradient-position: to right;
@supports (background-image: linear-gradient(in lab, red, red)) {
--tw-gradient-position: to right in oklab; --tw-gradient-position: to right in oklab;
}
background-image: linear-gradient(var(--tw-gradient-stops)); background-image: linear-gradient(var(--tw-gradient-stops));
} }
.from-indigo-600 { .from-indigo-500 {
--tw-gradient-from: var(--color-indigo-600); --tw-gradient-from: var(--color-indigo-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.via-purple-500 {
--tw-gradient-via: var(--color-purple-500);
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-via-stops);
}
.to-pink-500 { .to-pink-500 {
--tw-gradient-to: var(--color-pink-500); --tw-gradient-to: var(--color-pink-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.box-decoration-clone {
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
}
.p-2 { .p-2 {
padding: calc(var(--spacing) * 2); padding: calc(var(--spacing) * 2);
} }
@ -415,18 +355,9 @@
.p-4 { .p-4 {
padding: calc(var(--spacing) * 4); padding: calc(var(--spacing) * 4);
} }
.px-2 {
padding-inline: calc(var(--spacing) * 2);
}
.px-5 { .px-5 {
padding-inline: calc(var(--spacing) * 5); padding-inline: calc(var(--spacing) * 5);
} }
.py-1 {
padding-block: calc(var(--spacing) * 1);
}
.py-1\.5 {
padding-block: calc(var(--spacing) * 1.5);
}
.py-2 { .py-2 {
padding-block: calc(var(--spacing) * 2); padding-block: calc(var(--spacing) * 2);
} }
@ -439,53 +370,22 @@
.ps-10 { .ps-10 {
padding-inline-start: calc(var(--spacing) * 10); padding-inline-start: calc(var(--spacing) * 10);
} }
.pr-3 {
padding-right: calc(var(--spacing) * 3);
}
.pr-7 {
padding-right: calc(var(--spacing) * 7);
}
.pl-1 {
padding-left: calc(var(--spacing) * 1);
}
.pl-3 {
padding-left: calc(var(--spacing) * 3);
}
.text-center {
text-align: center;
}
.text-2xl { .text-2xl {
font-size: var(--text-2xl); font-size: var(--text-2xl);
line-height: var(--tw-leading, var(--text-2xl--line-height)); line-height: var(--tw-leading, var(--text-2xl--line-height));
} }
.text-3xl {
font-size: var(--text-3xl);
line-height: var(--tw-leading, var(--text-3xl--line-height));
}
.text-4xl { .text-4xl {
font-size: var(--text-4xl); font-size: var(--text-4xl);
line-height: var(--tw-leading, var(--text-4xl--line-height)); line-height: var(--tw-leading, var(--text-4xl--line-height));
} }
.text-base {
font-size: var(--text-base);
line-height: var(--tw-leading, var(--text-base--line-height));
}
.text-sm { .text-sm {
font-size: var(--text-sm); font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height)); line-height: var(--tw-leading, var(--text-sm--line-height));
} }
.font-extrabold {
--tw-font-weight: var(--font-weight-extrabold);
font-weight: var(--font-weight-extrabold);
}
.font-medium { .font-medium {
--tw-font-weight: var(--font-weight-medium); --tw-font-weight: var(--font-weight-medium);
font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium);
} }
.tracking-tight {
--tw-tracking: var(--tracking-tight);
letter-spacing: var(--tracking-tight);
}
.text-gray-500 { .text-gray-500 {
color: var(--color-gray-500); color: var(--color-gray-500);
} }
@ -506,30 +406,6 @@
outline-style: var(--tw-outline-style); outline-style: var(--tw-outline-style);
outline-width: 1px; outline-width: 1px;
} }
.outline-1 {
outline-style: var(--tw-outline-style);
outline-width: 1px;
}
.-outline-offset-1 {
outline-offset: calc(1px * -1);
}
.outline-gray-300 {
outline-color: var(--color-gray-300);
}
.select-none {
-webkit-user-select: none;
user-select: none;
}
.placeholder\:text-gray-400 {
&::placeholder {
color: var(--color-gray-400);
}
}
.focus-within\:relative {
&:focus-within {
position: relative;
}
}
.hover\:bg-blue-800 { .hover\:bg-blue-800 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -544,13 +420,6 @@
} }
} }
} }
.hover\:text-blue-700 {
&:hover {
@media (hover: hover) {
color: var(--color-blue-700);
}
}
}
.hover\:underline { .hover\:underline {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -558,11 +427,6 @@
} }
} }
} }
.focus\:z-10 {
&:focus {
z-index: 10;
}
}
.focus\:border-blue-500 { .focus\:border-blue-500 {
&:focus { &:focus {
border-color: var(--color-blue-500); border-color: var(--color-blue-500);
@ -589,72 +453,22 @@
--tw-ring-color: var(--color-gray-100); --tw-ring-color: var(--color-gray-100);
} }
} }
.focus\:outline-2 {
&:focus {
outline-style: var(--tw-outline-style);
outline-width: 2px;
}
}
.focus\:-outline-offset-2 {
&:focus {
outline-offset: calc(2px * -1);
}
}
.focus\:outline-indigo-600 {
&:focus {
outline-color: var(--color-indigo-600);
}
}
.focus\:outline-none { .focus\:outline-none {
&:focus { &:focus {
--tw-outline-style: none; --tw-outline-style: none;
outline-style: none; outline-style: none;
} }
} }
.has-\[input\:focus-within\]\:outline-2 {
&:has(*:is(input:focus-within)) {
outline-style: var(--tw-outline-style);
outline-width: 2px;
}
}
.has-\[input\:focus-within\]\:-outline-offset-2 {
&:has(*:is(input:focus-within)) {
outline-offset: calc(2px * -1);
}
}
.has-\[input\:focus-within\]\:outline-indigo-600 {
&:has(*:is(input:focus-within)) {
outline-color: var(--color-indigo-600);
}
}
.sm\:mt-0 { .sm\:mt-0 {
@media (width >= 40rem) { @media (width >= 40rem) {
margin-top: calc(var(--spacing) * 0); margin-top: calc(var(--spacing) * 0);
} }
} }
.sm\:size-4 {
@media (width >= 40rem) {
width: calc(var(--spacing) * 4);
height: calc(var(--spacing) * 4);
}
}
.sm\:text-center { .sm\:text-center {
@media (width >= 40rem) { @media (width >= 40rem) {
text-align: center; text-align: center;
} }
} }
.sm\:text-5xl {
@media (width >= 40rem) {
font-size: var(--text-5xl);
line-height: var(--tw-leading, var(--text-5xl--line-height));
}
}
.sm\:text-sm\/6 {
@media (width >= 40rem) {
font-size: var(--text-sm);
line-height: calc(var(--spacing) * 6);
}
}
.md\:me-6 { .md\:me-6 {
@media (width >= 48rem) { @media (width >= 48rem) {
margin-inline-end: calc(var(--spacing) * 6); margin-inline-end: calc(var(--spacing) * 6);
@ -675,12 +489,6 @@
justify-content: space-between; justify-content: space-between;
} }
} }
.lg\:text-6xl {
@media (width >= 64rem) {
font-size: var(--text-6xl);
line-height: var(--tw-leading, var(--text-6xl--line-height));
}
}
.dark\:border-gray-600 { .dark\:border-gray-600 {
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
border-color: var(--color-gray-600); border-color: var(--color-gray-600);
@ -706,6 +514,11 @@
background-color: var(--color-gray-950); background-color: var(--color-gray-950);
} }
} }
.dark\:text-gray-200 {
@media (prefers-color-scheme: dark) {
color: var(--color-gray-200);
}
}
.dark\:text-gray-400 { .dark\:text-gray-400 {
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
color: var(--color-gray-400); color: var(--color-gray-400);
@ -750,15 +563,6 @@
} }
} }
} }
.dark\:hover\:text-white {
@media (prefers-color-scheme: dark) {
&:hover {
@media (hover: hover) {
color: var(--color-white);
}
}
}
}
.dark\:focus\:border-blue-500 { .dark\:focus\:border-blue-500 {
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
&:focus { &:focus {
@ -839,10 +643,6 @@
syntax: "*"; syntax: "*";
inherits: false; inherits: false;
} }
@property --tw-tracking {
syntax: "*";
inherits: false;
}
@property --tw-shadow { @property --tw-shadow {
syntax: "*"; syntax: "*";
inherits: false; inherits: false;
@ -927,7 +727,6 @@
--tw-gradient-via-position: 50%; --tw-gradient-via-position: 50%;
--tw-gradient-to-position: 100%; --tw-gradient-to-position: 100%;
--tw-font-weight: initial; --tw-font-weight: initial;
--tw-tracking: initial;
--tw-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000;
--tw-shadow-color: initial; --tw-shadow-color: initial;
--tw-shadow-alpha: 100%; --tw-shadow-alpha: 100%;

View file

@ -9,13 +9,14 @@
</head> </head>
<body> <body>
<center>
<div class="bg-white dark:bg-gray-950 place-content-center place-items-center min-h-screen"> <div class="bg-white dark:bg-gray-950 place-content-center place-items-center min-h-screen">
<span class="text-4xl dark:text-white"> <span class="text-4xl dark:text-white">
WebDICT WebDICT
<br /> <br />
</span> </span>
<span class="dark:text-white place-self-center"> <span class="dark:text-white place-self-center">
Word: {{ word }} Word: {{ word }} <br />
Definition: {{ definition }} Definition: {{ definition }}
</span> </span>
<br /> <br />
@ -25,6 +26,7 @@
home</button> home</button>
</a> </a>
</div> </div>
</center>
</body> </body>
</html> </html>

View file

@ -9,14 +9,13 @@
</head> </head>
<body> <body>
<center>
<div <div
class="bg-white dark:bg-gray-950 place-content-center content-center justify-center place-items-center min-h-screen"> class="bg-white dark:bg-gray-950 place-content-center content-center justify-center place-items-center min-h-screen">
<span class="text-4xl dark:text-white"> <span class="text-4xl dark:text-white">
WebDICT WebDICT
<br /> <br />
</span> </span>
<form class="flex items-center max-w-sm mx-auto"> <form class="flex items-center max-w-sm mx-auto">
<label for="simple-search" class="sr-only">Search</label> <label for="simple-search" class="sr-only">Search</label>
<div class="relative w-full"> <div class="relative w-full">
@ -31,6 +30,7 @@
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
placeholder="Search a word..." required /> placeholder="Search a word..." required />
</div> </div>
<form method="post">
<button type="submit" <button type="submit"
class="p-2.5 ms-2 text-sm font-medium text-white bg-blue-700 rounded-lg border border-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"> class="p-2.5 ms-2 text-sm font-medium text-white bg-blue-700 rounded-lg border border-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
<svg class="w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" <svg class="w-4 h-4" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
@ -41,17 +41,17 @@
<span class="sr-only">Search</span> <span class="sr-only">Search</span>
</button> </button>
</form> </form>
</form>
<br /> <br />
<a href="/about"> <a href="/about">
<button type="button" <button type="button"
class="text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700">About</button> class="text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700">About</button>
</a> </a>
<footer class="bg-white rounded-lg shadow-sm m-4 dark:bg-gray-800"> <footer class="bg-white rounded-lg shadow-sm m-4 dark:bg-gray-800">
<div class="w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-between"> <div class="w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-between">
<span class="text-sm text-gray-500 sm:text-center dark:text-gray-400">Made with love by <a <span class="text-sm text-gray-500 sm:text-center dark:text-gray-400">Made with love by <a
href="https://everypizza.im/" class="hover:underline">everypizza.im</a>. This is a free program, href="https://everypizza.im/" class="hover:underline">everypizza.im</a>. This is a free
program,
with no warranty. It's licensed under the Unlicese. with no warranty. It's licensed under the Unlicese.
</span> </span>
<br /> <br />
@ -66,8 +66,8 @@
</ul> </ul>
</div> </div>
</footer> </footer>
</div> </div>
</center>
</body> </body>
</html> </html>