/* This document has been created with Marked.app , Copyright 2013 Brett Terpstra Content is property of the document author Please leave this notice in place7%, along with any additional credits below. --------------------------------------------------------------- Title: GitHub Author: Brett Terpstra Description: Github README style. Includes theme for Pygmentized code blocks. --------------------------------------------------------------- Modified by Olivier Spinnler (OpSpl, dr-spinnler.ch): * nice colors imitating pen on paper * font family * maximum column width of 50 rem * column centered and not into window borders * table caption * figure caption * built-in paper background + ornament for separating lines (
element) * special care of the vertical spacing * links and footnote markers are visible but discreet; they are hightlighted when hovered * vertical text positionning inside table cells and headers * easy to configure via variables at the top of the file Version date: 2020-10-10 Modified again by Barry MacKichan Changed default fonts to Minion Pro and Myriad Pro Changed px font dimensions to pt */ :root{ --font-size-normal: 12pt; --line-height: 1.5rem; /* line spacing, relative to the font size */ --max-width: 50rem; /* line length, relative to the font size */ --font-family: "Minion Pro", "ITC Stone Sans Std", Lato, "Noto Sans", "PT Sans", "Palatino Sans Com", "Frutiger Neue LT Pro", "IBM Plex Sans", "Between 2", "Helvetica Neue", Optima, Candara, "Avenir Next", Avenir, Verdana, sans-serif; /* ������ If you prefer a �Serifs� version, uncomment this font family, for example ������ --font-family: "PT Serif", "Palatino eText", "ITC Stone Serif Com", "ITC Stone Informal Std", "IBM Plex Serif", "Gentium Plus", "Frutiger Serif LT Pro", "Gentium Book Basic", "Warnock Pro", Constantia, Cochin, Optima, Cambria, Georgia, serif; */ --blockquote-font-family: "Minion Pro", "ITC Stone Serif Com", Cochin, Optima, Cambria, "Times New Roman", serif; /* OpSpl: was: "Lucida Grande", Lucida, Verdana, sans-serif; */ --blockquote-font-size: 12pt; --blockquote-color: #5463a9; --text-color: #bb0000; /* deep red ink */ /* --text-color: #042264; /* deep blue ink */ --text-color: #000000; /* black ink */ --link-color: #4183c4; /* light blue, kind of sky blue */ --link-hover-bg-color: #FFE5BA; /* kind of beige */ --link-hover-color: #619FDF; /* still light blue, but more readable over beige */ --table-head-bkg-color: hsl(38, 55%, 90%); /* for the header row of tables */ --table-alt-row-color: hsl(38, 55%, 93%); /* for the alternating rows of tables */ --font-size-code: 9pt; --font-size-h1: 15pt; --font-size-h2: 13pt; --font-size-h3: 12pt; --font-size-h4: 12pt; --font-size-h5: 12pt; --font-size-h6: 12pt; --font-weight-h1: 600; /* semibold is enough and more readable */ --font-weight-h2: 550; /* bolder is not necessary� */ --font-weight-h3: 600; /* semibold is enough and more readable */ --font-weight-h4: 700; /* to make them really stand up as headers */ --font-weight-h5: 700; /* to make them really stand up as headers */ --font-weight-h6: 700; /* to make them really stand up as headers */ --img-max-height: 25rem; /* to prevent images with portrait proportions from overwhelming text; put "100%" if you don�t like this idea*/ } html, body { background-color: pink; font-family: var(--font-family); font-size: var(--font-size-normal); color: var(--text-color); line-height: var(--line-height); max-width: var(--max-width); margin-left: auto; /* to center the content inside the window, left and right margins are set to �auto� */ margin-right: auto; border-bottom-color: var(--text-color); padding-left: .75rem; /* �padding� to offset content from window edges */ padding-right: .75rem; } p { margin-top: 0.6rem; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } /* OpSpl � to prevent �bold� from being too bold; if the font has a *semibold* variant, it will be preferred */ strong { font-weight: 600; } *:not('#mkdbuttons') { margin: 0; padding: 0; } a { color: var(--link-color); text-decoration: none; } a:hover { background-color: var(--link-hover-bg-color); text-decoration: none; color: var(--link-hover-color); border-top: .2rem solid var(--link-hover-bg-color); border-bottom: .2rem solid var(--link-hover-bg-color); } h1, h2, h3, h4, h5, h6 { line-height: 1.7; cursor: text; position: relative; padding: 0; margin-top: 1.3em; margin-bottom: 0em; } h1 { font-size: var(--font-size-h1); font-weight: var(--font-weight-h1); border-bottom: .05em solid; font-variant: small-caps; text-align: center; margin-top: 0; /* As this H1 generally appears at the top of a note or of a page, it�s not necessary to push it further down. Thus, we have more room for text on display, without sacrifycing aesthetics. */ margin-bottom: 1em; /* But we want some breathing room below it. */ } h2 { font-size: var(--font-size-h2); font-weight: var(--font-weight-h2); border-bottom: 0.12em; /* solid; */ margin-bottom: 1em; /* Here too, we want some breathing room. */ } h3 { font-size: var(--font-size-h3); font-weight: var(--font-weight-h3); margin-bottom: 0; font-style: italic; } h4 { font-size: var(--font-size-h4); font-weight: var(--font-weight-h4); margin-bottom: 0; font-style: italic; } h5 { font-size: var(--font-size-h5); font-weight: var(--font-weight-h5); margin-bottom: 0; font-style: italic; } h6 { font-size: var(--font-size-h6); font-weight: var(--font-weight-h6); margin-bottom: 0; font-style: italic; } blockquote, table, pre { margin: .75em 0 0 1em; } /* ������������ Lists ������������*/ ul, ol { margin-left: 1.5rem; margin-right: 0; margin-top: 0; padding-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0; list-style-position: outside; list-style-image: none; } /* every �list item� gets a small space above */ li { margin-top: .6rem; } li p { margin-top: .5rem; } ul li :last-child, ol li :last-child { margin-top: .3rem; margin-bottom: .4rem; } /* unordered or ordered list following a body paragraph */ p + ul, p + ol { padding-top: 0; margin-top: .5rem; padding-bottom: 0; margin-bottom: 0.6rem; } ol li { padding-left: 0; } ul li, ol li { /* selects every �list item� inside an �unordered list� or an �ordered list� */ margin-top: .3rem; } /* ������������ Definition lists ������������*/ dl { padding: 0; } dl dt { font-size: 14pt; font-weight: 600; /* OpSpl: was: bold; */ font-style: italic; padding: 0; margin: 15pt 0 5pt; } dl dt:first-child { padding: 0; } dl dt > :first-child { margin-top: 0; } dl dt > :last-child { margin-bottom: 0; } dl dd { margin: 0 0 15pt; padding: 0 15pt; } dl dd > :first-child { margin-top: 0; } dl dd > :last-child { margin-bottom: 0; } /* ------------------ Block quotes ------------------ */ blockquote { border-left: 6pt solid ; /* KD: was 4px; OpSpl changed #DDD to blockquote color */ margin: 30pt; /* KD */ padding: 0 20px; /* KD; was 15px */ color: var(--blockquote-color); font-family: var(--blockquote-font-family); font-size: var(--blockquote-font-size); font-style: italic; } blockquote > :first-child { margin-top: 0; } blockquote > :last-child { margin-bottom: 0; } hr { /* swirl elaborated by OpSpl */ height: 2rem; background: url(data:image/png;base64,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); background-repeat: no-repeat; background-position: center; width: 100%; max-width: 100%; margin-top: 30pt; margin-bottom: 30pt; border-style: none; } /* ������������ Tables ����������������*/ table { border-collapse: collapse; border-spacing: 0; font-size: 100%; font: inherit; margin: 1em auto; border: 0.1em solid var(--text-color); } table th { font-weight: 600; /* border-width: 2pt; */ /* border-style: solid; */ padding: .3em .5em .4em; background-color: var(--table-head-bkg-color); font-size: 1.1em; border-right-style: none; vertical-align: bottom; } table td { padding: .4em .5em .4em .4em; border-width: 2em; border-style: none; line-height: 1.2em; border-right-style: none; vertical-align: top; } /* table tr { border-width: 2pt; border-style: solid; // background-color: #fff; border-right-style: none; } */ table tr:nth-child(2n) { background-color: var(--table-alt-row-color); } table caption { font-weight: 600; /* OpSpl: was bold */ font-style: italic; padding-bottom: .4em; padding-top: .4em; font-size: 1.1em; caption-side: top; } /* ������������ Images ����������������*/ figure { margin: 2em 0 2em 0em; } figure img { /* OpSpl added a frame via outline property */ outline: 2pt solid var(--text-color); outline-offset: 10pt; left: 10pt; position: relative; margin-bottom: 7pt; } figcaption { /* OpSpl: adjusted to frame and overall styling */ font-weight: 600; font-style: italic; padding-bottom: 1em; padding-top: .4em; padding-left: .6em; font-size: .9em; } img { /* OpSpl: preventing images from overwhelming text */ max-width: 100%; max-height: var(--img-max-height); } /* ������������ Code ����������������*/ code, tt { margin: 0 2pt; padding: 0 5pt; white-space: nowrap; border: 1pt solid #eaeaea; background-color: #f8f8f8; border-radius: 3pt; font-family: Inconsolata, Menlo, Consolas, 'Liberation Mono', Courier, monospace; font-size: var(--font-size-code); color: #333333; } pre > code { margin: 0; padding: 0; white-space: pre; border: none; background: transparent; font-size: var(--font-size-code); } .highlight pre { background-color: #f8f8f8; border: 1pt solid #ccc; font-size: 13pt; line-height: 19pt; overflow: auto; padding: 6pt 10pt; border-radius: 3pt; } pre { background-color: #f8f8f8; border: 1pt solid #ccc; font-size: 14pt; line-height: 19pt; overflow: auto; padding: 6pt 10pt; border-radius: 3pt; margin: 26pt 0; } pre code, pre tt { background-color: transparent; border: none; font-size: var(--font-size-code); } .poetry pre { font-family: Georgia, Garamond, serif !important; font-style: italic; font-size: 110% !important; line-height: 1.6em; display: block; margin-left: 1em; } .poetry pre code { font-family: Georgia, Garamond, serif !important; word-break: break-all; word-break: break-word; /* Non standard for webkit */ -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; white-space: pre-wrap; } sup, sub, a.footnote { font-size: 1.4ex; height: 0; line-height: 1; vertical-align: super; position: relative; } a.footnote { height: 0; line-height: 1; vertical-align: super; position: relative; color: var(--link-color); font-size: .9em; } a.footnote:hover { background-color: var(--link-hover-bg-color); /* text-decoration: underline; */ color: var(--link-hover-color); border-top: .2rem solid var(--link-hover-bg-color); border-bottom: .2rem solid var(--link-hover-bg-color); } sub { vertical-align: sub; top: -1pt; } @media print { html, body { background-color: white; } } @media screen { html, body { background: url(data:image/jpeg;base64,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) 0% 0% repeat scroll; background-size: auto; } }