/ittf/site/docs/styles/article.css.ittf (primary)
1 css 2 $include base 3 $include header 4 $include search 5 $include aside-right 6 $include news 7 < article 8 background-color ${wzCtx.Colors.bg_dark_medium} 9 border-radius 10px 10 padding 20px 11 margin 0 5px 3px 5px 12 box-shadow 0 3px 5px rgba(0,0,0,0.1) 13 font-size 16px 14 media (min-width: 768px) 15 < article 16 padding 40px 40px 30px 17 font-size 21px 18 margin 0 10px 10px 10px 19 box-shadow 0 5px 10px rgba(0,0,0,0.1) 20 . doc-container 21 margin 0 auto 22 width 60% 23 display flex 24 . w-1-5 25 width 20% 26 . w-4-5 27 width 80% 28 . doc-title 29 font-size 1.5rem 30 font-weight 600 31 border-bottom 1px solid #999 32 . ittf-panel 33 $$ background-color #aaa 34 $$ padding 20px 35 margin-bottom 20px 36 . ittf-panel-title 37 font-size 1rem 38 font-weight 700 39 margin-bottom 2px 40 media (min-width: 768px) 41 . ittf-panel-title 42 font-size 19px 43 font-weight 700 44 margin-bottom 4px 45 . link 46 float 'right' 47 paddingLeft '10px' 48 . cheatsheet 49 . cheatsheet-page 50 display flex 51 padding 25px 52 position fixed 53 height 100vh 54 width 100% 55 . cheatsheet-sidebar 56 display flex 57 min-width 300px 58 margin 5px 59 flex-direction column 60 overflow auto 61 . cheatsheet-sidebar-schemas 62 display flex 63 flex-direction column 64 border 1px solid gray 65 margin-bottom 5px 66 . cheatsheet-sidebar-element-title 67 padding-left 15px 68 font-weight 600 69 . cheatsheet-sidebar-items 70 border 1px solid gray 71 . cheatsheet-content 72 flex 1 1 auto 73 margin 5px 74 overflow auto 75 . cheatsheet-item 76 display flex 77 background-color #3e5a6d 78 . cheatsheet-ittf 79 padding 10px 80 border 1px solid gray 81 margin 5px 82 width 50% 83 < pre 84 width 100% 85 padding 10px 86 . cheatsheet-generated 87 padding 10px 88 border 1px solid gray 89 margin 5px 90 width 50% 91 background-color #dedede 92 < pre 93 width 100% 94 padding 10px 95 . cheatsheet-element-title 96 background-color #bbb 97 width 100% 98 padding 15px 5px 15px 15px 99 margin 20px 0 10px 0 100 font-size 1.2rem 101 font-weight 600 102 . cheatsheet-item-title 103 padding 5px 10px 0px 10px 104 font-weight 700 105 $include highlight 106 $ var opt = wzCtx.Fonts 107 css/fonts( &opt)
/ittf/site/docs/styles/t/base.css.ittf
1 $group 2 < html 3 margin 0 4 padding 0 5 border 0 6 vertical-align baseline 7 font-family "Lato",sans-serif 8 font-size 16px 9 overflow-x hidden 10 overflow-y scroll 11 box-sizing border-box 12 < body 13 font 300 21px Lato, 'Helvetica Neue', Helvetica, Arial, sans-serif 14 background-color ${wzCtx.Colors.bg_dark} 15 color ${wzCtx.Colors.c_dark} 16 < ul 17 margin-left 0.45rem 18 margin-right 0 19 margin-top 0 20 padding 0 21 margin-bottom 1.45rem 22 list-style-position inside 23 list-style-image none 24 $$ list-style-type none 25 < a 26 text-decoration none 27 color #fc0 28 transition all 0.25s 29 & :hover 30 color #da0 31 < td 32 padding 0 10px
/ittf/site/docs/styles/t/header.css.ittf
1 $group 2 < header .flexbox 3 display flex 4 height 50px 5 < header 6 padding 15px 7 background darken(#333, 3%) 8 < h1, nav 9 display inline-block 10 . flexbox 11 display flex 12 height 50px 13 & > * 14 margin auto 15 . logo 16 display block 17 < img 18 margin-top -7px 19 . search .svg-icons 20 display none 21 < nav, .meta 22 < ul 23 padding 0 24 margin 0 25 white-space nowrap 26 display inline-block 27 < li 28 display inline-block 29 . meta ul 30 margin-left 10px 31 < li 32 vertical-align middle 33 . main-nav, .meta 34 < li 35 < a 36 border-radius 5px 37 font-weight 900 38 font-size 0.75em 39 padding 0.5em 1em 40 text-shadow none 41 text-transform uppercase 42 transition all .25s 43 & :hover 44 background-color #252525 45 box-shadow inset 0 1px 3px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.1) 46 text-shadow 0 1px 3px rgba(0,0,0,.5) 47 & .current 48 < a 49 background-color #fc0 50 color #222 51 box-shadow inset 0 1px 0 rgba(255,255,255,.5), 0 1px 5px rgba(0,0,0,.5) 52 text-shadow 0 1px 0 rgba(255,255,255,.3) 53 . mobile-nav 54 padding 0 5px 55 < ul 56 overflow hidden 57 width 100% 58 display table 59 < a 60 float left 61 width 100% 62 background-color #333 63 color #fc0 64 text-align center 65 text-transform uppercase 66 font-size 0.625em 67 font-weight 900 68 padding 10px 5px 69 border-radius 5px 70 < li 71 display table-cell 72 width 20% 73 padding 8px 2px 74 . current 75 < a 76 background-color #fc0 77 color #222 78 box-shadow inset 0 1px 0 rgba(255,255,255,.5), 0 1px 5px rgba(0,0,0,.5) 79 text-shadow 0 1px 0 rgba(255,255,255,.3) 80 - This code is courtesy Ben Balter, modified by Parker Moore for jekyllrb.com 81 - http://ben.balter.com/2014/03/13/pages-anchor-links/ 82 . header-link 83 position relative 84 left 0.5em 85 opacity 0 86 font-size 0.8em 87 transition opacity 0.2s ease-in-out 0.1s 88 < h2:hover .header-link 89 + h3:hover .header-link 90 + h4:hover .header-link 91 + h5:hover .header-link 92 + h6:hover .header-link 93 opacity 1 94 media (max-width: 580px) 95 < header 96 . flexbox 97 height auto 98 . logo img 99 margin-top 0 100 media (max-width: 699px) 101 . searchbox 102 display none 103 media (max-width: 768px) 104 . main-nav ul 105 text-align right 106 media (max-width: 830px) 107 . main-nav 108 . show-on-mobiles 109 display inline 110 . hide-on-mobiles 111 display none 112 media (max-width: 890px) 113 . meta 114 display none
/ittf/site/docs/styles/t/search.css.ittf
1 $group 2 . searchbox 3 display inline-block 4 position relative 5 width 200px 6 height 32px !important 7 padding-top 1px 8 white-space nowrap 9 box-sizing border-box 10 border 0 11 border-radius 16px 12 visibility visible !important 13 & :hover 14 box-shadow inset 0 0 0 3px #b3b3b3 15 background-color ${wzCtx.Colors.c_dark} 16 color ${wzCtx.Colors.bg_dark} 17 < input 18 display inline-block 19 box-sizing border-box 20 transition box-shadow 0.4s ease, background 0.4s ease 21 box-shadow inset 0 0 0 1px #cccccc 22 background ${wzCtx.Colors.bg_dark} 23 padding 0 24 padding-right 26px 25 padding-left 32px 26 width 100% 27 height 100% 28 vertical-align middle 29 white-space normal 30 font-size 12px 31 appearance none 32 & :focus 33 outline 0 34 box-shadow inset 0 0 0 1px #aaaaaa 35 background-color ${wzCtx.Colors.c_dark} 36 color ${wzCtx.Colors.bg_dark} 37 & ::placeholder 38 color #aaaaaa
/ittf/site/docs/styles/t/aside-right.css.ittf
1 $group 2 . aside-right 3 padding-top 30px 4 < h4 5 text-transform uppercase 6 font-size 14px 7 font-weight 700 8 padding 0 0 10px 30px 9 margin-left -30px 10 display inline-block 11 border-bottom 1px solid #c00 12 < ul 13 padding-left 0 14 & :first-child 15 margin-top 0 16 < li 17 list-style-type none 18 < a 19 position relative 20 & .current 21 < div:before 22 content "" 23 border-color transparent transparent transparent #444 24 border-style solid 25 border-width 10px 26 width 0 27 height 0 28 position absolute 29 top 0 30 left -30px 31 & .current div 32 color #f90
/ittf/site/docs/styles/t/news.css.ittf
1 $group 2 < article h2:first-child 3 margin-top 0 4 . post-category 5 + .post-meta 6 display inline-block 7 vertical-align middle 8 font-size .8em 9 . post-category 10 display inline-block 11 margin-left -30px 12 padding 6px 10px 8px 13 padding-left 50px 14 border-radius 0 5px 5px 0 15 position relative 16 box-shadow 0 1px 5px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(0,0,0,.3) 17 background-color #9e2812 18 background-image url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzllMjgxMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2ZjBkMGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) 19 background-image -webkit-gradient(linear, left top, left bottom, from(#9e2812), to(#6f0d0d)) 20 background-image -webkit-linear-gradient(top, #9e2812 0%, #6f0d0d 100%) 21 background-image -moz-linear-gradient(top, #9e2812 0%, #6f0d0d 100%) 22 background-image -o-linear-gradient(top, #9e2812 0%, #6f0d0d 100%) 23 background-image linear-gradient(to bottom, #9e2812 0%,#6f0d0d 100%) 24 filter progid:DXImageTransform.Microsoft.gradient( startColorstr='#9e2812', endColorstr='#6f0d0d',GradientType=0 ) 25 & :before 26 content "" 27 position absolute 28 top -10px 29 left 0 30 border-color transparent #6f0d0d #6f0d0d transparent 31 border-style solid 32 border-width 5px 33 width 0 34 height 0 35 . post-content img 36 max-width 100% 37 . label 38 float left 39 text-transform uppercase 40 font-weight 700 41 text-shadow 0 -1px 0 rgba(0,0,0,.5) 42 media (max-width: 568px) 43 . post-category 44 padding-left 30px 45 media (min-width: 768px) 46 . post-category 47 margin-left -50px 48 . avatar 49 border-radius 3px 50 display inline-block 51 vertical-align middle 52 . post-meta 53 padding 5px 0 54 color #c0c0c0 55 font-weight 600 56 text-shadow 0 -1px 0 #000 57 . post-date 58 + .post-author 59 margin-left 10px 60 . news article + article 61 margin-top -10px 62 border-radius 0 0 10px 10px 63 border-top 1px solid #555 64 box-shadow 0 -1px 0 #2f2f2f
/ittf/site/docs/styles/t/highlight.css.ittf
1 $group 2 < pre, code 3 white-space pre 4 $$ display inline-block 5 margin 0 6 font 14px/1.8em Menlo, Consolas, "Courier New", Courier, "Liberation Mono", monospace 7 padding 0 0.5em 8 - ======================================== 9 - WIZZI PRETTY PRINT 10 - ---------------------------------------- 11 . pln 12 color #F1F2F3 13 . tag 14 color #77f328 15 . str 16 color #EC7600 $$ string content 17 . kwd 18 color #f79256 $$ a keyword 19 . com 20 color #66747B $$ a comment 21 . typ 22 color #678CB1 $$ a type name 23 . lit 24 color #FACD22 $$ a literal value 25 . mix 26 color #ff0040 $$ mixin call 27 cursor pointer 28 . tag 29 color #77f328 $$ a markup tag name 30 . atn 31 color #E0E2E4 $$ a markup attribute name 32 . atv 33 color #EC7600 $$ a markup attribute value 34 . expr 35 color #f3e877 $$ a declaration; a variable name 36 . fun 37 color red $$ a function name 38 . arg 39 color yellow $$ a mixin arg 40 . pp-ln 41 color #999 42 . pp-pln 43 color #f1ebeb 44 . pp-str 45 color #EC7600 $$ string content 46 . pp-kwd 47 color #f79256 $$ a keyword 48 . pp-com 49 color #66747B $$ a comment 50 . pp-typ 51 color #678CB1 $$ a type name 52 . pp-lit 53 color #FACD22 $$ a literal value 54 . pp-mix 55 color #ff0040 $$ mixin call 56 cursor pointer 57 . pp-tag 58 color #77f328 $$ a markup tag name 59 . pp-atn 60 color #E0E2E4 $$ a markup attribute name 61 . pp-atv 62 color #EC7600 $$ a markup attribute value 63 . pp-expr 64 color #f3e877 $$ a declaration; a variable name 65 . pp-fun 66 color red $$ a function name 67 . pp-arg 68 color yellow $$ a mixin arg 69 < pre.prettyprint 70 $$ padding 0.8rem 71 $$ border-left 5px solid #999 72 $$ font-size 1rem 73 overflow auto 74 $$ background #2B3A42 75 $$ background #3e586d 76 $$ margin-bottom 1rem 77 $$ text-shadow 0 1px #888 78 font-family Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace 79 text-align left 80 white-space pre 81 word-spacing normal 82 word-break normal 83 word-wrap normal 84 line-height 1.3 85 tab-size 4 86 hyphens none 87 background-color #2b2b2b 88 color #fff 89 $$ max-width 100% 90 $$ overflow-x auto 91 vertical-align middle 92 border-radius 5px 93 box-shadow inset 0 1px 10px rgba(0,0,0,.3), 0 1px 0 rgba(255,255,255,.1), 0 -1px 0 rgba(0,0,0,.5) 94 < ol 95 padding-left 2rem 96 . L0 97 + .L1 98 + .L2 99 + .L3 100 + .L4 101 + .L5 102 + .L6 103 + .L7 104 + .L8 105 + .L9 106 color #777 107 margin-left 0.3rem 108 padding-left 0.3rem 109 list-style-type decimal 110 # Alternate shading for lines 111 . L1 112 + .L3 113 + .L5 114 + .L7 115 + .L9 116 $$ background #013a56 117 $$ background #2A3941 118 background-color #2f2f2f 119 . prettyprint-js 120 background #fff 121 # Alternate shading for lines 122 . J1 123 + .J3 124 + .J5 125 + .J7 126 + .J9 127 background #ddd 128 . linenums 129 color #fff 130 media screen and (max-width: 1028px) 131 . pp-pln 132 color #FFF 133 < pre.prettyprint 134 padding 1.2rem 135 border-left 5px solid #999 136 font-size 2rem 137 line-height 3rem 138 overflow auto 139 $* 140 media (min-width: 768px) 141 < pre, code 142 font-size 16px 143 . highlight 144 + p > pre 145 + p > code 146 + p > nobr > code 147 + li > code 148 + li> pre 149 + h5 > code 150 + .note > code 151 background-color #2b2b2b 152 color #fff 153 max-width 100% 154 overflow-x auto 155 vertical-align middle 156 border-radius 5px 157 box-shadow inset 0 1px 10px rgba(0,0,0,.3), 0 1px 0 rgba(255,255,255,.1), 0 -1px 0 rgba(0,0,0,.5) 158 . note .highlight 159 width 94% 160 < pre code 161 font-size 0.9em 162 background-color transparent 163 box-shadow none 164 . note code 165 background-color #333 166 background-color rgba(0,0,0,0.2) 167 margin-left 2.5px 168 margin-right 2.5px 169 font-size 0.8em 170 . code-block 171 margin 10px 0 172 < code 173 background none 174 . highlight 175 margin 1em 0 176 width 100% 177 overflow auto 178 < pre.highlight 179 padding 10px 0.5em 180 . highlighter-rouge .highlight 181 @extend .highlight 182 margin 0 183 *$ 184 . highlight-code 185 white-space nowrap 186 padding 4px 8px 4px 0px 187 background-color #2b2b2b 188 color #fff 189 max-width 100% 190 overflow-x auto 191 vertical-align middle 192 -webkit-border-radius 5px 193 -moz-border-radius 5px 194 border-radius 5px 195 box-shadow inset 0 1px 10px rgba(0,0,0,0.3),0 1px 0 rgba(255,255,255,0.1),0 -1px 0 rgba(0,0,0,0.5)
/ittf/site/docs/t/css/fonts.css.ittf
1 $group 2 $params &opt 3 $if opt.useMaterialIcons 4 font-face 5 font-family 'Material Icons' 6 font-style normal 7 font-weight ${opt.materialIcons.fontWeight} 8 - For IE6-8 9 src url(${opt.materialIcons.baseUrl}/MaterialIcons-Regular.eot) 10 src local('Material Icons'), 11 \b local('MaterialIcons-Regular'), 12 \b url(${opt.materialIcons.baseUrl}/MaterialIcons-Regular.woff2) format('woff2'), 13 \b url(${opt.materialIcons.baseUrl}/MaterialIcons-Regular.woff) format('woff'), 14 \b url(${opt.materialIcons.baseUrl}/MaterialIcons-Regular.ttf) format('truetype') 15 . material-icons 16 font-family 'Material Icons' 17 font-weight normal 18 font-style normal 19 - Preferred icon size 20 font-size ${opt.materialIcons.size} 21 display inline-block 22 line-height 1 23 text-transform none 24 letter-spacing normal 25 word-wrap normal 26 white-space nowrap 27 direction ltr 28 - Support for all WebKit browsers. 29 -webkit-font-smoothing antialiased 30 - Support for Safari and Chrome. 31 text-rendering optimizeLegibility 32 - Support for Firefox. 33 -moz-osx-font-smoothing grayscale 34 - Support for IE. 35 @ font-feature-settings 'liga' 36 - Rules for sizing the icon. 37 . material-icons.md-18 38 font-size 18px 39 . material-icons.md-24 40 font-size 24px 41 . material-icons.md-36 42 font-size 36px 43 . material-icons.md-48 44 font-size 48px 45 - Rules for using icons as black on a light background. 46 . material-icons.md-dark 47 color rgba(0, 0, 0, 0.54) 48 . material-icons.md-dark.md-inactive 49 color rgba(0, 0, 0, 0.26) 50 - Rules for using icons as white on a dark background. 51 . material-icons.md-light 52 color rgba(255, 255, 255, 1) 53 . material-icons.md-light.md-inactive 54 color rgba(255, 255, 255, 0.3) 55 $if opt.useFontAwesome 56 font-face 57 font-family 'FontAwesome' 58 src url('${opt.fontAwesome.baseUrl}/FontAwesome.eot?9h6hxj') 59 src url('${opt.fontAwesome.baseUrl}/FontAwesome.eot?9h6hxj#iefix') format('embedded-opentype'), 60 \b url('${opt.fontAwesome.baseUrl}/FontAwesome.woff?9h6hxj') format('woff'), 61 \b url('${opt.fontAwesome.baseUrl}/FontAwesome.ttf?9h6hxj') format('truetype'), 62 \b url('${opt.fontAwesome.baseUrl}/FontAwesome.svg?9h6hxj#FontAwesome') format('svg') 63 font-weight normal 64 font-style normal 65 . fa 66 display inline-block 67 font normal normal normal 14px/1 FontAwesome 68 font-size inherit 69 text-rendering auto 70 -webkit-font-smoothing antialiased 71 -moz-osx-font-smoothing grayscale 72 . fa-link:before 73 content "\f0c1" 74 . fa-pencil:before 75 content "\f040"