baseline for dfx-mdl
Signed-off-by: Tony Tkacik <tonydamage@gmail.com>
This commit is contained in:
parent
a09abe2e13
commit
c97cc68e61
22 changed files with 754 additions and 71 deletions
240
_sass/_asciidoc.scss
Normal file
240
_sass/_asciidoc.scss
Normal file
|
|
@ -0,0 +1,240 @@
|
|||
.title {
|
||||
font-weight: bold;
|
||||
color: $primary-color;
|
||||
}
|
||||
|
||||
.listingblock,
|
||||
.literalblock {
|
||||
@extend .admonition;
|
||||
|
||||
pre {
|
||||
background: $grey-color-light;
|
||||
}
|
||||
|
||||
pre.nowrap,
|
||||
pre[class].nowrap {
|
||||
overflow-x: auto;
|
||||
white-space: pre;
|
||||
word-wrap: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.exampleblock {
|
||||
@extend .admonition;
|
||||
background: $yellow-100;
|
||||
|
||||
.title {
|
||||
color: $primary-color;
|
||||
}
|
||||
}
|
||||
|
||||
.imageblock {
|
||||
@extend .admonition;
|
||||
padding: 0;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.admonitionblock {
|
||||
@extend .admonition;
|
||||
padding: 16px 16px 16px 0;
|
||||
td.icon {
|
||||
width: 55px;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
|
||||
.fa {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 36px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.icon-note:after {
|
||||
content: "info";
|
||||
}
|
||||
|
||||
.icon-important:after {
|
||||
content: "announcement";
|
||||
}
|
||||
|
||||
.icon-caution:after {
|
||||
content: "warning";
|
||||
}
|
||||
|
||||
.icon-warning:after {
|
||||
content: "warning";
|
||||
}
|
||||
|
||||
.icon-tip:after {
|
||||
content: "lightbulb_outline";
|
||||
}
|
||||
}
|
||||
|
||||
&.note {
|
||||
background: $blue-200;
|
||||
}
|
||||
|
||||
&.tip {
|
||||
background: $green-200;
|
||||
}
|
||||
|
||||
&.warning {
|
||||
background: $red-300;
|
||||
}
|
||||
|
||||
&.important {
|
||||
background: $orange-200;
|
||||
}
|
||||
|
||||
&.caution {
|
||||
background: $orange-200;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Numbers & Code excerpts */
|
||||
.conum{
|
||||
&[data-value] {
|
||||
display: inline-block;
|
||||
color: $grey-50 !important;
|
||||
background-color: $grey-800;
|
||||
-webkit-border-radius: 100px;
|
||||
border-radius: 100px;
|
||||
text-align: center;
|
||||
font-size: 0.75em;
|
||||
width: 1.67em;
|
||||
height: 1.67em;
|
||||
line-height: 1.67em;
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
|
||||
* {
|
||||
color: #grey-50 !important;
|
||||
}
|
||||
|
||||
+b {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: attr(data-value);
|
||||
}
|
||||
}
|
||||
&:not([data-value]):empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
pre .conum[data-value] {
|
||||
position: relative;
|
||||
top: -.125em;
|
||||
}
|
||||
|
||||
b.conum * {
|
||||
color: inherit!important;
|
||||
}
|
||||
|
||||
.quoteblock {
|
||||
blockquote {
|
||||
border: none;
|
||||
}
|
||||
|
||||
blockquote:before {
|
||||
|
||||
}
|
||||
|
||||
.attribution {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
table.tableblock{
|
||||
max-width:100%;
|
||||
border-collapse: collapse;
|
||||
position: relative;
|
||||
border: 1px solid rgba(0,0,0,.12);
|
||||
border-collapse: collapse;
|
||||
/* white-space: nowrap; */
|
||||
font-size: 13px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);margin: 16px 0px;
|
||||
}
|
||||
|
||||
td>.paragraph:last-child p>p:last-child,
|
||||
th>p:last-child,
|
||||
td>p:last-child {
|
||||
margin-bottom:0
|
||||
}
|
||||
|
||||
table.grid-all th.tableblock,table.grid-all td.tableblock{/* border-width:0 1px 1px 0; */}
|
||||
table.grid-all tfoot>tr>th.tableblock,table.grid-all tfoot>tr>td.tableblock{border-width:1px 1px 0 0}
|
||||
table.grid-cols th.tableblock,table.grid-cols td.tableblock{border-width:0 1px 0 0}
|
||||
table.grid-all *>tr>.tableblock:last-child,table.grid-cols *>tr>.tableblock:last-child{border-right-width:0}
|
||||
table.grid-rows th.tableblock,table.grid-rows td.tableblock{border-width:0 0 1px 0}
|
||||
table.grid-all tbody>tr:last-child>th.tableblock,table.grid-all tbody>tr:last-child>td.tableblock,table.grid-all thead:last-child>tr>th.tableblock,table.grid-rows tbody>tr:last-child>th.tableblock,table.grid-rows tbody>tr:last-child>td.tableblock,table.grid-rows thead:last-child>tr>th.tableblock{border-bottom-width:0}
|
||||
table.grid-rows tfoot>tr>th.tableblock,table.grid-rows tfoot>tr>td.tableblock{border-width:1px 0 0 0}
|
||||
|
||||
table.frame-all{border-width:1px}
|
||||
table.frame-sides{border-width:0 1px}
|
||||
table.frame-topbot{border-width:1px 0}
|
||||
|
||||
|
||||
|
||||
table thead th,table tfoot th, tbody tr th,tbody tr th p,tfoot tr th,tfoot tr th p{
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
|
||||
tbody tr th{
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
p.tableblock{
|
||||
font-size:1em;
|
||||
>code:only-child{background:none;padding:0}
|
||||
}
|
||||
|
||||
table.tableblock {
|
||||
td, th {
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
height: 48px;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.12);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
|
||||
padding-top: 12px;
|
||||
box-sizing: border-box;
|
||||
&:first-of-type {
|
||||
padding-left: 24px;
|
||||
}
|
||||
&:last-of-type {
|
||||
padding-right: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
tr {
|
||||
position: relative;
|
||||
min-height: 48px;
|
||||
transition-duration: .28s;
|
||||
transition-timing-function: cubic-bezier(.4,0,.2,1);
|
||||
transition-property: background-color;
|
||||
&:hover { background-color: #eeeeee; }
|
||||
}
|
||||
}
|
||||
|
|
@ -12,8 +12,8 @@ ul, ol, dl, figure,
|
|||
* Blockquotes
|
||||
*/
|
||||
blockquote {
|
||||
color: $grey-color;
|
||||
border-left: 4px solid $grey-color-light;
|
||||
color: $grey-600;
|
||||
border-left: 4px solid $grey-200;
|
||||
padding-left: $spacing-unit / 2;
|
||||
font-size: 18px;
|
||||
letter-spacing: -1px;
|
||||
|
|
@ -24,15 +24,27 @@ blockquote {
|
|||
}
|
||||
}
|
||||
|
||||
.admonition {
|
||||
margin: 16px -16px;
|
||||
padding: 16px 16px 1px 16px;
|
||||
background: $grey-color-light;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Code formatting
|
||||
*/
|
||||
pre,
|
||||
code {
|
||||
font-size: 15px;
|
||||
border: 1px solid $grey-color-light;
|
||||
border-radius: 3px;
|
||||
background-color: #eef;
|
||||
border: 1px solid $grey-200;
|
||||
}
|
||||
|
||||
pre {
|
||||
background: $grey-200;
|
||||
}
|
||||
|
||||
pre.highlight {
|
||||
background: $grey-color-light;
|
||||
}
|
||||
|
||||
code {
|
||||
|
|
@ -40,8 +52,7 @@ code {
|
|||
}
|
||||
|
||||
pre {
|
||||
padding: 8px 12px;
|
||||
overflow-x: scroll;
|
||||
//@extend .admonition;
|
||||
|
||||
> code {
|
||||
border: 0;
|
||||
|
|
@ -50,6 +61,8 @@ pre {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Clearfix
|
||||
*/
|
||||
|
|
@ -62,11 +75,7 @@ pre {
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Icons
|
||||
*/
|
||||
.icon {
|
||||
|
||||
> svg {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
|
|
@ -78,3 +87,13 @@ pre {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
td, th {
|
||||
&.halign-left {text-align:left}
|
||||
&.halign-right {text-align:right}
|
||||
&.halign-center {text-align:center}
|
||||
&.valign-top {vertical-align:top}
|
||||
&.valign-bottom {vertical-align:bottom}
|
||||
&.valign-middle {vertical-align:middle}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,11 @@
|
|||
//
|
||||
.post {
|
||||
.mdl-card__supporting-text {
|
||||
padding: 16px;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Styles for post
|
||||
//
|
||||
|
||||
|
|
@ -16,7 +23,7 @@
|
|||
flex-shrink: 0;
|
||||
|
||||
.post-container {
|
||||
max-width: 1600px;
|
||||
max-width: 960px;
|
||||
width: calc(100% - 16px);
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
|
|
|||
1
_sass/_quantum-colors.scss
Symbolic link
1
_sass/_quantum-colors.scss
Symbolic link
|
|
@ -0,0 +1 @@
|
|||
../3rd-party/quantum-colors/_quantum-colors.scss
|
||||
0
_sass/adoc-material-icons.scss
Normal file
0
_sass/adoc-material-icons.scss
Normal file
Loading…
Add table
Add a link
Reference in a new issue