Skip to content

Instantly share code, notes, and snippets.

@mr4torr

mr4torr/dark-mode.html

Last active September 11, 2019 22:11
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save mr4torr/eb50b99c41c5eda3464dab3cc22a914d to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save mr4torr/eb50b99c41c5eda3464dab3cc22a914d to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. mr4torr revised this gist Sep 11, 2019. No changes.
  2. mr4torr renamed this gist Sep 11, 2019. 1 changed file with 0 additions and 0 deletions.
    0 icon svg dark mode → dark-mode.html
    View file
    File renamed without changes.
  3. mr4torr created this gist Sep 11, 2019.
    46 changes: 46 additions & 0 deletions icon svg dark mode
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,46 @@
    <!DOCTYPE html>
    <html>
    <head>
    <title>Parcel Sandbox</title>
    <meta charset="UTF-8" />
    <style>
    .row {
    display: flex;
    }
    .icon {
    padding: 10px;
    flex: 1;
    }
    .bg-dark {
    background: #3c4043;
    }
    .mode-light {
    fill: #e8eaed;
    }
    .mode-dark {
    fill: #3c4043;
    }
    </style>
    </head>

    <body>
    <div class="row">
    <div class="icon">
    <svg class="dark-mode mode-dark" viewBox="0 0 24 24">
    <path
    d="M20 8.69V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12 20 8.69zM12 18c-.89 0-1.74-.2-2.5-.55C11.56 16.5 13 14.42 13 12s-1.44-4.5-3.5-5.45C10.26 6.2 11.11 6 12 6c3.31 0 6 2.69 6 6s-2.69 6-6 6z"
    ></path>
    <path d="M0 0h24v24H0V0z" fill="none"></path>
    </svg>
    </div>
    <div class="icon bg-dark">
    <svg class="dark-mode mode-light" viewBox="0 0 24 24">
    <path
    d="M20 8.69V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12 20 8.69zm-2 5.79V18h-3.52L12 20.48 9.52 18H6v-3.52L3.52 12 6 9.52V6h3.52L12 3.52 14.48 6H18v3.52L20.48 12 18 14.48zM12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5z"
    ></path>
    <path d="M0 0h24v24H0V0z" fill="none"></path>
    </svg>
    </div>
    </div>
    </body>
    </html>