mirror of
https://github.com/RGBCube/serenity
synced 2025-05-22 15:45:08 +00:00
19b22fbb4a
This adds test pages for border-radius, CSS custom properties and flexboxes to the default page in the Browser. I used those files to develop said features and they can be of use when debugging in the future or just to showcase those features.
68 lines
1.1 KiB
HTML
68 lines
1.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>Custom Properties</title>
|
|
<style>
|
|
:root {
|
|
--my-color: purple;
|
|
}
|
|
|
|
div {
|
|
margin: 20px;
|
|
}
|
|
|
|
.test {
|
|
background: var(--my-color);
|
|
}
|
|
|
|
.test-parent {
|
|
--my-color: pink;
|
|
border: 1px solid black;
|
|
}
|
|
|
|
.box {
|
|
width: 150px;
|
|
height: 150px;
|
|
border: 1px solid black;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<h1>CSS Custom Properties</h1>
|
|
<pre>
|
|
:root {
|
|
--my-color: purple;
|
|
}
|
|
|
|
.test {
|
|
background: var(--my-color);
|
|
}
|
|
|
|
.test-parent {
|
|
--my-color: pink;
|
|
}
|
|
|
|
</pre>
|
|
<div class="box test">
|
|
<pre>
|
|
.test
|
|
</pre>
|
|
This should be purple
|
|
</div>
|
|
|
|
<div class="test-parent">
|
|
<pre>
|
|
.test-parent
|
|
</pre>
|
|
<div class="box test">
|
|
<pre>
|
|
.test
|
|
</pre>
|
|
This should be pink
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|