Merge pull request #374 from anhtumai/358-add-dark-theme

Add theme argument to view in dark mode or light mode

README.md

@@ -342,7 +342,7 @@ serve(path=None, host=None, port=None, user_content=False, context=None, usernam
 Writes the specified Readme file to an HTML file with styles and assets inlined.
 
 ```python
-export(path=None, user_content=False, context=None, username=None, password=None, render_offline=False, render_wide=False, render_inline=True, out_filename=None, api_url=None, title=None, quiet=None, grip_class=None)
+export(path=None, user_content=False, context=None, username=None, password=None, render_offline=False, render_wide=False, render_inline=True, out_filename=None, api_url=None, title=None, quiet=None, theme='light', grip_class=None)
 ```
 
 - `path`: The filename to render, or the directory containing your Readme file, defaulting to the current working directory
@@ -358,6 +358,7 @@ export(path=None, user_content=False, context=None, username=None, password=None
 - `api_url`: A different base URL for the github API, for example that of a Github Enterprise instance. The default is the public API https://api.github.com.
 - `title`: The page title, derived from `path` by default
 - `quiet`: Do not print to the terminal
+- `theme`: Theme to view markdown file (light mode or dark mode). Valid options ("light", "dark"). Default: "light".
 - `grip_class`: Use a custom [Grip class](#class-gripflask)
 
 
@@ -424,7 +425,7 @@ Renders the markdown from the specified path or text, without caching,
 and returns an HTML page that resembles the GitHub Readme view.
 
 ```python
-render_page(path=None, user_content=False, context=None, username=None, password=None, render_offline=False, render_wide=False, render_inline=False, api_url=None, title=None, text=None, quiet=None, grip_class=None)
+render_page(path=None, user_content=False, context=None, username=None, password=None, render_offline=False, render_wide=False, render_inline=False, api_url=None, title=None, text=None, quiet=None, theme='light', grip_class=None)
 ```
 
 - `path`: The path to use for the page title, rendering `'README.md'` if None
@@ -440,6 +441,7 @@ render_page(path=None, user_content=False, context=None, username=None, password
 - `title`: The page title, derived from `path` by default
 - `text`: A string or stream of Markdown text to render instead of being loaded from `path` (Note: `path` can be used to set the page title)
 - `quiet`: Do not print to the terminal
+- `theme`: Theme to view markdown file (light mode or dark mode). Valid options ("light", "dark"). Default: "light".
 - `grip_class`: Use a custom [Grip class](#class-gripflask)
 
 
@@ -470,7 +472,7 @@ main(argv=None, force_utf8=True)
 A Flask application that can serve a file or directory containing a README.
 
 ```python
-Grip(source=None, auth=None, renderer=None, assets=None, render_wide=None, render_inline=None, title=None, autorefresh=None, quiet=None, grip_url=None, static_url_path=None, instance_path=None, **kwargs)
+Grip(source=None, auth=None, renderer=None, assets=None, render_wide=None, render_inline=None, title=None, autorefresh=None, quiet=None, theme='light', grip_url=None, static_url_path=None, instance_path=None, **kwargs)
 ```
 
 ##### default_renderer

grip/api.py

@@ -13,7 +13,7 @@
 def create_app(path=None, user_content=False, context=None, username=None,
                password=None, render_offline=False, render_wide=False,
                render_inline=False, api_url=None, title=None, text=None,
-               autorefresh=None, quiet=None, grip_class=None):
+               autorefresh=None, quiet=None, theme='light', grip_class=None):
     """
     Creates a Grip application with the specified overrides.
     """
@@ -43,20 +43,20 @@ def create_app(path=None, user_content=False, context=None, username=None,
 
     # Create the customized app with default asset manager
     return grip_class(source, auth, renderer, None, render_wide,
-                      render_inline, title, autorefresh, quiet)
+                      render_inline, title, autorefresh, quiet, theme)
 
 
 def serve(path=None, host=None, port=None, user_content=False, context=None,
           username=None, password=None, render_offline=False,
           render_wide=False, render_inline=False, api_url=None, title=None,
-          autorefresh=True, browser=False, quiet=None, grip_class=None):
+          autorefresh=True, browser=False, quiet=None, theme='light', grip_class=None):
     """
     Starts a server to render the specified file or directory containing
     a README.
     """
     app = create_app(path, user_content, context, username, password,
                      render_offline, render_wide, render_inline, api_url,
-                     title, None, autorefresh, quiet, grip_class)
+                     title, None, autorefresh, quiet, theme, grip_class)
     app.run(host, port, open_browser=browser)
 
 
@@ -72,14 +72,14 @@ def clear_cache(grip_class=None):
 def render_page(path=None, user_content=False, context=None,
                 username=None, password=None,
                 render_offline=False, render_wide=False, render_inline=False,
-                api_url=None, title=None, text=None, quiet=None,
+                api_url=None, title=None, text=None, quiet=None, theme='light',
                 grip_class=None):
     """
     Renders the specified markup text to an HTML page and returns it.
     """
     return create_app(path, user_content, context, username, password,
                       render_offline, render_wide, render_inline, api_url,
-                      title, text, False, quiet, grip_class).render()
+                      title, text, False, quiet, theme, grip_class).render()
 
 
 def render_content(text, user_content=False, context=None, username=None,
@@ -97,7 +97,7 @@ def render_content(text, user_content=False, context=None, username=None,
 def export(path=None, user_content=False, context=None,
            username=None, password=None, render_offline=False,
            render_wide=False, render_inline=True, out_filename=None,
-           api_url=None, title=None, quiet=False, grip_class=None):
+           api_url=None, title=None, quiet=False, theme='light', grip_class=None):
     """
     Exports the rendered HTML to a file.
     """
@@ -115,7 +115,7 @@ def export(path=None, user_content=False, context=None,
 
     page = render_page(path, user_content, context, username, password,
                        render_offline, render_wide, render_inline, api_url,
-                       title, None, quiet, grip_class)
+                       title, None, quiet, theme, grip_class)
 
     if export_to_stdout:
         try:

grip/app.py

@@ -43,7 +43,7 @@ class Grip(Flask):
     """
     def __init__(self, source=None, auth=None, renderer=None,
                  assets=None, render_wide=None, render_inline=None, title=None,
-                 autorefresh=None, quiet=None, grip_url=None,
+                 autorefresh=None, quiet=None, theme='light', grip_url=None,
                  static_url_path=None, instance_path=None, **kwargs):
         # Defaults
         if source is None or isinstance(source, str_type):
@@ -111,6 +111,7 @@ def __init__(self, source=None, auth=None, renderer=None,
             import logging
             log = logging.getLogger('werkzeug')
             log.setLevel(logging.ERROR)
+        self.theme = theme
 
         # Overridable attributes
         if self.renderer is None:
@@ -212,12 +213,23 @@ def _render_page(self, subpath=None):
                            if self.autorefresh
                            else None)
 
+        if self.theme == 'dark':
+            data_color_mode = 'dark'
+            data_light_theme = 'light'
+            data_dark_theme = 'dark'
+        else:
+            data_color_mode = 'light'
+            data_light_theme = 'light'
+            data_dark_theme = 'dark'
+
         return render_template(
             'index.html', filename=self.reader.filename_for(subpath),
             title=self.title, content=content, favicon=favicon,
             user_content=self.renderer.user_content,
             wide_style=self.render_wide, style_urls=self.assets.style_urls,
-            styles=self.assets.styles, autorefresh_url=autorefresh_url)
+            styles=self.assets.styles, autorefresh_url=autorefresh_url,
+            data_color_mode=data_color_mode, data_light_theme=data_light_theme,
+            data_dark_theme=data_dark_theme)
 
     def _render_refresh(self, subpath=None):
         if not self.autorefresh:

grip/command.py

@@ -38,6 +38,8 @@
   --norefresh       Do not automatically refresh the Readme content when
                     the file changes.
   --quiet           Do not print to the terminal.
+  --theme=<theme>   Theme to view markdown file (light mode or dark mode).
+                    Valid options ("light", "dark"). Default: "light"
 """
 
 from __future__ import print_function
@@ -59,6 +61,8 @@
 usage = '\n\n\n'.join(__doc__.split('\n\n\n')[1:])
 version = 'Grip ' + __version__
 
+# Note: GitHub supports more than light mode and dark mode (exp: light-high-constrast, dark-high-constrast).
+VALID_THEME_OPTIONS = ['light', 'dark']
 
 def main(argv=None, force_utf8=True, patch_svg=True):
     """
@@ -101,13 +105,23 @@ def main(argv=None, force_utf8=True, patch_svg=True):
     if args['--user'] and not password:
         password = getpass()
 
+    # Parse theme argument
+    if args['--theme']:
+        if args['--theme'] in VALID_THEME_OPTIONS:
+            theme: str = args['--theme']
+        else:
+            print('Error: valid options for theme argument are "light", "dark"')
+            return 1
+    else:
+        theme = 'light'
+
     # Export to a file instead of running a server
     if args['--export']:
         try:
             export(args['<path>'], args['--user-content'], args['--context'],
                    args['--user'], password, False, args['--wide'],
                    not args['--no-inline'], args['<address>'],
-                   args['--api-url'], args['--title'], args['--quiet'])
+                   args['--api-url'], args['--title'], args['--quiet'], theme)
             return 0
         except ReadmeNotFoundError as ex:
             print('Error:', ex)
@@ -126,7 +140,7 @@ def main(argv=None, force_utf8=True, patch_svg=True):
         serve(path, host, port, args['--user-content'], args['--context'],
               args['--user'], password, False, args['--wide'], False,
               args['--api-url'], args['--title'], not args['--norefresh'],
-              args['--browser'], args['--quiet'], None)
+              args['--browser'], args['--quiet'], theme, None)
         return 0
     except ReadmeNotFoundError as ex:
         print('Error:', ex)

grip/templates/base.html

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" data-color-mode={{ data_color_mode }} data-light-theme={{ data_light_theme }} data-dark-theme={{ data_dark_theme }}>
 <head>
   <meta charset="utf-8" />
   <title>{% block title %}Grip{% endblock %}</title>