main.scss

---
# Only the main Sass file needs front matter (the dashes are enough)
---

@import "{{ site.theme }}";

.post img {
        display: block;
        // border:1px solid #021a40;
        vertical-align: top;
        margin-left: auto;
        margin-right: auto;
}

.post figcaption {
  text-align: center;
  font-size: .8rem;
  font-style: italic;
  color: light-grey;
}

.language-python + .language-plaintext {
        border-left: 1px solid grey;
        margin-left: 1rem !important;
}

// ensure dark background for code
[class^="language-"]:not(.language-plaintext) pre,
[class^="language-"]:not(.language-plaintext) code
{
  background-color: #323443 !important;
}

.language-python + .language-plaintext code { background-color: white !important; }
.language-python + .language-plaintext pre  { background-color: white !important; }

// for Jupyter Notebook HTML Code Cells modified from https://www.fast.ai/public/css/hyde.css

.input_area pre, .input_area div {
        margin-bottom:2rem !important;
        margin-top:1.5rem !important;
        padding-bottom:0 !important;
        padding-top:0 !important;
        background: #323443 !important;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
        font-family: Menlo, Monaco, Consolas, "Lucida Console", Roboto, Ubuntu, monospace;
        border-radius: 5px;
}
.output_area pre, .output_area div {
        margin-bottom:0.1rem !important;
        margin-top:0.1rem !important;
        padding-bottom:0 !important;
        padding-top:0 !important;
}
.input_area pre {
        border-left: 1px solid lightcoral;
}
.output_area pre {
        border-left: 1px solid grey;
        margin-left: 1rem !important;
}

.code_cell table { width: auto; }

.page-content {
        -webkit-font-smoothing: antialiased !important;
        text-rendering: optimizeLegibility !important;
        font-family: "Segoe UI", SegoeUI, "Segoe WP", "Helvetica Neue", "Helvetica", "Tahoma", "Arial", sans-serif;
}

// make non-headings slightly lighter
.post-content p, .post-content li {
   font-size: 20px;
   color: #515151;
}

// change padding of headings
h1 {
    margin-top:2.5rem !important;      
}

h2 {
    margin-top:2rem !important;      
}

h3, h4 {
    margin-top:1.5rem !important;      
}

// make sure the post title doesn't have too much spacing
.post-title { margin-top: .5rem !important; }

li {
  h3, h4 {
  margin-top:.05rem !important;
  margin-bottom:.05rem !important;
  }
  .post-meta-description {
    color: rgb(88, 88, 88);
    font-size: 15px;
    margin-bottom:.05rem !important;
  }
}

/* Dracula Theme v1.2.5
 *
 * https://github.com/zenorocha/dracula-theme
 *
 * Copyright 2016, All rights reserved
 *
 * Code licensed under the MIT license
 *
 */

/*
 * Variables
 */

 $dt-gray-dark: #282a36;  // Background
 $dt-gray: #44475a;       // Current Line & Selection
 $dt-gray-light: #f8f8f2; // Foreground
 $dt-blue: #6272a4;       // Comment
 $dt-cyan: #8be9fd;
 $dt-green: #50fa7b;
 $dt-orange: #ffb86c;
 $dt-pink: #ff79c6;
 $dt-purple: #bd93f9;
 $dt-red: #ff5555;
 $dt-yellow: #f1fa8c;
 $dt-green-light: rgb(172, 229, 145);
 
 /*
  * Styles
  */
 
 .highlight {
//    background: $dt-gray-dark;
//    color: $dt-gray-light;
 
   .hll,
   .s,
   .sa,
   .sb,
   .sc,
   .dl,
   .sd,
   .s2,
   .se,
   .sh,
   .si,
   .sx,
   .sr,
   .s1,
   .ss {
        color:rgb(231, 153, 122);
   }
 
   .go {
     color: $dt-gray;
   }
 
   .err,
   .g,
   .l,
   .n,
   .x,
   .ge,
   .gr,
   .gh,
   .gi,
   .gp,
   .gs,
   .gu,
   .gt,
   .ld,
   .no,
   .nd,
   .pi,
   .ni,
   .ne,
   .nn,
   .nx,
   .py,
   .w,
   .bp {
     color: $dt-gray-light;
   }

   .p {
        font-weight: bold;
        color: rgb(102, 217, 239);
}
 
//    .gh,
//    .gi,
//    .gu {
//      font-weight: bold;
//    }
 
   .ge {
     text-decoration: underline;
   }
 
   .bp {
     font-style: italic;
   }
 
   .c,
   .ch,
   .cm,
   .cpf,
   .c1,
   .cs {
     color: $dt-blue;
   }
 
   .kd,
   .kt,
   .nb,
   .nl,
   .nv,
   .vc,
   .vg,
   .vi,
   .vm {
     color: $dt-cyan;
   }
 
   .kd,
   .nb,
   .nl,
   .nv,
   .vc,
   .vg,
   .vi,
   .vm {
     font-style: italic;
   }
 
   .fm,
   .na,
   .nc,
   .nf
    {
     color: $dt-green-light;
   }
 
   .k,
   .o,
   .cp,
   .kc,
   .kn,
   .kp,
   .kr,
   .nt,
   .ow {
     color: $dt-pink;
   }

   .kc {
        color: $dt-green-light;   
   }
 
   .m,
   .mb,
   .mf,
   .mh,
   .mi,
   .mo,
   .il {
     color: $dt-purple;
   }
 
   .gd {
     color: $dt-red;
   }
 }

//  Code Folding

 details.description[open] summary::after {
  content: attr(data-open);
}

details.description:not([open]) summary::after {
  content: attr(data-close);
}

.notebook-badge-image {
  border:0 !important;
}

.footnotes {
  font-size: 12px !important;
  p{
    font-size: 12px !important;
 }
}

.social.svg-icon {
  width: 21px !important;
}

.anchor-link {
  opacity: 0;
  padding-left: 0.375em;
  \-webkit-text-stroke: 1.75px white;
  \-webkit-transition: opacity 0.2s ease-in-out 0.1s;
  \-moz-transition: opacity 0.2s ease-in-out 0.1s;
  \-ms-transition: opacity 0.2s ease-in-out 0.1s;
}

h1:hover .anchor-link,
h2:hover .anchor-link,
h3:hover .anchor-link,
h4:hover .anchor-link,
h5:hover .anchor-link,
h6:hover .anchor-link {
  opacity: 1;
}

.page-description {
  color: #585858;
  font-size: 110%;
}

// category tags
.category-tags {
  margin-top: .25rem !important;
  margin-bottom: .25rem !important;
}

.post-meta-title{
  margin-top: .25em;
  margin-bottom: .25em;
}

.category-tags-icon {
  font-size: 75% !important;
  padding-left: 0.375em;
  opacity: 35%;
}
.category-tags-link {
  color:rgb(187, 129, 129) !important;
  font-size: 13px !important;
}

// lunr search styles
#lunrsearchresults {padding-top: 0.2rem;}
.lunrsearchresult {padding-bottom: 1rem;}
.lunrsearchresult .title {color: #d9230f;}
.lunrsearchresult .url {color: silver;}
.lunrsearchresult a {display: block; color: #777;}
.lunrsearchresult a:hover, .lunrsearchresult a:focus {text-decoration: none;}
.lunrsearchresult a:hover .title {text-decoration: underline;}