RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 04:37:44 +00:00
Code Issues Activity Actions

Browser: Add various test pages to welcome

Browse source 
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.
This commit is contained in:
Tobias Christiansen 2021-06-06 00:08:54 +02:00 • committed by Linus Groh
parent f290048662
commit 19b22fbb4a
4 changed files with 495 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

68
Base/res/html/misc/custom-properties.html Normal file
View file

@ -0,0 +1,68 @@
<!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>