External stylesheet, fixed root breadcrumb bug.

2 years ago · 8bcb9a0699
--- a/context.go
+++ b/context.go
@ -50,6 +50,7 @@ func NewContext(root, fullPath string, fi os.FileInfo) (ctx Context) {
 	}

 	ctx.URL, _ = filepath.Rel(root, ctx.fullPath)
 	ctx.URL = strings.TrimPrefix(ctx.URL, ".")
 	ctx.URL = filepath.ToSlash("/" + ctx.URL)

 	ctx.Breadcrumbs = ctx.breadcrumbs()
--- a/embed.go
+++ b/embed.go
@ -3,5 +3,5 @@ package mdserver
 import "embed"

 // content holds our static web server content.
 //go:embed tmpl
 //go:embed tmpl static
 var content embed.FS
--- a/static/css/site.css
+++ b/static/css/site.css
@ -0,0 +1,93 @@
 body {
    font-family: sans-serif;
    line-height: 1.5;
    font-weight:400;
    counter-reset: h2;
    background-color: #282828;
    color: #fdf4c1;
 }

 a, a:hover {
    color: #fb4933;
 }

 h1, h2, h3, h4, h5, h6, h7, h8 {
    font-weight: 500;
    color: #fabd2f;
 }

 h2 {
    font-size:32px;
    border-top: 3px solid #504945;
    padding-top:16px;
    counter-reset: h3;
 }

 h3 {
    font-size: 24px;
    counter-reset: h4;
 }

 h4 {
    font-size: 20px;
 }

 h2:before {
    content : counter(h2,decimal) ". ";
    counter-increment : h2;
 }

 h3:before {
    content : counter(h2,decimal) "." counter(h3,decimal) ". ";
    counter-increment : h3;
 }

 h4:before {
    content : counter(h2,decimal) "." counter(h3,decimal) "." counter(h4,decimal) ". ";
    counter-increment : h4;
 }

 .container {
    width: 100%;
    max-width: 960px;
    padding: 16px;
    margin: auto;
    box-sizing: border-box;
 }

 .breadcrumbs {
    padding: 12px;
    background-color: #504945;
 }

 .dir-table {
    border-collapse: collapse;
    border-bottom: 6px solid #504945;
    width: 100%;
 }

 .dir-table td {
    padding: 6px;
 }

 .dir-table tr {
    border-bottom: 1px solid #504945;
 }

 pre {
    padding: 8px;
 }

 img {
    max-width: 100%;
 }

 .md {
    margin-top:16px;
 }

 /* Override for chroma code colors */
 .chroma {
    background-color: #3c3836;
    color: #fdf4c1;
 }
--- a/tmpl/page.html
+++ b/tmpl/page.html
@ -3,105 +3,8 @@
  <head>
    <style>
      {{.MarkdownCSS}}

      body {
          font-family: sans-serif;
          line-height: 1.5;
          font-weight:400;
          counter-reset: h2;
          background-color: #282828;
          color: #fdf4c1;
      }

      a, a:hover {
          color: #fb4933;
      }

      h1, h2, h3, h4, h5, h6, h7, h8 {
          font-weight: 500;
          color: #fabd2f;
      }

      h2 {
          font-size:32px;
          border-top: 3px solid #504945;
          padding-top:16px;
          counter-reset: h3;
      }

      h3 {
          font-size: 24px;
          counter-reset: h4;
      }

      h4 {
          font-size: 20px;
      }

      h2:before {
          content : counter(h2,decimal) ". ";
          counter-increment : h2;
 	    }

      h3:before {
          content : counter(h2,decimal) "." counter(h3,decimal) ". ";
          counter-increment : h3;
 	    }

      h4:before {
          content : counter(h2,decimal) "." counter(h3,decimal) "." counter(h4,decimal) ". ";
          counter-increment : h4;
 	    }


      .container {
          width: 100%;
          max-width: 960px;
          padding: 16px;
          margin: auto;
          box-sizing: border-box;
      }

      .breadcrumbs {
          padding: 12px;
          background-color: #504945;
          //border-radius: 6px;
      }

      .dir-table {
          border-collapse: collapse;
          border-bottom: 6px solid #504945;
          width: 100%;
      }

      .dir-table td {
          padding: 6px;
      }

      .dir-table tr {
          border-bottom: 1px solid #504945;
      }

      pre {
          padding: 8px;
          //border-radius: 6px;
      }

      img {
          //border-radius: 6px;
          max-width: 100%;
      }

      .md {
          margin-top:16px;
      }

      .chroma {
          background-color: #3c3836;
          color: #fdf4c1;
      }

    </style>
     <link rel="stylesheet" href="/static/css/site.css">
    <title>{{.URL}}</title>
  </head>
  <body>