More template work

extension-js · Sep 19, 2024 · 283deca · 283deca
1 parent c8130f0
commit 283deca
Show file tree

Hide file tree

Showing 41 changed files with 255 additions and 230 deletions.
diff --git a/examples/action/action/styles.css b/examples/action/action/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/config-babel/newtab/styles.css b/examples/config-babel/newtab/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/config-eslint/newtab/styles.css b/examples/config-eslint/newtab/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/config-lint/newtab/styles.css b/examples/config-lint/newtab/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/config-prettier/newtab/styles.css b/examples/config-prettier/newtab/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/config-stylelint/newtab/styles.scss b/examples/config-stylelint/newtab/styles.scss
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/declarative_net_request/public/extension.svg b/examples/declarative_net_request/public/extension.svg
diff --git a/examples/locales/action/styles.css b/examples/locales/action/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/new-crypto/newtab/index.html b/examples/new-crypto/newtab/index.html
@@ -4,6 +4,7 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Crypto Extension</title>
+    <link rel="stylesheet" href="./styles.css" media="screen" />
   </head>
   <body>
     <header>

diff --git a/examples/new-crypto/newtab/styles.css b/examples/new-crypto/newtab/styles.css
@@ -16,7 +16,7 @@ body {
   max-width: 38em;
   margin: auto;
   color: #c9c9c9;
-  background-color: #0A0C10;
+  background-color: #0a0c10;
 }
 
 @media (max-width: 684px) {
@@ -59,15 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
-
 img {
   height: auto;
   max-width: 100%;
@@ -89,7 +80,7 @@ body {
   height: calc(100vh - 4rem);
 }
 
-header>div {
+header > div {
   display: flex;
   align-items: center;
 }
@@ -98,6 +89,90 @@ input {
   width: calc(100% - 74px);
 }
 
-input, button {
+input,
+button {
   height: 58px;
 }
+
+/* Pre and Code */
+pre {
+  background-color: #4a4a4a;
+  display: block;
+  padding: 1em;
+  overflow-x: auto;
+  margin-top: 0px;
+  margin-bottom: 2.5rem;
+  font-size: 0.9em;
+}
+
+code,
+kbd,
+samp {
+  font-size: 0.9em;
+  padding: 0 0.5em;
+  background-color: #4a4a4a;
+  white-space: pre-wrap;
+}
+
+pre > code {
+  padding: 0;
+  background-color: transparent;
+  white-space: pre;
+  font-size: 1em;
+}
+
+input,
+textarea {
+  border: 1px solid #c9c9c9;
+}
+input:focus,
+textarea:focus {
+  border: 1px solid #ffffff;
+}
+
+button {
+  display: inline-block;
+  padding: 5px 10px;
+  text-align: center;
+  text-decoration: none;
+  white-space: nowrap;
+  background-color: #ffffff;
+  color: #222222;
+  border-radius: 1px;
+  border: 1px solid #ffffff;
+  cursor: pointer;
+  box-sizing: border-box;
+}
+
+button:hover {
+  background-color: #c9c9c9;
+  color: #222222;
+  outline: 0;
+}
+
+button:focus-visible {
+  outline-style: solid;
+  outline-width: 2px;
+}
+
+input {
+  color: #c9c9c9;
+  padding: 6px 10px;
+  margin-bottom: 10px;
+  background-color: #4a4a4a;
+  border: 1px solid #4a4a4a;
+  border-radius: 4px;
+  box-shadow: none;
+  box-sizing: border-box;
+}
+
+input:focus {
+  border: 1px solid #ffffff;
+  outline: 0;
+}
+
+label {
+  display: block;
+  margin-bottom: 0.5rem;
+  font-weight: 600;
+}
diff --git a/examples/new-env-esm/newtab/index.html b/examples/new-env-esm/newtab/index.html
@@ -13,6 +13,7 @@ <h1>
           class="logo"
           src="/logo.png"
           alt="The .env logo"
+          width="120px"
         />
         <br />
         Welcome to your New ESModule + .env Extension

diff --git a/examples/new-env-esm/newtab/styles.css b/examples/new-env-esm/newtab/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/new-env/images/typescript.png b/examples/new-env/images/typescript.png
diff --git a/examples/new-env/newtab/styles.css b/examples/new-env/newtab/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;

diff --git a/examples/new-esm/newtab/index.html b/examples/new-esm/newtab/index.html
@@ -13,6 +13,7 @@ <h1>
           class="logo"
           src="/logo.png"
           alt="The .env logo"
+          width="120px"
         />
         <br />
         Welcome to your New ESModule Extension

diff --git a/examples/new-esm/newtab/styles.css b/examples/new-esm/newtab/styles.css
@@ -59,14 +59,6 @@ a {
   color: #e5e7eb;
 }
 
-a:visited {
-  color: #e6e6e6;
-}
-
-a:hover {
-  border: none;
-  color: #c9c9c9;
-}
 
 img {
   height: auto;