Basic tab strip for the minibrowser (#33100)

This implements a simple tab system for servoshell:
- The egui part uses the built-in SelectableLabels components and
  display the full tab title on hover.
- WebView structs now hold all the state for each WebView. When we
  need "global" state, we return the focused WebView state, eg.
  for the load status since it's still global in the UI.
- New keyboard shortcut: [Cmd-or-Ctrl]+[W] to close the current tab.
- New keyboard shortcut: [Cmd-or-Ctrl]+[T] to create a new tab.
- The new tab content is loaded from the 'servo:newtab' url using a
  couple of custom protocol handlers.

Signed-off-by: webbeef <me@webbeef.org>
This commit is contained in:
webbeef 2024-08-27 13:17:33 -07:00 committed by GitHub
parent a0ff57cea1
commit 1b48bd18aa
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
14 changed files with 455 additions and 72 deletions

View file

@ -0,0 +1,57 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at https://mozilla.org/MPL/2.0/. */
html,
body {
height: 100%;
padding: 0;
margin: 0;
}
body {
background-color: #121619;
font-family: sans-serif;
color: hsl(0, 0%, 96%);
font-weight: 400;
line-height: 1.5;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
img {
width: 25vw;
}
form {
margin: 1em;
}
input {
width: 50vw;
}
a {
color: #1191e8;
cursor: pointer;
text-decoration: none;
}
a:hover {
color: #42bf64;
}
/* This should not be needed but paper over missing default styles */
button {
padding-block: 1px;
padding-inline: 8px;
box-sizing: border-box;
}
form {
display: flex;
justify-items: center;
gap: 0.5em;
}

View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Servo - New Tab</title>
<link rel="stylesheet" href="resource:///newtab.css" />
</head>
<html>
<a href="https://servo.org">
<img src="resource:///servo-color-negative-no-container.png" />
</a>
<form action="https://duckduckgo.com/html/">
<input name="q" placeholder="Search the web…" autofocus />
<button type="submit">Go!</button>
</form>
<a href="https://servo.org">Home</a>
</html>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB