tea/browsertrix
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
73e20269ef
browsertrix/frontend
History
Emma Segal-Grossman 73e20269ef
Org settings layout fix + misc styling & consistency improvements (#1427) 
## General changes

- Added `postcss-lit`, which allows us to use tailwind in lit elements
with shadow DOMs
- Added `// postcss-lit-disable-next-line` comments to most `` css`...`
`` tagged templates so as not to change existing CSS in components
- Added `TailwindElement`, which uses a single shared `CSSStyleSheet`
across all instances to be able to access Tailwind without requiring a
full copy of (compiled) Tailwind for every instance of a component that
extends it
- Added a new `<btrix-copy-field>` element, replacing the existing copy
elements

## Org settings page

- Stopped content from overflowing at medium widths
- Made spacing consistent at both smaller and wider widths
- Used readonly/monospace styling for copyable org id field
- Updated tab shadows to be slightly blue, consistent with the tab
background (also did this in other places tabs show up)

Before | After
-|-
![dev browsertrix
cloud_orgs_default-org_settings](https://github.com/webrecorder/browsertrix-cloud/assets/5727389/9bcacdcc-259b-4a01-bac5-8913518776f0)
|
![localhost_9870_orgs_default-org_workflows_crawls](https://github.com/webrecorder/browsertrix-cloud/assets/5727389/53936d4d-e5cd-4f37-ad06-b3b5041381df)
![dev browsertrix cloud_orgs_default-org_settings
(3)](https://github.com/webrecorder/browsertrix-cloud/assets/5727389/602dd8d6-3012-4a0e-a638-a5192c9601ec)
| ![localhost_9870_orgs_default-org_workflows_crawls
(3)](https://github.com/webrecorder/browsertrix-cloud/assets/5727389/74c93312-ad26-48d8-a87e-3da9a851693b)

## Misc fixes

- Used consistent single-line readonly/monospace styling for copyable
url field

Before | After
-|-
![dev browsertrix cloud_orgs_default-org_settings
(1)](https://github.com/webrecorder/browsertrix-cloud/assets/5727389/e361feeb-3ea0-4f56-9e38-12ef6a644d58)
| ![localhost_9870_orgs_default-org_workflows_crawls
(1)](https://github.com/webrecorder/browsertrix-cloud/assets/5727389/0145b1ad-8f45-4486-893e-8f638ac9add6)

- Removed inconsistent angled bottom borders from crawl workflow list
header

Before | After
-|-
![dev browsertrix cloud_orgs_default-org_settings
(2)](https://github.com/webrecorder/browsertrix-cloud/assets/5727389/4aa20359-3ecf-4441-83c0-ed36a951ed3b)
| ![localhost_9870_orgs_default-org_workflows_crawls
(2)](https://github.com/webrecorder/browsertrix-cloud/assets/5727389/8c771464-3a70-47e7-8475-fa82d4d030a9)

- Changes _all_ list page primary action buttons to use
`variant="primary"`

<img width="190" alt="Screenshot 2023-12-08 at 11 23 49 AM"
src="https://github.com/webrecorder/browsertrix-cloud/assets/5672810/2b007f5e-e675-40b2-86a7-f0bf8ef83b81">
<img width="240" alt="Screenshot 2023-12-08 at 11 23 43 AM"
src="https://github.com/webrecorder/browsertrix-cloud/assets/5672810/621b340e-2051-4ab0-8f42-8f0a51d8d3a5">

---------

Co-authored-by: Henry Wilkinson <henry@wilkinson.graphics>
Co-authored-by: sua yoo <sua@webrecorder.org>
Co-authored-by: sua yoo <sua@suayoo.com>
2023-12-13 17:29:35 -05:00
..
.husky
assets
config ESLint & Typescript fixes (#1407) 2023-11-24 12:32:53 -05:00
patches Fix attribute casing & lit-analyzer issues (#1429) 2023-12-11 12:34:03 -05:00
scripts
src Org settings layout fix + misc styling & consistency improvements (#1427) 2023-12-13 17:29:35 -05:00
tests
xliff revert changes from i18n (will address elsewhere) 2023-11-13 19:36:03 -05:00
.dockerignore
.editorconfig
.eslintrc.js Refactor LiteElement into reactive controllers (#1423) 2023-12-05 15:30:10 -08:00
.gitignore
.prettierignore
.vscode add vscode config symlink in frontend dir 2023-11-20 16:56:48 -05:00
00-browsertrix-nginx-init.sh
Dockerfile supports overriding the replayweb.page version without having to be r… (#1122) 2023-09-05 20:10:21 -04:00
frontend.conf.template Passthrough X-Forwarded-Proto header in frontend nginx (#1226) 2023-09-28 10:58:57 -07:00
index.d.ts Org settings layout fix + misc styling & consistency improvements (#1427) 2023-12-13 17:29:35 -05:00
lit-localize.json
minio.conf
package.json Org settings layout fix + misc styling & consistency improvements (#1427) 2023-12-13 17:29:35 -05:00
playwright.config.ts
postcss.config.js Org settings layout fix + misc styling & consistency improvements (#1427) 2023-12-13 17:29:35 -05:00
README.md
sample.env.local
tailwind.config.js Org settings layout fix + misc styling & consistency improvements (#1427) 2023-12-13 17:29:35 -05:00
tsconfig.eslint.json ESLint & Typescript fixes (#1407) 2023-11-24 12:32:53 -05:00
tsconfig.json Fix attribute casing & lit-analyzer issues (#1429) 2023-12-11 12:34:03 -05:00
web-test-runner.config.mjs Organize components into folders by function (#1411) 2023-11-29 14:12:29 -05:00
webpack.config.js Org settings layout fix + misc styling & consistency improvements (#1427) 2023-12-13 17:29:35 -05:00
webpack.dev.js build: disable webpack polling for hot reload 2023-09-18 15:14:34 -07:00
webpack.prod.js Improve frontend event system (#1450) 2023-12-13 14:11:15 -08:00
yarn.lock Org settings layout fix + misc styling & consistency improvements (#1427) 2023-12-13 17:29:35 -05:00

README.md

Development guide