Added sitemap and documentation to Sass files
This commit is contained in:
ポール ウェッブ
parent
d31d26b2df
commit
1161adace4
6 changed files with 218 additions and 170 deletions
22
documents/sitemap.md
Normal file
22
documents/sitemap.md
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
---
|
||||
title: Sitemap
|
||||
---
|
||||
|
||||
- [/](/)
|
||||
- [/api](/api)
|
||||
- [/build](/build)
|
||||
- [/community](/community)
|
||||
- [/contribute](/contribute)
|
||||
- [/glossary](/glossary)
|
||||
- [/overview](/overview)
|
||||
- [/resources](/resources)
|
||||
- [/claimtrie](/resources/claimtrie)
|
||||
- [/encrypt-lbrycrd](/resources/encrypt-lbrycrd)
|
||||
- [/lbry-claimtrie](/resources/lbry-claimtrie)
|
||||
- [/pow](/resources/pow)
|
||||
- [/regtest-setup](/resources/regtest-setup)
|
||||
- [/repository-standards](/resources/repository-standards)
|
||||
- [/schema](/resources/schema)
|
||||
- [/signing-claim](/resources/signing-claim)
|
||||
- [/uri](/resources/uri)
|
||||
- [/tour](/tour)
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,5 +1,25 @@
|
|||
|
||||
// B U T T O N S
|
||||
/**
|
||||
* Button
|
||||
*
|
||||
* @class .__button-base
|
||||
* @class .__button-basic
|
||||
*
|
||||
* @class .__button-plain
|
||||
* @selector {::after}
|
||||
* @state {:hover}
|
||||
*
|
||||
* @class .__button-black
|
||||
* @state {:hover}
|
||||
*
|
||||
* @class .__button-white
|
||||
* @state {:hover}
|
||||
*
|
||||
* @class .__button-gray
|
||||
* @state {:hover}
|
||||
*
|
||||
* @class .__button-padding-horizontal
|
||||
* @class .__button-padding-vertical
|
||||
*/
|
||||
|
||||
.__button-base {
|
||||
border: 1px solid;
|
||||
|
|
@ -95,95 +115,26 @@
|
|||
}
|
||||
}
|
||||
|
||||
.__button-padding-vertical {
|
||||
padding-top: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.__button-padding-horizontal {
|
||||
padding-right: 1rem;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// G R I D
|
||||
|
||||
.__grid {
|
||||
&:first-of-type {
|
||||
cursor: default;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.2rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
&:not(:first-of-type) {
|
||||
border-left: 1px solid $gray;
|
||||
|
||||
.col {
|
||||
border-bottom-style: solid;
|
||||
border-bottom-width: 1px;
|
||||
|
||||
&:last-of-type {
|
||||
border-right-style: solid;
|
||||
border-right-width: 1px;
|
||||
}
|
||||
|
||||
&:not(.red):not(.orange):not(.yellow):not(.green) {
|
||||
border-color: $gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 600px) {
|
||||
display: table;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
|
||||
.col {
|
||||
display: table-cell;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.col {
|
||||
padding: 0.5rem 1rem;
|
||||
width: 100%;
|
||||
|
||||
&:not(:first-of-type) {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
// Padded columns
|
||||
.grid-padded {
|
||||
@media (min-width: 600px) {
|
||||
margin-right: -1rem;
|
||||
margin-left: -1rem;
|
||||
|
||||
.grid {
|
||||
border-spacing: 1rem 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Vertically center grid content
|
||||
// Requires content within the column to be inline/inline-block
|
||||
.grid-align-middle .col {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.grid-reverse {
|
||||
direction: rtl;
|
||||
|
||||
.col {
|
||||
direction: ltr;
|
||||
}
|
||||
.__button-padding-vertical {
|
||||
padding-top: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Loader
|
||||
*
|
||||
* @class .__loading
|
||||
* @selector {::before}
|
||||
* @selector {::after}
|
||||
*/
|
||||
|
||||
.__loading {
|
||||
width: 100%; height: 10rem;
|
||||
position: relative;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,10 @@
|
|||
/**
|
||||
* API Wrapper
|
||||
*
|
||||
* @class .__slate
|
||||
* @selector {::after}
|
||||
*/
|
||||
|
||||
.__slate {
|
||||
width: 100%; height: 100%;
|
||||
position: relative;
|
||||
|
|
@ -9,6 +16,22 @@
|
|||
|
||||
|
||||
|
||||
/**
|
||||
* API | Table of Contents
|
||||
*
|
||||
* @class .api__toc
|
||||
* @class .api__toc__search
|
||||
* @class .api__toc__search__field
|
||||
*
|
||||
* @class .api__toc__search__clear
|
||||
* @state {.active}
|
||||
*
|
||||
* @class .api__toc__items
|
||||
*
|
||||
* @class .api__toc__item
|
||||
* @state {:hover}
|
||||
*/
|
||||
|
||||
.api__toc {
|
||||
width: 200px; height: calc(100vh - 4rem); // navigation is 4rem tall
|
||||
top: 4rem; left: 0; bottom: 0;
|
||||
|
|
@ -80,6 +103,21 @@
|
|||
|
||||
|
||||
|
||||
/**
|
||||
* API | Main Content
|
||||
*
|
||||
* @class .api__content
|
||||
* @class .api__content__body
|
||||
* @class .api__content__body__arguments
|
||||
*
|
||||
* @class .api__content__body__argument
|
||||
* @selector {::after}
|
||||
* @selector {:last-of-type}
|
||||
* @selector {:nth-child}
|
||||
*
|
||||
* @class .api__content__example
|
||||
*/
|
||||
|
||||
.api__content {
|
||||
display: grid;
|
||||
float: right;
|
||||
|
|
@ -198,8 +236,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.api__content__example {
|
||||
background-color: mix($gray, $black, 10%);
|
||||
border-bottom: 1px solid rgba($white, 0.1);
|
||||
|
|
|
|||
|
|
@ -1,3 +1,12 @@
|
|||
/**
|
||||
* Tour | Wrapper
|
||||
*
|
||||
* @class .tour
|
||||
* @selector {::before}
|
||||
* @selector {::after}
|
||||
* @state {.waiting}
|
||||
*/
|
||||
|
||||
.tour {
|
||||
border-top: 1px solid rgba($black, 0.05);
|
||||
position: relative;
|
||||
|
|
@ -21,6 +30,17 @@
|
|||
|
||||
|
||||
|
||||
/**
|
||||
* Tour | Sidebar
|
||||
*
|
||||
* @class .tour__sidebar
|
||||
*
|
||||
* @class .tour__sidebar__example
|
||||
* @selector {:last-of-type}
|
||||
* @state {.active}
|
||||
* @state {:hover}
|
||||
*/
|
||||
|
||||
.tour__sidebar {
|
||||
width: 250px; height: 100%;
|
||||
|
||||
|
|
@ -75,6 +95,30 @@
|
|||
|
||||
|
||||
|
||||
/**
|
||||
* Tour | Content
|
||||
*
|
||||
* @class .tour__content
|
||||
*
|
||||
* @class .tour__content__meme
|
||||
* @selector {::after}
|
||||
*
|
||||
* @class .tour__content__meme__canvas
|
||||
*
|
||||
* @class .tour__content__meme__canvas__thumbnail
|
||||
* @selector {:last-of-type}
|
||||
* @state {.selected}
|
||||
*
|
||||
* @class .tour__content__meme__editor
|
||||
*
|
||||
* @class .tour__content__trends
|
||||
* @selector {::after}
|
||||
* @state {:empty}
|
||||
*
|
||||
* @class .tour__content__trend
|
||||
* @class .tour__content__urlbar
|
||||
*/
|
||||
|
||||
.tour__content {
|
||||
width: calc(100% - 250px); height: 100%; min-height: 500px;
|
||||
|
||||
|
|
@ -92,91 +136,13 @@
|
|||
}
|
||||
}
|
||||
|
||||
.tour__content__urlbar {
|
||||
border: 1px solid rgba($black, 0.05);
|
||||
display: flex;
|
||||
margin-bottom: 1rem;
|
||||
|
||||
button,
|
||||
input,
|
||||
span {
|
||||
float: left;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
button,
|
||||
span {
|
||||
height: 100%;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
button {
|
||||
color: $white;
|
||||
font-size: 1rem;
|
||||
position: relative;
|
||||
text-transform: lowercase;
|
||||
transition: background-color 0.2s;
|
||||
width: 6rem;
|
||||
|
||||
&::after {
|
||||
width: calc(100% + 2px); height: calc(100% + 2px);
|
||||
top: -1px; left: -1px;
|
||||
|
||||
content: "";
|
||||
position: absolute;
|
||||
transition: background-color 0.2s;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
&:not(:hover) {
|
||||
background-color: $black;
|
||||
|
||||
&::after {
|
||||
background-color: $black;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $teal;
|
||||
|
||||
&::after {
|
||||
background-color: $teal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
font-size: 1rem;
|
||||
width: calc(100% - 9.5rem);
|
||||
|
||||
&::placeholder {
|
||||
color: rgba($black, 0.5);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
@include no-user-select;
|
||||
color: rgba($black, 0.5);
|
||||
cursor: default;
|
||||
font-size: 1rem;
|
||||
text-align: right;
|
||||
width: 3.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.tour__content__meme,
|
||||
.tour__content__trends {
|
||||
.tour__content__meme {
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.tour__content__meme::after {
|
||||
&::after {
|
||||
@include clearfix;
|
||||
}
|
||||
}
|
||||
|
||||
.tour__content__meme__canvas {
|
||||
|
|
@ -328,12 +294,12 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.tour__content__trends {
|
||||
display: grid;
|
||||
grid-gap: 2%;
|
||||
grid-template-columns: 32% 32% 32%;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
|
||||
&:empty {
|
||||
@extend .__loading;
|
||||
|
|
@ -369,3 +335,76 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tour__content__urlbar {
|
||||
border: 1px solid rgba($black, 0.05);
|
||||
display: flex;
|
||||
margin-bottom: 1rem;
|
||||
|
||||
button,
|
||||
input,
|
||||
span {
|
||||
float: left;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
button,
|
||||
span {
|
||||
height: 100%;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
button {
|
||||
color: $white;
|
||||
font-size: 1rem;
|
||||
position: relative;
|
||||
text-transform: lowercase;
|
||||
transition: background-color 0.2s;
|
||||
width: 6rem;
|
||||
|
||||
&::after {
|
||||
width: calc(100% + 2px); height: calc(100% + 2px);
|
||||
top: -1px; left: -1px;
|
||||
|
||||
content: "";
|
||||
position: absolute;
|
||||
transition: background-color 0.2s;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
&:not(:hover) {
|
||||
background-color: $black;
|
||||
|
||||
&::after {
|
||||
background-color: $black;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $teal;
|
||||
|
||||
&::after {
|
||||
background-color: $teal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
font-size: 1rem;
|
||||
width: calc(100% - 9.5rem);
|
||||
|
||||
&::placeholder {
|
||||
color: rgba($black, 0.5);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
@include no-user-select;
|
||||
color: rgba($black, 0.5);
|
||||
cursor: default;
|
||||
font-size: 1rem;
|
||||
text-align: right;
|
||||
width: 3.5rem;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue