Move doc stylesheets to sass (#47)

This commit is contained in:
Levi McCallum
2017-04-20 09:55:46 -07:00
committed by GitHub
parent 67387c0978
commit 8ebd903e67
7 changed files with 561 additions and 1373 deletions

View File

@@ -3,9 +3,9 @@
<head>
<meta charset='utf-8'>
<title>Texture | {{ page.title }}</title>
<link rel='stylesheet' href='/static/main.css' type='text/css'/>
<link rel='stylesheet' href='/static/media.css' type='text/css'/>
<link rel="stylesheet" href='/static/pygments.css' type='text/css'/>
<link rel='stylesheet' href='/stylesheets/main.css' type='text/css'/>
<link rel='stylesheet' href='/stylesheets/media.css' type='text/css'/>
<link rel="stylesheet" href='/stylesheets/pygments.css' type='text/css'/>
<link rel="apple-touch-icon" sizes="57x57" href="/static/images/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/static/images/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/static/images/favicon/apple-icon-72x72.png">

225
docs/_sass/_code.sass Normal file
View File

@@ -0,0 +1,225 @@
code {
letter-spacing: 0.02em;
padding: 2px 4px;
/*font-weight: 700;
color: #008ED4;
font-size: 14px;
vertical-align: baseline;
font-family: 'Droid Sans Mono',sans-serif;*/
}
p code, span code, li code {
background-color: rgba(135, 215, 255, 0.2);
}
.paddingBetweenCols th {
text-align: left;
padding: 15px 15px 15px 15px;
}
.paddingBetweenCols td {
padding: 15px 15px 15px 15px;
/* border: 1 px solid black;*/
}
.highlight pre, .redhighlight pre {
font-size: 13px;
line-height: 20px;
padding: 0 10px 20px 10px;
}
.highlighttable {
margin-left: 10px;
margin-bottom: 20px;
margin-right: 10px;
border-collapse: separate !important;
}
.highlighttable .highlight pre, .highlighttable .redhighlight pre {
padding: 0;
}
.highlighttable code {
padding-right: 10px;
margin: 0;
padding-left: 2px;
font-size: 12px;
display: block;
line-height: 20px;
white-space: pre;
color: hsl(210, 100%, 8%);
}
.highlight pre code, .redhighlight pre code, .highlighttable {
overflow-x: scroll;
display: block;
padding: 0;
font-size: 13px;
border: 1px solid rgb(220, 220, 220);
padding: 5px 10px;
box-sizing: border-box;
border-radius: 3;
}
.highlight pre code, .highlighttable {
background-color: rgba(90, 140, 140, 0.1);
}
.redhighlight pre code {
background-color: rgba(180, 80, 80, 0.1);
}
.showcasetable code {
padding: 10px 10px 30px 30px;
margin: 10;
}
.highlight pre code, .redhighlight pre code {
width: 100%;
white-space: pre;
}
.lineno {
color: rgb(214, 139, 0);
}
.lineno::after {
content: ';';
font-size: 0;
}
.highlight + .highlight + .highlight,
.highlighttable + .highlight + .highlight,
.redhighlight + .redhighlight + .redhighlight
.highlighttable + .redhighlight + .redhighlight {
margin-top: -20px;
}
/**
* Syntax highlighting styles
*/
/* not official Xcode colors, but looks better on the web */
.highlight {
background: #fff; }
.highlight .c {
color: #008d14;
font-style: italic; }
.highlight .err {
color: #a61717;
background-color: #e3d2d2; }
.highlight .k {
color: #103ffb; }
.highlight .cm {
color: #008d14;
font-style: italic; }
.highlight .cp {
color: #b72748; }
.highlight .c1 {
color: #008d14;
font-style: italic; }
.highlight .cs {
color: #008d14;
font-weight: bold;
font-style: italic; }
.highlight .gd {
color: #000;
background-color: #fdd; }
.highlight .gd .x {
color: #000;
background-color: #faa; }
.highlight .ge {
font-style: italic; }
.highlight .gr {
color: #a00; }
.highlight .gh {
color: #999; }
.highlight .gi {
color: #000;
background-color: #dfd; }
.highlight .gi .x {
color: #000;
background-color: #afa; }
.highlight .go {
color: #888; }
.highlight .gp {
color: #555; }
.highlight .gs {
font-weight: bold; }
.highlight .gu {
color: #aaa; }
.highlight .gt {
color: #a00; }
.highlight .kc {
color: orange; }
.highlight .kd {
color: orange; }
.highlight .kp {
color: #008d14; }
.highlight .kr {
color: #008d14; }
.highlight .kt {
color: #103ffb; }
.highlight .m {
color: orange; }
.highlight .s {
color: #b72748; }
.highlight .na {
color: orange; }
.highlight .nb {
color: #103ffb; }
.highlight .nc {
color: #3a95ba; }
.highlight .no {
color: orange; }
.highlight .ni {
color: orange; }
.highlight .ne {
color: orange; }
.highlight .nn {
color: orange; }
.highlight .nt {
color: orange; }
.highlight .w {
color: #bbb; }
.highlight .mh {
color: black; }
.highlight .mi {
color: black; }
.highlight .mo {
color: black; }
.highlight .il {
color: black; }
.highlight .sb {
color: #d14; }
.highlight .sc {
color: #d14; }
.highlight .sd {
color: #d14; }
.highlight .s2 {
color: #d14; }
.highlight .se {
color: #d14; }
.highlight .sh {
color: #d14; }
.highlight .si {
color: #d14; }
.highlight .sx {
color: #d14; }
.highlight .sr {
color: orange; }
.highlight .s1 {
color: #b72748; }
.highlight .ss {
color: #b72748; }
.highlight .bp {
color: #3a95ba; }
.highlight .vc {
color: #3a95ba; }
.highlight .vg {
color: black; }
.highlight .vi {
color: orange; }
.highlight .nl {
color: #3a95ba; }

View File

@@ -1,806 +0,0 @@
* {
padding: 0;
margin: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-text-size-adjust: 100%;
}
html {
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
background-color: #FFFFFF;
}
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: proxima-nova, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 300;
color: #444;
margin: 0;
padding-top: 50px;
line-height: 22px;
}
h1, h2, h3, h4 {
font-weight: normal;
margin: 1.3em 0 0.2em;
line-height: 1.4em;
position: relative;
}
td {
vertical-align: top;
}
h1:first-child, h2:first-child, h3:first-child, h4:first-child {
margin-top: 0;
}
h1 {
font-size: 2em;
font-weight: bold;
}
h2 {
font-size: 1.5em;
}
h3 {
font-size: 1.3em;
}
h4 {
font-size: 1.1em;
}
p, ul, ol {
margin: 0 0 1em 0;
}
.wrap {
width: 960px;
margin-left: auto;
margin-right: auto;
padding-left: 20px;
padding-right: 20px
}
.subhero .wrap {
width: auto;
max-width: 960px;
}
.home-section {
width: 500px;
margin-left: auto;
margin-right: auto;
}
code {
letter-spacing: 0.02em;
padding: 2px 4px;
border-radius: 3px;
/*font-weight: 700;
color: #008ED4;
font-size: 14px;
vertical-align: baseline;
font-family: 'Droid Sans Mono',sans-serif;*/
}
p code, span code, li code {
border: 1px solid rgb(220, 220, 220);
background-color: rgba(135, 215, 255, 0.2);
}
.highlight pre, .redhighlight pre {
font-size: 13px;
line-height: 20px;
padding: 0 10px 20px 10px;
}
.highlighttable {
margin-left: 10px;
margin-bottom: 20px;
margin-right: 10px;
border-collapse: separate !important;
}
.highlighttable .highlight pre, .highlighttable .redhighlight pre {
padding: 0;
}
.highlighttable code {
padding-right: 10px;
margin: 0;
padding-left: 2px;
font-size: 12px;
display: block;
line-height: 20px;
white-space: pre;
color: hsl(210, 100%, 8%);
}
.highlight pre code, .redhighlight pre code, .highlighttable {
overflow-x: scroll;
display: block;
padding: 0;
font-size: 13px;
border: 1px solid rgb(220, 220, 220);
padding: 5px 10px;
box-sizing: border-box;
border-radius: 3;
}
.highlight pre code, .highlighttable {
background-color: rgba(90, 140, 140, 0.1);
}
.redhighlight pre code {
background-color: rgba(180, 80, 80, 0.1);
}
.highlight pre code, .redhighlight pre code {
width: 100%;
white-space: pre;
}
.lineno {
color: rgb(214, 139, 0);
}
.lineno::after {
content: ';';
font-size: 0;
}
.highlight + .highlight + .highlight,
.highlighttable + .highlight + .highlight,
.redhighlight + .redhighlight + .redhighlight
.highlighttable + .redhighlight + .redhighlight {
margin-top: -20px;
}
ul, ol {
list-style-position: outside;
margin-left: 1em;
padding-left: 1em;
}
a {
text-decoration: none;
color: #1C9BC7;
}
nav.toc a {
color: #444;
}
nav.toc a.active {
color: #1C9BC7;
}
a.hash-link {
color: #ccc;
}
a.hash-link:hover {
color: #1C9BC7;
}
.width {
margin: 0 auto;
padding: 0 20px;
}
header:after, section.content:after, footer:after {
clear: both;
content: ".";
display: block;
font-size: 0;
height: 0;
line-height: 0;
visibility: hidden;
}
header.topbar {
background: #F8F8F8;
color: #424242;
position: fixed;
top: 0;
height: 50px;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
width: 100%;
z-index: 100;
}
header.topbar .logo {
margin-top: 9px;
height: 30px;
}
.componentkit-header {
background-image: url(componentkit-hero-logo.png);
background-size: 660px;
background-position: 50% 50%;
background-repeat: no-repeat;
height: 280px;
}
header.topbar nav ul {
float: right;
text-align: right;
padding: 0;
margin: 0;
}
header.topbar nav ul li {
display: inline;
font-weight: bold;
}
header.topbar nav ul li a {
padding: 0 8px;
line-height: 50px;
display: inline-block;
height: 50px;
color: #828282;
font-size: 15px;
}
header.topbar nav ul li a.active {
color: #111111;
font-style: underline;
}
header.topbar nav ul li a:hover {
color: #111111;
font-style: underline;
}
header.hero {
padding: 20px 0;
}
header.hero .width {
text-align: center;
}
footer.copyright .width {
text-align: center;
}
header.hero h1 {
font-size: 4em;
font-weight: normal;
color: #bb2910;
margin: 0;
line-height: 1.5em;
}
header.hero p {
font-size: 1.4em;
margin-bottom: 40px;
}
header.hero a.button {
background-color: #20AECF;
border: 1px solid #1D9CC8;
border-radius: 3px;
color: #ffffff;
font-weight: bold;
padding: 10px 20px;
display: inline-block;
margin: 1em;
}
header.subhero {
padding: 10px 0;
padding-top: 30px;
}
section.content {
padding: 20px 0;
}
section.content article ul li,
section.content article ol li {
margin-bottom: 0.5em;
}
section.content article img {
display: block;
margin: 1em auto;
max-width: 100%;
}
section.content article blockquote {
padding: 5px 10px;
margin-left: 20px;
margin-bottom: 10px;
font-weight: bold;
}
section.content article blockquote p {
margin: 0;
}
section.content article blockquote p:first-child {
float: left;
margin-right: 5px;
color: hsl(19, 100%, 42%);
}
section.content article blockquote p {
font-style: italic;
}
section.content article blockquote small:before {
content: '\2014 \00A0';
}
section.content article.withtoc {
position: relative;
}
section.content article .read-more {
font-weight: bold;
text-align: right;
}
section.content article hr.blogpostend {
margin-bottom: 20px;
margin-top: 20px;
}
section.content aside .fb-like {
top: 4px;
left: 4px;
}
.edit-page-link {
float: right;
font-size: 12px;
font-weight: normal;
line-height: 20px;
opacity: 0.6;
transition: opacity 0.5s;
}
.edit-page-link:hover {
opacity: 1;
}
nav.toc {
font-size: 14px;
line-height: 18px;
margin-bottom: 20px;
}
nav.toc h3 {
margin: 0.5em 0;
padding-top: 0.5em;
font-size: 14px;
font-weight: bold;
line-height: 40px;
}
nav.toc section:first-child h3 {
border-top: none;
margin-top: 0;
padding-top: 0;
}
nav.toc ul {
list-style: none;
margin: 0;
padding-left: 0;
}
nav.toc ul li {
line-height: 20px;
}
footer {
padding: 5px 0;
padding-bottom: 10px;
font-size: 13px;
text-align: right;
}
.right {
float: right;
}
.right a {
color: #cd4e34;
padding: 0 5px;
}
.hash {
margin-left: 3px;
visibility: hidden;
}
*:hover > .hash {
visibility: visible;
}
.hashref {
position: absolute;
top: -60px;
left: 0;
}
.note {
padding: 10px;
border-radius: 3px;
background-color: #EFF7FF;
border: 1px solid #CCDDFF;
margin-bottom: 20px;
}
.note p:before {
content: "NOTE:";
font-weight: bold;
}
.note p {
margin-bottom: 0px;
}
.note-important {
padding: 10px;
border-radius: 3px;
background-color: #FFCCCC;
border: 1px solid #FF8899;
margin-bottom: 20px;
}
.note-important p:before {
content: "IMPORTANT:";
font-weight: bold;
}
.note-important p {
margin-bottom: 0px;
}
/* desktopish */
@media (min-width: 481px) {
.width {
max-width: 960px;
/* make columns add to <880 for 60 gutter */
}
.content .width {
width: 960px;
}
.panel3 {
width: 29%;
margin: 1em 2% 0;
display:inline-block;
vertical-align: top;
font-size: 14px;
}
section.content article {
margin: 0 auto;
width: 660px;
}
section.content nav.toc {
float: left;
}
section.content article.withtoc {
float: right;
}
section.content aside {
float: left;
width: 220px;
}
}
/* phoneish */
@media (max-width: 480px) {
.wrap, .content .width, .home-section, section.content article {
width: auto;
max-width: 100%;
overflow-x: scroll;
}
header.topbar .width {
padding: 0 5px;
}
.highlighttable, section.content article blockquote {
margin-left: 0;
}
.highlight pre {
padding-left: 0;
}
body {
padding-bottom: 20px;
}
#\_ {
display: block;
position: absolute;
top: -60px;
left: 0;
}
}
.video-thumbnail {
margin-top: 1em;
margin-bottom: 1em;
background-image: url(atscaletalk.jpg);
background-size: 660px;
background-position: 50% 50%;
background-repeat: no-repeat;
height: 320px;
width: 100%;
cursor: pointer;
}
.site-title {
font-size: 26px;
line-height: 56px;
letter-spacing: -1px;
margin-bottom: 0;
float: left; }
.site-title, .site-title:visited {
color: #424242; }
.site-title:hover {
text-decoration: none; }
/**
* Links
*/
a {
color: #21b6ff;
text-decoration: none; }
a:visited {
color: #008ed4; }
a:hover {
color: #111;
text-decoration: underline; }
/**
* Syntax highlighting styles
*/
/* not official Xcode colors, but looks better on the web */
.highlight {
background: #fff; }
.highlight .c {
color: #008d14;
font-style: italic; }
.highlight .err {
color: #a61717;
background-color: #e3d2d2; }
.highlight .k {
color: #103ffb; }
.highlight .cm {
color: #008d14;
font-style: italic; }
.highlight .cp {
color: #b72748; }
.highlight .c1 {
color: #008d14;
font-style: italic; }
.highlight .cs {
color: #008d14;
font-weight: bold;
font-style: italic; }
.highlight .gd {
color: #000;
background-color: #fdd; }
.highlight .gd .x {
color: #000;
background-color: #faa; }
.highlight .ge {
font-style: italic; }
.highlight .gr {
color: #a00; }
.highlight .gh {
color: #999; }
.highlight .gi {
color: #000;
background-color: #dfd; }
.highlight .gi .x {
color: #000;
background-color: #afa; }
.highlight .go {
color: #888; }
.highlight .gp {
color: #555; }
.highlight .gs {
font-weight: bold; }
.highlight .gu {
color: #aaa; }
.highlight .gt {
color: #a00; }
.highlight .kc {
color: orange; }
.highlight .kd {
color: orange; }
.highlight .kp {
color: #008d14; }
.highlight .kr {
color: #008d14; }
.highlight .kt {
color: #103ffb; }
.highlight .m {
color: orange; }
.highlight .s {
color: #b72748; }
.highlight .na {
color: orange; }
.highlight .nb {
color: #103ffb; }
.highlight .nc {
color: #3a95ba; }
.highlight .no {
color: orange; }
.highlight .ni {
color: orange; }
.highlight .ne {
color: orange; }
.highlight .nn {
color: orange; }
.highlight .nt {
color: orange; }
.highlight .w {
color: #bbb; }
.highlight .mh {
color: black; }
.highlight .mi {
color: black; }
.highlight .mo {
color: black; }
.highlight .il {
color: black; }
.highlight .sb {
color: #d14; }
.highlight .sc {
color: #d14; }
.highlight .sd {
color: #d14; }
.highlight .s2 {
color: #d14; }
.highlight .se {
color: #d14; }
.highlight .sh {
color: #d14; }
.highlight .si {
color: #d14; }
.highlight .sx {
color: #d14; }
.highlight .sr {
color: orange; }
.highlight .s1 {
color: #b72748; }
.highlight .ss {
color: #b72748; }
.highlight .bp {
color: #3a95ba; }
.highlight .vc {
color: #3a95ba; }
.highlight .vg {
color: black; }
.highlight .vi {
color: orange; }
.highlight .nl {
color: #3a95ba; }
.site-header {
border-top: 5px solid #424242;
border-bottom: 1px solid #e8e8e8;
min-height: 56px;
background-color: #f8f8f8;
position: relative;
}
.post-title {
font-size: 42px;
letter-spacing: -1px;
line-height: 1; }
@media screen and (max-width: 800px) {
.post-title {
font-size: 36px; } }
.post-title .edit-page-link {
font-size: 18px; }
body {
background-color: #fff;
color: #333;
font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;
font-size: 1em;
line-height: 1.5;
}
.language-toggle {
display: block;
box-sizing: border-box;
font-size: 125%
-webkit-font-smoothing: antialiased;
line-height: 1.5;
margin-bottom: 1em;
padding-right: 10px;
}
.language-toggle a.active {
color: #222220 !important;
}
.language-toggle a {
cursor: pointer;
display: block;
float: right;
padding-left: 0.5em;
color: #a3a39e !important;
text-decoration: none;
transition: color 0.1s linear;
}
.language-toggle:after {
content: "";
display: table;
clear: both;
}
.highlight-group {
margin-top: 1em;
font-family: BodyFontFamily,"Georgia Pro",Georgia,Times;
margin: 0;
border-top: 3px #1C9BC7 solid;
background: #f8f7f5;
border-radius: 4px;
}
.hidden {
display: none;
}
.code {
padding-left: 20px;
padding-bottom: 10px;
overflow: auto;
}
pre {
font-family: 'Inconsolata' !important;
font-weight: 500;
color: #333333;
}
.paddingBetweenCols th {
text-align: left;
padding: 15px 15px 15px 15px;
}
.paddingBetweenCols td {
padding: 15px 15px 15px 15px;
/* border: 1 px solid black;*/
}
.paddingBetweenCols tr:nth-child(even){
background-color: #f2f2f2
}
.paddingBetweenColsNoColor th {
text-align: left;
padding: 15px 15px 15px 15px;
}
.paddingBetweenColsNoColor td {
padding: 15px 15px 15px 15px;
}

562
docs/static/main.css vendored
View File

@@ -1,562 +0,0 @@
* {
padding: 0;
margin: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-text-size-adjust: 100%;
}
html {
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
background-color: #FFFFFF;
}
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: proxima-nova, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 400;
color: #444;
margin: 0;
line-height: 22px;
}
h1, h2, h3, h4 {
font-weight: normal;
margin: 1.3em 0 0.2em;
line-height: 1.4em;
position: relative;
}
td {
vertical-align: top;
}
h1:first-child, h2:first-child, h3:first-child, h4:first-child {
margin-top: 0;
}
h1 {
font-size: 2em;
font-weight: bold;
}
h2 {
font-size: 1.5em;
}
h3 {
font-size: 1.3em;
}
h4 {
font-size: 1.1em;
}
p, ul, ol {
margin: 0 0 1em 0;
}
a {
color: #0484f2;
text-decoration: none;
}
.btn {
padding: 10px 20px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #0f70dd;
color: #fff;
display: inline-block;
text-decoration: none;
font-weight: bold;
}
.container {
width: 90%;
margin: 0 auto;
clear: both;
}
#logo {
}
header {
padding: 30px 0 10px 0;
background: #f8f8f8;
}
header h1 {
position: relative;
top: -5px;
}
header nav {
margin-top: 10px;
font-size: 18px;
}
header nav ul {
list-style: none;
}
header nav ul li {
float: left;
margin-right: 20px;
}
header nav ul li a {
color: #0484f2;
text-decoration: none;
}
.hero {
background: #0f70dd;
margin-bottom: 30px;
padding: 30px 0;
}
.hero .hero-title {
font-size: 45px;
line-height: 110%;
color: #fff;
margin-bottom: 20px;
}
.hero .btn {
background: #fff;
color: #0f70dd;
border: 2px solid #fff;
margin-right: 10px;
}
.hero .btn.btn-outlined {
background: none;
border: 2px solid #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #fff;
}
.container-margin {
margin-top: 30px;
}
.container .sidebar {
font-size: 14px;
}
.container .sidebar ul {
list-style: none;
}
.container .sidebar ul li {
list-style: none;
}
.container .sidebar a.active {
font-weight: bold;
}
.container .content {
}
.container tr > td {
padding-bottom: 30px;
}
.container tr td img {
display: inline-block;
margin-bottom: 5px;
}
.container tr td b {
padding-bottom: 5px;
display: inline-block;
}
.roundrect {
border: 1px solid #f4f4f4;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.container .content ul, .container .content ol {
margin-left: 20px;
margin-bottom: 30px;
}
.content p img {
display: block;
margin: 1em auto;
max-width: 100%;
}
.edit-page-link {
font-size: 14px;
}
code {
letter-spacing: 0.02em;
padding: 2px 4px;
/*font-weight: 700;
color: #008ED4;
font-size: 14px;
vertical-align: baseline;
font-family: 'Droid Sans Mono',sans-serif;*/
}
p code, span code, li code {
background-color: rgba(135, 215, 255, 0.2);
}
.paddingBetweenCols th {
text-align: left;
padding: 15px 15px 15px 15px;
}
.paddingBetweenCols td {
padding: 15px 15px 15px 15px;
/* border: 1 px solid black;*/
}
.highlight pre, .redhighlight pre {
font-size: 13px;
line-height: 20px;
padding: 0 10px 20px 10px;
}
.highlighttable {
margin-left: 10px;
margin-bottom: 20px;
margin-right: 10px;
border-collapse: separate !important;
}
.highlighttable .highlight pre, .highlighttable .redhighlight pre {
padding: 0;
}
.highlighttable code {
padding-right: 10px;
margin: 0;
padding-left: 2px;
font-size: 12px;
display: block;
line-height: 20px;
white-space: pre;
color: hsl(210, 100%, 8%);
}
.highlight pre code, .redhighlight pre code, .highlighttable {
overflow-x: scroll;
display: block;
padding: 0;
font-size: 13px;
border: 1px solid rgb(220, 220, 220);
padding: 5px 10px;
box-sizing: border-box;
border-radius: 3;
}
.highlight pre code, .highlighttable {
background-color: rgba(90, 140, 140, 0.1);
}
.redhighlight pre code {
background-color: rgba(180, 80, 80, 0.1);
}
.showcasetable code {
padding: 10px 10px 30px 30px;
margin: 10;
}
.highlight pre code, .redhighlight pre code {
width: 100%;
white-space: pre;
}
.lineno {
color: rgb(214, 139, 0);
}
.lineno::after {
content: ';';
font-size: 0;
}
.highlight + .highlight + .highlight,
.highlighttable + .highlight + .highlight,
.redhighlight + .redhighlight + .redhighlight
.highlighttable + .redhighlight + .redhighlight {
margin-top: -20px;
}
/**
* Syntax highlighting styles
*/
/* not official Xcode colors, but looks better on the web */
.highlight {
background: #fff; }
.highlight .c {
color: #008d14;
font-style: italic; }
.highlight .err {
color: #a61717;
background-color: #e3d2d2; }
.highlight .k {
color: #103ffb; }
.highlight .cm {
color: #008d14;
font-style: italic; }
.highlight .cp {
color: #b72748; }
.highlight .c1 {
color: #008d14;
font-style: italic; }
.highlight .cs {
color: #008d14;
font-weight: bold;
font-style: italic; }
.highlight .gd {
color: #000;
background-color: #fdd; }
.highlight .gd .x {
color: #000;
background-color: #faa; }
.highlight .ge {
font-style: italic; }
.highlight .gr {
color: #a00; }
.highlight .gh {
color: #999; }
.highlight .gi {
color: #000;
background-color: #dfd; }
.highlight .gi .x {
color: #000;
background-color: #afa; }
.highlight .go {
color: #888; }
.highlight .gp {
color: #555; }
.highlight .gs {
font-weight: bold; }
.highlight .gu {
color: #aaa; }
.highlight .gt {
color: #a00; }
.highlight .kc {
color: orange; }
.highlight .kd {
color: orange; }
.highlight .kp {
color: #008d14; }
.highlight .kr {
color: #008d14; }
.highlight .kt {
color: #103ffb; }
.highlight .m {
color: orange; }
.highlight .s {
color: #b72748; }
.highlight .na {
color: orange; }
.highlight .nb {
color: #103ffb; }
.highlight .nc {
color: #3a95ba; }
.highlight .no {
color: orange; }
.highlight .ni {
color: orange; }
.highlight .ne {
color: orange; }
.highlight .nn {
color: orange; }
.highlight .nt {
color: orange; }
.highlight .w {
color: #bbb; }
.highlight .mh {
color: black; }
.highlight .mi {
color: black; }
.highlight .mo {
color: black; }
.highlight .il {
color: black; }
.highlight .sb {
color: #d14; }
.highlight .sc {
color: #d14; }
.highlight .sd {
color: #d14; }
.highlight .s2 {
color: #d14; }
.highlight .se {
color: #d14; }
.highlight .sh {
color: #d14; }
.highlight .si {
color: #d14; }
.highlight .sx {
color: #d14; }
.highlight .sr {
color: orange; }
.highlight .s1 {
color: #b72748; }
.highlight .ss {
color: #b72748; }
.highlight .bp {
color: #3a95ba; }
.highlight .vc {
color: #3a95ba; }
.highlight .vg {
color: black; }
.highlight .vi {
color: orange; }
.highlight .nl {
color: #3a95ba; }
.language-toggle {
border-bottom: 2px #0484f2 solid;
background: white;
display: block;
box-sizing: border-box;
font-size: 125%
-webkit-font-smoothing: antialiased;
line-height: 1.5;
padding-right: 10px;
}
.language-toggle a.active {
color: #222220 !important;
}
.language-toggle a {
cursor: pointer;
display: block;
float: right;
padding-left: 1em;
color: #a3a39e !important;
text-decoration: none;
transition: color 0.1s linear;
}
.language-toggle:after {
content: "";
display: table;
clear: both;
}
.highlight-group {
font-family: 'Inconsolata' !important;
margin: 0;
margin-top: 20px;
margin-bottom: 20px;
background: #f8f7f5;
}
.hidden {
display: none;
}
.code {
padding: 15px;
overflow: auto;
}
pre {
font-family: 'Inconsolata' !important;
font-weight: 500;
color: #333333;
}
.note {
padding: 10px;
border-radius: 3px;
background-color: #EFF7FF;
border: 1px solid #CCDDFF;
margin-bottom: 20px;
}
.note p:before {
content: "NOTE:";
font-weight: bold;
}
.note p {
margin-bottom: 0px;
}
.note-important {
padding: 10px;
border-radius: 3px;
background-color: #FFCCCC;
border: 1px solid #FF8899;
margin-bottom: 20px;
}
.note-important p:before {
content: "IMPORTANT:";
font-weight: bold;
}
.note-important p {
margin-bottom: 0px;
}
.right {
float: right;
}
footer {
padding: 20px 0;
}
footer p {
text-align: center;
}
/** Banner */
.texture-banner {
padding: 20px 0 20px 0;
width: 100%;
background-color: #0e1e28;
box-shadow: inset 0 -2px 20px 0 rgba(0,0,0,0.5);
text-align: center;
}
.texture-banner .announcement {
font-stretch: normal;
font-size: 16px;
line-height: 1.75;
letter-spacing: 0.1px;
text-align: center;
color: #d7e2e9;
font-weight: bold;
margin: 0;
}
.texture-banner .learn-more-link {
font-size: 12px;
font-weight: bold;
font-style: normal;
font-stretch: normal;
line-height: 1.17;
letter-spacing: 0.5px;
color: #0484f2;
margin-left: 10px;
}

332
docs/stylesheets/main.scss Executable file
View File

@@ -0,0 +1,332 @@
---
---
@charset "utf-8";
* {
padding: 0;
margin: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-text-size-adjust: 100%;
}
html {
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
background-color: #FFFFFF;
}
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: proxima-nova, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 400;
color: #444;
margin: 0;
line-height: 22px;
}
h1, h2, h3, h4 {
font-weight: normal;
margin: 1.3em 0 0.2em;
line-height: 1.4em;
position: relative;
}
td {
vertical-align: top;
}
h1:first-child, h2:first-child, h3:first-child, h4:first-child {
margin-top: 0;
}
h1 {
font-size: 2em;
font-weight: bold;
}
h2 {
font-size: 1.5em;
}
h3 {
font-size: 1.3em;
}
h4 {
font-size: 1.1em;
}
p, ul, ol {
margin: 0 0 1em 0;
}
a {
color: #0484f2;
text-decoration: none;
}
.btn {
padding: 10px 20px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #0f70dd;
color: #fff;
display: inline-block;
text-decoration: none;
font-weight: bold;
}
.container {
width: 90%;
margin: 0 auto;
clear: both;
}
header {
padding: 30px 0 10px 0;
background: #f8f8f8;
h1 {
position: relative;
top: -5px;
}
nav {
margin-top: 10px;
font-size: 18px;
ul {
list-style: none;
li {
float: left;
margin-right: 20px;
a {
color: #0484f2;
text-decoration: none;
}
}
}
}
}
.hero {
background: #0f70dd;
margin-bottom: 30px;
padding: 30px 0;
.hero-title {
font-size: 45px;
line-height: 110%;
color: #fff;
margin-bottom: 20px;
}
.btn {
background: #fff;
color: #0f70dd;
border: 2px solid #fff;
margin-right: 10px;
}
.btn.btn-outlined {
background: none;
border: 2px solid #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #fff;
}
}
.container-margin {
margin-top: 30px;
}
.container .sidebar {
font-size: 14px;
}
.container .sidebar ul {
list-style: none;
}
.container .sidebar ul li {
list-style: none;
}
.container .sidebar a.active {
font-weight: bold;
}
.container .content {
}
.container tr > td {
padding-bottom: 30px;
}
.container tr td img {
display: inline-block;
margin-bottom: 5px;
}
.container tr td b {
padding-bottom: 5px;
display: inline-block;
}
.roundrect {
border: 1px solid #f4f4f4;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.container .content ul, .container .content ol {
margin-left: 20px;
margin-bottom: 30px;
}
.content p img {
display: block;
margin: 1em auto;
max-width: 100%;
}
.edit-page-link {
font-size: 14px;
}
@import "code";
.language-toggle {
border-bottom: 2px #0484f2 solid;
background: white;
display: block;
box-sizing: border-box;
font-size: 125%
-webkit-font-smoothing: antialiased;
line-height: 1.5;
padding-right: 10px;
}
.language-toggle a.active {
color: #222220 !important;
}
.language-toggle a {
cursor: pointer;
display: block;
float: right;
padding-left: 1em;
color: #a3a39e !important;
text-decoration: none;
transition: color 0.1s linear;
}
.language-toggle:after {
content: "";
display: table;
clear: both;
}
.highlight-group {
font-family: 'Inconsolata' !important;
margin: 0;
margin-top: 20px;
margin-bottom: 20px;
background: #f8f7f5;
}
.hidden {
display: none;
}
.code {
padding: 15px;
overflow: auto;
}
pre {
font-family: 'Inconsolata' !important;
font-weight: 500;
color: #333333;
}
.note {
padding: 10px;
border-radius: 3px;
background-color: #EFF7FF;
border: 1px solid #CCDDFF;
margin-bottom: 20px;
}
.note p:before {
content: "NOTE:";
font-weight: bold;
}
.note p {
margin-bottom: 0px;
}
.note-important {
padding: 10px;
border-radius: 3px;
background-color: #FFCCCC;
border: 1px solid #FF8899;
margin-bottom: 20px;
}
.note-important p:before {
content: "IMPORTANT:";
font-weight: bold;
}
.note-important p {
margin-bottom: 0px;
}
.right {
float: right;
}
footer {
padding: 20px 0;
p {
text-align: center;
}
}
/** Banner */
.texture-banner {
padding: 20px 0 20px 0;
width: 100%;
background-color: #0e1e28;
box-shadow: inset 0 -2px 20px 0 rgba(0,0,0,0.5);
text-align: center;
.announcement {
font-stretch: normal;
font-size: 16px;
line-height: 1.75;
letter-spacing: 0.1px;
text-align: center;
color: #d7e2e9;
font-weight: bold;
margin: 0;
}
.learn-more-link {
font-size: 12px;
font-weight: bold;
font-style: normal;
font-stretch: normal;
line-height: 1.17;
letter-spacing: 0.5px;
color: #0484f2;
margin-left: 10px;
}
}

View File

@@ -45,8 +45,7 @@
}
}
@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
#logo {
content: url(/static/images/Texturelogo@2x.png);
width: 186px;