Add dark theme support

razorjack · Oct 14, 2017 · 3ca38b8 · 3ca38b8
1 parent ac1ccb0
commit 3ca38b8
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 5 deletions.
diff --git a/custom.yml.example b/custom.yml.example
@@ -1,2 +1,2 @@
 bucketName: your-s3-bucket-name
-darkMode: false
+darkTheme: false
diff --git a/handler.js b/handler.js
@@ -17,7 +17,8 @@ function processDirectoryInBucket(directory, bucket) {
     let summary = summarizeFileList(files);
     let breadcrumbs = getBreadcrumbs(directory);
     let pathToUp = breadcrumbs[breadcrumbs.length - 2] ? breadcrumbs[breadcrumbs.length - 2].path : false;
-    var html = template({files, directories, summary, breadcrumbs, pathToUp});
+    let darkTheme = process.env.darkTheme == "true";
+    var html = template({files, directories, summary, breadcrumbs, pathToUp, darkTheme});
     var params = {
       Body: html,
       Bucket: bucket,

diff --git a/index.pug b/index.pug
@@ -5,9 +5,13 @@ html(lang='en')
     title Directory listing
     meta(name='viewport', content='width=device-width,initial-scale=1')
     meta(http-equiv='X-UA-Compatible', content='IE=edge')
-    link(href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css', rel='stylesheet', integrity='sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u', crossorigin='anonymous')
+
+    if darkTheme
+      link(href='https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/cyborg/bootstrap.min.css', rel='stylesheet', integrity='sha384-D9XILkoivXN+bcvB2kSOowkIvIcBbNdoDQvfBNsxYAIieZbx8/SI4NeUvrRGCpDi', crossorigin='anonymous')
+    else
+      link(href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css', rel='stylesheet', integrity='sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u', crossorigin='anonymous')
+
     link(href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css', rel='stylesheet', integrity='sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN', crossorigin='anonymous')
-    // <link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/cyborg/bootstrap.min.css" rel="stylesheet" integrity="sha384-D9XILkoivXN+bcvB2kSOowkIvIcBbNdoDQvfBNsxYAIieZbx8/SI4NeUvrRGCpDi" crossorigin="anonymous">
     style(type='text/css').
       body {
         padding-top: 20px;

diff --git a/serverless.yml b/serverless.yml
@@ -22,7 +22,7 @@ plugins:
 # frameworkVersion: "=X.X.X"
 custom:
   bucketName: ${file(custom.yml):bucketName}
-  darkMode: ${file(custom.yml):darkMode, 'false'}
+  darkTheme: ${file(custom.yml):darkTheme, 'false'}
 
 provider:
   name: aws
@@ -82,6 +82,8 @@ provider:
 functions:
   generateListing:
     handler: handler.generateListing
+    environment:
+      darkTheme: ${self:custom.darkTheme}
     events:
       - existingS3:
           bucket: ${self:custom.bucketName}