├── .gitignore ├── docs ├── img │ ├── css.png │ └── imagem.jpeg ├── font │ ├── fontello.eot │ ├── fontello.ttf │ ├── fontello.woff │ ├── fontello.woff2 │ └── fontello.svg ├── js │ ├── certificado.png │ └── highlight.min.js ├── css │ ├── github.min.css │ ├── fontello.css │ ├── docs.css │ ├── organico.css │ └── normalize.css └── index.html ├── README.md ├── base.html ├── package.json └── css ├── organico.min.css ├── organico.css └── normalize.css /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ -------------------------------------------------------------------------------- /docs/img/css.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/estevanmaito/organico/HEAD/docs/img/css.png -------------------------------------------------------------------------------- /docs/img/imagem.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/estevanmaito/organico/HEAD/docs/img/imagem.jpeg -------------------------------------------------------------------------------- /docs/font/fontello.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/estevanmaito/organico/HEAD/docs/font/fontello.eot -------------------------------------------------------------------------------- /docs/font/fontello.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/estevanmaito/organico/HEAD/docs/font/fontello.ttf -------------------------------------------------------------------------------- /docs/font/fontello.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/estevanmaito/organico/HEAD/docs/font/fontello.woff -------------------------------------------------------------------------------- /docs/js/certificado.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/estevanmaito/organico/HEAD/docs/js/certificado.png -------------------------------------------------------------------------------- /docs/font/fontello.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/estevanmaito/organico/HEAD/docs/font/fontello.woff2 -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Orgânico CSS 2 | 3 | ## Um framework CSS 100% brasileiro 4 | 5 | ### Leve, natural e inobstrusivo. 6 | 7 | Inicialmente um arquivo CSS para o [Curso de Framework CSS](http://cursocss.com.br), que acabei incorporando ao desenvolvimento dos meus sites e que pode ser útil para mais pessoas que procurem: 8 | 9 | - Uma ferramenta que não imponha suas opiniões; 10 | - Escrever menos ```!important``` e mais estilo; 11 | - Entender a estrutura através de classes idênticas à linguagem falada; 12 | - Uma ferramenta leve, que não impacte negativamente a performance em redes limitadas; 13 | - Responsividade, mobile-first e flexbox; 14 | - Sair do submundo do suporte ao IE8 e 9. 15 | 16 | ## Utilização 17 | 18 | EM BREVE -------------------------------------------------------------------------------- /base.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Orgânico CSS 7 | 8 | 9 | 10 | 11 |
12 |
13 |
14 |

Seja bem-vind@!

15 |

Esta é a estrutura mínima para você começar com o Orgânico CSS!

16 | Documentação 17 |
18 |
19 |
20 | 21 | -------------------------------------------------------------------------------- /docs/css/github.min.css: -------------------------------------------------------------------------------- 1 | .hljs{display:block;overflow-x:auto;padding:0.5em;color:#333;background:#f8f8f8}.hljs-comment,.hljs-quote{color:#998;font-style:italic}.hljs-keyword,.hljs-selector-tag,.hljs-subst{color:#333;font-weight:bold}.hljs-number,.hljs-literal,.hljs-variable,.hljs-template-variable,.hljs-tag .hljs-attr{color:#008080}.hljs-string,.hljs-doctag{color:#d14}.hljs-title,.hljs-section,.hljs-selector-id{color:#900;font-weight:bold}.hljs-subst{font-weight:normal}.hljs-type,.hljs-class .hljs-title{color:#458;font-weight:bold}.hljs-tag,.hljs-name,.hljs-attribute{color:#000080;font-weight:normal}.hljs-regexp,.hljs-link{color:#009926}.hljs-symbol,.hljs-bullet{color:#990073}.hljs-built_in,.hljs-builtin-name{color:#0086b3}.hljs-meta{color:#999;font-weight:bold}.hljs-deletion{background:#fdd}.hljs-addition{background:#dfd}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:bold} -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "organico", 3 | "version": "1.0.0", 4 | "description": "Leve, natural e inobstrusivo", 5 | "main": "index.js", 6 | "scripts": { 7 | "autoprefixer": "postcss -u autoprefixer -r css/*", 8 | "minify-css": "cleancss -o css/organico.min.css css/organico.css --rounding-precision -1", 9 | "build:css": "npm run autoprefixer && npm run minify-css" 10 | }, 11 | "keywords": [ 12 | "css", 13 | "framework", 14 | "light", 15 | "leve", 16 | "organic", 17 | "organico", 18 | "natural", 19 | "grid", 20 | "responsivo", 21 | "mobile" 22 | ], 23 | "homepage": "https://estevanmaito.github.io/organico", 24 | "author": "Estevan Maito", 25 | "repository": { 26 | "type": "git", 27 | "url": "https://github.com/estevanmaito/organico.git" 28 | }, 29 | "bugs": { 30 | "url": "https://github.com/estevanmaito/organico/issues" 31 | }, 32 | "license": "MIT", 33 | "devDependencies": { 34 | "autoprefixer": "^6.5.0", 35 | "clean-css": "^3.4.20", 36 | "postcss-cli": "^2.6.0" 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /docs/font/fontello.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Copyright (C) 2016 by original authors @ fontello.com 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /docs/css/fontello.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'fontello'; 3 | src: url('../font/fontello.eot?70264529'); 4 | src: url('../font/fontello.eot?70264529#iefix') format('embedded-opentype'), 5 | url('../font/fontello.woff2?70264529') format('woff2'), 6 | url('../font/fontello.woff?70264529') format('woff'), 7 | url('../font/fontello.ttf?70264529') format('truetype'), 8 | url('../font/fontello.svg?70264529#fontello') format('svg'); 9 | font-weight: normal; 10 | font-style: normal; 11 | } 12 | /* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */ 13 | /* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */ 14 | /* 15 | @media screen and (-webkit-min-device-pixel-ratio:0) { 16 | @font-face { 17 | font-family: 'fontello'; 18 | src: url('../font/fontello.svg?70264529#fontello') format('svg'); 19 | } 20 | } 21 | */ 22 | 23 | [class^="icon-"]:before, [class*=" icon-"]:before { 24 | font-family: "fontello"; 25 | font-style: normal; 26 | font-weight: normal; 27 | speak: none; 28 | 29 | display: inline-block; 30 | text-decoration: inherit; 31 | width: 1em; 32 | margin-right: .2em; 33 | text-align: center; 34 | /* opacity: .8; */ 35 | 36 | /* For safety - reset parent styles, that can break glyph codes*/ 37 | font-variant: normal; 38 | text-transform: none; 39 | 40 | /* fix buttons height, for twitter bootstrap */ 41 | line-height: 1em; 42 | 43 | /* Animation center compensation - margins should be symmetric */ 44 | /* remove if not needed */ 45 | margin-left: .2em; 46 | 47 | /* you can be more comfortable with increased icons size */ 48 | /* font-size: 120%; */ 49 | 50 | /* Font smoothing. That was taken from TWBS */ 51 | -webkit-font-smoothing: antialiased; 52 | -moz-osx-font-smoothing: grayscale; 53 | 54 | /* Uncomment for 3D effect */ 55 | /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ 56 | } 57 | 58 | .icon-traffic-cone:before { content: '\e800'; } /* '' */ 59 | .icon-leaf:before { content: '\e801'; } /* '' */ 60 | .icon-feather:before { content: '\e802'; } /* '' */ -------------------------------------------------------------------------------- /docs/css/docs.css: -------------------------------------------------------------------------------- 1 | header { 2 | text-align: center; 3 | padding-top: 10rem; 4 | padding-bottom: 12rem; 5 | } 6 | 7 | header h1 { 8 | font-size: 8rem; 9 | margin-bottom: 1rem; 10 | } 11 | 12 | @media screen and (max-width: 650px) { 13 | header h1 { 14 | font-size: 5rem; 15 | } 16 | } 17 | 18 | .curso { 19 | background-color: #f1f1f1; 20 | background-image: url('../img/css.png'); 21 | background-position: center 1rem; 22 | background-repeat: no-repeat; 23 | background-size: 6rem; 24 | border: 1px solid #ddd; 25 | border-radius: 2px; 26 | box-sizing: border-box; 27 | color: #555 !important; 28 | display: block; 29 | font-size: 1.5rem; 30 | margin: 2rem auto 0; 31 | padding-top: 10rem; 32 | padding-bottom: 2rem; 33 | position: relative; 34 | text-decoration: none; 35 | width: 100%; 36 | } 37 | 38 | @media screen and (min-width: 750px) { 39 | .curso { 40 | background-position: 2rem; 41 | background-size: 70px; 42 | padding: 3rem 0; 43 | padding-left: 7rem; 44 | width: 360px; 45 | } 46 | } 47 | 48 | .tag { 49 | background-color: #4DBD2E; 50 | border-radius: 2px; 51 | color: #fff; 52 | display: block; 53 | font-size: 1rem; 54 | padding: .3rem .5rem; 55 | position: absolute; 56 | right: 0; 57 | top: 0; 58 | } 59 | 60 | .curso span { 61 | display: block; 62 | } 63 | 64 | .curso span:nth-child(2) { 65 | margin-bottom: 1rem; 66 | } 67 | 68 | .coluna.exemplo, 69 | .colunas.exemplo { 70 | padding-top: 1rem; 71 | padding-bottom: 1rem; 72 | background-color: #ddd; 73 | border: 2px solid white; 74 | border-radius: 2px; 75 | font-size: 1rem; 76 | } 77 | 78 | [class^="icon-"] { 79 | color: #ddd; 80 | font-size: 4rem; 81 | margin: 0; 82 | } 83 | 84 | .caracteristicas { 85 | text-align: center; 86 | } 87 | 88 | @media screen and (min-width: 750px) { 89 | .caracteristicas { 90 | margin: 2rem 0 5rem; 91 | } 92 | } 93 | 94 | .caracteristicas h3 { 95 | margin-top: .8rem; 96 | margin-bottom: .9rem; 97 | } 98 | 99 | h1.exemplo { 100 | border-bottom: 1px solid #e1e1e1; 101 | } 102 | 103 | nav { 104 | padding-top: 4rem; 105 | padding-left: 1rem; 106 | } 107 | 108 | .fixed { 109 | padding-top: 2rem; 110 | position: fixed; 111 | top: 0; 112 | } 113 | 114 | @media screen and (max-width: 750px) { 115 | nav { 116 | position: relative; 117 | } 118 | } 119 | 120 | nav li { 121 | list-style: none; 122 | } 123 | 124 | nav a, 125 | nav a:visited { 126 | text-decoration: none; 127 | color: #555; 128 | } 129 | 130 | nav a:hover, 131 | nav a:focus, 132 | nav a.active { 133 | font-weight: 700; 134 | color: #555; 135 | } -------------------------------------------------------------------------------- /css/organico.min.css: -------------------------------------------------------------------------------- 1 | .coluna,.colunas,.container{padding-right:1.5rem;padding-left:1.5rem;width:100%;box-sizing:border-box}@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;src:local('Open Sans'),local('OpenSans'),url(https://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:700;src:local('Open Sans Bold'),local('OpenSans-Bold'),url(https://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzInF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')}html{font-size:62.5%}body{color:#555;font-size:1.6rem;font-weight:400;font-family:"Open Sans","Helvetica Neue",Arial,sans-serif;line-height:1.6}.container{max-width:990px}.linha{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-1.5rem;margin-right:-1.5rem}@media (min-width:400px){.container{width:85%;margin:0 auto}}@media (min-width:750px){.container{width:80%}.uma.coluna,.uma.colunas{-webkit-box-flex:0;-ms-flex:0 0 8.33333333%;flex:0 0 8.33333333%;max-width:8.33333333%}.duas.colunas{-webkit-box-flex:0;-ms-flex:0 0 16.66666667%;flex:0 0 16.66666667%;max-width:16.66666667%}.tres.colunas{-webkit-box-flex:0;-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}.quatro.colunas{-webkit-box-flex:0;-ms-flex:0 0 33.33333333%;flex:0 0 33.33333333%;max-width:33.33333333%}.cinco.colunas{-webkit-box-flex:0;-ms-flex:0 0 41.66666667%;flex:0 0 41.66666667%;max-width:41.66666667%}.seis.colunas{-webkit-box-flex:0;-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}.sete.colunas{-webkit-box-flex:0;-ms-flex:0 0 58.33333333%;flex:0 0 58.33333333%;max-width:58.33333333%}.oito.colunas{-webkit-box-flex:0;-ms-flex:0 0 66.66666667%;flex:0 0 66.66666667%;max-width:66.66666667%}.nove.colunas{-webkit-box-flex:0;-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}.dez.colunas{-webkit-box-flex:0;-ms-flex:0 0 83.33333333%;flex:0 0 83.33333333%;max-width:83.33333333%}.onze.colunas{-webkit-box-flex:0;-ms-flex:0 0 91.66666667%;flex:0 0 91.66666667%;max-width:91.66666667%}.doze.colunas{-webkit-box-flex:0;-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}}h1,h2,h3,h4,h5,h6,strong{color:#333;font-weight:700}h1{font-size:4rem}h2{font-size:3.4rem}h3{font-size:2.8rem}h4{font-size:2.2rem}h5{font-size:1.6rem}h6{font-size:1.4rem}p{margin-top:0}a{color:#337ab7}a:focus,a:hover{color:#23527c}a:visited{color:#c34f4a}.botao,button,input[type=submit],input[type=reset],input[type=button]{display:inline-block;box-sizing:border-box;background-color:#fff;border:1px solid #bbb;border-radius:2px;color:#555;cursor:default;font-size:1.4rem;font-weight:700;line-height:3.8rem;text-align:center;text-decoration:none;padding:0 3rem;height:3.8rem}.botao:hover,button:hover,input[type=submit]:hover,input[type=reset]:hover,input[type=button]:hover{border-color:#888;color:#333}.botao:focus,button:focus,input[type=submit]:focus,input[type=reset]:focus,input[type=button]:focus{background-color:#f1f1f1;border-color:#888;outline:0}.botao:active,button:active,input[type=submit]:active,input[type=reset]:active,input[type=button]:active{box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.botao.destacado,button.botao.destacado,input[type=submit].botao.destacado,input[type=reset].botao.destacado,input[type=button].botao.destacado{background-color:#33c3f0;border-color:#33c3f0;color:#fff}.botao.destacado:focus,.botao.destacado:hover,button.botao.destacado:focus,button.botao.destacado:hover,input[type=submit].botao.destacado:focus,input[type=submit].botao.destacado:hover,input[type=reset].botao.destacado:focus,input[type=reset].botao.destacado:hover,input[type=button].botao.destacado:focus,input[type=button].botao.destacado:hover{background-color:#1eaedb;border-color:#1eaedb;color:#fff}.botao:visited{color:#555}.botao.destacado:visited{color:#fff}input[type=email],input[type=number],input[type=search],input[type=text],input[type=tel],input[type=url],input[type=password],select,textarea{box-sizing:border-box;box-shadow:none;background-color:#fff;border:1px solid #d1d1d1;border-radius:2px;font:inherit;padding:.6rem 1rem;height:3.8rem}input[type=email]:focus,input[type=number]:focus,input[type=search]:focus,input[type=text]:focus,input[type=tel]:focus,input[type=url]:focus,input[type=password]:focus,select:focus,textarea:focus{border:1px solid #33c3f0;outline:0}textarea{min-height:6.5rem}ol,ul{list-style-position:inside;padding-left:0}ol ol,ol ul,ul ol,ul ul{padding-left:3rem;margin-top:1rem}.botao,button,input,li,select,table,textarea{margin-bottom:1rem}code{background-color:#f1f1f1;border-radius:2px;color:#c7254e;padding:.2rem .5rem}pre>code{display:block;padding:1rem 1.5rem}table{border-collapse:collapse}td,th{border-bottom:1px solid #e1e1e1;padding:1rem .7rem;text-align:left}label{display:block;font-weight:700;margin-bottom:.4rem}.u-width-100{box-sizing:border-box;width:100%} -------------------------------------------------------------------------------- /css/organico.css: -------------------------------------------------------------------------------- 1 | /* Tabela de conteúdos 2 | –––––––––––––––––––––––––––––––––––––––––––––––––– 3 | - Estilos base 4 | - Grid 5 | - Tipografia 6 | - Links 7 | - Botões 8 | - Formulários 9 | - Listas 10 | - Código 11 | - Tabelas 12 | - Espaçamento 13 | - Utilidades 14 | */ 15 | 16 | /* Estilos base 17 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 18 | @import 'https://fonts.googleapis.com/css?family=Open+Sans:400,700'; 19 | 20 | html { 21 | font-size: 62.5%; /* 16px pra 10px */ 22 | } 23 | 24 | body { 25 | color: #555; 26 | font-size: 1.6rem; 27 | font-weight: 400; 28 | font-family: "Open Sans" ,"Helvetica Neue", Arial, sans-serif; 29 | line-height: 1.6; 30 | } 31 | 32 | /* Grid 33 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 34 | .container { 35 | box-sizing: border-box; 36 | padding-left: 1.5rem; 37 | padding-right: 1.5rem; 38 | width: 100%; 39 | max-width: 990px; 40 | } 41 | 42 | .linha { 43 | display: -webkit-box; 44 | display: -ms-flexbox; 45 | display: flex; 46 | -ms-flex-wrap: wrap; 47 | flex-wrap: wrap; 48 | margin-left: -1.5rem; 49 | margin-right: -1.5rem; 50 | } 51 | 52 | .coluna, 53 | .colunas { 54 | box-sizing: border-box; 55 | padding-right: 1.5rem; 56 | padding-left: 1.5rem; 57 | width: 100%; 58 | } 59 | 60 | @media (min-width: 400px) { 61 | .container { 62 | width: 85%; 63 | margin: 0 auto; 64 | } 65 | } 66 | 67 | @media (min-width: 750px) { 68 | .container { 69 | width: 80%; 70 | } 71 | 72 | .uma.coluna, 73 | .uma.colunas { 74 | -webkit-box-flex: 0; 75 | -ms-flex: 0 0 8.33333333%; 76 | flex: 0 0 8.33333333%; 77 | max-width: 8.33333333%; 78 | } 79 | 80 | .duas.colunas { 81 | -webkit-box-flex: 0; 82 | -ms-flex: 0 0 16.66666667%; 83 | flex: 0 0 16.66666667%; 84 | max-width: 16.66666667%; 85 | } 86 | 87 | .tres.colunas { 88 | -webkit-box-flex: 0; 89 | -ms-flex: 0 0 25%; 90 | flex: 0 0 25%; 91 | max-width: 25%; 92 | } 93 | 94 | .quatro.colunas { 95 | -webkit-box-flex: 0; 96 | -ms-flex: 0 0 33.33333333%; 97 | flex: 0 0 33.33333333%; 98 | max-width: 33.33333333%; 99 | } 100 | 101 | .cinco.colunas { 102 | -webkit-box-flex: 0; 103 | -ms-flex: 0 0 41.66666667%; 104 | flex: 0 0 41.66666667%; 105 | max-width: 41.66666667%; 106 | } 107 | 108 | .seis.colunas { 109 | -webkit-box-flex: 0; 110 | -ms-flex: 0 0 50%; 111 | flex: 0 0 50%; 112 | max-width: 50%; 113 | } 114 | 115 | .sete.colunas { 116 | -webkit-box-flex: 0; 117 | -ms-flex: 0 0 58.33333333%; 118 | flex: 0 0 58.33333333%; 119 | max-width: 58.33333333%; 120 | } 121 | 122 | .oito.colunas { 123 | -webkit-box-flex: 0; 124 | -ms-flex: 0 0 66.66666667%; 125 | flex: 0 0 66.66666667%; 126 | max-width: 66.66666667%; 127 | } 128 | 129 | .nove.colunas { 130 | -webkit-box-flex: 0; 131 | -ms-flex: 0 0 75%; 132 | flex: 0 0 75%; 133 | max-width: 75%; 134 | } 135 | 136 | .dez.colunas { 137 | -webkit-box-flex: 0; 138 | -ms-flex: 0 0 83.33333333%; 139 | flex: 0 0 83.33333333%; 140 | max-width: 83.33333333%; 141 | } 142 | 143 | .onze.colunas { 144 | -webkit-box-flex: 0; 145 | -ms-flex: 0 0 91.66666667%; 146 | flex: 0 0 91.66666667%; 147 | max-width: 91.66666667%; 148 | } 149 | 150 | .doze.colunas { 151 | -webkit-box-flex: 0; 152 | -ms-flex: 0 0 100%; 153 | flex: 0 0 100%; 154 | max-width: 100%; 155 | } 156 | } 157 | 158 | /* Tipografia 159 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 160 | h1, 161 | h2, 162 | h3, 163 | h4, 164 | h5, 165 | h6, 166 | strong { 167 | color: #333; 168 | font-weight: 700; 169 | } 170 | 171 | h1 { 172 | font-size: 4rem; 173 | } 174 | 175 | h2 { 176 | font-size: 3.4rem; 177 | } 178 | 179 | h3 { 180 | font-size: 2.8rem; 181 | } 182 | 183 | h4 { 184 | font-size: 2.2rem; 185 | } 186 | 187 | h5 { 188 | font-size: 1.6rem; 189 | } 190 | 191 | h6 { 192 | font-size: 1.4rem; 193 | } 194 | 195 | p { 196 | margin-top: 0; 197 | } 198 | 199 | /* Links 200 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 201 | a { 202 | color: #337ab7; 203 | } 204 | 205 | a:hover, 206 | a:focus { 207 | color: #23527c; 208 | } 209 | 210 | a:visited { 211 | color: #c34f4a; 212 | } 213 | 214 | /* Botões 215 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 216 | .botao, 217 | button, 218 | input[type="submit"], 219 | input[type="reset"], 220 | input[type="button"] { 221 | display: inline-block; 222 | box-sizing: border-box; 223 | background-color: #fff; 224 | border: 1px solid #bbb; 225 | border-radius: 2px; 226 | color: #555; 227 | cursor: default; 228 | font-size: 1.4rem; 229 | font-weight: 700; 230 | line-height: 3.8rem; 231 | text-align: center; 232 | text-decoration: none; 233 | padding: 0 3rem; 234 | height: 3.8rem; 235 | } 236 | 237 | .botao:hover, 238 | button:hover, 239 | input[type="submit"]:hover, 240 | input[type="reset"]:hover, 241 | input[type="button"]:hover { 242 | border-color: #888; 243 | color: #333; 244 | } 245 | 246 | .botao:focus, 247 | button:focus, 248 | input[type="submit"]:focus, 249 | input[type="reset"]:focus, 250 | input[type="button"]:focus { 251 | background-color: #f1f1f1; 252 | border-color: #888; 253 | outline: 0; 254 | } 255 | 256 | .botao:active, 257 | button:active, 258 | input[type="submit"]:active, 259 | input[type="reset"]:active, 260 | input[type="button"]:active { 261 | box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); 262 | } 263 | 264 | .botao.destacado, 265 | button.botao.destacado, 266 | input[type="submit"].botao.destacado, 267 | input[type="reset"].botao.destacado, 268 | input[type="button"].botao.destacado { 269 | background-color: #33c3f0; 270 | border-color: #33c3f0; 271 | color: #fff; 272 | } 273 | 274 | .botao.destacado:hover, 275 | button.botao.destacado:hover, 276 | input[type="submit"].botao.destacado:hover, 277 | input[type="reset"].botao.destacado:hover, 278 | input[type="button"].botao.destacado:hover, 279 | .botao.destacado:focus, 280 | button.botao.destacado:focus, 281 | input[type="submit"].botao.destacado:focus, 282 | input[type="reset"].botao.destacado:focus, 283 | input[type="button"].botao.destacado:focus { 284 | background-color: #1eaedb; 285 | border-color: #1eaedb; 286 | color: #fff; 287 | } 288 | 289 | .botao:visited { 290 | color: #555 291 | } 292 | 293 | .botao.destacado:visited { 294 | color: #fff; 295 | } 296 | 297 | /* Formulários 298 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 299 | input[type="email"], 300 | input[type="number"], 301 | input[type="search"], 302 | input[type="text"], 303 | input[type="tel"], 304 | input[type="url"], 305 | input[type="password"], 306 | textarea, 307 | select { 308 | box-sizing: border-box; 309 | box-shadow: none; 310 | background-color: #fff; 311 | border: 1px solid #d1d1d1; 312 | border-radius: 2px; 313 | font: inherit; 314 | padding: .6rem 1rem; 315 | height: 3.8rem; 316 | } 317 | 318 | input[type="email"]:focus, 319 | input[type="number"]:focus, 320 | input[type="search"]:focus, 321 | input[type="text"]:focus, 322 | input[type="tel"]:focus, 323 | input[type="url"]:focus, 324 | input[type="password"]:focus, 325 | textarea:focus, 326 | select:focus { 327 | border: 1px solid #33c3f0; 328 | outline: 0; 329 | } 330 | 331 | textarea { 332 | min-height: 6.5rem; 333 | } 334 | 335 | label { 336 | display: block; 337 | font-weight: 700; 338 | } 339 | 340 | /* Listas 341 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 342 | ol, 343 | ul { 344 | list-style-position: inside; 345 | padding-left: 0; 346 | } 347 | 348 | ul ul, 349 | ul ol, 350 | ol ol, 351 | ol ul { 352 | padding-left: 3rem; 353 | margin-top: 1rem; 354 | } 355 | 356 | li { 357 | margin-bottom: 1rem; 358 | } 359 | 360 | /* Código 361 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 362 | code { 363 | background-color: #f1f1f1; 364 | border-radius: 2px; 365 | color: #c7254e; 366 | padding: .2rem .5rem; 367 | } 368 | 369 | pre > code { 370 | display: block; 371 | padding: 1rem 1.5rem; 372 | } 373 | 374 | /* Tabelas 375 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 376 | table { 377 | border-collapse: collapse; 378 | } 379 | 380 | th, 381 | td { 382 | border-bottom: 1px solid #e1e1e1; 383 | padding: 1rem .7rem; 384 | text-align: left; 385 | } 386 | 387 | /* Espaçamento 388 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 389 | .botao, 390 | button, 391 | input, 392 | select, 393 | textarea, 394 | table { 395 | margin-bottom: 1rem; 396 | } 397 | 398 | label { 399 | margin-bottom: .4rem; 400 | } 401 | 402 | /* Utilidades 403 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 404 | .u-width-100 { 405 | box-sizing: border-box; 406 | width: 100%; 407 | } -------------------------------------------------------------------------------- /docs/css/organico.css: -------------------------------------------------------------------------------- 1 | /* Tabela de conteúdos 2 | –––––––––––––––––––––––––––––––––––––––––––––––––– 3 | - Estilos base 4 | - Grid 5 | - Tipografia 6 | - Links 7 | - Botões 8 | - Formulários 9 | - Listas 10 | - Código 11 | - Tabelas 12 | - Espaçamento 13 | - Utilidades 14 | */ 15 | 16 | /* Estilos base 17 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 18 | @import 'https://fonts.googleapis.com/css?family=Open+Sans:400,700'; 19 | 20 | html { 21 | font-size: 62.5%; /* 16px pra 10px */ 22 | } 23 | 24 | body { 25 | color: #555; 26 | font-size: 1.6rem; 27 | font-weight: 400; 28 | font-family: "Open Sans" ,"Helvetica Neue", Arial, sans-serif; 29 | line-height: 1.6; 30 | } 31 | 32 | /* Grid 33 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 34 | .container { 35 | box-sizing: border-box; 36 | padding-left: 1.5rem; 37 | padding-right: 1.5rem; 38 | width: 100%; 39 | max-width: 990px; 40 | } 41 | 42 | .linha { 43 | display: -webkit-box; 44 | display: -ms-flexbox; 45 | display: flex; 46 | -ms-flex-wrap: wrap; 47 | flex-wrap: wrap; 48 | margin-left: -1.5rem; 49 | margin-right: -1.5rem; 50 | } 51 | 52 | .coluna, 53 | .colunas { 54 | box-sizing: border-box; 55 | padding-right: 1.5rem; 56 | padding-left: 1.5rem; 57 | width: 100%; 58 | } 59 | 60 | @media (min-width: 400px) { 61 | .container { 62 | width: 85%; 63 | margin: 0 auto; 64 | } 65 | } 66 | 67 | @media (min-width: 750px) { 68 | .container { 69 | width: 80%; 70 | } 71 | 72 | .uma.coluna, 73 | .uma.colunas { 74 | -webkit-box-flex: 0; 75 | -ms-flex: 0 0 8.33333333%; 76 | flex: 0 0 8.33333333%; 77 | max-width: 8.33333333%; 78 | } 79 | 80 | .duas.colunas { 81 | -webkit-box-flex: 0; 82 | -ms-flex: 0 0 16.66666667%; 83 | flex: 0 0 16.66666667%; 84 | max-width: 16.66666667%; 85 | } 86 | 87 | .tres.colunas { 88 | -webkit-box-flex: 0; 89 | -ms-flex: 0 0 25%; 90 | flex: 0 0 25%; 91 | max-width: 25%; 92 | } 93 | 94 | .quatro.colunas { 95 | -webkit-box-flex: 0; 96 | -ms-flex: 0 0 33.33333333%; 97 | flex: 0 0 33.33333333%; 98 | max-width: 33.33333333%; 99 | } 100 | 101 | .cinco.colunas { 102 | -webkit-box-flex: 0; 103 | -ms-flex: 0 0 41.66666667%; 104 | flex: 0 0 41.66666667%; 105 | max-width: 41.66666667%; 106 | } 107 | 108 | .seis.colunas { 109 | -webkit-box-flex: 0; 110 | -ms-flex: 0 0 50%; 111 | flex: 0 0 50%; 112 | max-width: 50%; 113 | } 114 | 115 | .sete.colunas { 116 | -webkit-box-flex: 0; 117 | -ms-flex: 0 0 58.33333333%; 118 | flex: 0 0 58.33333333%; 119 | max-width: 58.33333333%; 120 | } 121 | 122 | .oito.colunas { 123 | -webkit-box-flex: 0; 124 | -ms-flex: 0 0 66.66666667%; 125 | flex: 0 0 66.66666667%; 126 | max-width: 66.66666667%; 127 | } 128 | 129 | .nove.colunas { 130 | -webkit-box-flex: 0; 131 | -ms-flex: 0 0 75%; 132 | flex: 0 0 75%; 133 | max-width: 75%; 134 | } 135 | 136 | .dez.colunas { 137 | -webkit-box-flex: 0; 138 | -ms-flex: 0 0 83.33333333%; 139 | flex: 0 0 83.33333333%; 140 | max-width: 83.33333333%; 141 | } 142 | 143 | .onze.colunas { 144 | -webkit-box-flex: 0; 145 | -ms-flex: 0 0 91.66666667%; 146 | flex: 0 0 91.66666667%; 147 | max-width: 91.66666667%; 148 | } 149 | 150 | .doze.colunas { 151 | -webkit-box-flex: 0; 152 | -ms-flex: 0 0 100%; 153 | flex: 0 0 100%; 154 | max-width: 100%; 155 | } 156 | } 157 | 158 | /* Tipografia 159 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 160 | h1, 161 | h2, 162 | h3, 163 | h4, 164 | h5, 165 | h6, 166 | strong { 167 | color: #333; 168 | font-weight: 700; 169 | } 170 | 171 | h1 { 172 | font-size: 4rem; 173 | } 174 | 175 | h2 { 176 | font-size: 3.4rem; 177 | } 178 | 179 | h3 { 180 | font-size: 2.8rem; 181 | } 182 | 183 | h4 { 184 | font-size: 2.2rem; 185 | } 186 | 187 | h5 { 188 | font-size: 1.6rem; 189 | } 190 | 191 | h6 { 192 | font-size: 1.4rem; 193 | } 194 | 195 | p { 196 | margin-top: 0; 197 | } 198 | 199 | /* Links 200 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 201 | a { 202 | color: #337ab7; 203 | } 204 | 205 | a:hover, 206 | a:focus { 207 | color: #23527c; 208 | } 209 | 210 | a:visited { 211 | color: #c34f4a; 212 | } 213 | 214 | /* Botões 215 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 216 | .botao, 217 | button, 218 | input[type="submit"], 219 | input[type="reset"], 220 | input[type="button"] { 221 | display: inline-block; 222 | box-sizing: border-box; 223 | background-color: #fff; 224 | border: 1px solid #bbb; 225 | border-radius: 2px; 226 | color: #555; 227 | cursor: default; 228 | font-size: 1.4rem; 229 | font-weight: 700; 230 | line-height: 3.8rem; 231 | text-align: center; 232 | text-decoration: none; 233 | padding: 0 3rem; 234 | height: 3.8rem; 235 | } 236 | 237 | .botao:hover, 238 | button:hover, 239 | input[type="submit"]:hover, 240 | input[type="reset"]:hover, 241 | input[type="button"]:hover { 242 | border-color: #888; 243 | color: #333; 244 | } 245 | 246 | .botao:focus, 247 | button:focus, 248 | input[type="submit"]:focus, 249 | input[type="reset"]:focus, 250 | input[type="button"]:focus { 251 | background-color: #f1f1f1; 252 | border-color: #888; 253 | outline: 0; 254 | } 255 | 256 | .botao:active, 257 | button:active, 258 | input[type="submit"]:active, 259 | input[type="reset"]:active, 260 | input[type="button"]:active { 261 | box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); 262 | } 263 | 264 | .botao.destacado, 265 | button.botao.destacado, 266 | input[type="submit"].botao.destacado, 267 | input[type="reset"].botao.destacado, 268 | input[type="button"].botao.destacado { 269 | background-color: #33c3f0; 270 | border-color: #33c3f0; 271 | color: #fff; 272 | } 273 | 274 | .botao.destacado:hover, 275 | button.botao.destacado:hover, 276 | input[type="submit"].botao.destacado:hover, 277 | input[type="reset"].botao.destacado:hover, 278 | input[type="button"].botao.destacado:hover, 279 | .botao.destacado:focus, 280 | button.botao.destacado:focus, 281 | input[type="submit"].botao.destacado:focus, 282 | input[type="reset"].botao.destacado:focus, 283 | input[type="button"].botao.destacado:focus { 284 | background-color: #1eaedb; 285 | border-color: #1eaedb; 286 | color: #fff; 287 | } 288 | 289 | .botao:visited { 290 | color: #555 291 | } 292 | 293 | .botao.destacado:visited { 294 | color: #fff; 295 | } 296 | 297 | /* Formulários 298 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 299 | input[type="email"], 300 | input[type="number"], 301 | input[type="search"], 302 | input[type="text"], 303 | input[type="tel"], 304 | input[type="url"], 305 | input[type="password"], 306 | textarea, 307 | select { 308 | box-sizing: border-box; 309 | box-shadow: none; 310 | background-color: #fff; 311 | border: 1px solid #d1d1d1; 312 | border-radius: 2px; 313 | font: inherit; 314 | padding: .6rem 1rem; 315 | height: 3.8rem; 316 | } 317 | 318 | input[type="email"]:focus, 319 | input[type="number"]:focus, 320 | input[type="search"]:focus, 321 | input[type="text"]:focus, 322 | input[type="tel"]:focus, 323 | input[type="url"]:focus, 324 | input[type="password"]:focus, 325 | textarea:focus, 326 | select:focus { 327 | border: 1px solid #33c3f0; 328 | outline: 0; 329 | } 330 | 331 | textarea { 332 | min-height: 6.5rem; 333 | } 334 | 335 | label { 336 | display: block; 337 | font-weight: 700; 338 | } 339 | 340 | /* Listas 341 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 342 | ol, 343 | ul { 344 | list-style-position: inside; 345 | padding-left: 0; 346 | } 347 | 348 | ul ul, 349 | ul ol, 350 | ol ol, 351 | ol ul { 352 | padding-left: 3rem; 353 | margin-top: 1rem; 354 | } 355 | 356 | li { 357 | margin-bottom: 1rem; 358 | } 359 | 360 | /* Código 361 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 362 | code { 363 | background-color: #f1f1f1; 364 | border-radius: 2px; 365 | color: #c7254e; 366 | padding: .2rem .5rem; 367 | } 368 | 369 | pre > code { 370 | display: block; 371 | padding: 1rem 1.5rem; 372 | } 373 | 374 | /* Tabelas 375 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 376 | table { 377 | border-collapse: collapse; 378 | } 379 | 380 | th, 381 | td { 382 | border-bottom: 1px solid #e1e1e1; 383 | padding: 1rem .7rem; 384 | text-align: left; 385 | } 386 | 387 | /* Espaçamento 388 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 389 | .botao, 390 | button, 391 | input, 392 | select, 393 | textarea, 394 | table { 395 | margin-bottom: 1rem; 396 | } 397 | 398 | label { 399 | margin-bottom: .4rem; 400 | } 401 | 402 | /* Utilidades 403 | –––––––––––––––––––––––––––––––––––––––––––––––––– */ 404 | .u-width-100 { 405 | box-sizing: border-box; 406 | width: 100%; 407 | } -------------------------------------------------------------------------------- /css/normalize.css: -------------------------------------------------------------------------------- 1 | /*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */ 2 | 3 | /** 4 | * 1. Change the default font family in all browsers (opinionated). 5 | * 2. Prevent adjustments of font size after orientation changes in IE and iOS. 6 | */ 7 | 8 | html { 9 | font-family: sans-serif; /* 1 */ 10 | -ms-text-size-adjust: 100%; /* 2 */ 11 | -webkit-text-size-adjust: 100%; /* 2 */ 12 | } 13 | 14 | /** 15 | * Remove the margin in all browsers (opinionated). 16 | */ 17 | 18 | body { 19 | margin: 0; 20 | } 21 | 22 | /* HTML5 display definitions 23 | ========================================================================== */ 24 | 25 | /** 26 | * Add the correct display in IE 9-. 27 | * 1. Add the correct display in Edge, IE, and Firefox. 28 | * 2. Add the correct display in IE. 29 | */ 30 | 31 | article, 32 | aside, 33 | details, /* 1 */ 34 | figcaption, 35 | figure, 36 | footer, 37 | header, 38 | main, /* 2 */ 39 | menu, 40 | nav, 41 | section, 42 | summary { /* 1 */ 43 | display: block; 44 | } 45 | 46 | /** 47 | * Add the correct display in IE 9-. 48 | */ 49 | 50 | audio, 51 | canvas, 52 | progress, 53 | video { 54 | display: inline-block; 55 | } 56 | 57 | /** 58 | * Add the correct display in iOS 4-7. 59 | */ 60 | 61 | audio:not([controls]) { 62 | display: none; 63 | height: 0; 64 | } 65 | 66 | /** 67 | * Add the correct vertical alignment in Chrome, Firefox, and Opera. 68 | */ 69 | 70 | progress { 71 | vertical-align: baseline; 72 | } 73 | 74 | /** 75 | * Add the correct display in IE 10-. 76 | * 1. Add the correct display in IE. 77 | */ 78 | 79 | template, /* 1 */ 80 | [hidden] { 81 | display: none; 82 | } 83 | 84 | /* Links 85 | ========================================================================== */ 86 | 87 | /** 88 | * 1. Remove the gray background on active links in IE 10. 89 | * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. 90 | */ 91 | 92 | a { 93 | background-color: transparent; /* 1 */ 94 | -webkit-text-decoration-skip: objects; /* 2 */ 95 | } 96 | 97 | /** 98 | * Remove the outline on focused links when they are also active or hovered 99 | * in all browsers (opinionated). 100 | */ 101 | 102 | a:active, 103 | a:hover { 104 | outline-width: 0; 105 | } 106 | 107 | /* Text-level semantics 108 | ========================================================================== */ 109 | 110 | /** 111 | * 1. Remove the bottom border in Firefox 39-. 112 | * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 113 | */ 114 | 115 | abbr[title] { 116 | border-bottom: none; /* 1 */ 117 | text-decoration: underline; /* 2 */ 118 | text-decoration: underline dotted; /* 2 */ 119 | } 120 | 121 | /** 122 | * Prevent the duplicate application of `bolder` by the next rule in Safari 6. 123 | */ 124 | 125 | b, 126 | strong { 127 | font-weight: inherit; 128 | } 129 | 130 | /** 131 | * Add the correct font weight in Chrome, Edge, and Safari. 132 | */ 133 | 134 | b, 135 | strong { 136 | font-weight: bolder; 137 | } 138 | 139 | /** 140 | * Add the correct font style in Android 4.3-. 141 | */ 142 | 143 | dfn { 144 | font-style: italic; 145 | } 146 | 147 | /** 148 | * Correct the font size and margin on `h1` elements within `section` and 149 | * `article` contexts in Chrome, Firefox, and Safari. 150 | */ 151 | 152 | h1 { 153 | font-size: 2em; 154 | margin: 0.67em 0; 155 | } 156 | 157 | /** 158 | * Add the correct background and color in IE 9-. 159 | */ 160 | 161 | mark { 162 | background-color: #ff0; 163 | color: #000; 164 | } 165 | 166 | /** 167 | * Add the correct font size in all browsers. 168 | */ 169 | 170 | small { 171 | font-size: 80%; 172 | } 173 | 174 | /** 175 | * Prevent `sub` and `sup` elements from affecting the line height in 176 | * all browsers. 177 | */ 178 | 179 | sub, 180 | sup { 181 | font-size: 75%; 182 | line-height: 0; 183 | position: relative; 184 | vertical-align: baseline; 185 | } 186 | 187 | sub { 188 | bottom: -0.25em; 189 | } 190 | 191 | sup { 192 | top: -0.5em; 193 | } 194 | 195 | /* Embedded content 196 | ========================================================================== */ 197 | 198 | /** 199 | * Remove the border on images inside links in IE 10-. 200 | */ 201 | 202 | img { 203 | border-style: none; 204 | } 205 | 206 | /** 207 | * Hide the overflow in IE. 208 | */ 209 | 210 | svg:not(:root) { 211 | overflow: hidden; 212 | } 213 | 214 | /* Grouping content 215 | ========================================================================== */ 216 | 217 | /** 218 | * 1. Correct the inheritance and scaling of font size in all browsers. 219 | * 2. Correct the odd `em` font sizing in all browsers. 220 | */ 221 | 222 | code, 223 | kbd, 224 | pre, 225 | samp { 226 | font-family: monospace, monospace; /* 1 */ 227 | font-size: 1em; /* 2 */ 228 | } 229 | 230 | /** 231 | * Add the correct margin in IE 8. 232 | */ 233 | 234 | figure { 235 | margin: 1em 40px; 236 | } 237 | 238 | /** 239 | * 1. Add the correct box sizing in Firefox. 240 | * 2. Show the overflow in Edge and IE. 241 | */ 242 | 243 | hr { 244 | box-sizing: content-box; /* 1 */ 245 | height: 0; /* 1 */ 246 | overflow: visible; /* 2 */ 247 | } 248 | 249 | /* Forms 250 | ========================================================================== */ 251 | 252 | /** 253 | * 1. Change font properties to `inherit` in all browsers (opinionated). 254 | * 2. Remove the margin in Firefox and Safari. 255 | */ 256 | 257 | button, 258 | input, 259 | select, 260 | textarea { 261 | font: inherit; /* 1 */ 262 | margin: 0; /* 2 */ 263 | } 264 | 265 | /** 266 | * Restore the font weight unset by the previous rule. 267 | */ 268 | 269 | optgroup { 270 | font-weight: bold; 271 | } 272 | 273 | /** 274 | * Show the overflow in IE. 275 | * 1. Show the overflow in Edge. 276 | */ 277 | 278 | button, 279 | input { /* 1 */ 280 | overflow: visible; 281 | } 282 | 283 | /** 284 | * Remove the inheritance of text transform in Edge, Firefox, and IE. 285 | * 1. Remove the inheritance of text transform in Firefox. 286 | */ 287 | 288 | button, 289 | select { /* 1 */ 290 | text-transform: none; 291 | } 292 | 293 | /** 294 | * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` 295 | * controls in Android 4. 296 | * 2. Correct the inability to style clickable types in iOS and Safari. 297 | */ 298 | 299 | button, 300 | html [type="button"], /* 1 */ 301 | [type="reset"], 302 | [type="submit"] { 303 | -webkit-appearance: button; /* 2 */ 304 | } 305 | 306 | /** 307 | * Remove the inner border and padding in Firefox. 308 | */ 309 | 310 | button::-moz-focus-inner, 311 | [type="button"]::-moz-focus-inner, 312 | [type="reset"]::-moz-focus-inner, 313 | [type="submit"]::-moz-focus-inner { 314 | border-style: none; 315 | padding: 0; 316 | } 317 | 318 | /** 319 | * Restore the focus styles unset by the previous rule. 320 | */ 321 | 322 | button:-moz-focusring, 323 | [type="button"]:-moz-focusring, 324 | [type="reset"]:-moz-focusring, 325 | [type="submit"]:-moz-focusring { 326 | outline: 1px dotted ButtonText; 327 | } 328 | 329 | /** 330 | * Change the border, margin, and padding in all browsers (opinionated). 331 | */ 332 | 333 | fieldset { 334 | border: 1px solid #c0c0c0; 335 | margin: 0 2px; 336 | padding: 0.35em 0.625em 0.75em; 337 | } 338 | 339 | /** 340 | * 1. Correct the text wrapping in Edge and IE. 341 | * 2. Correct the color inheritance from `fieldset` elements in IE. 342 | * 3. Remove the padding so developers are not caught out when they zero out 343 | * `fieldset` elements in all browsers. 344 | */ 345 | 346 | legend { 347 | box-sizing: border-box; /* 1 */ 348 | color: inherit; /* 2 */ 349 | display: table; /* 1 */ 350 | max-width: 100%; /* 1 */ 351 | padding: 0; /* 3 */ 352 | white-space: normal; /* 1 */ 353 | } 354 | 355 | /** 356 | * Remove the default vertical scrollbar in IE. 357 | */ 358 | 359 | textarea { 360 | overflow: auto; 361 | } 362 | 363 | /** 364 | * 1. Add the correct box sizing in IE 10-. 365 | * 2. Remove the padding in IE 10-. 366 | */ 367 | 368 | [type="checkbox"], 369 | [type="radio"] { 370 | box-sizing: border-box; /* 1 */ 371 | padding: 0; /* 2 */ 372 | } 373 | 374 | /** 375 | * Correct the cursor style of increment and decrement buttons in Chrome. 376 | */ 377 | 378 | [type="number"]::-webkit-inner-spin-button, 379 | [type="number"]::-webkit-outer-spin-button { 380 | height: auto; 381 | } 382 | 383 | /** 384 | * 1. Correct the odd appearance in Chrome and Safari. 385 | * 2. Correct the outline style in Safari. 386 | */ 387 | 388 | [type="search"] { 389 | -webkit-appearance: textfield; /* 1 */ 390 | outline-offset: -2px; /* 2 */ 391 | } 392 | 393 | /** 394 | * Remove the inner padding and cancel buttons in Chrome and Safari on OS X. 395 | */ 396 | 397 | [type="search"]::-webkit-search-cancel-button, 398 | [type="search"]::-webkit-search-decoration { 399 | -webkit-appearance: none; 400 | } 401 | 402 | /** 403 | * Correct the text style of placeholders in Chrome, Edge, and Safari. 404 | */ 405 | 406 | ::-webkit-input-placeholder { 407 | color: inherit; 408 | opacity: 0.54; 409 | } 410 | 411 | /** 412 | * 1. Correct the inability to style clickable types in iOS and Safari. 413 | * 2. Change font properties to `inherit` in Safari. 414 | */ 415 | 416 | ::-webkit-file-upload-button { 417 | -webkit-appearance: button; /* 1 */ 418 | font: inherit; /* 2 */ 419 | } 420 | -------------------------------------------------------------------------------- /docs/css/normalize.css: -------------------------------------------------------------------------------- 1 | /*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */ 2 | 3 | /** 4 | * 1. Change the default font family in all browsers (opinionated). 5 | * 2. Prevent adjustments of font size after orientation changes in IE and iOS. 6 | */ 7 | 8 | html { 9 | font-family: sans-serif; /* 1 */ 10 | -ms-text-size-adjust: 100%; /* 2 */ 11 | -webkit-text-size-adjust: 100%; /* 2 */ 12 | } 13 | 14 | /** 15 | * Remove the margin in all browsers (opinionated). 16 | */ 17 | 18 | body { 19 | margin: 0; 20 | } 21 | 22 | /* HTML5 display definitions 23 | ========================================================================== */ 24 | 25 | /** 26 | * Add the correct display in IE 9-. 27 | * 1. Add the correct display in Edge, IE, and Firefox. 28 | * 2. Add the correct display in IE. 29 | */ 30 | 31 | article, 32 | aside, 33 | details, /* 1 */ 34 | figcaption, 35 | figure, 36 | footer, 37 | header, 38 | main, /* 2 */ 39 | menu, 40 | nav, 41 | section, 42 | summary { /* 1 */ 43 | display: block; 44 | } 45 | 46 | /** 47 | * Add the correct display in IE 9-. 48 | */ 49 | 50 | audio, 51 | canvas, 52 | progress, 53 | video { 54 | display: inline-block; 55 | } 56 | 57 | /** 58 | * Add the correct display in iOS 4-7. 59 | */ 60 | 61 | audio:not([controls]) { 62 | display: none; 63 | height: 0; 64 | } 65 | 66 | /** 67 | * Add the correct vertical alignment in Chrome, Firefox, and Opera. 68 | */ 69 | 70 | progress { 71 | vertical-align: baseline; 72 | } 73 | 74 | /** 75 | * Add the correct display in IE 10-. 76 | * 1. Add the correct display in IE. 77 | */ 78 | 79 | template, /* 1 */ 80 | [hidden] { 81 | display: none; 82 | } 83 | 84 | /* Links 85 | ========================================================================== */ 86 | 87 | /** 88 | * 1. Remove the gray background on active links in IE 10. 89 | * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. 90 | */ 91 | 92 | a { 93 | background-color: transparent; /* 1 */ 94 | -webkit-text-decoration-skip: objects; /* 2 */ 95 | } 96 | 97 | /** 98 | * Remove the outline on focused links when they are also active or hovered 99 | * in all browsers (opinionated). 100 | */ 101 | 102 | a:active, 103 | a:hover { 104 | outline-width: 0; 105 | } 106 | 107 | /* Text-level semantics 108 | ========================================================================== */ 109 | 110 | /** 111 | * 1. Remove the bottom border in Firefox 39-. 112 | * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 113 | */ 114 | 115 | abbr[title] { 116 | border-bottom: none; /* 1 */ 117 | text-decoration: underline; /* 2 */ 118 | text-decoration: underline dotted; /* 2 */ 119 | } 120 | 121 | /** 122 | * Prevent the duplicate application of `bolder` by the next rule in Safari 6. 123 | */ 124 | 125 | b, 126 | strong { 127 | font-weight: inherit; 128 | } 129 | 130 | /** 131 | * Add the correct font weight in Chrome, Edge, and Safari. 132 | */ 133 | 134 | b, 135 | strong { 136 | font-weight: bolder; 137 | } 138 | 139 | /** 140 | * Add the correct font style in Android 4.3-. 141 | */ 142 | 143 | dfn { 144 | font-style: italic; 145 | } 146 | 147 | /** 148 | * Correct the font size and margin on `h1` elements within `section` and 149 | * `article` contexts in Chrome, Firefox, and Safari. 150 | */ 151 | 152 | h1 { 153 | font-size: 2em; 154 | margin: 0.67em 0; 155 | } 156 | 157 | /** 158 | * Add the correct background and color in IE 9-. 159 | */ 160 | 161 | mark { 162 | background-color: #ff0; 163 | color: #000; 164 | } 165 | 166 | /** 167 | * Add the correct font size in all browsers. 168 | */ 169 | 170 | small { 171 | font-size: 80%; 172 | } 173 | 174 | /** 175 | * Prevent `sub` and `sup` elements from affecting the line height in 176 | * all browsers. 177 | */ 178 | 179 | sub, 180 | sup { 181 | font-size: 75%; 182 | line-height: 0; 183 | position: relative; 184 | vertical-align: baseline; 185 | } 186 | 187 | sub { 188 | bottom: -0.25em; 189 | } 190 | 191 | sup { 192 | top: -0.5em; 193 | } 194 | 195 | /* Embedded content 196 | ========================================================================== */ 197 | 198 | /** 199 | * Remove the border on images inside links in IE 10-. 200 | */ 201 | 202 | img { 203 | border-style: none; 204 | } 205 | 206 | /** 207 | * Hide the overflow in IE. 208 | */ 209 | 210 | svg:not(:root) { 211 | overflow: hidden; 212 | } 213 | 214 | /* Grouping content 215 | ========================================================================== */ 216 | 217 | /** 218 | * 1. Correct the inheritance and scaling of font size in all browsers. 219 | * 2. Correct the odd `em` font sizing in all browsers. 220 | */ 221 | 222 | code, 223 | kbd, 224 | pre, 225 | samp { 226 | font-family: monospace, monospace; /* 1 */ 227 | font-size: 1em; /* 2 */ 228 | } 229 | 230 | /** 231 | * Add the correct margin in IE 8. 232 | */ 233 | 234 | figure { 235 | margin: 1em 40px; 236 | } 237 | 238 | /** 239 | * 1. Add the correct box sizing in Firefox. 240 | * 2. Show the overflow in Edge and IE. 241 | */ 242 | 243 | hr { 244 | box-sizing: content-box; /* 1 */ 245 | height: 0; /* 1 */ 246 | overflow: visible; /* 2 */ 247 | } 248 | 249 | /* Forms 250 | ========================================================================== */ 251 | 252 | /** 253 | * 1. Change font properties to `inherit` in all browsers (opinionated). 254 | * 2. Remove the margin in Firefox and Safari. 255 | */ 256 | 257 | button, 258 | input, 259 | select, 260 | textarea { 261 | font: inherit; /* 1 */ 262 | margin: 0; /* 2 */ 263 | } 264 | 265 | /** 266 | * Restore the font weight unset by the previous rule. 267 | */ 268 | 269 | optgroup { 270 | font-weight: bold; 271 | } 272 | 273 | /** 274 | * Show the overflow in IE. 275 | * 1. Show the overflow in Edge. 276 | */ 277 | 278 | button, 279 | input { /* 1 */ 280 | overflow: visible; 281 | } 282 | 283 | /** 284 | * Remove the inheritance of text transform in Edge, Firefox, and IE. 285 | * 1. Remove the inheritance of text transform in Firefox. 286 | */ 287 | 288 | button, 289 | select { /* 1 */ 290 | text-transform: none; 291 | } 292 | 293 | /** 294 | * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` 295 | * controls in Android 4. 296 | * 2. Correct the inability to style clickable types in iOS and Safari. 297 | */ 298 | 299 | button, 300 | html [type="button"], /* 1 */ 301 | [type="reset"], 302 | [type="submit"] { 303 | -webkit-appearance: button; /* 2 */ 304 | } 305 | 306 | /** 307 | * Remove the inner border and padding in Firefox. 308 | */ 309 | 310 | button::-moz-focus-inner, 311 | [type="button"]::-moz-focus-inner, 312 | [type="reset"]::-moz-focus-inner, 313 | [type="submit"]::-moz-focus-inner { 314 | border-style: none; 315 | padding: 0; 316 | } 317 | 318 | /** 319 | * Restore the focus styles unset by the previous rule. 320 | */ 321 | 322 | button:-moz-focusring, 323 | [type="button"]:-moz-focusring, 324 | [type="reset"]:-moz-focusring, 325 | [type="submit"]:-moz-focusring { 326 | outline: 1px dotted ButtonText; 327 | } 328 | 329 | /** 330 | * Change the border, margin, and padding in all browsers (opinionated). 331 | */ 332 | 333 | fieldset { 334 | border: 1px solid #c0c0c0; 335 | margin: 0 2px; 336 | padding: 0.35em 0.625em 0.75em; 337 | } 338 | 339 | /** 340 | * 1. Correct the text wrapping in Edge and IE. 341 | * 2. Correct the color inheritance from `fieldset` elements in IE. 342 | * 3. Remove the padding so developers are not caught out when they zero out 343 | * `fieldset` elements in all browsers. 344 | */ 345 | 346 | legend { 347 | box-sizing: border-box; /* 1 */ 348 | color: inherit; /* 2 */ 349 | display: table; /* 1 */ 350 | max-width: 100%; /* 1 */ 351 | padding: 0; /* 3 */ 352 | white-space: normal; /* 1 */ 353 | } 354 | 355 | /** 356 | * Remove the default vertical scrollbar in IE. 357 | */ 358 | 359 | textarea { 360 | overflow: auto; 361 | } 362 | 363 | /** 364 | * 1. Add the correct box sizing in IE 10-. 365 | * 2. Remove the padding in IE 10-. 366 | */ 367 | 368 | [type="checkbox"], 369 | [type="radio"] { 370 | box-sizing: border-box; /* 1 */ 371 | padding: 0; /* 2 */ 372 | } 373 | 374 | /** 375 | * Correct the cursor style of increment and decrement buttons in Chrome. 376 | */ 377 | 378 | [type="number"]::-webkit-inner-spin-button, 379 | [type="number"]::-webkit-outer-spin-button { 380 | height: auto; 381 | } 382 | 383 | /** 384 | * 1. Correct the odd appearance in Chrome and Safari. 385 | * 2. Correct the outline style in Safari. 386 | */ 387 | 388 | [type="search"] { 389 | -webkit-appearance: textfield; /* 1 */ 390 | outline-offset: -2px; /* 2 */ 391 | } 392 | 393 | /** 394 | * Remove the inner padding and cancel buttons in Chrome and Safari on OS X. 395 | */ 396 | 397 | [type="search"]::-webkit-search-cancel-button, 398 | [type="search"]::-webkit-search-decoration { 399 | -webkit-appearance: none; 400 | } 401 | 402 | /** 403 | * Correct the text style of placeholders in Chrome, Edge, and Safari. 404 | */ 405 | 406 | ::-webkit-input-placeholder { 407 | color: inherit; 408 | opacity: 0.54; 409 | } 410 | 411 | /** 412 | * 1. Correct the inability to style clickable types in iOS and Safari. 413 | * 2. Change font properties to `inherit` in Safari. 414 | */ 415 | 416 | ::-webkit-file-upload-button { 417 | -webkit-appearance: button; /* 1 */ 418 | font: inherit; /* 2 */ 419 | } 420 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Orgânico CSS 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 |
21 |
22 |
23 |

Orgânico CSS

24 |

Leve, natural e inobstrusivo.

25 | Download 26 | 27 | CURSO 28 | Aprenda a criar um framework 29 | Domine layouts responsivos 30 | 31 |
32 |
33 |
34 |
35 | 36 |
37 |
38 |
39 |
40 |
41 | 42 |
43 |
44 |

Leve

45 |

4,8kb minificado, perfeito para mobile

46 |
47 |
48 |
49 |
50 | 51 |
52 |
53 |

Natural

54 |

Linguagem semântica, como no português escrito.

55 |
56 |
57 |
58 |
59 | 60 |
61 |
62 |

Inobstrusivo

63 |

Não se preocupe em sobrescrever estilos.

64 |
65 |
66 | 67 |
68 |
69 |
70 |
71 |

Apresentação

72 |

Uma ferramenta para facilitar a criação de layouts com o objetivo de interferir o mínimo possível no layout, dando flexibilidade ao desenvolvedor (menos estilos, menor a necessidade de sobrescrever regras), além de semântica idêntica ao português falado (quatro colunas e já temos um grid!).

73 |

Se você está começando com CSS e procura por um projeto de fácil compreensão e em português ou quer apenas um framework que não fique no seu caminho te obrigando a escrever mais !important do que estilos propriamente ditos, fique conosco!

74 |
75 |
76 |
77 |
78 |

Como usar

79 |
    80 |
  1. Faça o download.
    2. 81 |
  2. Adicione a pasta css ao seu projeto.
    3. 82 |
  3. Adicione o código abaixo ao head do seu html.
    4. 83 |
84 | 
<link rel="stylesheet" href="css/normalize.css">
 85 | <link rel="stylesheet" href="css/organico.min.css">
86 |
87 |
88 |
89 |
90 |

Grid

91 |
92 |
93 |
94 |
95 |

O grid responsivo é composto por 12 colunas que se adaptam ao tamanho da janela ou dispositivo.

96 |
    97 |
  • Linhas (.linha) devem ser colocadas dentro de um container (.container) para alinhamento apropriado.
    • 98 |
  • Use linhas para criar seções horizontais de colunas.
    • 99 |
  • O conteúdo deve ser inserido em colunas (.coluna ou .colunas) que devem ser filhas imediatas de linhas (.linha).
    • 100 |
  • Colunas são criadas especificando uma quantidade (uma a doze) e o termo apropriado de acordo com a quantidade, coluna ou colunas.
    • 101 |
  • É importante seguir esta ordem pois cada elemento introduzido anteriormente, produz um efeito sobre os espaçamentos do layout.
    • 102 |
  • Flexbox é utilizado para facilitar a disposição do conteúdo, além de evitar hacks com floats e clears.
    • 103 |
104 |
105 |
106 |
107 |
108 |

Exemplo

109 |
110 |
111 |
112 |
UMA
113 |
ONZE
114 |
115 |
116 |
DUAS
117 |
DEZ
118 |
119 |
120 |
TRÊS
121 |
NOVE
122 |
123 |
124 |
QUATRO
125 |
OITO
126 |
127 |
128 |
CINCO
129 |
SETE
130 |
131 |
132 |
SEIS
133 |
SEIS
134 |
135 |
136 |
SETE
137 |
CINCO
138 |
139 |
140 |
OITO
141 |
QUATRO
142 |
143 |
144 |
NOVE
145 |
TRÊS
146 |
147 |
148 |
DEZ
149 |
DUAS
150 |
151 |
152 |
ONZE
153 |
UMA
154 |
155 |
156 |
DOZE
157 |
158 |
159 |
QUATRO
160 |
QUATRO
161 |
QUATRO
162 |
163 |
164 |
165 | 
<div class="linha">
166 |   <div class="uma coluna">UMA</div>
167 |   <div class="onze colunas">ONZE</div>
168 | </div>
169 |   <div class="linha">
170 |   <div class="duas colunas">DUAS</div>
171 |   <div class="dez colunas">DEZ</div>
172 | </div>
173 |   <div class="linha">
174 |   <div class="tres colunas">TRÊS</div>
175 |   <div class="nove colunas">NOVE</div>
176 | </div>
177 |   ...
178 | <div class="linha">
179 |   <div class="quatro colunas">QUATRO</div>
180 |   <div class="quatro colunas">QUATRO</div>
181 |   <div class="quatro colunas">QUATRO</div>
182 | </div>
183 |
184 |
185 | 186 |
187 |
188 |

Tipografia

189 |

Cabeçalhos são identificados pelo respectivo elemento padrão. Nenhuma classe é necessária. O tamanho de fonte padrão (font-size) para o corpo do texto é de 16px, com altura de linha (line-height) de 1.6.

190 |

Exemplo

191 |

Cabeçalho 1

192 |

Cabeçalho 2

193 |

Cabeçalho 3

194 |

Cabeçalho 4

195 |
Cabeçalho 5
196 |
Cabeçalho 6
197 |

Parágrafo em negrito com itálico, um pouco de sublinhado e marcação.

198 |

Pra finalizar, um link.

199 |
200 |
201 |
202 |
203 | 
<h1>Tipografia</h1>
204 | <h1>Cabeçalho 1</h1>
205 | <h2>Cabeçalho 2</h2>
206 | <h3>Cabeçalho 3</h3>
207 | <h4>Cabeçalho 4</h4>
208 | <h5>Cabeçalho 5</h5>
209 | <h6>Cabeçalho 6</h6>
210 | <p>Parágrafo em <strong>negrito</strong> com <em>itálico</em>, um pouco de <u>sublinhado</u> e <mark>marcação</mark>.</p>
211 | <p>Pra finalizar, um <a href="#">link</a>.</p>
212 |
213 |
214 | 215 |
216 |
217 |

Botões

218 |

Botão padrão

219 |

Botão com o mínimo de estilo, criado simplesmente inserindo um elemento que resulte em um botão, ou adicionando a classe .botao a um link (a).

220 | 221 | 222 | 223 | Link 224 |
225 |
226 | 227 |
228 |
229 | 
<button>Button</button>
230 | <input type="button" value="Input">
231 | <input type="submit" value="Submit">
232 | <a href="#" class="botao">Link</a>
233 |
234 |
235 | 236 |
237 |
238 |

Botão destacado

239 |

Botão em contraste com a cor padrão, criado ao adicionar as classes .botao e .destacado aos elementos que resultem em botões.

240 | 241 | 242 | 243 | Link 244 |
245 |
246 | 247 |
248 |
249 | 
<button class="botao destacado">Button</button>
250 | <input type="button" value="Input" class="botao destacado">
251 | <input type="submit" value="Submit" class="botao destacado">
252 | <a href="#" class="botao destacado">Link</a>
253 |
254 |
255 | 256 |
257 |
258 |

Formulários

259 |

Dentro ou fora de um formulário (form), os elementos input dos tipos email, number, search, text, tel, url e password, textarea, select e label recebem estilos sem a necessidade de adicionar classes.

260 |

Para que o elemento em questão ocupe a largura total da coluna em que está inserido, pode-se utilizar a classe utilitária .u-width-100, que faz com que o elemento ocupe 100% da largura.

261 |

Exemplo

262 |
263 |
264 |
265 | 266 | 267 |
268 |
269 | 270 | 275 |
276 |
277 |
278 |
279 | 280 | 281 |
282 |
283 | 286 | 287 |
288 |
289 |
290 | 291 |
292 |
293 | 
<form>
294 |   <div class="linha">
295 |     <div class="seis colunas">
296 |       <label for="nome">Nome</label>
297 |       <input type="text" id="nome" class="u-width-100">
298 |     </div>
299 |     <div class="seis colunas">
300 |       <label for="assunto">Assunto</label>
301 |       <select id="assunto" class="u-width-100">
302 |         <option value="1">Opção 1</option>
303 |         <option value="2">Opção 2</option>
304 |         <option value="3">Opção 3</option>
305 |       </select>
306 |     </div>
307 |   </div>
308 |   <div class="linha">
309 |     <div class="doze colunas">
310 |       <label for="mensagem">Mensagem</label>
311 |       <textarea id="mensagem" rows="10" class="u-width-100"></textarea>
312 |     </div>
313 |   </div>
314 |   <label>
315 |     <input type="checkbox"> Aceitar os termos
316 |   </label>
317 |   <input type="submit" value="Enviar" class="botao destacado">
318 | </form>
319 |
320 |
321 | 322 |
323 |
324 |

Listas

325 |

Os elementos que compõem listas são estilizados diretamente, não havendo assim a necessidade da adição de classes. Ainda, é possível inserir listas dentro de listas.

326 |

Exemplo

327 |
328 |
329 |
    330 |
  • Listas sem ordem tem estilo básico
    • 331 |
  • 332 | E podem ter até um nível interno 333 |
      334 |
    • Lorem ipsum
      • 335 |
    • Dolor sit amet
      • 336 |
    337 |
    • 338 |
  • Lorem ipsum dolor
    • 339 |
340 |
341 |
342 |
    343 |
  1. Lorem ipsum dolor sit amet
    2. 344 |
  2. 345 | Lorem ipsum dolor sit amet 346 |
      347 |
    1. Lorem ipsum dolor sit amet
      2. 348 |
    2. Lorem ipsum dolor sit amet
      3. 349 |
    350 |
    3. 351 |
  3. Lorem ipsum dolor sit amet
    4. 352 |
353 |
354 |
355 | 356 |
357 |
358 | 
<ul>
359 |   <li>Listas sem ordem tem estilo básico</li>
360 |   <li>
361 |     E podem ter até um nível interno
362 |     <ul>
363 |       <li>Lorem ipsum</li>
364 |       <li>Dolor sit amet</li>
365 |     </ul>
366 |   </li>
367 |   <li>Lorem ipsum dolor</li>
368 | </ul>
369 |
370 |
371 | 372 |
373 |
374 |

Códigos

375 |

Para facilitar a apresentação de pequenos trechos de código, estilos são aplicados aos elementos code e pre. Havendo necessidade de se apresentar longos trechos de código, recomenda-se o uso de uma biblioteca apropriada para a formatação, como highlight.js, utilizada nos exemplos por aqui.

376 |

Exemplo

377 |

Código em linha assim

378 | 
.alguma-classe {
379 |   background-color: blue;
380 | }
381 |
382 |
383 | 384 |
385 |
386 | 
<p>Código em linha <code>assim</code></p>
387 | <pre><code>.alguma-classe {
388 |   background-color: blue;
389 | }</code></pre>
390 |
391 |
392 | 393 |
394 |
395 |

Tabelas

396 |

Uma tabela é estilizada diretamente também, evitando o uso de classes. Para atingir o resultado de largura total, é aconselhável o uso da classe utilitária .u-width-100.

397 |

Exemplo

398 | 399 | 400 | 401 | 402 | 403 | 404 | 405 | 406 | 407 | 408 | 409 | 410 | 411 | 412 | 413 | 414 | 415 | 416 | 417 | 418 | 419 | 420 | 421 |
NomeIdadeSistemaCidade
Estevan Maito24LinuxCaxias do Sul
João Ninguém30WindowsLugar Algum
422 |
423 |
424 | 425 |
426 |
427 | 
<table class="u-width-100">
428 |   <thead>
429 |     <tr>
430 |       <th>Nome</th>
431 |       <th>Idade</th>
432 |       <th>Sistema</th>
433 |       <th>Cidade</th>
434 |     </tr>
435 |   </thead>
436 |   <tbody>
437 |     <tr>
438 |       <td>Bill Jobs</td>
439 |       <td>24</td>
440 |       <td>Linux</td>
441 |       <td>Oiapoque</td>
442 |     </tr>
443 |     <tr>
444 |       <td>João Ninguém</td>
445 |       <td>30</td>
446 |       <td>Windows</td>
447 |       <td>Lugar Algum</td>
448 |     </tr>
449 |   </tbody>
450 | </table>
451 |
452 |
453 | 454 |
455 |
456 |

Utilidades

457 |

Conjunto de classes utilizadas com frequência em diversos elementos.

458 |
    459 |
  • .u-width-100 - Expande um elemento a 100% da largura do elemento em que ele está contido. Comum em formulários e imagens.
    • 460 |
461 |

Imagens responsivas

462 |

É possível tornar uma imagem responsiva adicionando a classe .u-width-100 a ela.

463 |

Exemplo

464 |
465 |
466 | 467 |
468 |
469 | 470 |
471 |
472 |
473 |
474 | 475 |
476 |
477 | 
<div class="linha">
478 |   <div class="seis colunas">
479 |     <img src="img/exemplo1.jpg" class="u-width-100">
480 |   </div>
481 |   <div class="seis colunas">
482 |     <img src="img/exemplo2.jpg" class="u-width-100">
483 |   </div>
484 | </div>
485 |
486 |
487 |
488 |
489 | 505 |
506 |
507 |
508 | 509 | Fork me on GitHub 510 | 511 | 512 | 513 | 514 | 515 | 541 | 542 | 543 | -------------------------------------------------------------------------------- /docs/js/highlight.min.js: -------------------------------------------------------------------------------- 1 | /*! highlight.js v9.7.0 | BSD3 License | git.io/hljslicense */ 2 | !function(e){var t="object"==typeof window&&window||"object"==typeof self&&self;"undefined"!=typeof exports?e(exports):t&&(t.hljs=e({}),"function"==typeof define&&define.amd&&define([],function(){return t.hljs}))}(function(e){function t(e){return e.replace(/[&<>]/gm,function(e){return S[e]})}function r(e){return e.nodeName.toLowerCase()}function a(e,t){var r=e&&e.exec(t);return r&&0===r.index}function n(e){return C.test(e)}function i(e){var t,r,a,i,s=e.className+" ";if(s+=e.parentNode?e.parentNode.className:"",r=E.exec(s))return y(r[1])?r[1]:"no-highlight";for(s=s.split(/\s+/),t=0,a=s.length;a>t;t++)if(i=s[t],n(i)||y(i))return i}function s(e,t){var r,a={};for(r in e)a[r]=e[r];if(t)for(r in t)a[r]=t[r];return a}function c(e){var t=[];return function a(e,n){for(var i=e.firstChild;i;i=i.nextSibling)3===i.nodeType?n+=i.nodeValue.length:1===i.nodeType&&(t.push({event:"start",offset:n,node:i}),n=a(i,n),r(i).match(/br|hr|img|input/)||t.push({event:"stop",offset:n,node:i}));return n}(e,0),t}function o(e,a,n){function i(){return e.length&&a.length?e[0].offset!==a[0].offset?e[0].offset"}function c(e){u+=""}function o(e){("start"===e.event?s:c)(e.node)}for(var l=0,u="",d=[];e.length||a.length;){var b=i();if(u+=t(n.substr(l,b[0].offset-l)),l=b[0].offset,b===e){d.reverse().forEach(c);do o(b.splice(0,1)[0]),b=i();while(b===e&&b.length&&b[0].offset===l);d.reverse().forEach(s)}else"start"===b[0].event?d.push(b[0].node):d.pop(),o(b.splice(0,1)[0])}return u+t(n.substr(l))}function l(e){function t(e){return e&&e.source||e}function r(r,a){return new RegExp(t(r),"m"+(e.cI?"i":"")+(a?"g":""))}function a(n,i){if(!n.compiled){if(n.compiled=!0,n.k=n.k||n.bK,n.k){var c={},o=function(t,r){e.cI&&(r=r.toLowerCase()),r.split(" ").forEach(function(e){var r=e.split("|");c[r[0]]=[t,r[1]?Number(r[1]):1]})};"string"==typeof n.k?o("keyword",n.k):N(n.k).forEach(function(e){o(e,n.k[e])}),n.k=c}n.lR=r(n.l||/\w+/,!0),i&&(n.bK&&(n.b="\\b("+n.bK.split(" ").join("|")+")\\b"),n.b||(n.b=/\B|\b/),n.bR=r(n.b),n.e||n.eW||(n.e=/\B|\b/),n.e&&(n.eR=r(n.e)),n.tE=t(n.e)||"",n.eW&&i.tE&&(n.tE+=(n.e?"|":"")+i.tE)),n.i&&(n.iR=r(n.i)),null==n.r&&(n.r=1),n.c||(n.c=[]);var l=[];n.c.forEach(function(e){e.v?e.v.forEach(function(t){l.push(s(e,t))}):l.push("self"===e?n:e)}),n.c=l,n.c.forEach(function(e){a(e,n)}),n.starts&&a(n.starts,i);var u=n.c.map(function(e){return e.bK?"\\.?("+e.b+")\\.?":e.b}).concat([n.tE,n.i]).map(t).filter(Boolean);n.t=u.length?r(u.join("|"),!0):{exec:function(){return null}}}}a(e)}function u(e,r,n,i){function s(e,t){var r,n;for(r=0,n=t.c.length;n>r;r++)if(a(t.c[r].bR,e))return t.c[r]}function c(e,t){if(a(e.eR,t)){for(;e.endsParent&&e.parent;)e=e.parent;return e}return e.eW?c(e.parent,t):void 0}function o(e,t){return!n&&a(t.iR,e)}function b(e,t){var r=v.cI?t[0].toLowerCase():t[0];return e.k.hasOwnProperty(r)&&e.k[r]}function p(e,t,r,a){var n=a?"":R.classPrefix,i='',i+t+s}function m(){var e,r,a,n;if(!N.k)return t(E);for(n="",r=0,N.lR.lastIndex=0,a=N.lR.exec(E);a;)n+=t(E.substr(r,a.index-r)),e=b(N,a),e?(M+=e[1],n+=p(e[0],t(a[0]))):n+=t(a[0]),r=N.lR.lastIndex,a=N.lR.exec(E);return n+t(E.substr(r))}function f(){var e="string"==typeof N.sL;if(e&&!k[N.sL])return t(E);var r=e?u(N.sL,E,!0,x[N.sL]):d(E,N.sL.length?N.sL:void 0);return N.r>0&&(M+=r.r),e&&(x[N.sL]=r.top),p(r.language,r.value,!1,!0)}function g(){C+=null!=N.sL?f():m(),E=""}function _(e){C+=e.cN?p(e.cN,"",!0):"",N=Object.create(e,{parent:{value:N}})}function h(e,t){if(E+=e,null==t)return g(),0;var r=s(t,N);if(r)return r.skip?E+=t:(r.eB&&(E+=t),g(),r.rB||r.eB||(E=t)),_(r,t),r.rB?0:t.length;var a=c(N,t);if(a){var n=N;n.skip?E+=t:(n.rE||n.eE||(E+=t),g(),n.eE&&(E=t));do N.cN&&(C+=B),N.skip||(M+=N.r),N=N.parent;while(N!==a.parent);return a.starts&&_(a.starts,""),n.rE?0:t.length}if(o(t,N))throw new Error('Illegal lexeme "'+t+'" for mode "'+(N.cN||"")+'"');return E+=t,t.length||1}var v=y(e);if(!v)throw new Error('Unknown language: "'+e+'"');l(v);var w,N=i||v,x={},C="";for(w=N;w!==v;w=w.parent)w.cN&&(C=p(w.cN,"",!0)+C);var E="",M=0;try{for(var S,L,A=0;;){if(N.t.lastIndex=A,S=N.t.exec(r),!S)break;L=h(r.substr(A,S.index-A),S[0]),A=S.index+L}for(h(r.substr(A)),w=N;w.parent;w=w.parent)w.cN&&(C+=B);return{r:M,value:C,language:e,top:N}}catch($){if($.message&&-1!==$.message.indexOf("Illegal"))return{r:0,value:t(r)};throw $}}function d(e,r){r=r||R.languages||N(k);var a={r:0,value:t(e)},n=a;return r.filter(y).forEach(function(t){var r=u(t,e,!1);r.language=t,r.r>n.r&&(n=r),r.r>a.r&&(n=a,a=r)}),n.language&&(a.second_best=n),a}function b(e){return R.tabReplace||R.useBR?e.replace(M,function(e,t){return R.useBR&&"\n"===e?"
":R.tabReplace?t.replace(/\t/g,R.tabReplace):void 0}):e}function p(e,t,r){var a=t?x[t]:r,n=[e.trim()];return e.match(/\bhljs\b/)||n.push("hljs"),-1===e.indexOf(a)&&n.push(a),n.join(" ").trim()}function m(e){var t,r,a,s,l,m=i(e);n(m)||(R.useBR?(t=document.createElementNS("http://www.w3.org/1999/xhtml","div"),t.innerHTML=e.innerHTML.replace(/\n/g,"").replace(//g,"\n")):t=e,l=t.textContent,a=m?u(m,l,!0):d(l),r=c(t),r.length&&(s=document.createElementNS("http://www.w3.org/1999/xhtml","div"),s.innerHTML=a.value,a.value=o(r,c(s),l)),a.value=b(a.value),e.innerHTML=a.value,e.className=p(e.className,m,a.language),e.result={language:a.language,re:a.r},a.second_best&&(e.second_best={language:a.second_best.language,re:a.second_best.r}))}function f(e){R=s(R,e)}function g(){if(!g.called){g.called=!0;var e=document.querySelectorAll("pre code");w.forEach.call(e,m)}}function _(){addEventListener("DOMContentLoaded",g,!1),addEventListener("load",g,!1)}function h(t,r){var a=k[t]=r(e);a.aliases&&a.aliases.forEach(function(e){x[e]=t})}function v(){return N(k)}function y(e){return e=(e||"").toLowerCase(),k[e]||k[x[e]]}var w=[],N=Object.keys,k={},x={},C=/^(no-?highlight|plain|text)$/i,E=/\blang(?:uage)?-([\w-]+)\b/i,M=/((^(<[^>]+>|\t|)+|(?:\n)))/gm,B="",R={classPrefix:"hljs-",tabReplace:null,useBR:!1,languages:void 0},S={"&":"&","<":"<",">":">"};return e.highlight=u,e.highlightAuto=d,e.fixMarkup=b,e.highlightBlock=m,e.configure=f,e.initHighlighting=g,e.initHighlightingOnLoad=_,e.registerLanguage=h,e.listLanguages=v,e.getLanguage=y,e.inherit=s,e.IR="[a-zA-Z]\\w*",e.UIR="[a-zA-Z_]\\w*",e.NR="\\b\\d+(\\.\\d+)?",e.CNR="(-?)(\\b0[xX][a-fA-F0-9]+|(\\b\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)",e.BNR="\\b(0b[01]+)",e.RSR="!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|-|-=|/=|/|:|;|<<|<<=|<=|<|===|==|=|>>>=|>>=|>=|>>>|>>|>|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~",e.BE={b:"\\\\[\\s\\S]",r:0},e.ASM={cN:"string",b:"'",e:"'",i:"\\n",c:[e.BE]},e.QSM={cN:"string",b:'"',e:'"',i:"\\n",c:[e.BE]},e.PWM={b:/\b(a|an|the|are|I'm|isn't|don't|doesn't|won't|but|just|should|pretty|simply|enough|gonna|going|wtf|so|such|will|you|your|like)\b/},e.C=function(t,r,a){var n=e.inherit({cN:"comment",b:t,e:r,c:[]},a||{});return n.c.push(e.PWM),n.c.push({cN:"doctag",b:"(?:TODO|FIXME|NOTE|BUG|XXX):",r:0}),n},e.CLCM=e.C("//","$"),e.CBCM=e.C("/\\*","\\*/"),e.HCM=e.C("#","$"),e.NM={cN:"number",b:e.NR,r:0},e.CNM={cN:"number",b:e.CNR,r:0},e.BNM={cN:"number",b:e.BNR,r:0},e.CSSNM={cN:"number",b:e.NR+"(%|em|ex|ch|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|px|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx)?",r:0},e.RM={cN:"regexp",b:/\//,e:/\/[gimuy]*/,i:/\n/,c:[e.BE,{b:/\[/,e:/\]/,r:0,c:[e.BE]}]},e.TM={cN:"title",b:e.IR,r:0},e.UTM={cN:"title",b:e.UIR,r:0},e.METHOD_GUARD={b:"\\.\\s*"+e.UIR,r:0},e.registerLanguage("apache",function(e){var t={cN:"number",b:"[\\$%]\\d+"};return{aliases:["apacheconf"],cI:!0,c:[e.HCM,{cN:"section",b:""},{cN:"attribute",b:/\w+/,r:0,k:{nomarkup:"order deny allow setenv rewriterule rewriteengine rewritecond documentroot sethandler errordocument loadmodule options header listen serverroot servername"},starts:{e:/$/,r:0,k:{literal:"on off all"},c:[{cN:"meta",b:"\\s\\[",e:"\\]$"},{cN:"variable",b:"[\\$%]\\{",e:"\\}",c:["self",t]},t,e.QSM]}}],i:/\S/}}),e.registerLanguage("bash",function(e){var t={cN:"variable",v:[{b:/\$[\w\d#@][\w\d_]*/},{b:/\$\{(.*?)}/}]},r={cN:"string",b:/"/,e:/"/,c:[e.BE,t,{cN:"variable",b:/\$\(/,e:/\)/,c:[e.BE]}]},a={cN:"string",b:/'/,e:/'/};return{aliases:["sh","zsh"],l:/-?[a-z\._]+/,k:{keyword:"if then else elif fi for while in do done case esac function",literal:"true false",built_in:"break cd continue eval exec exit export getopts hash pwd readonly return shift test times trap umask unset alias bind builtin caller command declare echo enable help let local logout mapfile printf read readarray source type typeset ulimit unalias set shopt autoload bg bindkey bye cap chdir clone comparguments compcall compctl compdescribe compfiles compgroups compquote comptags comptry compvalues dirs disable disown echotc echoti emulate fc fg float functions getcap getln history integer jobs kill limit log noglob popd print pushd pushln rehash sched setcap setopt stat suspend ttyctl unfunction unhash unlimit unsetopt vared wait whence where which zcompile zformat zftp zle zmodload zparseopts zprof zpty zregexparse zsocket zstyle ztcp",_:"-ne -eq -lt -gt -f -d -e -s -l -a"},c:[{cN:"meta",b:/^#![^\n]+sh\s*$/,r:10},{cN:"function",b:/\w[\w\d_]*\s*\(\s*\)\s*\{/,rB:!0,c:[e.inherit(e.TM,{b:/\w[\w\d_]*/})],r:0},e.HCM,r,a,t]}}),e.registerLanguage("coffeescript",function(e){var t={keyword:"in if for while finally new do return else break catch instanceof throw try this switch continue typeof delete debugger super then unless until loop of by when and or is isnt not",literal:"true false null undefined yes no on off",built_in:"npm require console print module global window document"},r="[A-Za-z$_][0-9A-Za-z$_]*",a={cN:"subst",b:/#\{/,e:/}/,k:t},n=[e.BNM,e.inherit(e.CNM,{starts:{e:"(\\s*/)?",r:0}}),{cN:"string",v:[{b:/'''/,e:/'''/,c:[e.BE]},{b:/'/,e:/'/,c:[e.BE]},{b:/"""/,e:/"""/,c:[e.BE,a]},{b:/"/,e:/"/,c:[e.BE,a]}]},{cN:"regexp",v:[{b:"///",e:"///",c:[a,e.HCM]},{b:"//[gim]*",r:0},{b:/\/(?![ *])(\\\/|.)*?\/[gim]*(?=\W|$)/}]},{b:"@"+r},{b:"`",e:"`",eB:!0,eE:!0,sL:"javascript"}];a.c=n;var i=e.inherit(e.TM,{b:r}),s="(\\(.*\\))?\\s*\\B[-=]>",c={cN:"params",b:"\\([^\\(]",rB:!0,c:[{b:/\(/,e:/\)/,k:t,c:["self"].concat(n)}]};return{aliases:["coffee","cson","iced"],k:t,i:/\/\*/,c:n.concat([e.C("###","###"),e.HCM,{cN:"function",b:"^\\s*"+r+"\\s*=\\s*"+s,e:"[-=]>",rB:!0,c:[i,c]},{b:/[:\(,=]\s*/,r:0,c:[{cN:"function",b:s,e:"[-=]>",rB:!0,c:[c]}]},{cN:"class",bK:"class",e:"$",i:/[:="\[\]]/,c:[{bK:"extends",eW:!0,i:/[:="\[\]]/,c:[i]},i]},{b:r+":",e:":",rB:!0,rE:!0,r:0}])}}),e.registerLanguage("cpp",function(e){var t={cN:"keyword",b:"\\b[a-z\\d_]*_t\\b"},r={cN:"string",v:[{b:'(u8?|U)?L?"',e:'"',i:"\\n",c:[e.BE]},{b:'(u8?|U)?R"',e:'"',c:[e.BE]},{b:"'\\\\?.",e:"'",i:"."}]},a={cN:"number",v:[{b:"\\b(0b[01']+)"},{b:"\\b([\\d']+(\\.[\\d']*)?|\\.[\\d']+)(u|U|l|L|ul|UL|f|F|b|B)"},{b:"(-?)(\\b0[xX][a-fA-F0-9']+|(\\b[\\d']+(\\.[\\d']*)?|\\.[\\d']+)([eE][-+]?[\\d']+)?)"}],r:0},n={cN:"meta",b:/#\s*[a-z]+\b/,e:/$/,k:{"meta-keyword":"if else elif endif define undef warning error line pragma ifdef ifndef include"},c:[{b:/\\\n/,r:0},e.inherit(r,{cN:"meta-string"}),{cN:"meta-string",b:"<",e:">",i:"\\n"},e.CLCM,e.CBCM]},i=e.IR+"\\s*\\(",s={keyword:"int float while private char catch import module export virtual operator sizeof dynamic_cast|10 typedef const_cast|10 const struct for static_cast|10 union namespace unsigned long volatile static protected bool template mutable if public friend do goto auto void enum else break extern using class asm case typeid short reinterpret_cast|10 default double register explicit signed typename try this switch continue inline delete alignof constexpr decltype noexcept static_assert thread_local restrict _Bool complex _Complex _Imaginary atomic_bool atomic_char atomic_schar atomic_uchar atomic_short atomic_ushort atomic_int atomic_uint atomic_long atomic_ulong atomic_llong atomic_ullong new throw return",built_in:"std string cin cout cerr clog stdin stdout stderr stringstream istringstream ostringstream auto_ptr deque list queue stack vector map set bitset multiset multimap unordered_set unordered_map unordered_multiset unordered_multimap array shared_ptr abort abs acos asin atan2 atan calloc ceil cosh cos exit exp fabs floor fmod fprintf fputs free frexp fscanf isalnum isalpha iscntrl isdigit isgraph islower isprint ispunct isspace isupper isxdigit tolower toupper labs ldexp log10 log malloc realloc memchr memcmp memcpy memset modf pow printf putchar puts scanf sinh sin snprintf sprintf sqrt sscanf strcat strchr strcmp strcpy strcspn strlen strncat strncmp strncpy strpbrk strrchr strspn strstr tanh tan vfprintf vprintf vsprintf endl initializer_list unique_ptr",literal:"true false nullptr NULL"},c=[t,e.CLCM,e.CBCM,a,r];return{aliases:["c","cc","h","c++","h++","hpp"],k:s,i:"",k:s,c:["self",t]},{b:e.IR+"::",k:s},{v:[{b:/=/,e:/;/},{b:/\(/,e:/\)/},{bK:"new throw return else",e:/;/}],k:s,c:c.concat([{b:/\(/,e:/\)/,k:s,c:c.concat(["self"]),r:0}]),r:0},{cN:"function",b:"("+e.IR+"[\\*&\\s]+)+"+i,rB:!0,e:/[{;=]/,eE:!0,k:s,i:/[^\w\s\*&]/,c:[{b:i,rB:!0,c:[e.TM],r:0},{cN:"params",b:/\(/,e:/\)/,k:s,r:0,c:[e.CLCM,e.CBCM,r,a,t]},e.CLCM,e.CBCM,n]}]),exports:{preprocessor:n,strings:r,k:s}}}),e.registerLanguage("cs",function(e){var t={keyword:"abstract as base bool break byte case catch char checked const continue decimal default delegate do double else enum event explicit extern finally fixed float for foreach goto if implicit in int interface internal is lock long object operator out override params private protected public readonly ref sbyte sealed short sizeof stackalloc static string struct switch this try typeof uint ulong unchecked unsafe ushort using virtual void volatile while nameof add alias ascending async await by descending dynamic equals from get global group into join let on orderby partial remove select set value var where yield",literal:"null false true"},r={cN:"string",b:'@"',e:'"',c:[{b:'""'}]},a=e.inherit(r,{i:/\n/}),n={cN:"subst",b:"{",e:"}",k:t},i=e.inherit(n,{i:/\n/}),s={cN:"string",b:/\$"/,e:'"',i:/\n/,c:[{b:"{{"},{b:"}}"},e.BE,i]},c={cN:"string",b:/\$@"/,e:'"',c:[{b:"{{"},{b:"}}"},{b:'""'},n]},o=e.inherit(c,{i:/\n/,c:[{b:"{{"},{b:"}}"},{b:'""'},i]});n.c=[c,s,r,e.ASM,e.QSM,e.CNM,e.CBCM],i.c=[o,s,a,e.ASM,e.QSM,e.CNM,e.inherit(e.CBCM,{i:/\n/})];var l={v:[c,s,r,e.ASM,e.QSM]},u=e.IR+"(<"+e.IR+"(\\s*,\\s*"+e.IR+")*>)?(\\[\\])?";return{aliases:["csharp"],k:t,i:/::/,c:[e.C("///","$",{rB:!0,c:[{cN:"doctag",v:[{b:"///",r:0},{b:""},{b:""}]}]}),e.CLCM,e.CBCM,{cN:"meta",b:"#",e:"$",k:{"meta-keyword":"if else elif endif define undef warning error line region endregion pragma checksum"}},l,e.CNM,{bK:"class interface",e:/[{;=]/,i:/[^\s:]/,c:[e.TM,e.CLCM,e.CBCM]},{bK:"namespace",e:/[{;=]/,i:/[^\s:]/,c:[e.inherit(e.TM,{b:"[a-zA-Z](\\.?\\w)*"}),e.CLCM,e.CBCM]},{bK:"new return throw await",r:0},{cN:"function",b:"("+u+"\\s+)+"+e.IR+"\\s*\\(",rB:!0,e:/[{;=]/,eE:!0,k:t,c:[{b:e.IR+"\\s*\\(",rB:!0,c:[e.TM],r:0},{cN:"params",b:/\(/,e:/\)/,eB:!0,eE:!0,k:t,r:0,c:[l,e.CNM,e.CBCM]},e.CLCM,e.CBCM]}]}}),e.registerLanguage("css",function(e){var t="[a-zA-Z-][a-zA-Z0-9_-]*",r={b:/[A-Z\_\.\-]+\s*:/,rB:!0,e:";",eW:!0,c:[{cN:"attribute",b:/\S/,e:":",eE:!0,starts:{eW:!0,eE:!0,c:[{b:/[\w-]+\(/,rB:!0,c:[{cN:"built_in",b:/[\w-]+/},{b:/\(/,e:/\)/,c:[e.ASM,e.QSM]}]},e.CSSNM,e.QSM,e.ASM,e.CBCM,{cN:"number",b:"#[0-9A-Fa-f]+"},{cN:"meta",b:"!important"}]}}]};return{cI:!0,i:/[=\/|'\$]/,c:[e.CBCM,{cN:"selector-id",b:/#[A-Za-z0-9_-]+/},{cN:"selector-class",b:/\.[A-Za-z0-9_-]+/},{cN:"selector-attr",b:/\[/,e:/\]/,i:"$"},{cN:"selector-pseudo",b:/:(:)?[a-zA-Z0-9\_\-\+\(\)"'.]+/},{b:"@(font-face|page)",l:"[a-z-]+",k:"font-face page"},{b:"@",e:"[{;]",i:/:/,c:[{cN:"keyword",b:/\w+/},{b:/\s/,eW:!0,eE:!0,r:0,c:[e.ASM,e.QSM,e.CSSNM]}]},{cN:"selector-tag",b:t,r:0},{b:"{",e:"}",i:/\S/,c:[e.CBCM,r]}]}}),e.registerLanguage("diff",function(e){return{aliases:["patch"],c:[{cN:"meta",r:10,v:[{b:/^@@ +\-\d+,\d+ +\+\d+,\d+ +@@$/},{b:/^\*\*\* +\d+,\d+ +\*\*\*\*$/},{b:/^\-\-\- +\d+,\d+ +\-\-\-\-$/}]},{cN:"comment",v:[{b:/Index: /,e:/$/},{b:/={3,}/,e:/$/},{b:/^\-{3}/,e:/$/},{b:/^\*{3} /,e:/$/},{b:/^\+{3}/,e:/$/},{b:/\*{5}/,e:/\*{5}$/}]},{cN:"addition",b:"^\\+",e:"$"},{cN:"deletion",b:"^\\-",e:"$"},{cN:"addition",b:"^\\!",e:"$"}]}}),e.registerLanguage("http",function(e){var t="HTTP/[0-9\\.]+";return{aliases:["https"],i:"\\S",c:[{b:"^"+t,e:"$",c:[{cN:"number",b:"\\b\\d{3}\\b"}]},{b:"^[A-Z]+ (.*?) "+t+"$",rB:!0,e:"$",c:[{cN:"string",b:" ",e:" ",eB:!0,eE:!0},{b:t},{cN:"keyword",b:"[A-Z]+"}]},{cN:"attribute",b:"^\\w",e:": ",eE:!0,i:"\\n|\\s|=",starts:{e:"$",r:0}},{b:"\\n\\n",starts:{sL:[],eW:!0}}]}}),e.registerLanguage("ini",function(e){var t={cN:"string",c:[e.BE],v:[{b:"'''",e:"'''",r:10},{b:'"""',e:'"""',r:10},{b:'"',e:'"'},{b:"'",e:"'"}]};return{aliases:["toml"],cI:!0,i:/\S/,c:[e.C(";","$"),e.HCM,{cN:"section",b:/^\s*\[+/,e:/\]+/},{b:/^[a-z0-9\[\]_-]+\s*=\s*/,e:"$",rB:!0,c:[{cN:"attr",b:/[a-z0-9\[\]_-]+/},{b:/=/,eW:!0,r:0,c:[{cN:"literal",b:/\bon|off|true|false|yes|no\b/},{cN:"variable",v:[{b:/\$[\w\d"][\w\d_]*/},{b:/\$\{(.*?)}/}]},t,{cN:"number",b:/([\+\-]+)?[\d]+_[\d_]+/},e.NM]}]}]}}),e.registerLanguage("java",function(e){var t=e.UIR+"(<"+e.UIR+"(\\s*,\\s*"+e.UIR+")*>)?",r="false synchronized int abstract float private char boolean static null if const for true while long strictfp finally protected import native final void enum else break transient catch instanceof byte super volatile case assert short package default double public try this switch continue throws protected public private module requires exports",a="\\b(0[bB]([01]+[01_]+[01]+|[01]+)|0[xX]([a-fA-F0-9]+[a-fA-F0-9_]+[a-fA-F0-9]+|[a-fA-F0-9]+)|(([\\d]+[\\d_]+[\\d]+|[\\d]+)(\\.([\\d]+[\\d_]+[\\d]+|[\\d]+))?|\\.([\\d]+[\\d_]+[\\d]+|[\\d]+))([eE][-+]?\\d+)?)[lLfF]?",n={cN:"number",b:a,r:0};return{aliases:["jsp"],k:r,i:/<\/|#/,c:[e.C("/\\*\\*","\\*/",{r:0,c:[{b:/\w+@/,r:0},{cN:"doctag",b:"@[A-Za-z]+"}]}),e.CLCM,e.CBCM,e.ASM,e.QSM,{cN:"class",bK:"class interface",e:/[{;=]/,eE:!0,k:"class interface",i:/[:"\[\]]/,c:[{bK:"extends implements"},e.UTM]},{bK:"new throw return else",r:0},{cN:"function",b:"("+t+"\\s+)+"+e.UIR+"\\s*\\(",rB:!0,e:/[{;=]/,eE:!0,k:r,c:[{b:e.UIR+"\\s*\\(",rB:!0,r:0,c:[e.UTM]},{cN:"params",b:/\(/,e:/\)/,k:r,r:0,c:[e.ASM,e.QSM,e.CNM,e.CBCM]},e.CLCM,e.CBCM]},n,{cN:"meta",b:"@[A-Za-z]+"}]}}),e.registerLanguage("javascript",function(e){var t="[A-Za-z$_][0-9A-Za-z$_]*",r={keyword:"in of if for while finally var new function do return void else break catch instanceof with throw case default try this switch continue typeof delete let yield const export super debugger as async await static import from as",literal:"true false null undefined NaN Infinity",built_in:"eval isFinite isNaN parseFloat parseInt decodeURI decodeURIComponent encodeURI encodeURIComponent escape unescape Object Function Boolean Error EvalError InternalError RangeError ReferenceError StopIteration SyntaxError TypeError URIError Number Math Date String RegExp Array Float32Array Float64Array Int16Array Int32Array Int8Array Uint16Array Uint32Array Uint8Array Uint8ClampedArray ArrayBuffer DataView JSON Intl arguments require module console window document Symbol Set Map WeakSet WeakMap Proxy Reflect Promise"},a={cN:"number",v:[{b:"\\b(0[bB][01]+)"},{b:"\\b(0[oO][0-7]+)"},{b:e.CNR}],r:0},n={cN:"subst",b:"\\$\\{",e:"\\}",k:r,c:[]},i={cN:"string",b:"`",e:"`",c:[e.BE,n]};n.c=[e.ASM,e.QSM,i,a,e.RM];var s=n.c.concat([e.CBCM,e.CLCM]);return{aliases:["js","jsx"],k:r,c:[{cN:"meta",r:10,b:/^\s*['"]use (strict|asm)['"]/},{cN:"meta",b:/^#!/,e:/$/},e.ASM,e.QSM,i,e.CLCM,e.CBCM,a,{b:/[{,]\s*/,r:0,c:[{b:t+"\\s*:",rB:!0,r:0,c:[{cN:"attr",b:t,r:0}]}]},{b:"("+e.RSR+"|\\b(case|return|throw)\\b)\\s*",k:"return throw case",c:[e.CLCM,e.CBCM,e.RM,{cN:"function",b:"(\\(.*?\\)|"+t+")\\s*=>",rB:!0,e:"\\s*=>",c:[{cN:"params",v:[{b:t},{b:/\(\s*\)/},{b:/\(/,e:/\)/,eB:!0,eE:!0,k:r,c:s}]}]},{b://,sL:"xml",c:[{b:/<\w+\s*\/>/,skip:!0},{b:/<\w+/,e:/(\/\w+|\w+\/)>/,skip:!0,c:[{b:/<\w+\s*\/>/,skip:!0},"self"]}]}],r:0},{cN:"function",bK:"function",e:/\{/,eE:!0,c:[e.inherit(e.TM,{b:t}),{cN:"params",b:/\(/,e:/\)/,eB:!0,eE:!0,c:s}],i:/\[|%/},{b:/\$[(.]/},e.METHOD_GUARD,{cN:"class",bK:"class",e:/[{;=]/,eE:!0,i:/[:"\[\]]/,c:[{bK:"extends"},e.UTM]},{bK:"constructor",e:/\{/,eE:!0}],i:/#(?!!)/}}),e.registerLanguage("json",function(e){var t={literal:"true false null"},r=[e.QSM,e.CNM],a={e:",",eW:!0,eE:!0,c:r,k:t},n={b:"{",e:"}",c:[{cN:"attr",b:/"/,e:/"/,c:[e.BE],i:"\\n"},e.inherit(a,{b:/:/})],i:"\\S"},i={b:"\\[",e:"\\]",c:[e.inherit(a)],i:"\\S"};return r.splice(r.length,0,n,i),{c:r,k:t,i:"\\S"}}),e.registerLanguage("makefile",function(e){var t={cN:"variable",b:/\$\(/,e:/\)/,c:[e.BE]};return{aliases:["mk","mak"],c:[e.HCM,{b:/^\w+\s*\W*=/,rB:!0,r:0,starts:{e:/\s*\W*=/,eE:!0,starts:{e:/$/,r:0,c:[t]}}},{cN:"section",b:/^[\w]+:\s*$/},{cN:"meta",b:/^\.PHONY:/,e:/$/,k:{"meta-keyword":".PHONY"},l:/[\.\w]+/},{b:/^\t+/,e:/$/,r:0,c:[e.QSM,t]}]}}),e.registerLanguage("xml",function(e){var t="[A-Za-z0-9\\._:-]+",r={eW:!0,i:/`]+/}]}]}]};return{aliases:["html","xhtml","rss","atom","xjb","xsd","xsl","plist"],cI:!0,c:[{cN:"meta",b:"",r:10,c:[{b:"\\[",e:"\\]"}]},e.C("",{r:10}),{b:"<\\!\\[CDATA\\[",e:"\\]\\]>",r:10},{b:/<\?(php)?/,e:/\?>/,sL:"php",c:[{b:"/\\*",e:"\\*/",skip:!0}]},{cN:"tag",b:"|$)",e:">",k:{name:"style"},c:[r],starts:{e:"",rE:!0,sL:["css","xml"]}},{cN:"tag",b:"|$)",e:">",k:{name:"script"},c:[r],starts:{e:"",rE:!0,sL:["actionscript","javascript","handlebars","xml"]}},{cN:"meta",v:[{b:/<\?xml/,e:/\?>/,r:10},{b:/<\?\w+/,e:/\?>/}]},{cN:"tag",b:"",c:[{cN:"name",b:/[^\/><\s]+/,r:0},r]}]}}),e.registerLanguage("markdown",function(e){return{aliases:["md","mkdown","mkd"],c:[{cN:"section",v:[{b:"^#{1,6}",e:"$"},{b:"^.+?\\n[=-]{2,}$"}]},{b:"<",e:">",sL:"xml",r:0},{cN:"bullet",b:"^([*+-]|(\\d+\\.))\\s+"},{cN:"strong",b:"[*_]{2}.+?[*_]{2}"},{cN:"emphasis",v:[{b:"\\*.+?\\*"},{b:"_.+?_",r:0}]},{cN:"quote",b:"^>\\s+",e:"$"},{cN:"code",v:[{b:"^```w*s*$",e:"^```s*$"},{b:"`.+?`"},{b:"^( {4}| )",e:"$",r:0}]},{b:"^[-\\*]{3,}",e:"$"},{b:"\\[.+?\\][\\(\\[].*?[\\)\\]]",rB:!0,c:[{cN:"string",b:"\\[",e:"\\]",eB:!0,rE:!0,r:0},{cN:"link",b:"\\]\\(",e:"\\)",eB:!0,eE:!0},{cN:"symbol",b:"\\]\\[",e:"\\]",eB:!0,eE:!0}],r:10},{b:/^\[[^\n]+\]:/,rB:!0,c:[{cN:"symbol",b:/\[/,e:/\]/,eB:!0,eE:!0},{cN:"link",b:/:\s*/,e:/$/,eB:!0}]}]}}),e.registerLanguage("nginx",function(e){var t={cN:"variable",v:[{b:/\$\d+/},{b:/\$\{/,e:/}/},{b:"[\\$\\@]"+e.UIR}]},r={eW:!0,l:"[a-z/_]+",k:{literal:"on off yes no true false none blocked debug info notice warn error crit select break last permanent redirect kqueue rtsig epoll poll /dev/poll"},r:0,i:"=>",c:[e.HCM,{cN:"string",c:[e.BE,t],v:[{b:/"/,e:/"/},{b:/'/,e:/'/}]},{b:"([a-z]+):/",e:"\\s",eW:!0,eE:!0,c:[t]},{cN:"regexp",c:[e.BE,t],v:[{b:"\\s\\^",e:"\\s|{|;",rE:!0},{b:"~\\*?\\s+",e:"\\s|{|;",rE:!0},{b:"\\*(\\.[a-z\\-]+)+"},{b:"([a-z\\-]+\\.)+\\*"}]},{cN:"number",b:"\\b\\d{1,3}\\.\\d{1,3}\\.\\d{1,3}\\.\\d{1,3}(:\\d{1,5})?\\b"},{cN:"number",b:"\\b\\d+[kKmMgGdshdwy]*\\b",r:0},t]};return{aliases:["nginxconf"],c:[e.HCM,{b:e.UIR+"\\s+{",rB:!0,e:"{",c:[{cN:"section",b:e.UIR}],r:0},{b:e.UIR+"\\s",e:";|{",rB:!0,c:[{cN:"attribute",b:e.UIR,starts:r}],r:0}],i:"[^\\s\\}]"}}),e.registerLanguage("objectivec",function(e){var t={cN:"built_in",b:"\\b(AV|CA|CF|CG|CI|CL|CM|CN|CT|MK|MP|MTK|MTL|NS|SCN|SK|UI|WK|XC)\\w+"},r={keyword:"int float while char export sizeof typedef const struct for union unsigned long volatile static bool mutable if do return goto void enum else break extern asm case short default double register explicit signed typename this switch continue wchar_t inline readonly assign readwrite self @synchronized id typeof nonatomic super unichar IBOutlet IBAction strong weak copy in out inout bycopy byref oneway __strong __weak __block __autoreleasing @private @protected @public @try @property @end @throw @catch @finally @autoreleasepool @synthesize @dynamic @selector @optional @required @encode @package @import @defs @compatibility_alias __bridge __bridge_transfer __bridge_retained __bridge_retain __covariant __contravariant __kindof _Nonnull _Nullable _Null_unspecified __FUNCTION__ __PRETTY_FUNCTION__ __attribute__ getter setter retain unsafe_unretained nonnull nullable null_unspecified null_resettable class instancetype NS_DESIGNATED_INITIALIZER NS_UNAVAILABLE NS_REQUIRES_SUPER NS_RETURNS_INNER_POINTER NS_INLINE NS_AVAILABLE NS_DEPRECATED NS_ENUM NS_OPTIONS NS_SWIFT_UNAVAILABLE NS_ASSUME_NONNULL_BEGIN NS_ASSUME_NONNULL_END NS_REFINED_FOR_SWIFT NS_SWIFT_NAME NS_SWIFT_NOTHROW NS_DURING NS_HANDLER NS_ENDHANDLER NS_VALUERETURN NS_VOIDRETURN",literal:"false true FALSE TRUE nil YES NO NULL",built_in:"BOOL dispatch_once_t dispatch_queue_t dispatch_sync dispatch_async dispatch_once"},a=/[a-zA-Z@][a-zA-Z0-9_]*/,n="@interface @class @protocol @implementation";return{aliases:["mm","objc","obj-c"],k:r,l:a,i:""}]}]},{cN:"class",b:"("+n.split(" ").join("|")+")\\b",e:"({|$)",eE:!0,k:n,l:a,c:[e.UTM]},{b:"\\."+e.UIR,r:0}]}}),e.registerLanguage("perl",function(e){var t="getpwent getservent quotemeta msgrcv scalar kill dbmclose undef lc ma syswrite tr send umask sysopen shmwrite vec qx utime local oct semctl localtime readpipe do return format read sprintf dbmopen pop getpgrp not getpwnam rewinddir qqfileno qw endprotoent wait sethostent bless s|0 opendir continue each sleep endgrent shutdown dump chomp connect getsockname die socketpair close flock exists index shmgetsub for endpwent redo lstat msgctl setpgrp abs exit select print ref gethostbyaddr unshift fcntl syscall goto getnetbyaddr join gmtime symlink semget splice x|0 getpeername recv log setsockopt cos last reverse gethostbyname getgrnam study formline endhostent times chop length gethostent getnetent pack getprotoent getservbyname rand mkdir pos chmod y|0 substr endnetent printf next open msgsnd readdir use unlink getsockopt getpriority rindex wantarray hex system getservbyport endservent int chr untie rmdir prototype tell listen fork shmread ucfirst setprotoent else sysseek link getgrgid shmctl waitpid unpack getnetbyname reset chdir grep split require caller lcfirst until warn while values shift telldir getpwuid my getprotobynumber delete and sort uc defined srand accept package seekdir getprotobyname semop our rename seek if q|0 chroot sysread setpwent no crypt getc chown sqrt write setnetent setpriority foreach tie sin msgget map stat getlogin unless elsif truncate exec keys glob tied closedirioctl socket readlink eval xor readline binmode setservent eof ord bind alarm pipe atan2 getgrent exp time push setgrent gt lt or ne m|0 break given say state when",r={cN:"subst",b:"[$@]\\{",e:"\\}",k:t},a={b:"->{",e:"}"},n={v:[{b:/\$\d/},{b:/[\$%@](\^\w\b|#\w+(::\w+)*|{\w+}|\w+(::\w*)*)/},{b:/[\$%@][^\s\w{]/,r:0}]},i=[e.BE,r,n],s=[n,e.HCM,e.C("^\\=\\w","\\=cut",{eW:!0}),a,{cN:"string",c:i,v:[{b:"q[qwxr]?\\s*\\(",e:"\\)",r:5},{b:"q[qwxr]?\\s*\\[",e:"\\]",r:5},{b:"q[qwxr]?\\s*\\{",e:"\\}",r:5},{b:"q[qwxr]?\\s*\\|",e:"\\|",r:5},{b:"q[qwxr]?\\s*\\<",e:"\\>",r:5},{b:"qw\\s+q",e:"q",r:5},{b:"'",e:"'",c:[e.BE]},{b:'"',e:'"'},{b:"`",e:"`",c:[e.BE]},{b:"{\\w+}",c:[],r:0},{b:"-?\\w+\\s*\\=\\>",c:[],r:0}]},{cN:"number",b:"(\\b0[0-7_]+)|(\\b0x[0-9a-fA-F_]+)|(\\b[1-9][0-9_]*(\\.[0-9_]+)?)|[0_]\\b",r:0},{b:"(\\/\\/|"+e.RSR+"|\\b(split|return|print|reverse|grep)\\b)\\s*",k:"split return print reverse grep",r:0,c:[e.HCM,{cN:"regexp",b:"(s|tr|y)/(\\\\.|[^/])*/(\\\\.|[^/])*/[a-z]*",r:10},{cN:"regexp",b:"(m|qr)?/",e:"/[a-z]*",c:[e.BE],r:0}]},{cN:"function",bK:"sub",e:"(\\s*\\(.*?\\))?[;{]",eE:!0,r:5,c:[e.TM]},{b:"-\\w\\b",r:0},{b:"^__DATA__$",e:"^__END__$",sL:"mojolicious",c:[{b:"^@@.*",e:"$",cN:"comment"}]}];return r.c=s,a.c=s,{aliases:["pl","pm"],l:/[\w\.]+/,k:t,c:s}}),e.registerLanguage("php",function(e){var t={b:"\\$+[a-zA-Z_-ÿ][a-zA-Z0-9_-ÿ]*"},r={cN:"meta",b:/<\?(php)?|\?>/},a={cN:"string",c:[e.BE,r],v:[{b:'b"',e:'"'},{b:"b'",e:"'"},e.inherit(e.ASM,{i:null}),e.inherit(e.QSM,{i:null})]},n={v:[e.BNM,e.CNM]};return{aliases:["php3","php4","php5","php6"],cI:!0,k:"and include_once list abstract global private echo interface as static endswitch array null if endwhile or const for endforeach self var while isset public protected exit foreach throw elseif include __FILE__ empty require_once do xor return parent clone use __CLASS__ __LINE__ else break print eval new catch __METHOD__ case exception default die require __FUNCTION__ enddeclare final try switch continue endfor endif declare unset true false trait goto instanceof insteadof __DIR__ __NAMESPACE__ yield finally",c:[e.HCM,e.C("//","$",{c:[r]}),e.C("/\\*","\\*/",{c:[{cN:"doctag",b:"@[A-Za-z]+"}]}),e.C("__halt_compiler.+?;",!1,{eW:!0,k:"__halt_compiler",l:e.UIR}),{cN:"string",b:/<<<['"]?\w+['"]?$/,e:/^\w+;?$/,c:[e.BE,{cN:"subst",v:[{b:/\$\w+/},{b:/\{\$/,e:/\}/}]}]},r,{cN:"keyword",b:/\$this\b/},t,{b:/(::|->)+[a-zA-Z_\x7f-\xff][a-zA-Z0-9_\x7f-\xff]*/},{cN:"function",bK:"function",e:/[;{]/,eE:!0,i:"\\$|\\[|%",c:[e.UTM,{cN:"params",b:"\\(",e:"\\)",c:["self",t,e.CBCM,a,n]}]},{cN:"class",bK:"class interface",e:"{",eE:!0,i:/[:\(\$"]/,c:[{bK:"extends implements"},e.UTM]},{bK:"namespace",e:";",i:/[\.']/,c:[e.UTM]},{bK:"use",e:";",c:[e.UTM]},{b:"=>"},a,n]}}),e.registerLanguage("python",function(e){var t={cN:"meta",b:/^(>>>|\.\.\.) /},r={cN:"string",c:[e.BE],v:[{b:/(u|b)?r?'''/,e:/'''/,c:[t],r:10},{b:/(u|b)?r?"""/,e:/"""/,c:[t],r:10},{b:/(u|r|ur)'/,e:/'/,r:10},{b:/(u|r|ur)"/,e:/"/,r:10},{b:/(b|br)'/,e:/'/},{b:/(b|br)"/,e:/"/},e.ASM,e.QSM]},a={cN:"number",r:0,v:[{b:e.BNR+"[lLjJ]?"},{b:"\\b(0o[0-7]+)[lLjJ]?"},{b:e.CNR+"[lLjJ]?"}]},n={cN:"params",b:/\(/,e:/\)/,c:["self",t,a,r]};return{aliases:["py","gyp"],k:{keyword:"and elif is global as in if from raise for except finally print import pass return exec else break not with class assert yield try while continue del or def lambda async await nonlocal|10 None True False",built_in:"Ellipsis NotImplemented"},i:/(<\/|->|\?)/,c:[t,a,r,e.HCM,{v:[{cN:"function",bK:"def",r:10},{cN:"class",bK:"class"}],e:/:/,i:/[${=;\n,]/,c:[e.UTM,n,{b:/->/,eW:!0,k:"None"}]},{cN:"meta",b:/^[\t ]*@/,e:/$/},{b:/\b(print|exec)\(/}]}}),e.registerLanguage("ruby",function(e){var t="[a-zA-Z_]\\w*[!?=]?|[-+~]\\@|<<|>>|=~|===?|<=>|[<>]=?|\\*\\*|[-/+%^&*~`|]|\\[\\]=?",r={keyword:"and then defined module in return redo if BEGIN retry end for self when next until do begin unless END rescue else break undef not super class case require yield alias while ensure elsif or include attr_reader attr_writer attr_accessor",literal:"true false nil"},a={cN:"doctag",b:"@[A-Za-z]+"},n={b:"#<",e:">"},i=[e.C("#","$",{c:[a]}),e.C("^\\=begin","^\\=end",{c:[a],r:10}),e.C("^__END__","\\n$")],s={cN:"subst",b:"#\\{",e:"}",k:r},c={cN:"string",c:[e.BE,s],v:[{b:/'/,e:/'/},{b:/"/,e:/"/},{b:/`/,e:/`/},{b:"%[qQwWx]?\\(",e:"\\)"},{b:"%[qQwWx]?\\[",e:"\\]"},{b:"%[qQwWx]?{",e:"}"},{b:"%[qQwWx]?<",e:">"},{b:"%[qQwWx]?/",e:"/"},{b:"%[qQwWx]?%",e:"%"},{b:"%[qQwWx]?-",e:"-"},{b:"%[qQwWx]?\\|",e:"\\|"},{b:/\B\?(\\\d{1,3}|\\x[A-Fa-f0-9]{1,2}|\\u[A-Fa-f0-9]{4}|\\?\S)\b/},{b:/<<(-?)\w+$/,e:/^\s*\w+$/}]},o={cN:"params",b:"\\(",e:"\\)",endsParent:!0,k:r},l=[c,n,{cN:"class",bK:"class module",e:"$|;",i:/=/,c:[e.inherit(e.TM,{b:"[A-Za-z_]\\w*(::\\w+)*(\\?|\\!)?"}),{b:"<\\s*",c:[{b:"("+e.IR+"::)?"+e.IR}]}].concat(i)},{cN:"function",bK:"def", 3 | e:"$|;",c:[e.inherit(e.TM,{b:t}),o].concat(i)},{b:e.IR+"::"},{cN:"symbol",b:e.UIR+"(\\!|\\?)?:",r:0},{cN:"symbol",b:":(?!\\s)",c:[c,{b:t}],r:0},{cN:"number",b:"(\\b0[0-7_]+)|(\\b0x[0-9a-fA-F_]+)|(\\b[1-9][0-9_]*(\\.[0-9_]+)?)|[0_]\\b",r:0},{b:"(\\$\\W)|((\\$|\\@\\@?)(\\w+))"},{cN:"params",b:/\|/,e:/\|/,k:r},{b:"("+e.RSR+")\\s*",c:[n,{cN:"regexp",c:[e.BE,s],i:/\n/,v:[{b:"/",e:"/[a-z]*"},{b:"%r{",e:"}[a-z]*"},{b:"%r\\(",e:"\\)[a-z]*"},{b:"%r!",e:"![a-z]*"},{b:"%r\\[",e:"\\][a-z]*"}]}].concat(i),r:0}].concat(i);s.c=l,o.c=l;var u="[>?]>",d="[\\w#]+\\(\\w+\\):\\d+:\\d+>",b="(\\w+-)?\\d+\\.\\d+\\.\\d(p\\d+)?[^>]+>",p=[{b:/^\s*=>/,starts:{e:"$",c:l}},{cN:"meta",b:"^("+u+"|"+d+"|"+b+")",starts:{e:"$",c:l}}];return{aliases:["rb","gemspec","podspec","thor","irb"],k:r,i:/\/\*/,c:i.concat(p).concat(l)}}),e.registerLanguage("sql",function(e){var t=e.C("--","$");return{cI:!0,i:/[<>{}*#]/,c:[{bK:"begin end start commit rollback savepoint lock alter create drop rename call delete do handler insert load replace select truncate update set show pragma grant merge describe use explain help declare prepare execute deallocate release unlock purge reset change stop analyze cache flush optimize repair kill install uninstall checksum restore check backup revoke comment",e:/;/,eW:!0,l:/[\w\.]+/,k:{keyword:"abort abs absolute acc acce accep accept access accessed accessible account acos action activate add addtime admin administer advanced advise aes_decrypt aes_encrypt after agent aggregate ali alia alias allocate allow alter always analyze ancillary and any anydata anydataset anyschema anytype apply archive archived archivelog are as asc ascii asin assembly assertion associate asynchronous at atan atn2 attr attri attrib attribu attribut attribute attributes audit authenticated authentication authid authors auto autoallocate autodblink autoextend automatic availability avg backup badfile basicfile before begin beginning benchmark between bfile bfile_base big bigfile bin binary_double binary_float binlog bit_and bit_count bit_length bit_or bit_xor bitmap blob_base block blocksize body both bound buffer_cache buffer_pool build bulk by byte byteordermark bytes cache caching call calling cancel capacity cascade cascaded case cast catalog category ceil ceiling chain change changed char_base char_length character_length characters characterset charindex charset charsetform charsetid check checksum checksum_agg child choose chr chunk class cleanup clear client clob clob_base clone close cluster_id cluster_probability cluster_set clustering coalesce coercibility col collate collation collect colu colum column column_value columns columns_updated comment commit compact compatibility compiled complete composite_limit compound compress compute concat concat_ws concurrent confirm conn connec connect connect_by_iscycle connect_by_isleaf connect_by_root connect_time connection consider consistent constant constraint constraints constructor container content contents context contributors controlfile conv convert convert_tz corr corr_k corr_s corresponding corruption cos cost count count_big counted covar_pop covar_samp cpu_per_call cpu_per_session crc32 create creation critical cross cube cume_dist curdate current current_date current_time current_timestamp current_user cursor curtime customdatum cycle data database databases datafile datafiles datalength date_add date_cache date_format date_sub dateadd datediff datefromparts datename datepart datetime2fromparts day day_to_second dayname dayofmonth dayofweek dayofyear days db_role_change dbtimezone ddl deallocate declare decode decompose decrement decrypt deduplicate def defa defau defaul default defaults deferred defi defin define degrees delayed delegate delete delete_all delimited demand dense_rank depth dequeue des_decrypt des_encrypt des_key_file desc descr descri describ describe descriptor deterministic diagnostics difference dimension direct_load directory disable disable_all disallow disassociate discardfile disconnect diskgroup distinct distinctrow distribute distributed div do document domain dotnet double downgrade drop dumpfile duplicate duration each edition editionable editions element ellipsis else elsif elt empty enable enable_all enclosed encode encoding encrypt end end-exec endian enforced engine engines enqueue enterprise entityescaping eomonth error errors escaped evalname evaluate event eventdata events except exception exceptions exchange exclude excluding execu execut execute exempt exists exit exp expire explain export export_set extended extent external external_1 external_2 externally extract failed failed_login_attempts failover failure far fast feature_set feature_value fetch field fields file file_name_convert filesystem_like_logging final finish first first_value fixed flash_cache flashback floor flush following follows for forall force form forma format found found_rows freelist freelists freepools fresh from from_base64 from_days ftp full function general generated get get_format get_lock getdate getutcdate global global_name globally go goto grant grants greatest group group_concat group_id grouping grouping_id groups gtid_subtract guarantee guard handler hash hashkeys having hea head headi headin heading heap help hex hierarchy high high_priority hosts hour http id ident_current ident_incr ident_seed identified identity idle_time if ifnull ignore iif ilike ilm immediate import in include including increment index indexes indexing indextype indicator indices inet6_aton inet6_ntoa inet_aton inet_ntoa infile initial initialized initially initrans inmemory inner innodb input insert install instance instantiable instr interface interleaved intersect into invalidate invisible is is_free_lock is_ipv4 is_ipv4_compat is_not is_not_null is_used_lock isdate isnull isolation iterate java join json json_exists keep keep_duplicates key keys kill language large last last_day last_insert_id last_value lax lcase lead leading least leaves left len lenght length less level levels library like like2 like4 likec limit lines link list listagg little ln load load_file lob lobs local localtime localtimestamp locate locator lock locked log log10 log2 logfile logfiles logging logical logical_reads_per_call logoff logon logs long loop low low_priority lower lpad lrtrim ltrim main make_set makedate maketime managed management manual map mapping mask master master_pos_wait match matched materialized max maxextents maximize maxinstances maxlen maxlogfiles maxloghistory maxlogmembers maxsize maxtrans md5 measures median medium member memcompress memory merge microsecond mid migration min minextents minimum mining minus minute minvalue missing mod mode model modification modify module monitoring month months mount move movement multiset mutex name name_const names nan national native natural nav nchar nclob nested never new newline next nextval no no_write_to_binlog noarchivelog noaudit nobadfile nocheck nocompress nocopy nocycle nodelay nodiscardfile noentityescaping noguarantee nokeep nologfile nomapping nomaxvalue nominimize nominvalue nomonitoring none noneditionable nonschema noorder nopr nopro noprom nopromp noprompt norely noresetlogs noreverse normal norowdependencies noschemacheck noswitch not nothing notice notrim novalidate now nowait nth_value nullif nulls num numb numbe nvarchar nvarchar2 object ocicoll ocidate ocidatetime ociduration ociinterval ociloblocator ocinumber ociref ocirefcursor ocirowid ocistring ocitype oct octet_length of off offline offset oid oidindex old on online only opaque open operations operator optimal optimize option optionally or oracle oracle_date oradata ord ordaudio orddicom orddoc order ordimage ordinality ordvideo organization orlany orlvary out outer outfile outline output over overflow overriding package pad parallel parallel_enable parameters parent parse partial partition partitions pascal passing password password_grace_time password_lock_time password_reuse_max password_reuse_time password_verify_function patch path patindex pctincrease pctthreshold pctused pctversion percent percent_rank percentile_cont percentile_disc performance period period_add period_diff permanent physical pi pipe pipelined pivot pluggable plugin policy position post_transaction pow power pragma prebuilt precedes preceding precision prediction prediction_cost prediction_details prediction_probability prediction_set prepare present preserve prior priority private private_sga privileges procedural procedure procedure_analyze processlist profiles project prompt protection public publishingservername purge quarter query quick quiesce quota quotename radians raise rand range rank raw read reads readsize rebuild record records recover recovery recursive recycle redo reduced ref reference referenced references referencing refresh regexp_like register regr_avgx regr_avgy regr_count regr_intercept regr_r2 regr_slope regr_sxx regr_sxy reject rekey relational relative relaylog release release_lock relies_on relocate rely rem remainder rename repair repeat replace replicate replication required reset resetlogs resize resource respect restore restricted result result_cache resumable resume retention return returning returns reuse reverse revoke right rlike role roles rollback rolling rollup round row row_count rowdependencies rowid rownum rows rtrim rules safe salt sample save savepoint sb1 sb2 sb4 scan schema schemacheck scn scope scroll sdo_georaster sdo_topo_geometry search sec_to_time second section securefile security seed segment select self sequence sequential serializable server servererror session session_user sessions_per_user set sets settings sha sha1 sha2 share shared shared_pool short show shrink shutdown si_averagecolor si_colorhistogram si_featurelist si_positionalcolor si_stillimage si_texture siblings sid sign sin size size_t sizes skip slave sleep smalldatetimefromparts smallfile snapshot some soname sort soundex source space sparse spfile split sql sql_big_result sql_buffer_result sql_cache sql_calc_found_rows sql_small_result sql_variant_property sqlcode sqldata sqlerror sqlname sqlstate sqrt square standalone standby start starting startup statement static statistics stats_binomial_test stats_crosstab stats_ks_test stats_mode stats_mw_test stats_one_way_anova stats_t_test_ stats_t_test_indep stats_t_test_one stats_t_test_paired stats_wsr_test status std stddev stddev_pop stddev_samp stdev stop storage store stored str str_to_date straight_join strcmp strict string struct stuff style subdate subpartition subpartitions substitutable substr substring subtime subtring_index subtype success sum suspend switch switchoffset switchover sync synchronous synonym sys sys_xmlagg sysasm sysaux sysdate sysdatetimeoffset sysdba sysoper system system_user sysutcdatetime table tables tablespace tan tdo template temporary terminated tertiary_weights test than then thread through tier ties time time_format time_zone timediff timefromparts timeout timestamp timestampadd timestampdiff timezone_abbr timezone_minute timezone_region to to_base64 to_date to_days to_seconds todatetimeoffset trace tracking transaction transactional translate translation treat trigger trigger_nestlevel triggers trim truncate try_cast try_convert try_parse type ub1 ub2 ub4 ucase unarchived unbounded uncompress under undo unhex unicode uniform uninstall union unique unix_timestamp unknown unlimited unlock unpivot unrecoverable unsafe unsigned until untrusted unusable unused update updated upgrade upped upper upsert url urowid usable usage use use_stored_outlines user user_data user_resources users using utc_date utc_timestamp uuid uuid_short validate validate_password_strength validation valist value values var var_samp varcharc vari varia variab variabl variable variables variance varp varraw varrawc varray verify version versions view virtual visible void wait wallet warning warnings week weekday weekofyear wellformed when whene whenev wheneve whenever where while whitespace with within without work wrapped xdb xml xmlagg xmlattributes xmlcast xmlcolattval xmlelement xmlexists xmlforest xmlindex xmlnamespaces xmlpi xmlquery xmlroot xmlschema xmlserialize xmltable xmltype xor year year_to_month years yearweek",literal:"true false null",built_in:"array bigint binary bit blob boolean char character date dec decimal float int int8 integer interval number numeric real record serial serial8 smallint text varchar varying void"},c:[{cN:"string",b:"'",e:"'",c:[e.BE,{b:"''"}]},{cN:"string",b:'"',e:'"',c:[e.BE,{b:'""'}]},{cN:"string",b:"`",e:"`",c:[e.BE]},e.CNM,e.CBCM,t]},e.CBCM,t]}}),e}); --------------------------------------------------------------------------------