mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2024-11-22 15:40:19 +00:00
34cd98a607
We don't need to lug around all these image files now that we'll be using 3rd party libraries for image format support anyway.
233 lines
12 KiB
HTML
233 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>Welcome!</title>
|
|
<!-- this is a comment -->
|
|
<style>
|
|
/* css comment */
|
|
body {
|
|
background-color: #000;
|
|
background-image: url("90s-bg.png");
|
|
color: #fff;
|
|
/* another css comment */
|
|
}
|
|
/* lol
|
|
a
|
|
css
|
|
comment */
|
|
|
|
h1 {
|
|
color: #a00;
|
|
}
|
|
|
|
a {
|
|
color: #ae7250;
|
|
}
|
|
|
|
a:hover {
|
|
color: #f4cca0;
|
|
}
|
|
|
|
span#ua {
|
|
color: red;
|
|
}
|
|
|
|
span#loadtime {
|
|
color: yellow;
|
|
}
|
|
|
|
.page-list {
|
|
column-width: 250px;
|
|
}
|
|
</style>
|
|
<script>
|
|
console.log('Hello from an inline script in the head of welcome.html');
|
|
</script>
|
|
<script src="welcome.js"></script>
|
|
</head>
|
|
|
|
<body background="90s-bg.png">
|
|
<h1>Welcome to the Ladybird web browser!</h1>
|
|
<p>This is a very simple browser built on the LibWeb and LibJS engines.</p>
|
|
<p>Your user agent is: <b><span id="ua"></span></b></p>
|
|
<p>This page loaded in <b><span id="loadtime"></span></b> ms</p>
|
|
<nav class="page-list">
|
|
<h2>HTML</h2>
|
|
<ul>
|
|
<li><a href="contenteditable.html">contenteditable</a></li>
|
|
<li><a href="many-buggies.html">many buggies</a></li>
|
|
<li><a href="html-escape-test.html">html character escape test</a></li>
|
|
<li><a href="phint.html">presentational hints</a></li>
|
|
<li><a href="lorem.html">lorem ipsum</a></li>
|
|
<li><h3>Elements</h3></li>
|
|
<li><a href="iframe.html">iframe</a></li>
|
|
<li><a href="button.html">button</a></li>
|
|
<li><a href="radio.html">radio button</a></li>
|
|
<li><a href="checkbox.html">checkbox</a></li>
|
|
<li><a href="form.html">form</a></li>
|
|
<li><a href="input.html">input</a></li>
|
|
<li><a href="images.html">images</a></li>
|
|
<li><a href="pre.html">pre</a></li>
|
|
<li><a href="svg.html">svg</a></li>
|
|
<li><a href="svg-transforms.html">svg transforms</a></li>
|
|
<li><a href="svg-gradients.html">svg gradients</a></li>
|
|
<li><a href="svg-preserve-aspect-ratio.html">svg preserveAspectRatio</a></li>
|
|
<li><a href="svg-fill-rule.html">svg fill-rule</a></li>
|
|
<li><a href="small.html">small</a></li>
|
|
<li><a href="link.html">link</a></li>
|
|
<li><a href="afrag.html">links with fragments</a></li>
|
|
<li><a href="blink.html">blink</a></li>
|
|
<li><a href="br.html">br</a></li>
|
|
<li><a href="progressbar.html">progressbar</a></li>
|
|
<li><a href="textarea.html">textarea</a></li>
|
|
<li><a href="noscript.html">noscript</a></li>
|
|
</ul>
|
|
|
|
<h2>CSS</h2>
|
|
<ul>
|
|
<li><h3>CSSOM</h3></li>
|
|
<li><a href="attr-invalidate-style.html">Style invalidation on attribute changes</a></li>
|
|
<li><a href="computed-style.html">Computed style</a></li>
|
|
<li><a href="supports.html">CSS.supports() and @supports</a></li>
|
|
<li><a href="attributes.html">Attributes</a></li>
|
|
<li><a href="class-list.html">Class List</a></li>
|
|
<li><h3>Selectors</h3></li>
|
|
<li><a href="selectors.html">Selectors</a></li>
|
|
<li><a href="attrselectors.html">Attribute selectors</a></li>
|
|
<li><a href="more-attribute-selectors.html#target">More attribute selectors</a></li>
|
|
<li><a href="first-child.html">:first-child</a></li>
|
|
<li><a href="last-child.html">:last-child</a></li>
|
|
<li><a href="nth-child.html">:nth-child</a></li>
|
|
<li><a href="nth-last-child.html">:nth-last-child</a></li>
|
|
<li><a href="only-child.html">:only-child</a></li>
|
|
<li><a href="first-of-type.html">:first-of-type</a></li>
|
|
<li><a href="last-of-type.html">:last-of-type</a></li>
|
|
<li><a href="nth-of-type.html">:nth-of-type</a></li>
|
|
<li><a href="nth-last-of-type.html">:nth-last-of-type</a></li>
|
|
<li><a href="empty.html">:empty</a></li>
|
|
<li><a href="root.html">:root</a></li>
|
|
<li><a href="is-selector.html">:is()</a></li>
|
|
<li><a href="not-selector.html">:not()</a></li>
|
|
<li><a href="where-selector.html">:where()</a></li>
|
|
<li><a href="hover.html">:hover</a></li>
|
|
<li><a href="focus.html">:focus</a></li>
|
|
<li><h3>Properties</h3></li>
|
|
<li><a href="gradients.html">Gradients</a></li>
|
|
<li><a href="vertical-align.html">vertical-align</a></li>
|
|
<li><a href="backdrop-filter.html">backdrop-filter</a></li>
|
|
<li><a href="backgrounds.html">Backgrounds</a></li>
|
|
<li><a href="background-repeat-test.html">Background-repeat</a></li>
|
|
<li><a href="background-position-xy.html">Background-position-x/y</a></li>
|
|
<li><a href="box-shadow.html">Box-shadow</a></li>
|
|
<li><a href="text-shadow.html">Text-shadow</a></li>
|
|
<li><a href="opacity.html">Opacity</a></li>
|
|
<li><a href="text-decoration.html">Text-decoration</a></li>
|
|
<li><a href="fonts.html">Fonts</a></li>
|
|
<li><a href="borders.html">Borders</a></li>
|
|
<li><a href="border-radius.html">Border-Radius</a></li>
|
|
<li><a href="outline.html">Outlines</a></li>
|
|
<li><a href="lists.html">Lists</a></li>
|
|
<li><a href="flex.html">Flexboxes</a></li>
|
|
<li><a href="flex-order.html">Flexbox order</a></li>
|
|
<li><a href="justify-content.html">Flexbox justify-content</a></li>
|
|
<li><a href="flex-2.html">Flexboxes with unusual children</a></li>
|
|
<li><a href="inline-block.html">display: inline-block;</a></li>
|
|
<li><a href="display-grid.html">display: grid;</a></li>
|
|
<li><a href="display-table.html">display: table;</a></li>
|
|
<li><a href="inline-block-link.html">link inside display: inline-block</a></li>
|
|
<li><a href="padding-inline.html">inline elements with padding</a></li>
|
|
<li><a href="custom-properties.html">Custom Properties</a></li>
|
|
<li><a href="float-1.html">Floating boxes</a></li>
|
|
<li><a href="float-3.html">Floating boxes with overflow=hidden</a></li>
|
|
<li><a href="clear-1.html">Float clearing</a></li>
|
|
<li><a href="overflow.html">Overflow</a></li>
|
|
<li><a href="image-rendering.html">image-rendering property</a></li>
|
|
<li><a href="transform.html">Transforms</a></li>
|
|
<li><a href="clip.html">Clip</a></li>
|
|
<li><a href="cursor.html">Cursor</a></li>
|
|
<li><a href="accent-color.html">accent-color</a></li>
|
|
<li><h3>Features</h3></li>
|
|
<li><a href="css.html">Basic functionality</a></li>
|
|
<li><a href="colors.html">css colors</a></li>
|
|
<li><a href="palette.html">system palette color css extension</a></li>
|
|
<li><a href="calc.html">calc()</a></li>
|
|
<li><a href="css-import.html">@import</a></li>
|
|
<li><a href="media-queries.html">@media queries</a></li>
|
|
<li><a href="font-face.html">@font-face</a></li>
|
|
<li><a href="margin-collapse-1.html">margin collapsing 1</a></li>
|
|
<li><a href="margin-collapse-2.html">margin collapsing 2</a></li>
|
|
<li><a href="position-absolute-from-edges.html">position: absolute, offset from edges</a></li>
|
|
<li><a href="link-over-zindex-block.html">link elements with background box placed with z-index</a></li>
|
|
<li><a href="percent-css.html">Percentage values</a></li>
|
|
<li><a href="position-absolute-top-left.html">position: absolute; for top and left</a></li>
|
|
<li><a href="cascade-keywords.html">Cascade keywords (initial, inherit, unset)</a></li>
|
|
<li><a href="inline-node.html">Styling "inline" elements</a></li>
|
|
<li><a href="pseudo-elements.html">Pseudo-elements (::before, ::after, etc)</a></li>
|
|
<li><a href="effects_with_opacity_and_transforms.html">Effects with opacity and transforms</a></li>
|
|
<li><a href="css-animations.html">CSS Animations</a></li>
|
|
</ul>
|
|
|
|
<h2>JavaScript/Wasm</h2>
|
|
<ul>
|
|
<li><a href="mouse-events.html">mouse events</a></li>
|
|
<li><a href="message-channel.html">MessageChannel</a></li>
|
|
<li><a href="websocket.html">WebSocket API Test</a></li>
|
|
<li><a href="event-bubbling-and-multiple-listeners.html">event bubbling and multiple listeners</a></li>
|
|
<li><a href="raf.html">requestAnimationFrame</a></li>
|
|
<li><a href="events.html">simple DOM events</a></li>
|
|
<li><a href="dom.html">simple DOM JS</a></li>
|
|
<li><a href="alert.html">alert()</a></li>
|
|
<li><a href="prompt.html">prompt()</a></li>
|
|
<li><a href="qsa.html">querySelectorAll()</a></li>
|
|
<li><a href="innerHTML.html">innerHTML()</a></li>
|
|
<li><a href="demo.html">fun demo</a></li>
|
|
<li><a href="set-timeout-and-interval.html">setTimeout() and setInterval()</a></li>
|
|
<li><a href="location.html">window.location property</a></li>
|
|
<li><a href="script-preparation-test.html">Test for the early return steps 6-8 of the "prepare a script" algorithm</a></li>
|
|
<li><a href="async-js.html">Basic test for async functions and their integration with the LibWeb event loop</a></li>
|
|
<li><a href="worker_parent.html">Workers</a></li>
|
|
<li><a href="storage.html">Web Storage API</a></li>
|
|
<li><a href="private-element-test.html">Test for rejecting private elements on special objects</a></li>
|
|
<li><a href="exceptions.html">Exceptions</a></li>
|
|
<li><h3>Canvas</h3></li>
|
|
<li><a href="canvas.html">canvas 2D test</a></li>
|
|
<li><a href="canvas-gradients.html">canvas gradients!</a></li>
|
|
<li><a href="canvas-patterns.html">canvas patterns</a></li>
|
|
<li><a href="canvas-rotate.html">canvas rotate()</a></li>
|
|
<li><a href="canvas-path-rect.html">canvas path rect test</a></li>
|
|
<li><a href="canvas-path-quadratic-curve.html">canvas path quadratic curve test</a></li>
|
|
<li><a href="img-canvas.html">canvas drawImage() test</a></li>
|
|
<li><a href="canvas-path.html">canvas path house!</a></li>
|
|
<li><a href="canvas-clip-path.html">canvas clip paths</a></li>
|
|
<li><a href="trigonometry.html">canvas + trigonometry functions</a></li>
|
|
<li><a href="canvas-global-alpha.html">canvas globalAlpha</a></li>
|
|
<li><a href="canvas-path2d.html">Path2D</a></li>
|
|
<li><a href="web-animations.html">Web Animations</a></li>
|
|
<li><a href="webgl-clear-color-and-multiple-contexts.html">WebGL Demo - Multiple Contexts and glClear(Color)</a></li>
|
|
<li><h3>Wasm</h3></li>
|
|
<li><a href="mandelbrot-wasm.html">WebAssembly Mandelbrot Rendering Demo</a></li>
|
|
<li><a href="gol-wasm.html">WebAssembly Game Of Life Demo</a></li>
|
|
</ul>
|
|
|
|
<h2>Image Formats</h2>
|
|
<ul>
|
|
<li><a href="https://entropymine.com/jason/bmpsuite/bmpsuite/html/bmpsuite.html">BMP test suite</a></li>
|
|
<li><a href="data-url.html">"data:..." images</a></li>
|
|
</ul>
|
|
|
|
<h2>Test Sites</h2>
|
|
<ul>
|
|
<li><a href="acid1.html">acid1</a></li>
|
|
<li><a href="acid2.html">acid2</a></li>
|
|
<li><a href="http://serenityos.org/">serenityos.org</a></li>
|
|
</ul>
|
|
</nav>
|
|
<script>
|
|
queueMicrotask(function() {
|
|
document.getElementById("loadtime").innerHTML = performance.now();
|
|
});
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|