modify colors

orsi · May 28, 2020 · 33c1ab5 · 33c1ab5
1 parent 842b325
commit 33c1ab5
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 51 deletions.
diff --git a/src/components/DeveloperView/WorkSection/WorkSection.js b/src/components/DeveloperView/WorkSection/WorkSection.js
@@ -26,35 +26,23 @@ position: relative;
     width: 3px;
 }
 `;
-const PositionsList = styled.ul`
-font-size: .8em;
-list-style: none;
-margin: 16px 0 0 32px;
-padding: 0;
-opacity: .8;
-`;
-const PositionsListItem = styled.li`
-margin: 0;
-&:not(:first-of-type) {
-  margin-top: 16px;
-}
-`;
 const Company = styled.h3`
 font-size: 18px;
 margin: 0 auto;
 `;
-const Duration = styled.time`
-color: #999;
+const PositionTitle = styled.h4`
 font-size: smaller;
+font-weight: 400;
+margin: 0;
 line-height: 1;
 `;
-const PositionTitle = styled.h4`
-font-weight: 700;
-margin: 0;
+const Duration = styled.time`
+color: #999;
+font-size: smaller;
 line-height: 1;
 `;
 
-export default function WorkSection () {
+export default function WorkSection() {
 
   function getYears() {
     var ageDifMs = Date.now() - new Date('2014/09/01');
@@ -67,30 +55,28 @@ export default function WorkSection () {
   return (
     <WorkSectionContainer>
       <WorkSectionTitle id="work">Work</WorkSectionTitle>
-        <WorksList>
-          <WorksListItem>
-            <Company>Freelance Software Developer</Company>
-            <Duration>September 2014 ➔ Present, { getYears() } years { getMonths() } months</Duration>
-          </WorksListItem>
-          <WorksListItem>
-            <Company>Bombardier Aerospace</Company>
-            <Duration>October 2016 ➔ February 2020, 3 years, 5 months</Duration>
-            <PositionsList>
-              <PositionsListItem>
-                <PositionTitle>Senior Software Developer</PositionTitle>
-                <Duration>June 2019 ➔ February 2020, 8 months</Duration>
-              </PositionsListItem>
-              <PositionsListItem>
-                <PositionTitle>Full Stack Developer</PositionTitle>
-                <Duration>June 2017 ➔ May 2019, 2 years 1 month</Duration>
-              </PositionsListItem>
-              <PositionsListItem>
-                <PositionTitle>Front End Developer</PositionTitle>
-                <Duration>October 2016 ➔ May 2017, 9 months</Duration>
-              </PositionsListItem>
-            </PositionsList>
-          </WorksListItem>
-        </WorksList>
+      <WorksList>
+        <WorksListItem>
+          <Company>Self Employed</Company>
+          <PositionTitle>Freelancer</PositionTitle>
+          <Duration>September 2014 ➔ Present, {getYears()} years {getMonths()} months</Duration>
+        </WorksListItem>
+        <WorksListItem>
+          <Company>Bombardier Aerospace</Company>
+          <PositionTitle>Senior Software Developer</PositionTitle>
+          <Duration>June 2019 ➔ February 2020, 8 months</Duration>
+        </WorksListItem>
+        <WorksListItem>
+          <Company>Bombardier Aerospace</Company>
+          <PositionTitle>Full Stack Developer</PositionTitle>
+          <Duration>June 2017 ➔ May 2019, 2 years 1 month</Duration>
+        </WorksListItem>
+        <WorksListItem>
+          <Company>Bombardier Aerospace</Company>
+          <PositionTitle>Front End Developer</PositionTitle>
+          <Duration>October 2016 ➔ May 2017, 9 months</Duration>
+        </WorksListItem>
+      </WorksList>
     </WorkSectionContainer>
   );
 }
diff --git a/src/components/MusicView/MusicView.js b/src/components/MusicView/MusicView.js
@@ -66,9 +66,9 @@ export default function MusicView() {
     return (
         <MusicViewContainer>
 
-            <section>
+            {/* <section>
                 <MusicDescription>An eclectic variety of styles and immersive soundscapes.</MusicDescription>
-            </section>
+            </section> */}
 
             <section>
                 <YoutubeList>

diff --git a/src/components/NavigationBar/NavigationBar.js b/src/components/NavigationBar/NavigationBar.js
@@ -16,7 +16,7 @@ a {
     text-decoration: none;
 }
 &.is-open {
-    background-color: #0c0b10;
+    background-color: #040e1e;
     height: 100vh;
 }
 
@@ -43,6 +43,9 @@ const NameH1 = styled.h1`
 font-size: 1em;
 font-weight: 900;
 margin: 0;
+a {
+    color: inherit;
+}
 `;
 const HamburgerButton = styled.button`
 background: none;
@@ -91,6 +94,7 @@ padding: 0;
 `;
 const MenuListItem = styled.li`
 a {
+    color: inherit;
     display: flex;
     align-items: center;
     padding: 8px 0;

diff --git a/src/index.scss b/src/index.scss
@@ -8,8 +8,8 @@ $font-prefix: "~@ibm/plex";
     box-sizing: border-box;
 }
 body {
-    background-color: #0c0b10;
-    color: #d6cedb;
+    background-color: #040e1e;
+    color: #dfe3f0;
     font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
     font-family: 'IBM Plex Mono';
     font-size: 16px;
@@ -20,11 +20,11 @@ body {
 a,
 a:link,
 a:visited {
-    color: inherit;
+    color: #64ffdb;
 }
 a:active,
 a:focus {
-    color: inherit;
+    color: #64ffdb;
 }
 canvas {
     display: block;

diff --git a/src/services/automata.service.js b/src/services/automata.service.js
@@ -94,7 +94,7 @@ export class AutomataService {
             for (let x = 0; x < this.gridX; x++) {
                 if (this.grid[x][y] === true) {
                     const cellWidth = x * this.cellSize;
-                    this.context.fillStyle = `rgba(255,255,255,${alpha})`;
+                    this.context.fillStyle = `rgba(100, 255, 218, ${alpha})`;
                     this.context.fillRect(
                         cellWidth,
                         cellHeight,