algorithm-visualizer
diff --git a/‎.gitignore
Lines changed: 1 addition & 0 deletions b/‎.gitignore
Lines changed: 1 addition & 0 deletions
diff --git a/‎img/2/logo.png renamed to ‎img/3/logo.png b/‎img/2/logo.png renamed to ‎img/3/logo.png
diff --git a/‎img/3/screenshot.png
-243 KB b/‎img/3/screenshot.png
-243 KB
diff --git a/‎img/4/screenshot.png
803 KB b/‎img/4/screenshot.png
803 KB
diff --git a/‎index.html
Lines changed: 2 additions & 2 deletions b/‎index.html
Lines changed: 2 additions & 2 deletions
diff --git a/‎stylesheet.css
Lines changed: 9 additions & 8 deletions b/‎stylesheet.css
Lines changed: 9 additions & 8 deletions
diff --git a/‎stylesheet.css.map
Lines changed: 1 addition & 1 deletion b/‎stylesheet.css.map
Lines changed: 1 addition & 1 deletion
diff --git a/‎stylesheet.scss
Lines changed: 16 additions & 15 deletions b/‎stylesheet.scss
Lines changed: 16 additions & 15 deletions
@@ -1 +1,2 @@
 .idea
+.DS_Store
@@ -302,7 +302,7 @@
 </div>
 
 <script>
-  const frameLengths = [4, 3, 3, 1, 9, 10, 2];
+  const frameLengths = [4, 3, 3, 1, 9, 10, 1];
   const slideLength = frameLengths.length;
   const show = (slideIndex = 0, frameIndex = 0) => {
     let initial = false;
@@ -362,4 +362,4 @@
 </script>
 
 </body>
-</html>
+</html>
@@ -132,15 +132,15 @@ a {
   }
 
   &._0 {
-    background-image: url(./img/1/visualgo.png);
+    background-image: url(img/1/visualgo.png);
   }
 
   &._1 {
-    background-image: url(./img/1/usfca.png);
+    background-image: url(img/1/usfca.png);
   }
 
   &._2 {
-    background-image: url(./img/1/khan.png);
+    background-image: url(img/1/khan.png);
   }
 }
 
@@ -188,11 +188,14 @@ a {
 }
 
 .slide-3 {
-  background: url(./img/2/logo.png) no-repeat center;
+  background: url(img/3/logo.png) no-repeat center;
 }
 
 .slide-4 {
-  background: url(./img/3/screenshot.png) no-repeat center;
+  background: url(img/4/screenshot.png) no-repeat center;
+  background-size: contain;
+
+  $height-header: 84px;
 
   .highlight {
     position: absolute;
@@ -216,29 +219,29 @@ a {
   &._3,
   &._4 {
     .highlight {
-      bottom: 1080-84px;
+      bottom: 1080-$height-header;
     }
   }
 
   &._5 {
     .highlight {
-      top: 84px;
+      top: $height-header;
       right: 1920 * .8px;
     }
   }
 
   &._6,
   &._7 {
     .highlight {
-      top: 84px;
+      top: $height-header;
       left: 1920 * .2px;
       right: 1920 * .4px;
     }
   }
 
   &._8 {
     .highlight {
-      top: 84px;
+      top: $height-header;
       left: 1920 * .6px;
       right: 0;
     }
@@ -455,12 +458,10 @@ a {
     content: 'When the back-end compiles and runs code, the visualization library emits a change log.';
   }
   &._9:after {
-    content: 'The back-end then passes the change log on to the front-end, and the front-end interprets and renders it step by step';
+    content: 'The back-end then passes the change log on to the front-end, and the front-end interprets and renders it step by step.';
   }
 }
 
-.slide-6 {
-  &._0:after {
-    content: 'Visit algorithm-visualizer.org and be a part of our community.';
-  }
-}
+.slide-6:after {
+  content: 'Visit algorithm-visualizer.org.';
+}
Original file line number	Diff line number	Diff line change
`@@ -132,15 +132,15 @@ a {`
`132`	`132`	`}`
`133`	`133`
`134`	`134`	`&._0 {`
`135`		`- background-image: url(./img/1/visualgo.png);`
	`135`	`+ background-image: url(img/1/visualgo.png);`
`136`	`136`	`}`
`137`	`137`
`138`	`138`	`&._1 {`
`139`		`- background-image: url(./img/1/usfca.png);`
	`139`	`+ background-image: url(img/1/usfca.png);`
`140`	`140`	`}`
`141`	`141`
`142`	`142`	`&._2 {`
`143`		`- background-image: url(./img/1/khan.png);`
	`143`	`+ background-image: url(img/1/khan.png);`
`144`	`144`	`}`
`145`	`145`	`}`
`146`	`146`
`@@ -188,11 +188,14 @@ a {`
`188`	`188`	`}`
`189`	`189`
`190`	`190`	`.slide-3 {`
`191`		`- background: url(./img/2/logo.png) no-repeat center;`
	`191`	`+ background: url(img/3/logo.png) no-repeat center;`
`192`	`192`	`}`
`193`	`193`
`194`	`194`	`.slide-4 {`
`195`		`- background: url(./img/3/screenshot.png) no-repeat center;`
	`195`	`+ background: url(img/4/screenshot.png) no-repeat center;`
	`196`	`+ background-size: contain;`
	`197`	`+`
	`198`	`+ $height-header: 84px;`
`196`	`199`
`197`	`200`	`.highlight {`
`198`	`201`	`position: absolute;`
`@@ -216,29 +219,29 @@ a {`
`216`	`219`	`&._3,`
`217`	`220`	`&._4 {`
`218`	`221`	`.highlight {`
`219`		`- bottom: 1080-84px;`
	`222`	`+ bottom: 1080-$height-header;`
`220`	`223`	`}`
`221`	`224`	`}`
`222`	`225`
`223`	`226`	`&._5 {`
`224`	`227`	`.highlight {`
`225`		`- top: 84px;`
	`228`	`+ top: $height-header;`
`226`	`229`	`right: 1920 * .8px;`
`227`	`230`	`}`
`228`	`231`	`}`
`229`	`232`
`230`	`233`	`&._6,`
`231`	`234`	`&._7 {`
`232`	`235`	`.highlight {`
`233`		`- top: 84px;`
	`236`	`+ top: $height-header;`
`234`	`237`	`left: 1920 * .2px;`
`235`	`238`	`right: 1920 * .4px;`
`236`	`239`	`}`
`237`	`240`	`}`
`238`	`241`
`239`	`242`	`&._8 {`
`240`	`243`	`.highlight {`
`241`		`- top: 84px;`
	`244`	`+ top: $height-header;`
`242`	`245`	`left: 1920 * .6px;`
`243`	`246`	`right: 0;`
`244`	`247`	`}`
`@@ -455,12 +458,10 @@ a {`
`455`	`458`	`content: 'When the back-end compiles and runs code, the visualization library emits a change log.';`
`456`	`459`	`}`
`457`	`460`	`&._9:after {`
`458`		`- content: 'The back-end then passes the change log on to the front-end, and the front-end interprets and renders it step by step';`
	`461`	`+ content: 'The back-end then passes the change log on to the front-end, and the front-end interprets and renders it step by step.';`
`459`	`462`	`}`
`460`	`463`	`}`
`461`	`464`
`462`		`-.slide-6 {`
`463`		`- &._0:after {`
`464`		`- content: 'Visit algorithm-visualizer.org and be a part of our community.';`
`465`		`- }`
`466`		`-}`
	`465`	`+.slide-6:after {`
	`466`	`+ content: 'Visit algorithm-visualizer.org.';`
	`467`	`+}`