Base: Extract some about:settings CSS classes to a common file

We will re-use the card classes in about:bookmarks.
This commit is contained in:
Timothy Flynn
2026-04-06 17:34:38 -04:00
committed by Tim Flynn
parent 2f3199adbf
commit 6bf2279dfe
Notes: github-actions[bot] 2026-04-09 14:09:44 +00:00
3 changed files with 76 additions and 68 deletions

View File

@@ -3,94 +3,27 @@
<head>
<title>Settings</title>
<link rel="stylesheet" type="text/css" href="resource://ladybird/ladybird.css" />
<link rel="stylesheet" type="text/css" href="resource://ladybird/about-pages/webui.css" />
<style>
@media (prefers-color-scheme: light) {
:root {
--card-background-color: #f5f5f5;
--card-header-background-color: #f0f2f5;
--input-background-color: white;
--border-color: #dcdde1;
}
}
@media (prefers-color-scheme: dark) {
:root {
--card-background-color: #242424;
--card-header-background-color: #252525;
--border-color: #3d3d3d;
}
}
* {
box-sizing: border-box;
}
body {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
header {
display: flex;
align-items: center;
margin-bottom: 30px;
}
header h1 {
font-size: 20px;
}
header img {
height: 48px;
margin-right: 10px;
float: left;
}
hr {
height: 1px;
background-color: var(--border-color);
border: none;
}
.card-title {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 16px;
font-weight: 500;
margin: 0 0 8px 4px;
}
.card {
background-color: var(--card-background-color);
border-radius: 8px;
margin-bottom: 20px;
}
.card-body {
padding: 20px;
}
.card-body > hr {
margin: 0 8px 16px 8px;
}
.card-group {
margin-bottom: 20px;
}
.card-group:last-child {
margin-bottom: 0;
}
.inline-container {
display: flex;
align-items: center;

View File

@@ -0,0 +1,74 @@
@media (prefers-color-scheme: light) {
:root {
--card-background-color: #f5f5f5;
--card-header-background-color: #f0f2f5;
}
}
@media (prefers-color-scheme: dark) {
:root {
--card-background-color: #242424;
--card-header-background-color: #252525;
}
}
* {
box-sizing: border-box;
}
body {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
header {
display: flex;
align-items: center;
margin-bottom: 30px;
}
header h1 {
font-size: 20px;
}
header img {
height: 48px;
margin-right: 10px;
float: left;
}
.card-title {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 16px;
font-weight: 500;
margin: 0 0 8px 4px;
}
.card {
background-color: var(--card-background-color);
border-radius: 8px;
margin-bottom: 20px;
}
.card-body {
padding: 20px;
}
.card-body > hr {
margin: 0 8px 16px 8px;
}
.card-group {
margin-bottom: 20px;
}
.card-group:last-child {
margin-bottom: 0;
}

View File

@@ -73,6 +73,7 @@ set(ABOUT_PAGES
newtab.html
processes.html
settings.html
webui.css
)
list(TRANSFORM ABOUT_PAGES PREPEND "${LADYBIRD_SOURCE_DIR}/Base/res/ladybird/about-pages/")