Add Protocol base file to Relay, adjust main styles to maintain curre…

…nt look
mozilla · Jul 6, 2021 · e0b8569 · e0b8569
1 parent 2e528b2
commit e0b8569
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 16 deletions.
diff --git a/gulpfile.js b/gulpfile.js
@@ -1,10 +1,9 @@
 const { src, watch, series, dest } = require('gulp');
 const sass = require('gulp-sass');
 const del = require('del');
-const merge = require('merge-stream');
 
 // directory for building LESS, SASS, and bundles
-const buildDir = 'static/scss/libs/';
+const buildDir = 'static/scss/libs/protocol/';
 const finalDir = 'static/css/';
 
 function clean(cb) {
@@ -31,21 +30,14 @@ function styles(cb) {
 }
 
 function assetsCopy(cb) {
-    merge([
-        // SASS and LESS go to build dir
-        src([
-            '!node_modules/@mozilla-protocol/core/*',
-            'node_modules/@mozilla-protocol/core/**/*',
-            ])
-            .pipe(dest(buildDir)),
-    ]);
+    src(['node_modules/@mozilla-protocol/core/protocol/**/*']).pipe(dest(buildDir));
     cb();
 }
 
 exports.build = series(reset, assetsCopy, styles);
 
 exports.default = series(
-    reset, assetsCopy, styles, function() {
+    clean, assetsCopy, styles, function() {
         // You can use a single task
         watch('static/scss/**/*.scss', { ignoreInitial: false }, series(clean, styles));
     }

diff --git a/static/scss/app.scss b/static/scss/app.scss
@@ -1,5 +1,5 @@
 // Protocol
-// @import "libs/protocol/protocol";
+@import "libs/protocol/css/protocol.scss";
 
 // Includes
 @import "includes/variables";

diff --git a/static/scss/partials/main.scss b/static/scss/partials/main.scss
@@ -57,6 +57,15 @@ body {
   padding: 83px 0 0 0;
   font-size: 16px;
   overscroll-behavior: contain;
+  line-height: 1.2;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  color: var(--grey10);
+}
+
+:visited:hover, :visited:focus, :visited:active {
+  color: var(--grey10);
 }
 
 .loading {
@@ -69,7 +78,7 @@ body {
   color: var(--white);
 }
 
-.text-link {
+.text-link, .text-link:link {
   border-radius: 2px;
   color: inherit;
   text-decoration: underline;
@@ -120,7 +129,7 @@ h2,
   margin: 0;
 }
 
-a {
+a, :link, button {
   text-decoration: none;
 }
 
@@ -303,7 +312,6 @@ button:active {
   font-size: 1em;
   line-height: 1.7em;
   letter-spacing: 0.009em;
-  font-weight: 100;
 }
 
 .bold {
@@ -380,7 +388,7 @@ button:active {
 }
 
 .sign-in {
-  padding: 0.75em 1.25em;
+  padding: 0.75rem 1.25rem;
   font-weight: 400;
   display: flex;
   margin: auto;