Darkmode Images & Styling Added

_config.yml

@@ -13,7 +13,7 @@ description: > # this means to ignore newlines until "baseurl:"
 
 baseurl: "" # the subpath of your site, e.g. /blog
 url: "https://rehanbutt.com" # the base hostname & protocol for your site
-version: 8.24.0
+version: 8.25.0
 version-naming: [Apricot, Blackcurrent, Coconut, Dragonfruit, Elderberry, Fig, Guava, Honeydew]
 
 # Build settings

_projects/colorbot.markdown

@@ -24,6 +24,7 @@ In [Version (V1.0)](https://github.com/naher94/jasper/releases/tag/V1.0) Jasper
 
 ## Process
 
+{:#colorbot-table}
 | Effort/Priority | High   | Medium    | Low |
 | --------------- | ------ | -------   | --- |
 | **Low**         | Pull Tweets with #coloroftheday | clear formating | Creative error handling |

_projects/conversationaldesign.markdown

@@ -9,12 +9,12 @@ tags: bot
 
 As a designer I am very much interested in the design process and the tools used in the design process. One aspect that I find exceptionally interesting about the design process is how we communicate with one other specifically within the realm of verbal communication and conversation. Conversation and verbal communication was one of the first ways stories were passed down and still plays a very important role in our daily lives today from a quick chat in the hallway to formal presentations. As such I would like to wrap my thesis around this idea and create a tool to augment the design process from verbal input. Along the way we will explore the role that conversation and vocal communication plays in design. If you would like a more in depth look at my thoughs feel free to read my <a target="_blank" href="../img/conversationalDesign/conversationalDesignPaper.pdf">paper</a>.
 
-<div class="image-container"><img src="../img/conversationalDesign/designProcess.svg" alt="Design Process"/></div>
+<div class="image-container"><img src="../img/conversationalDesign/design-process.svg" alt="Design Process"/></div>
 
 I started by looking at what a design process could look like and came up what is shown above. The idea that designers either receive a prompt with the problem or find a problem to solve then jump into understanding the problem. Below I have created a storyboard that could be one injection of my design assistant into the “understanding the problem” phase of the design process. Throughout this project I would like to continue expanding what a design process is as well as create more scenario storyboards for each place where I see a useful injection of the design assistant.
 
 
-<div class="image-container" style="margin-top:50px;"><img src="../img/conversationalDesign/promptStoryBoard.svg" alt="Storyboarding the Prompt"/></div>
+<div class="image-container" style="margin-top:50px;"><img src="../img/conversationalDesign/prompt-storyboard.svg" alt="Storyboarding the Prompt"/></div>
 
 For several years now I have been exploring the design process and tools that exist in the space as well as designing new tools to solve certain pain points. One of the first projects that explored this was <a target="_blank" href="../esporre/">Esporre</a>, which explored the portfolio process, archiving storing and showcasing your work. Esporre has now evolved into, <a target="_blank" href="http://processly.io">Processly</a>, which looks at the process of producing work and how we work. Another aspect that I am very interested is that of color and the role color plays in our designs, which has lead me to thinking about several tools that could improve the space. One experiment of that is <a target="_blank" href="../colorbot">Jasper</a>, a color bot with the idea to expand your color vocabulary and provide a new source of inspiration, as a bot this project also explores the space of conversational design, bringing it full circle.
 

_projects/processly.markdown

@@ -0,0 +1,26 @@
+---
+layout: post
+title: "Processly"
+tile-name: "Processly"
+thumbnail: "processly"
+date: 2017-03-15
+tags: product web
+published: false
+---
+Processly is an infinite freeform online whiteboard, designed for modern education.
+
+Processly is an adaptive learning web platform that uses an infinite online whiteboard, making it easy for teachers, schools, and businesses to apply modern teaching methods. We do this by creating a play-space for learners to document, reflect, and communicate within a collaborative environment throughout their learning process, all the while providing key insights.
+
+Designed specifically with students and educators in mind, our platform makes it easier than ever to foster a learner-driven environment adapting to the various modern teaching methodologies being used today. By simply implementing Processly, you will find students taking accountability for their learning, improving their long-term learning skills, developing important life skills, and truly understand how it feels to learn and grow in their own unique ways.
+
+{:.post-callout-medium}
+It's about how we learn, not what we learn.
+
+Our tag line, Exposing the Process. The idea that ..... 
+
+{:.post-callout-medium}
+Iterate, organize, facilitate, reflect
+
+Processly is there at every step from the exploration to the discovery. The key to Processly is to help your students through the project process, exploring new ideas, iterating on them and reflecting on the finding to capture learnings for future work.
+
+What started as a class projects ESPORRE <link here>

css/rehan.scss

@@ -932,6 +932,23 @@ article{
   }
 }
 
+@media (prefers-color-scheme: dark){
+  #colorbot-table{
+    thead{
+      background: $navy-black-d5;
+      color: semantic-color(text);
+      border: 1px solid $navy-black-l1;
+    }
+    tbody{
+      background-color: $navy-black-d3; //same as page background
+      border: 1px solid $navy-black-l1;
+      tr:nth-child(even){
+        background-color: $navy-black-d1;
+      }
+    }
+  }
+}
+
 .camleon-button {
   background-color: #6cbe45;
   &:hover {