Themes

artyom.css

/* artyom.brick.do */

@import url('https://fonts.googleapis.com/css2?family=Carter+One&family=Averia+Serif+Libre:ital,wght@0,400;0,700;1,400;1,700&display=swap');

figure {
  border: 1px solid #aaa;
  border-bottom: none;
}

figcaption {
  border: 1px solid #aaa !important;
  border-top: none !important;
}

figure, figcaption {
      box-shadow:
                0.5px 0.5px 0px #999,
                1.0px 1.0px 0px #999,
                1.5px 1.5px 0px #999,
                2.0px 2.0px 0px #999,
                2.5px 2.5px 0px #999,
                3.0px 3.0px 0px #999,
                3.5px 3.5px 0px #999,
                4.0px 4.0px 0px #999,
                4.5px 4.5px 0px #999,
                5.0px 5.0px 0px #999,
                5.5px 5.5px 0px #999,
                6.0px 6.0px 0px #999
                !important;
}

.page-title, h2, h3, h4 {
  font-family: 'Carter One', serif;
}

h2, h3, h4 {
  color: #900d0d;
}

h1, h2, h3, h4, hr, .ck-horizontal-line {
  clear: both !important;
}

.page-title {
  font-size: 280% !important;
  color: #900d0d;
  line-height: 125%;
}

.page,
.flex.items-center.px-6.justify-end,
.flex.justify-center.items-center.p-2 {
  background-color: rgba(255, 200, 150, 0.2);
  color: #423144;
  font-family: 'Averia Serif Libre', sans-serif;
  font-size: 115%;
}

mark {
  color: inherit;
}

h2, h3, h4 {
  margin-top: 1.5em;
  margin-bottom: 0.3em;
}

h3 {
  margin-bottom: -0.5em !important;
}

.ck-content hr {
    margin: 15px 0;
    height: 4px;
    background: #dedede;
    border: 0;
}

.page .ck-content .table table th {
  background-color: hsla(0,0%,0%,5%);
}

.page .ck-content .table table {
  width: 100%;
  height: 100%;
}

.page-link {
  font-weight: bold;
}

.page h1 a, .page h2 a, .page h3 a, .page h4 a {
  text-decoration: underline;
}

freedom.css

/* freedom.brick.do */

@import url('https://fonts.googleapis.com/css2?family=Prompt:ital,wght@0,500;0,700;1,500;1,700&display=fallback');
@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,700;1,400;1,700&display=fallback');

.sidebar {
  filter: invert(1);
  background-color: #eee !important;
}
mark.marker-blue, .page-link {
  background-color: rgba(208,239,255, 0.5) !important;
  padding: 2px 5px !important;
  border-radius: 2px;
  font-weight: bold;
}
.page, .page-title::before {
  font-family: 'Rubik', sans-serif;
}
.page-title, h2, h3, h4 {
  font-family: 'Prompt', sans-serif;
  line-height: 1.4;
}
.page-title {
  font-weight: 700;
  font-size: 2.4rem;
}
h3 { font-size: 1.4rem; }
h2, h3, h4 {
  margin-top: 1.5em;
  margin-bottom: 0.3em;
  font-weight: 500;
}
.page-title {
  border-radius: 4px;
  padding: 0.25em 0.5em;
  background: linear-gradient(to right, #000, #333);
  color: white;
}
h2 {
  border-radius: 4px;
  padding: 0.25em 0.5em;
  background: linear-gradient(to right, #333, #666);
  color: white;
  font-size: 2rem;
}

.page-title::before {
  white-space: pre-wrap;
  content: 'freedom.brick.do — How to do what you want' !important;
  color: white !important;
  display: block;
  line-height: 170%;
  font-size: 1.5rem;
  background: linear-gradient(to right, #ee0979, #ff6a00);
  padding: 0.5em 1em;
  margin-bottom: 2em;
  border-radius: 4px;
}
mark {
  color: inherit;
}
.page .ck-content blockquote {
  background-color: #f0f2f3;
  border-radius: 2px;
}
.page .ck-content blockquote p {
  font-size: 100% !important;
}
.page .ck-content ul > li > ul,
.page .ck-content ol > li > ul,
.page .ck-content ul > li > ol,
.page .ck-content ol > li > ol {
  margin-top: 0.3em;
  margin-bottom: 1em;
}
.page hr + hr, .page .ck-horizontal-line + .ck-horizontal-line {
  margin: 1em 0;
}
.page figcaption {
  font-size: 90% !important;
  font-weight: bold;
}
.page figure {
  border: 1px solid #aaa;
  border-bottom: 2px solid #aaa;
}

.ck-content hr {
    margin: 15px 0;
    height: 4px;
    background: #dedede;
    border: 0;
}
h1, h2, h3, h4, hr, .ck-horizontal-line {
  clear: both !important;
}

making.css

/* making.brick.do */

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400;1,700&family=Staatliches&display=swap');

h1, h2, h3, h4 {
  font-family: 'Staatliches';
  text-align: center !important;
}

h2, h3, h4 {
  margin-top: 2em;
}

.page-title {
  color: rgb(232, 23, 92);
  font-size: 280%;
  line-height: 115%;
}
.page-title::before { content: '❖ '; }
.page-title::after { content: ' ❖'; }

.page {
  font-family: 'Lato';
  font-size: 130%;
}


.page table {
  font-size: inherit !important;
  line-height: inherit !important;
}

.page a {
  color: rgb(232, 23, 92);
}

mark {
  background-color: #e8125c !important;
  color: white;
  padding: 0px 5px 3px 5px;
}

.page .page-link {
  color: rgb(232, 23, 92);
  background-color: rgba(232, 23, 92, 0.05); !important;
  padding: 2px 5px !important;
  border-radius: 5px;
  font-weight: bold;
}

.page ul {
  margin-top: -0.7em;
  margin-left: 1em;
}

figure {
  border: 1px solid #aaa;
  border-bottom: none;
}

figcaption {
  border: 1px solid #aaa !important;
  border-top: none !important;
}

figure, figcaption {
      box-shadow:
                0.5px 0.5px 0px #999,
                1.0px 1.0px 0px #999,
                1.5px 1.5px 0px #999,
                2.0px 2.0px 0px #999,
                2.5px 2.5px 0px #999,
                3.0px 3.0px 0px #999,
                3.5px 3.5px 0px #999,
                4.0px 4.0px 0px #999,
                4.5px 4.5px 0px #999,
                5.0px 5.0px 0px #999,
                5.5px 5.5px 0px #999,
                6.0px 6.0px 0px #999
                !important;
}

tek.css

@import url("https://ghcdn.rawgit.org/neongreen/files/master/webfont-iosevka-term-slab-4.1.1/iosevka-term-slab.css");

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap');

.page-title {
  font-weight: 900;
  font-size: 240%;
}
.page {
  font-family: 'IBM Plex Serif', serif;
  font-size: 110%;
}
.page code {
  font-family: 'Iosevka Term Slab Web', 'Menlo', monospace;
  font-size: 95%;
  text-shadow: none !important;
}
.page .ck-content pre {
  border: none;
}
.page .ck-content pre code span {
  background: inherit !important;
}

h2, h3, h4 {
  margin-top: 3em;
  margin-bottom: 0.3em;
}

@media only screen and (max-width: 500px) {
  .page table {
    font-size: 80%;
  }
}