Files
linkbeam/themes/auto.css
Vladimir nett00n Budylnikov 3421275d37
Some checks failed
CI/CD Pipeline / Lint (pull_request) Has been cancelled
CI/CD Pipeline / Test (pull_request) Has been cancelled
CI/CD Pipeline / Build (386, linux, linkbeam-linux-386) (pull_request) Has been cancelled
CI/CD Pipeline / Build (386, windows, linkbeam-windows-386.exe) (pull_request) Has been cancelled
CI/CD Pipeline / Build (amd64, darwin, linkbeam-darwin-amd64) (pull_request) Has been cancelled
CI/CD Pipeline / Build (amd64, linux, linkbeam-linux-amd64) (pull_request) Has been cancelled
CI/CD Pipeline / Build (amd64, windows, linkbeam-windows-amd64.exe) (pull_request) Has been cancelled
CI/CD Pipeline / Build (arm, 7, linux, linkbeam-linux-armv7) (pull_request) Has been cancelled
CI/CD Pipeline / Build (arm64, darwin, linkbeam-darwin-arm64) (pull_request) Has been cancelled
CI/CD Pipeline / Build (arm64, linux, linkbeam-linux-arm64) (pull_request) Has been cancelled
CI/CD Pipeline / Build (arm64, windows, linkbeam-windows-arm64.exe) (pull_request) Has been cancelled
CI/CD Pipeline / Build Docker Image (pull_request) Has been cancelled
CI/CD Pipeline / Create Release (pull_request) Has been cancelled
more features
2025-11-16 13:16:22 +04:00

179 lines
3.2 KiB
CSS

/* auto.css - Super-simple monochrome theme for LinkBeam */
/* Default: Light mode */
:root {
--bg-color: #ffffff;
--text-color: #000000;
--text-secondary: #666666;
--link-bg: #f5f5f5;
--link-hover: #e0e0e0;
--border-color: #cccccc;
}
/* System dark mode preference */
@media (prefers-color-scheme: dark) {
:root {
--bg-color: #000000;
--text-color: #ffffff;
--text-secondary: #999999;
--link-bg: #1a1a1a;
--link-hover: #2a2a2a;
--border-color: #333333;
}
}
/* Manual overrides */
html[data-theme="light"] {
--bg-color: #ffffff;
--text-color: #000000;
--text-secondary: #666666;
--link-bg: #f5f5f5;
--link-hover: #e0e0e0;
--border-color: #cccccc;
}
html[data-theme="dark"] {
--bg-color: #000000;
--text-color: #ffffff;
--text-secondary: #999999;
--link-bg: #1a1a1a;
--link-hover: #2a2a2a;
--border-color: #333333;
}
* {
box-sizing: border-box;
}
body {
margin: 0;
padding: 0;
font-family: sans-serif;
background: var(--bg-color);
color: var(--text-color);
line-height: 1.5;
}
header {
text-align: center;
padding: 2rem 1rem;
max-width: 600px;
margin: 0 auto;
}
header img {
border: 1px solid var(--border-color);
}
header h1 {
margin: 1rem 0 0.5rem;
font-size: 1.5rem;
color: var(--text-color);
}
header p {
margin: 0.5rem 0;
color: var(--text-secondary);
}
main {
max-width: 600px;
margin: 0 auto;
padding: 1rem;
}
main ul {
list-style: none;
padding: 0;
margin: 0;
}
main li {
margin-bottom: 0.5rem;
}
main a,
button,
main span {
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 1rem;
background-color: var(--link-bg);
border: 1px solid var(--border-color);
border-radius: 0.5rem;
text-decoration: none;
color: var(--text-color);
text-align: center;
transition: all 0.2s ease;
cursor: pointer;
width: 100%;
font: inherit;
}
main span {
cursor: default;
}
main a:hover,
button:hover {
background-color: var(--link-hover);
transform: translateY(-2px);
}
main a:active,
button:active {
transform: translateY(0);
}
main code {
background-color: rgba(127, 127, 127, 0.1);
padding: 0.2rem 0.4rem;
border-radius: 0.25rem;
font-family: 'Courier New', Courier, monospace;
font-size: 0.9em;
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;
}
footer {
text-align: center;
padding: 2rem 1rem;
max-width: 600px;
margin: 0 auto;
}
footer p {
margin: 0.5rem 0;
color: var(--text-secondary);
font-size: 0.9rem;
}
/* Image module styles */
.image-item {
display: flex;
flex-direction: column;
align-items: center;
padding: 1rem;
background-color: var(--link-bg);
border: 1px solid var(--border-color);
border-radius: 0.5rem;
width: 100%;
}
.image-item img {
max-width: 100%;
height: auto;
border-radius: 0.25rem;
border: 1px solid var(--border-color);
}
.image-caption {
margin: 0.75rem 0 0;
color: var(--text-color);
text-align: center;
font-size: 0.95rem;
}