Merge pull request #156 from lbryio/markdown_refactor
decouple markdown and page content, simplify css
This commit is contained in:
netop:// ウェッブ
GitHub
commit
303caa19a4
9 changed files with 360 additions and 350 deletions
|
|
@ -9,17 +9,18 @@ module.exports = exports = () => `
|
|||
<h3 class="ecosystem__submodule__title" data-action="openSubmodule" data-target="chainquery">chainquery</h3>
|
||||
|
||||
<div class="ecosystem__submodule__description">
|
||||
<h4 class="ecosystem__submodule__description__title">Overview</h4>
|
||||
<p>The model of Chainquery at its foundation consists of the fundamental data types found in the blockchain. This information is then expounded on with additional columns and tables that make querying the data much easier.</p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title __connection">Connection to...</h4>
|
||||
<p class="__connection-details"></p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title">Source</h4>
|
||||
<ul>
|
||||
<li><a href="https://github.com/lbryio/chainquery" title="chainquery source code">https://github.com/lbryio/chainquery</a></li>
|
||||
</ul>
|
||||
|
||||
<div class="ecosystem__submodule__markdown">
|
||||
<h4 class="ecosystem__submodule__description__title">Overview</h4>
|
||||
<p>The model of Chainquery at its foundation consists of the fundamental data types found in the blockchain. This information is then expounded on with additional columns and tables that make querying the data much easier.</p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title __connection">Connection to...</h4>
|
||||
<p class="__connection-details"></p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title">Source</h4>
|
||||
<ul>
|
||||
<li><a href="https://github.com/lbryio/chainquery" title="chainquery source code">https://github.com/lbryio/chainquery</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<ul class="__parents">
|
||||
<li class="__parent green" data-action="open" data-target="applications">Applications</li>
|
||||
<li class="__parent red" data-action="open" data-target="lbrycrd">Blockchain</li>
|
||||
|
|
|
|||
|
|
@ -9,16 +9,18 @@ module.exports = exports = () => `
|
|||
<h3 class="ecosystem__submodule__title" data-action="openSubmodule" data-target="lighthouse">lighthouse</h3>
|
||||
|
||||
<div class="ecosystem__submodule__description">
|
||||
<h4 class="ecosystem__submodule__description__title">Overview</h4>
|
||||
<p>Lighthouse is a lightning-fast advanced search engine API for publications on the lbrycrd with autocomplete capabilities.</p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title __connection">Connection to...</h4>
|
||||
<p class="__connection-details"></p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title">Source</h4>
|
||||
<ul>
|
||||
<li><a href="https://github.com/lbryio/lighthouse" title="lighthouse source code">https://github.com/lbryio/lighthouse</a></li>
|
||||
</ul>
|
||||
<div class="ecosystem__submodule__markdown">
|
||||
<h4 class="ecosystem__submodule__description__title">Overview</h4>
|
||||
<p>Lighthouse is a lightning-fast advanced search engine API for publications on the lbrycrd with autocomplete capabilities.</p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title __connection">Connection to...</h4>
|
||||
<p class="__connection-details"></p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title">Source</h4>
|
||||
<ul>
|
||||
<li><a href="https://github.com/lbryio/lighthouse" title="lighthouse source code">https://github.com/lbryio/lighthouse</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<ul class="__parents">
|
||||
<li class="__parent green" data-action="open" data-target="applications">Applications</li>
|
||||
|
|
|
|||
|
|
@ -9,16 +9,18 @@ module.exports = exports = () => `
|
|||
<h3 class="ecosystem__submodule__title" data-action="openSubmodule" data-target="reflector">reflector</h3>
|
||||
|
||||
<div class="ecosystem__submodule__description">
|
||||
<h4 class="ecosystem__submodule__description__title">Overview</h4>
|
||||
<p>A reflector cluster to accept LBRY content for hosting en masse, rehost the content, and make money on data fees (TODO). This code includes Go implementations of the LBRY peer protocol, reflector protocol, and DHT.</p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title __connection">Connection to...</h4>
|
||||
<p class="__connection-details"></p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title">Source</h4>
|
||||
<ul>
|
||||
<li><a href="https://github.com/lbryio/reflector.go" title="reflector source code">https://github.com/lbryio/reflector.go</a></li>
|
||||
</ul>
|
||||
<div class="ecosystem__submodule__markdown">
|
||||
<h4 class="ecosystem__submodule__description__title">Overview</h4>
|
||||
<p>A reflector cluster to accept LBRY content for hosting en masse, rehost the content, and make money on data fees (TODO). This code includes Go implementations of the LBRY peer protocol, reflector protocol, and DHT.</p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title __connection">Connection to...</h4>
|
||||
<p class="__connection-details"></p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title">Source</h4>
|
||||
<ul>
|
||||
<li><a href="https://github.com/lbryio/reflector.go" title="reflector source code">https://github.com/lbryio/reflector.go</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<ul class="__parents">
|
||||
<li class="__parent green" data-action="open" data-target="applications">Applications</li>
|
||||
|
|
|
|||
|
|
@ -9,17 +9,19 @@ module.exports = exports = () => `
|
|||
<h3 class="ecosystem__submodule__title" data-action="openSubmodule" data-target="wallet">wallet server</h3>
|
||||
|
||||
<div class="ecosystem__submodule__description">
|
||||
<h4 class="ecosystem__submodule__description__title">Overview</h4>
|
||||
<p>The LBRY app is a graphical browser for the decentralized content marketplace provided by the <a href="https://lbry.io" title="">LBRY</a> protocol. It is essentially the <a href="https://github.com/lbryio/lbry" title="">lbry daemon</a> bundled with an UI using <a href="http://electron.atom.io" title="">Electron</a>.</p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title __connection">Connection to...</h4>
|
||||
<p class="__connection-details"></p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title">Source</h4>
|
||||
<ul>
|
||||
<li><a href="https://github.com/lbryio/lbry-desktop" title="lbry-desktop source code">https://github.com/lbryio/lbry-desktop</a></li>
|
||||
</ul>
|
||||
|
||||
<div class="ecosystem__submodule__markdown">
|
||||
<h4 class="ecosystem__submodule__description__title">Overview</h4>
|
||||
<p>The LBRY app is a graphical browser for the decentralized content marketplace provided by the <a href="https://lbry.io" title="">LBRY</a> protocol. It is essentially the <a href="https://github.com/lbryio/lbry" title="">lbry daemon</a> bundled with an UI using <a href="http://electron.atom.io" title="">Electron</a>.</p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title __connection">Connection to...</h4>
|
||||
<p class="__connection-details"></p>
|
||||
|
||||
<h4 class="ecosystem__submodule__description__title">Source</h4>
|
||||
<ul>
|
||||
<li><a href="https://github.com/lbryio/lbry-desktop" title="lbry-desktop source code">https://github.com/lbryio/lbry-desktop</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<ul class="__parents">
|
||||
<li class="__parent green" data-action="open" data-target="applications">Applications</li>
|
||||
<li class="__parent red" data-action="open" data-target="lbrycrd">Blockchain</li>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
"init/colors",
|
||||
"init/base",
|
||||
"init/mixins",
|
||||
"init/markdown",
|
||||
"init/extends",
|
||||
|
||||
"type/karla",
|
||||
|
|
|
|||
298
app/sass/init/_markdown.scss
Normal file
298
app/sass/init/_markdown.scss
Normal file
|
|
@ -0,0 +1,298 @@
|
|||
%markdown {
|
||||
h1 {
|
||||
margin-bottom: 0.25rem;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
+ h2 {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
@media (min-width: 901px) {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
+ h3 {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
@media (min-width: 901px) {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
h4 {
|
||||
letter-spacing: 0.05rem;
|
||||
text-transform: uppercase;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 1.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
sup {
|
||||
@include font-mono;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
left: 2px;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 0.5rem;
|
||||
position: relative;
|
||||
|
||||
@media (min-width: 601px) {
|
||||
margin-left: 15%; padding: 0.5rem 0 0.05rem 2rem;
|
||||
|
||||
font-size: 1.5rem;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
font-size: 1.25rem;
|
||||
padding: 0.5rem 0 0.05rem 0;
|
||||
}
|
||||
|
||||
@media (min-width: 376px) and (max-width: 600px) {
|
||||
margin-left: 5%;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
&::before {
|
||||
@include font-serif;
|
||||
width: 150px; height: 100px;
|
||||
top: 3rem; left: -2rem;
|
||||
|
||||
color: rgba($teal, 0.2);
|
||||
content: "\201C";
|
||||
font-size: 20rem;
|
||||
line-height: 0.5;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
ol,
|
||||
ul,
|
||||
table {
|
||||
code {
|
||||
background-color: $black;
|
||||
border-radius: 3px;
|
||||
color: $white;
|
||||
font-size: 60%;
|
||||
letter-spacing: 0.05rem;
|
||||
padding: 0.3rem 0.5rem;
|
||||
vertical-align: middle;
|
||||
|
||||
@media (max-width: 900px) {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
ol,
|
||||
ul {
|
||||
margin-bottom: 1rem;
|
||||
position: relative;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 1.05rem;
|
||||
line-height: 1.55;
|
||||
}
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
padding-top: 0.5rem;
|
||||
|
||||
li {
|
||||
&:not(:last-of-type) {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
+ h2, + h3, + h4, + h5 {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style-type: lower-roman;
|
||||
padding-left: 1.6rem;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
p {
|
||||
img {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
a:not(.__button-black):not(.button):not(.header-anchor):not(.newsletter-standalone__submit):not(.__plain) {
|
||||
@include underline($teal, $white);
|
||||
color: $teal;
|
||||
|
||||
code {
|
||||
background-color: $teal;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
margin-bottom: 2rem; padding: 2rem;
|
||||
|
||||
border-radius: 3px;
|
||||
font-size: 1rem;
|
||||
line-height: 1.33;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
|
||||
&:not([class]),
|
||||
&.language-text {
|
||||
background-color: #27283e;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
&.language-yaml {
|
||||
background-color: #27273f;
|
||||
color: #ffe066;
|
||||
|
||||
.atrule {
|
||||
color: #f083ac;
|
||||
}
|
||||
|
||||
.important {
|
||||
color: #ffa94d;
|
||||
}
|
||||
|
||||
.punctuation {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
h2, h3, h4, h5 {
|
||||
+ table {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
background-color: $white;
|
||||
border: 1px solid rgba($gray, 0.3);
|
||||
border-spacing: 0;
|
||||
margin-bottom: 2rem;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
@media (max-width: 1030px) {
|
||||
display: inline-grid;
|
||||
|
||||
thead {
|
||||
display: none;
|
||||
}
|
||||
|
||||
tbody, tr, td {
|
||||
display: block;
|
||||
}
|
||||
|
||||
tbody tr:last-of-type td:not(:last-of-type) {
|
||||
border-bottom: 1px solid rgba($gray, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
thead {
|
||||
background-color: $black;
|
||||
color: $white;
|
||||
cursor: default;
|
||||
position: relative;
|
||||
|
||||
tr {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&:not(*:root) {
|
||||
&::after {
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
&::after {
|
||||
width: calc(100% + 2px); height: calc(100% + 2px);
|
||||
top: -1px; left: -1px;
|
||||
|
||||
background-color: $black;
|
||||
content: "";
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
tr:nth-of-type(even) {
|
||||
background-color: rgba($black, 0.025);
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: 0.5rem 1rem;
|
||||
}
|
||||
|
||||
th {
|
||||
font-size: 0.8rem;
|
||||
letter-spacing: 0.1rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
tbody tr:not(:last-of-type) td {
|
||||
border-bottom: 1px solid rgba($gray, 0.3);
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -40,9 +40,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.page__content {
|
||||
background-image: url("/assets/media/images/grid.png");
|
||||
background-repeat: repeat;
|
||||
background-size: 32px;
|
||||
flex: 1;
|
||||
|
|
@ -50,310 +49,13 @@
|
|||
padding-bottom: 2rem;
|
||||
padding-right: env(safe-area-inset-right);
|
||||
padding-left: env(safe-area-inset-left);
|
||||
|
||||
h1 {
|
||||
margin-bottom: 0.25rem;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
+ h2 {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
h2:not(.__title) {
|
||||
@media (min-width: 901px) {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
+ h3 {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
h3:not(.ecosystem__submodule__title) {
|
||||
@media (min-width: 901px) {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
+ table {
|
||||
top: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
h4:not(.ecosystem__submodule__description__title) {
|
||||
letter-spacing: 0.05rem;
|
||||
text-transform: uppercase;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 1.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
sup {
|
||||
@include font-mono;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
left: 2px;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 0.5rem;
|
||||
position: relative;
|
||||
|
||||
@media (min-width: 601px) {
|
||||
margin-left: 15%; padding: 0.5rem 0 0.05rem 2rem;
|
||||
|
||||
font-size: 1.5rem;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
font-size: 1.25rem;
|
||||
padding: 0.5rem 0 0.05rem 0;
|
||||
}
|
||||
|
||||
@media (min-width: 376px) and (max-width: 600px) {
|
||||
margin-left: 5%;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
&::before {
|
||||
@include font-serif;
|
||||
width: 150px; height: 100px;
|
||||
top: 3rem; left: -2rem;
|
||||
|
||||
color: rgba($teal, 0.2);
|
||||
content: "\201C";
|
||||
font-size: 20rem;
|
||||
line-height: 0.5;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
ol,
|
||||
ul:not(.overview__ecosystem__module),
|
||||
table {
|
||||
code {
|
||||
background-color: $black;
|
||||
border-radius: 3px;
|
||||
color: $white;
|
||||
font-size: 60%;
|
||||
letter-spacing: 0.05rem;
|
||||
padding: 0.3rem 0.5rem;
|
||||
vertical-align: middle;
|
||||
|
||||
@media (max-width: 900px) {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
p,
|
||||
ol,
|
||||
ul:not(.feature-links):not(.overview__ecosystem__module):not(.__parents) {
|
||||
margin-bottom: 1rem;
|
||||
position: relative;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
font-size: 1.05rem;
|
||||
line-height: 1.55;
|
||||
}
|
||||
}
|
||||
|
||||
ol,
|
||||
ul:not(.feature-links):not(.overview__ecosystem__module):not(.__parents):not(.tour__sidebar) {
|
||||
padding-top: 0.5rem;
|
||||
|
||||
li {
|
||||
&:not(:last-of-type) {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
+ h2, + h3, + h4, + h5 {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style-type: lower-roman;
|
||||
padding-left: 1.6rem;
|
||||
}
|
||||
|
||||
ul:not(.feature-links):not(.overview__ecosystem__module):not(.__parents):not(.tour__sidebar) {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
p {
|
||||
img {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
a:not(.__button-black):not(.button):not(.feature-link__title):not(.header-anchor):not(.newsletter-standalone__submit):not(.__plain) {
|
||||
@include underline($teal, $white);
|
||||
color: $teal;
|
||||
|
||||
code {
|
||||
background-color: $teal;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
margin-bottom: 2rem; padding: 2rem;
|
||||
|
||||
border-radius: 3px;
|
||||
font-size: 1rem;
|
||||
line-height: 1.33;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
|
||||
&:not([class]),
|
||||
&.language-text {
|
||||
background-color: #27283e;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
&.language-yaml {
|
||||
background-color: #27273f;
|
||||
color: #ffe066;
|
||||
|
||||
.atrule {
|
||||
color: #f083ac;
|
||||
}
|
||||
|
||||
.important {
|
||||
color: #ffa94d;
|
||||
}
|
||||
|
||||
.punctuation {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
background-color: $white;
|
||||
border: 1px solid rgba($gray, 0.3);
|
||||
border-spacing: 0;
|
||||
margin-bottom: 2rem;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
@media (max-width: 1030px) {
|
||||
display: inline-grid;
|
||||
|
||||
thead {
|
||||
display: none;
|
||||
}
|
||||
|
||||
tbody, tr, td {
|
||||
display: block;
|
||||
}
|
||||
|
||||
tbody tr:last-of-type td:not(:last-of-type) {
|
||||
border-bottom: 1px solid rgba($gray, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
thead {
|
||||
background-color: $black;
|
||||
color: $white;
|
||||
cursor: default;
|
||||
position: relative;
|
||||
|
||||
tr {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&:not(*:root) {
|
||||
&::after {
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
&::after {
|
||||
width: calc(100% + 2px); height: calc(100% + 2px);
|
||||
top: -1px; left: -1px;
|
||||
|
||||
background-color: $black;
|
||||
content: "";
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
tbody {
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
tr:nth-of-type(even) {
|
||||
background-color: rgba($black, 0.025);
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: 0.5rem 1rem;
|
||||
}
|
||||
|
||||
th {
|
||||
font-size: 0.8rem;
|
||||
letter-spacing: 0.1rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
tbody tr:not(:last-of-type) td {
|
||||
border-bottom: 1px solid rgba($gray, 0.3);
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.page__markup {
|
||||
@extend %markdown;
|
||||
}
|
||||
|
||||
.page__header {
|
||||
// background-image: url("/assets/media/images/background-a.jpg");
|
||||
background-color: $black;
|
||||
}
|
||||
|
||||
.page__content {
|
||||
background-image: url("/assets/media/images/grid.png");
|
||||
}
|
||||
|
|
|
|||
|
|
@ -253,6 +253,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
.ecosystem__module__details, .ecosystem__submodule__markdown {
|
||||
@extend %markdown;
|
||||
}
|
||||
|
||||
.ecosystem__module__piece {
|
||||
background-color: $white;
|
||||
left: 10%;
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ module.exports = exports = (state, emit) => { // eslint-disable-line
|
|||
</div>
|
||||
</header>
|
||||
|
||||
<section class="page__content" itemprop="articleBody">
|
||||
<section class="page__content page__markup" itemprop="articleBody">
|
||||
<div class="inner-wrap">
|
||||
<p>The page you are looking for does not exist.</p>
|
||||
</div>
|
||||
|
|
@ -99,7 +99,7 @@ module.exports = exports = (state, emit) => { // eslint-disable-line
|
|||
|
||||
<section class="page__content" itemprop="articleBody">
|
||||
<div class="inner-wrap">
|
||||
${raw(updatedMarkdown)}
|
||||
<div class="page__markup">${raw(updatedMarkdown)}</div>
|
||||
${raw(pageScript)}
|
||||
${newMetadata.length ? raw(updateMetadata(newMetadata)) : ""}
|
||||
</div>
|
||||
|
|
@ -145,10 +145,8 @@ function partialFinder(markdownBody) {
|
|||
|
||||
if (fileExistsTest) {
|
||||
const partialFunction = require(path.join(__dirname, "..", `./components/${filename}.js`));
|
||||
|
||||
if (filename === "glossary-toc") markdownBody = markdownBody.replace(partial, partialFunction);
|
||||
|
||||
else markdownBody = markdownBody.replace(partial, partialFunction.default());
|
||||
const markdownHtml = filename === "glossary-toc" ? partialFunction : partialFunction.default(); //kill special case
|
||||
markdownBody = markdownBody.replace(partial, '</div>' + markdownHtml + '<div class="page__markup">');
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue