d45d77bedf
Our font styling for dotcom vs. our examples app is _ever_ so slightly different. - the Inter fonts weren't being consistently linked. Sometimes we grabbed 700, sometimes 800, sometimes 500 or 400 - the dotcom specified a default weight of 500 and line-height 1.6 which was not specified in the our UI. this made the UI inconsistent - furthermore, we didn't specify `text-rendering` nor `font-smooth` and that also made things inconsistent - finally, our buttons needed to inherit the line-height because otherwise they were reverting to the user agent default before: <img width="1800" alt="Screenshot 2024-03-26 at 15 23 12" src="https://github.com/tldraw/tldraw/assets/469604/ee25c79c-5b43-4501-a126-255a9b03a4b8"> after: <img width="1800" alt="Screenshot 2024-03-26 at 15 22 53" src="https://github.com/tldraw/tldraw/assets/469604/a7a62441-e767-4919-b2bb-5c283eadd230"> ### Change Type <!-- ❗ Please select a 'Scope' label ❗️ --> - [x] `sdk` — Changes the tldraw SDK - [ ] `dotcom` — Changes the tldraw.com web app - [ ] `docs` — Changes to the documentation, examples, or templates. - [ ] `vs code` — Changes to the vscode plugin - [ ] `internal` — Does not affect user-facing stuff <!-- ❗ Please select a 'Type' label ❗️ --> - [x] `bugfix` — Bug fix - [ ] `feature` — New feature - [ ] `improvement` — Improving existing features - [ ] `chore` — Updating dependencies, other boring stuff - [ ] `galaxy brain` — Architectural changes - [ ] `tests` — Changes to any test code - [ ] `tools` — Changes to infrastructure, CI, internal scripts, debugging tools, etc. - [ ] `dunno` — I don't know ### Test Plan 1. Add a step-by-step description of how to test your PR here. 2. - [ ] Unit Tests - [ ] End to end tests ### Release Notes - Add a brief release note for your PR here. --------- Co-authored-by: Steve Ruiz <steveruizok@gmail.com>
46 lines
678 B
CSS
46 lines
678 B
CSS
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;700&display=swap');
|
|
|
|
html,
|
|
body {
|
|
padding: 0;
|
|
margin: 0;
|
|
font-family: 'Inter', sans-serif;
|
|
overscroll-behavior: none;
|
|
touch-action: none;
|
|
overflow: hidden;
|
|
min-height: 100vh;
|
|
/* mobile viewport bug fix */
|
|
min-height: -webkit-fill-available;
|
|
}
|
|
|
|
#root {
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
a {
|
|
color: inherit;
|
|
text-decoration: none;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html,
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.tldraw--editor {
|
|
position: fixed;
|
|
top: 0px;
|
|
left: 0px;
|
|
bottom: 0px;
|
|
right: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
background-color: var(--color-background);
|
|
}
|