| <!-- |
| Copyright 2021 The Chromium Authors. All rights reserved. |
| Use of this source code is governed by a BSD-style license that can be |
| found in the LICENSE file. |
| --> |
| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="UTF-8" /> |
| <meta name="viewport" content="width=device-width" /> |
| <title>Button example</title> |
| <style> |
| #container { |
| padding: 25px; |
| display: flex; |
| align-items: center; |
| flex-wrap: wrap; |
| gap: 10px; |
| } |
| #toolbar { |
| background-color: var(--color-background); |
| display: flex; |
| flex-direction: row; |
| align-items: center; |
| border-bottom: 1px solid var(--color-details-hairline); |
| padding: 0px 5px; |
| height: 29px; |
| } |
| #small-toolbar { |
| background-color: var(--color-background); |
| display: flex; |
| flex-direction: row; |
| align-items: center; |
| border-bottom: 1px solid var(--color-details-hairline); |
| padding: 0px 5px; |
| height: 23px; |
| } |
| .separator { |
| background-color: var(--color-details-hairline); |
| width: 1px; |
| height: 17px; |
| margin: 0px 5px; |
| } |
| </style> |
| </head> |
| <body> |
| <div id="container"> |
| </div> |
| <div id="toolbar"> |
| </div> |
| <div id="small-toolbar"> |
| </div> |
| <form onsubmit="event.preventDefault(); alert('submitted');" id="form"> |
| <input name="field" placeholder="Enter smth" /> |
| </form> |
| <script type="module" src="./basic.js"></script> |
| </body> |
| </html> |
