mirrors/txtdot
3
0
Fork 0
mirror of https://github.com/txtdot/txtdot synced 2024-10-18 14:40:19 +03:00
Code Issues Packages Projects Releases Wiki Activity

Buttons styling

Browse Source
This commit is contained in:
DarkCat09 2023-08-16 14:35:03 +04:00
parent 22b8af4012
commit 6a3d541fb4
No known key found for this signature in database
GPG Key ID: 4785B6FB1C50A540
4 changed files with 36 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
static/common.css
View File

@ -6,8 +6,10 @@
--bg: #fff;
--fg: #111;
--link: hsl(207, 100%, 40%);
--link-hl: hsl(207, 100%, 20%);
--bg2: #bbb;
--accent: hsl(207, 100%, 40%);
--accent-hl: hsl(207, 100%, 20%);
}
@media (prefers-color-scheme: dark) {
@ -15,8 +17,10 @@
--bg: #222;
--fg: #eee;
--link: hsl(207, 100%, 60%);
--link-hl: hsl(207, 100%, 80%);
--bg2: #444;
--accent: hsl(207, 100%, 60%);
--accent-hl: hsl(207, 100%, 80%);
}
}
@ -36,3 +40,23 @@ main {
width: 100%;
margin: auto;
}
.button {
padding: 0.25rem 0.5rem;
border: 0.125rem solid var(--accent);
border-radius: 0.25rem;
background: var(--bg);
color: var(--fg);
text-decoration: none;
cursor: pointer;
}
.button.secondary {
border-color: var(--bg2);
}
.button:hover {
background: var(--bg2);
color: var(--fg);
}

8
static/get.css
View File

@ -1,17 +1,19 @@
.menu {
display: flex;
flex-direction: row;
column-gap: 1rem;
column-gap: 0.25rem;
font-size: 0.9rem;
}
.title {
font-weight: 500;
}
a {
color: var(--link);
color: var(--accent);
}
a:hover {
color: var(--link-hl);
color: var(--accent-hl);
}
pre {

4
templates/get.ejs
View File

@ -12,8 +12,8 @@
<body>
<main>
<div class="menu">
<a href="/">Home</a>
<a href="<%= remoteUrl %>">Original page</a>
<a class="button secondary" href="/">Home</a>
<a class="button secondary" href="<%= remoteUrl %>">Original page</a>
</div>
<div class="title">
<%= parsed.title %>

2
templates/index.ejs
View File

@ -21,7 +21,7 @@
<input type="text" name="url" id="url" placeholder="URL">
</div>
<div class="input">
<input type="submit" id="submit" value="Parse">
<input type="submit" id="submit" class="button" value="Parse">
</div>
<div class="input-row">
<div class="input">