Skip to content

Conversation

@fallaciousreasoning
Copy link
Collaborator

@fallaciousreasoning fallaciousreasoning commented Dec 16, 2024

This will allow pages (such as https://brave.com) to use Nala components without needing to load JavaScript. This uses the Declarative Shadow Dom API which hit baseline this year (so is supported in all browsers).

image
^ the above page does not load any scripts at all! The input and button elements work as is and after #942 lands the checkbox will too!

@github-actions
Copy link
Contributor

👋 Thanks for Submitting! This PR is available for preview at the link below.

✅ PR tip preview: https://943.pr.nala.bravesoftware.com/
✅ Commit preview: https://943.pr.nala.bravesoftware.com/commit-a850af3e92ac637cda040c981b95f99daf41c63f/

- ./tokens/css/variables-android.old.css: 7390 bytes
+ ./tokens/css/variables-android.css: 7390 bytes
---
- ./tokens/css/variables-browser.old.css: 6848 bytes
+ ./tokens/css/variables-browser.css: 6848 bytes
---
- ./tokens/css/variables-ios.old.css: 7033 bytes
+ ./tokens/css/variables-ios.css: 7033 bytes
---
- ./tokens/css/variables-marketing.old.css: 13501 bytes
+ ./tokens/css/variables-marketing.css: 13501 bytes
---
- ./tokens/css/variables-news.old.css: 526 bytes
+ ./tokens/css/variables-news.css: 526 bytes
---
- ./tokens/css/variables-newtab.old.css: 1933 bytes
+ ./tokens/css/variables-newtab.css: 1933 bytes
---
- ./tokens/css/variables-search.old.css: 2409 bytes
+ ./tokens/css/variables-search.css: 2409 bytes
---
- ./tokens/css/variables-web3.old.css: 905 bytes
+ ./tokens/css/variables-web3.css: 905 bytes
---
- ./tokens/css/variables.old.css: 119898 bytes
+ ./tokens/css/variables.css: 119898 bytes
Variables Diff: variables-android.diff
--- ./tokens/css/variables-android.old.css	2024-12-16 02:48:05.110626623 +0000
+++ ./tokens/css/variables-android.css	2024-12-16 02:47:25.574868141 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-browser.diff
--- ./tokens/css/variables-browser.old.css	2024-12-16 02:48:05.390624927 +0000
+++ ./tokens/css/variables-browser.css	2024-12-16 02:47:25.550868252 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-ios.diff
--- ./tokens/css/variables-ios.old.css	2024-12-16 02:48:05.770622625 +0000
+++ ./tokens/css/variables-ios.css	2024-12-16 02:47:25.590868066 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-marketing.diff
--- ./tokens/css/variables-marketing.old.css	2024-12-16 02:48:06.006621196 +0000
+++ ./tokens/css/variables-marketing.css	2024-12-16 02:47:25.614867954 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-news.diff
--- ./tokens/css/variables-news.old.css	2024-12-16 02:48:06.290619474 +0000
+++ ./tokens/css/variables-news.css	2024-12-16 02:47:25.642867824 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-newtab.diff
--- ./tokens/css/variables-newtab.old.css	2024-12-16 02:48:06.546617927 +0000
+++ ./tokens/css/variables-newtab.css	2024-12-16 02:47:25.650867787 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-search.diff
--- ./tokens/css/variables-search.old.css	2024-12-16 02:48:06.778616519 +0000
+++ ./tokens/css/variables-search.css	2024-12-16 02:47:25.634867862 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-web3.diff
--- ./tokens/css/variables-web3.old.css	2024-12-16 02:48:07.018615065 +0000
+++ ./tokens/css/variables-web3.css	2024-12-16 02:47:25.654867769 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 @media (prefers-color-scheme: light) {
Variables Diff: variables.diff
--- ./tokens/css/variables.old.css	2024-12-16 02:48:07.378612885 +0000
+++ ./tokens/css/variables.css	2024-12-16 02:47:25.386869015 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Fri Dec 13 2024 08:24:32 GMT+0000 (Coordinated Universal Time)
+ * Generated on Mon Dec 16 2024 02:47:25 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants