pax_global_header00006660000000000000000000000064136772630160014525gustar00rootroot0000000000000052 comment=838d0719889780c85ad1f7e4534df3daa2fb2f8d css-3.0.0/000077500000000000000000000000001367726301600123155ustar00rootroot00000000000000css-3.0.0/.gitignore000066400000000000000000000000151367726301600143010ustar00rootroot00000000000000node_modules css-3.0.0/.travis.yml000066400000000000000000000000511367726301600144220ustar00rootroot00000000000000language: node_js node_js: - "12.18.2" css-3.0.0/History.md000066400000000000000000000031401367726301600142760ustar00rootroot000000000000002.2.1 / 2015-06-17 ================== * fix parsing escaped quotes in quoted strings 2.2.0 / 2015-02-18 ================== * add `parsingErrors` to list errors when parsing with `silent: true` * accept EOL characters and all other whitespace characters in `@` rules such as `@media` 2.1.0 / 2014-08-05 ================== * change error message format and add `.reason` property to errors * add `inputSourcemaps` option to disable input source map processing * use `inherits` for inheritance (fixes some browsers) * add `sourcemap: 'generator'` option to return the `SourceMapGenerator` object 2.0.0 / 2014-06-18 ================== * add non-enumerable parent reference to each node * drop Component(1) support * add support for @custom-media, @host, and @font-face * allow commas inside selector functions * allow empty property values * changed default options.position value to true * remove comments from properties and values * asserts when selectors are missing * added node.position.content property * absorb css-parse and css-stringify libraries * apply original source maps from source files 1.6.1 / 2014-01-02 ================== * fix component.json 1.6.0 / 2013-12-21 ================== * update deps 1.5.0 / 2013-12-03 ================== * update deps 1.1.0 / 2013-04-04 ================== * update deps 1.0.7 / 2012-11-21 ================== * fix component.json 1.0.4 / 2012-11-15 ================== * update css-stringify 1.0.3 / 2012-09-01 ================== * add component support 0.0.1 / 2010-01-03 ================== * Initial release css-3.0.0/LICENSE000066400000000000000000000021121367726301600133160ustar00rootroot00000000000000(The MIT License) Copyright (c) 2012 TJ Holowaychuk Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. css-3.0.0/Readme.md000066400000000000000000000172411367726301600140410ustar00rootroot00000000000000# css [![Build Status](https://travis-ci.org/reworkcss/css.svg?branch=master)](https://travis-ci.org/reworkcss/css) CSS parser / stringifier. ## Installation $ npm install css ## Usage ```js var css = require('css'); var obj = css.parse('body { font-size: 12px; }', options); css.stringify(obj, options); ``` ## API ### css.parse(code, [options]) Accepts a CSS string and returns an AST `object`. `options`: - silent: silently fail on parse errors. - source: the path to the file containing `css`. Makes errors and source maps more helpful, by letting them know where code comes from. ### css.stringify(object, [options]) Accepts an AST `object` (as `css.parse` produces) and returns a CSS string. `options`: - indent: the string used to indent the output. Defaults to two spaces. - compress: omit comments and extraneous whitespace. - sourcemap: return a sourcemap along with the CSS output. Using the `source` option of `css.parse` is strongly recommended when creating a source map. Specify `sourcemap: 'generator'` to return the SourceMapGenerator object instead of serializing the source map. - inputSourcemaps: (enabled by default, specify `false` to disable) reads any source maps referenced by the input files when generating the output source map. When enabled, file system access may be required for reading the referenced source maps. ### Example ```js var ast = css.parse('body { font-size: 12px; }', { source: 'source.css' }); var css = css.stringify(ast); var result = css.stringify(ast, { sourcemap: true }); result.code // string with CSS result.map // source map object ``` ### Errors Errors thrown during parsing have the following properties: - message: `String`. The full error message with the source position. - reason: `String`. The error message without position. - filename: `String` or `undefined`. The value of `options.source` if passed to `css.parse`. Otherwise `undefined`. - line: `Integer`. - column: `Integer`. - source: `String`. The portion of code that couldn't be parsed. When parsing with the `silent` option, errors are listed in the `parsingErrors` property of the [`stylesheet`](#stylesheet) node instead of being thrown. If you create any errors in plugins such as in [rework](https://github.com/reworkcss/rework), you __must__ set the same properties for consistency. ## AST Interactively explore the AST with . ### Common properties All nodes have the following properties. #### position Information about the position in the source string that corresponds to the node. `Object`: - start: `Object`: - line: `Number`. - column: `Number`. - end: `Object`: - line: `Number`. - column: `Number`. - source: `String` or `undefined`. The value of `options.source` if passed to `css.parse`. Otherwise `undefined`. - content: `String`. The full source string passed to `css.parse`. The line and column numbers are 1-based: The first line is 1 and the first column of a line is 1 (not 0). The `position` property lets you know from which source file the node comes from (if available), what that file contains, and what part of that file was parsed into the node. #### type `String`. The possible values are the ones listed in the Types section below. #### parent A reference to the parent node, or `null` if the node has no parent. ### Types The available values of `node.type` are listed below, as well as the available properties of each node (other than the common properties listed above.) #### stylesheet The root node returned by `css.parse`. - stylesheet: `Object`: - rules: `Array` of nodes with the types `rule`, `comment` and any of the at-rule types. - parsingErrors: `Array` of `Error`s. Errors collected during parsing when option `silent` is true. #### rule - selectors: `Array` of `String`s. The list of selectors of the rule, split on commas. Each selector is trimmed from whitespace and comments. - declarations: `Array` of nodes with the types `declaration` and `comment`. #### declaration - property: `String`. The property name, trimmed from whitespace and comments. May not be empty. - value: `String`. The value of the property, trimmed from whitespace and comments. Empty values are allowed. #### comment A rule-level or declaration-level comment. Comments inside selectors, properties and values etc. are lost. - comment: `String`. The part between the starting `/*` and the ending `*/` of the comment, including whitespace. #### charset The `@charset` at-rule. - charset: `String`. The part following `@charset `. #### custom-media The `@custom-media` at-rule. - name: `String`. The `--`-prefixed name. - media: `String`. The part following the name. #### document The `@document` at-rule. - document: `String`. The part following `@document `. - vendor: `String` or `undefined`. The vendor prefix in `@document`, or `undefined` if there is none. - rules: `Array` of nodes with the types `rule`, `comment` and any of the at-rule types. #### font-face The `@font-face` at-rule. - declarations: `Array` of nodes with the types `declaration` and `comment`. #### host The `@host` at-rule. - rules: `Array` of nodes with the types `rule`, `comment` and any of the at-rule types. #### import The `@import` at-rule. - import: `String`. The part following `@import `. #### keyframes The `@keyframes` at-rule. - name: `String`. The name of the keyframes rule. - vendor: `String` or `undefined`. The vendor prefix in `@keyframes`, or `undefined` if there is none. - keyframes: `Array` of nodes with the types `keyframe` and `comment`. #### keyframe - values: `Array` of `String`s. The list of “selectors” of the keyframe rule, split on commas. Each “selector” is trimmed from whitespace. - declarations: `Array` of nodes with the types `declaration` and `comment`. #### media The `@media` at-rule. - media: `String`. The part following `@media `. - rules: `Array` of nodes with the types `rule`, `comment` and any of the at-rule types. #### namespace The `@namespace` at-rule. - namespace: `String`. The part following `@namespace `. #### page The `@page` at-rule. - selectors: `Array` of `String`s. The list of selectors of the rule, split on commas. Each selector is trimmed from whitespace and comments. - declarations: `Array` of nodes with the types `declaration` and `comment`. #### supports The `@supports` at-rule. - supports: `String`. The part following `@supports `. - rules: `Array` of nodes with the types `rule`, `comment` and any of the at-rule types. ### Example CSS: ```css body { background: #eee; color: #888; } ``` Parse tree: ```json { "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "background", "value": "#eee", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 19 } } }, { "type": "declaration", "property": "color", "value": "#888", "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 14 } } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 4, "column": 2 } } } ] } } ``` ## License MIT css-3.0.0/benchmark/000077500000000000000000000000001367726301600142475ustar00rootroot00000000000000css-3.0.0/benchmark/LICENSES000066400000000000000000000025431367726301600154030ustar00rootroot00000000000000File: large.css Copyright: 2013 Contributors License: MIT Origin: https://raw.githubusercontent.com/Semantic-Org/Semantic-UI/0.16.1/build/packaged/css/semantic.css File: small.css Copyright: Nicolas Gallagher and Jonathan Neal License: MIT Origin: https://raw.githubusercontent.com/necolas/normalize.css/3.0.1/normalize.css License: MIT Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. css-3.0.0/benchmark/index.js000066400000000000000000000014031367726301600157120ustar00rootroot00000000000000 var bytes = require('bytes'); var parse = require('..').parse; var fs = require('fs'); var small = fs.readFileSync('benchmark/small.css', 'utf8'); var large = fs.readFileSync('benchmark/large.css', 'utf8'); var huge = Array(8).join(large); function lines(str) { return str.split(/\n/g).length; } console.log(); console.log(' small : %s : %s lines', bytes(Buffer.byteLength(small)), lines(small)); console.log(' large : %s : %s lines', bytes(Buffer.byteLength(large)), lines(large)); console.log(' huge : %s : %s lines', bytes(Buffer.byteLength(huge)), lines(huge)); suite('css parse', function(){ bench('small', function(){ parse(small); }); bench('large', function(){ parse(large); }); bench('huge', function(){ parse(huge); }); }); css-3.0.0/benchmark/large.css000066400000000000000000012073761367726301600160730ustar00rootroot00000000000000/* * # Semantic - Breadcrumb * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Breadcrumb *******************************/ .ui.breadcrumb { margin: 1em 0em; display: inline-block; vertical-align: middle; } .ui.breadcrumb:first-child { margin-top: 0em; } .ui.breadcrumb:last-child { margin-bottom: 0em; } /******************************* Content *******************************/ .ui.breadcrumb .divider { display: inline-block; opacity: 0.5; margin: 0em 0.15em 0em; font-size: 1em; color: rgba(0, 0, 0, 0.3); } .ui.breadcrumb a.section { cursor: pointer; } .ui.breadcrumb .section { display: inline-block; margin: 0em; padding: 0em; } /* Loose Coupling */ .ui.breadcrumb.segment { display: inline-block; padding: 0.5em 1em; } /******************************* States *******************************/ .ui.breadcrumb .active.section { font-weight: bold; } /******************************* Variations *******************************/ .ui.small.breadcrumb { font-size: 0.75em; } .ui.large.breadcrumb { font-size: 1.1em; } .ui.huge.breadcrumb { font-size: 1.3em; } /* * # Semantic - Form * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Standard *******************************/ /*-------------------- Form ---------------------*/ .ui.form { position: relative; max-width: 100%; } .ui.form :first-child { margin-top: 0em; } .ui.form :last-child { margin-bottom: 0em; } /*-------------------- Content ---------------------*/ .ui.form > p { margin: 1em 0; } /*-------------------- Field ---------------------*/ .ui.form .field { clear: both; margin: 0em 0em 1em; } /*-------------------- Labels ---------------------*/ .ui.form .field > label { margin: 0em 0em 0.3em; display: block; color: #555555; font-size: 0.875em; } /*-------------------- Standard Inputs ---------------------*/ .ui.form textarea, .ui.form input[type="text"], .ui.form input[type="email"], .ui.form input[type="date"], .ui.form input[type="password"], .ui.form input[type="number"], .ui.form input[type="url"], .ui.form input[type="tel"], .ui.form .ui.input { width: 100%; } .ui.form textarea, .ui.form input[type="text"], .ui.form input[type="email"], .ui.form input[type="date"], .ui.form input[type="password"], .ui.form input[type="number"], .ui.form input[type="url"], .ui.form input[type="tel"] { margin: 0em; padding: 0.65em 1em; font-size: 1em; background-color: #FFFFFF; border: 1px solid rgba(0, 0, 0, 0.15); outline: none; color: rgba(0, 0, 0, 0.7); border-radius: 0.3125em; -webkit-transition: background-color 0.3s ease-out, -webkit-box-shadow 0.2s ease, border-color 0.2s ease; -moz-transition: background-color 0.3s ease-out, box-shadow 0.2s ease, border-color 0.2s ease; transition: background-color 0.3s ease-out, box-shadow 0.2s ease, border-color 0.2s ease; -webkit-box-shadow: 0em 0em 0em 0em rgba(0, 0, 0, 0.3) inset; box-shadow: 0em 0em 0em 0em rgba(0, 0, 0, 0.3) inset; -webkit-appearance: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.textarea, .ui.form textarea { line-height: 1.33; min-height: 8em; height: 12em; max-height: 24em; resize: vertical; } .ui.form textarea, .ui.form input[type="checkbox"] { vertical-align: top; } /*-------------------- Dividers ---------------------*/ .ui.form .divider { clear: both; margin: 1em 0em; } /*-------------------- Types of Messages ---------------------*/ .ui.form .info.message, .ui.form .warning.message, .ui.form .error.message { display: none; } /* Assumptions */ .ui.form .message:first-child { margin-top: 0px; } /*-------------------- Validation Prompt ---------------------*/ .ui.form .field .prompt.label { white-space: nowrap; } .ui.form .inline.field .prompt { margin-top: 0em; margin-left: 1em; } .ui.form .inline.field .prompt:before { margin-top: -0.3em; bottom: auto; right: auto; top: 50%; left: 0em; } /******************************* States *******************************/ /*-------------------- Focus ---------------------*/ .ui.form input[type="text"]:focus, .ui.form input[type="email"]:focus, .ui.form input[type="date"]:focus, .ui.form input[type="password"]:focus, .ui.form input[type="number"]:focus, .ui.form input[type="url"]:focus, .ui.form input[type="tel"]:focus, .ui.form textarea:focus { color: rgba(0, 0, 0, 0.85); border-color: rgba(0, 0, 0, 0.2); border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-appearance: none; -webkit-box-shadow: 0.3em 0em 0em 0em rgba(0, 0, 0, 0.2) inset; box-shadow: 0.3em 0em 0em 0em rgba(0, 0, 0, 0.2) inset; } /*-------------------- Error ---------------------*/ /* On Form */ .ui.form.warning .warning.message { display: block; } /*-------------------- Warning ---------------------*/ /* On Form */ .ui.form.error .error.message { display: block; } /* On Field(s) */ .ui.form .fields.error .field label, .ui.form .field.error label, .ui.form .fields.error .field .input, .ui.form .field.error .input { color: #D95C5C; } .ui.form .fields.error .field .corner.label, .ui.form .field.error .corner.label { border-color: #D95C5C; color: #FFFFFF; } .ui.form .fields.error .field textarea, .ui.form .fields.error .field input[type="text"], .ui.form .fields.error .field input[type="email"], .ui.form .fields.error .field input[type="date"], .ui.form .fields.error .field input[type="password"], .ui.form .fields.error .field input[type="number"], .ui.form .fields.error .field input[type="url"], .ui.form .fields.error .field input[type="tel"], .ui.form .field.error textarea, .ui.form .field.error input[type="text"], .ui.form .field.error input[type="email"], .ui.form .field.error input[type="date"], .ui.form .field.error input[type="password"], .ui.form .field.error input[type="number"], .ui.form .field.error input[type="url"], .ui.form .field.error input[type="tel"] { background-color: #FFFAFA; border-color: #E7BEBE; border-left: none; color: #D95C5C; padding-left: 1.2em; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-box-shadow: 0.3em 0em 0em 0em #D95C5C inset; box-shadow: 0.3em 0em 0em 0em #D95C5C inset; } .ui.form .field.error textarea:focus, .ui.form .field.error input[type="text"]:focus, .ui.form .field.error input[type="email"]:focus, .ui.form .field.error input[type="date"]:focus, .ui.form .field.error input[type="password"]:focus, .ui.form .field.error input[type="number"]:focus, .ui.form .field.error input[type="url"]:focus, .ui.form .field.error input[type="tel"]:focus { border-color: #ff5050; color: #ff5050; -webkit-appearance: none; -webkit-box-shadow: 0.3em 0em 0em 0em #FF5050 inset; box-shadow: 0.3em 0em 0em 0em #FF5050 inset; } /*---------------------------- Dropdown Selection Warning -----------------------------*/ .ui.form .fields.error .field .ui.dropdown, .ui.form .fields.error .field .ui.dropdown .item, .ui.form .field.error .ui.dropdown, .ui.form .field.error .ui.dropdown .item { background-color: #FFFAFA; color: #D95C5C; } .ui.form .fields.error .field .ui.dropdown, .ui.form .field.error .ui.dropdown { -webkit-box-shadow: 0px 0px 0px 1px #E7BEBE !important; box-shadow: 0px 0px 0px 1px #E7BEBE !important; } .ui.form .fields.error .field .ui.dropdown:hover, .ui.form .field.error .ui.dropdown:hover { -webkit-box-shadow: 0px 0px 0px 1px #E7BEBE !important; box-shadow: 0px 0px 0px 1px #E7BEBE !important; } .ui.form .fields.error .field .ui.dropdown:hover .menu, .ui.form .field.error .ui.dropdown:hover .menu { -webkit-box-shadow: 0px 1px 0px 1px #E7BEBE; box-shadow: 0px 1px 0px 1px #E7BEBE; } .ui.form .fields.error .field .ui.dropdown .menu .item:hover, .ui.form .field.error .ui.dropdown .menu .item:hover { background-color: #FFF2F2; } .ui.form .fields.error .field .ui.dropdown .menu .active.item, .ui.form .field.error .ui.dropdown .menu .active.item { background-color: #FDCFCF !important; } /*-------------------- Empty (Placeholder) ---------------------*/ /* browsers require these rules separate */ .ui.form ::-webkit-input-placeholder { color: #AAAAAA; } .ui.form ::-moz-placeholder { color: #AAAAAA; } .ui.form :focus::-webkit-input-placeholder { color: #999999; } .ui.form :focus::-moz-placeholder { color: #999999; } /* Error Placeholder */ .ui.form .error ::-webkit-input-placeholder { color: rgba(255, 80, 80, 0.4); } .ui.form .error ::-moz-placeholder { color: rgba(255, 80, 80, 0.4); } .ui.form .error :focus::-webkit-input-placeholder { color: rgba(255, 80, 80, 0.7); } .ui.form .error :focus::-moz-placeholder { color: rgba(255, 80, 80, 0.7); } /*-------------------- Disabled ---------------------*/ .ui.form .field :disabled, .ui.form .field.disabled { opacity: 0.5; } .ui.form .field.disabled label { opacity: 0.5; } .ui.form .field.disabled :disabled { opacity: 1; } /*-------------------- Loading State ---------------------*/ /* On Form */ .ui.form.loading { position: relative; } .ui.form.loading:after { position: absolute; top: 0%; left: 0%; content: ''; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8) url(../images/loader-large.gif) no-repeat 50% 50%; visibility: visible; } /******************************* Variations *******************************/ /*-------------------- Fluid Width ---------------------*/ .ui.form.fluid { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } /*-------------------------- Input w/ attached Button ---------------------------*/ .ui.form input.attached { width: auto; } /*-------------------- Date Input ---------------------*/ .ui.form .date.field > label { position: relative; } .ui.form .date.field > label:after { position: absolute; top: 2em; right: 0.5em; font-family: 'Icons'; content: '\f133'; font-size: 1.2em; font-weight: normal; color: #CCCCCC; } /*-------------------- Inverted Colors ---------------------*/ .ui.inverted.form label { color: #FFFFFF; } .ui.inverted.form .field.error textarea, .ui.inverted.form .field.error input[type="text"], .ui.inverted.form .field.error input[type="email"], .ui.inverted.form .field.error input[type="date"], .ui.inverted.form .field.error input[type="password"], .ui.inverted.form .field.error input[type="number"], .ui.inverted.form .field.error input[type="url"], .ui.inverted.form .field.error input[type="tel"] { background-color: #FFCCCC; } .ui.inverted.form .ui.checkbox label { color: rgba(255, 255, 255, 0.8); } .ui.inverted.form .ui.checkbox label:hover, .ui.inverted.form .ui.checkbox .box:hover { color: #FFFFFF; } /*-------------------- Field Groups ---------------------*/ /* Grouped Vertically */ .ui.form .grouped.fields { margin: 0em 0em 1em; } .ui.form .grouped.fields .field { display: block; float: none; margin: 0.5em 0em; padding: 0em; } /*-------------------- Fields ---------------------*/ /* Split fields */ .ui.form .fields { clear: both; } .ui.form .fields:after { content: ' '; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .ui.form .fields > .field { clear: none; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.form .fields > .field:first-child { border-left: none; -webkit-box-shadow: none; box-shadow: none; } /* Other Combinations */ .ui.form .two.fields > .fields, .ui.form .two.fields > .field { width: 50%; padding-left: 1%; padding-right: 1%; } .ui.form .three.fields > .fields, .ui.form .three.fields > .field { width: 33.333%; padding-left: 1%; padding-right: 1%; } .ui.form .four.fields > .fields, .ui.form .four.fields > .field { width: 25%; padding-left: 1%; padding-right: 1%; } .ui.form .five.fields > .fields, .ui.form .five.fields > .field { width: 20%; padding-left: 1%; padding-right: 1%; } .ui.form .fields .field:first-child { padding-left: 0%; } .ui.form .fields .field:last-child { padding-right: 0%; } /* Fields grid support */ .ui.form .fields .wide.field { width: 6.25%; padding-left: 1%; padding-right: 1%; } .ui.form .fields .wide.field:first-child { padding-left: 0%; } .ui.form .fields .wide.field:last-child { padding-right: 0%; } .ui.form .fields > .one.wide.field { width: 6.25%; } .ui.form .fields > .two.wide.field { width: 12.5%; } .ui.form .fields > .three.wide.field { width: 18.75%; } .ui.form .fields > .four.wide.field { width: 25%; } .ui.form .fields > .five.wide.field { width: 31.25%; } .ui.form .fields > .six.wide.field { width: 37.5%; } .ui.form .fields > .seven.wide.field { width: 43.75%; } .ui.form .fields > .eight.wide.field { width: 50%; } .ui.form .fields > .nine.wide.field { width: 56.25%; } .ui.form .fields > .ten.wide.field { width: 62.5%; } .ui.form .fields > .eleven.wide.field { width: 68.75%; } .ui.form .fields > .twelve.wide.field { width: 75%; } .ui.form .fields > .thirteen.wide.field { width: 81.25%; } .ui.form .fields > .fourteen.wide.field { width: 87.5%; } .ui.form .fields > .fifteen.wide.field { width: 93.75%; } .ui.form .fields > .sixteen.wide.field { width: 100%; } /* Swap to full width on mobile */ @media only screen and (max-width: 767px) { .ui.form .two.fields > .fields, .ui.form .two.fields > .field, .ui.form .three.fields > .fields, .ui.form .three.fields > .field, .ui.form .four.fields > .fields, .ui.form .four.fields > .field, .ui.form .five.fields > .fields, .ui.form .five.fields > .field, .ui.form .fields > .two.wide.field, .ui.form .fields > .three.wide.field, .ui.form .fields > .four.wide.field, .ui.form .fields > .five.wide.field, .ui.form .fields > .six.wide.field, .ui.form .fields > .seven.wide.field, .ui.form .fields > .eight.wide.field, .ui.form .fields > .nine.wide.field, .ui.form .fields > .ten.wide.field, .ui.form .fields > .eleven.wide.field, .ui.form .fields > .twelve.wide.field, .ui.form .fields > .thirteen.wide.field, .ui.form .fields > .fourteen.wide.field, .ui.form .fields > .fifteen.wide.field, .ui.form .fields > .sixteen.wide.field { width: 100%; padding-left: 0%; padding-right: 0%; } } /*-------------------- Inline Fields ---------------------*/ .ui.form .inline.fields .field { min-height: 1.3em; margin-right: 0.5em; } .ui.form .inline.fields .field > label, .ui.form .inline.fields .field > p, .ui.form .inline.fields .field > input, .ui.form .inline.field > label, .ui.form .inline.field > p, .ui.form .inline.field > input { display: inline-block; width: auto; margin-top: 0em; margin-bottom: 0em; vertical-align: middle; font-size: 1em; } .ui.form .inline.fields .field > input, .ui.form .inline.field > input { font-size: 0.875em; } .ui.form .inline.fields .field > :first-child, .ui.form .inline.field > :first-child { margin: 0em 0.5em 0em 0em; } .ui.form .inline.fields .field > :only-child, .ui.form .inline.field > :only-child { margin: 0em; } /*-------------------- Sizes ---------------------*/ /* Standard */ .ui.small.form { font-size: 0.875em; } .ui.small.form textarea, .ui.small.form input[type="text"], .ui.small.form input[type="email"], .ui.small.form input[type="date"], .ui.small.form input[type="password"], .ui.small.form input[type="number"], .ui.small.form input[type="url"], .ui.small.form input[type="tel"], .ui.small.form label { font-size: 1em; } /* Large */ .ui.large.form { font-size: 1.125em; } /* * # Semantic - Grid * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Grid *******************************/ .ui.grid { display: block; text-align: left; font-size: 0em; margin: 0% -1.5%; padding: 0%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body > .ui.grid { margin-left: 0% !important; margin-right: 0% !important; } .ui.grid:after, .ui.row:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /*------------------- Columns --------------------*/ /* Standard 16 column */ .ui.grid > .column, .ui.grid > .row > .column { display: inline-block; text-align: left; font-size: 1rem; width: 6.25%; padding-left: 1.5%; padding-right: 1.5%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; vertical-align: top; } /* Vertical padding when no rows */ .ui.grid > .column { margin-top: 1rem; margin-bottom: 1rem; } /*------------------- Rows --------------------*/ .ui.grid > .row { display: block; width: 100% !important; margin-top: 1.5%; padding: 1rem 0% 0%; font-size: 0rem; } .ui.grid > .row:first-child { padding-top: 0rem; margin-top: 0rem; } /*------------------- Content --------------------*/ .ui.grid > .row > img, .ui.grid > .row > .column > img { max-width: 100%; } .ui.grid .column > .ui.segment:only-child { margin: 0em; } /******************************* Variations *******************************/ /*----------------------- Page Grid (Responsive) -------------------------*/ .ui.page.grid { min-width: 320px; margin-left: 0%; margin-right: 0%; } @media only screen and (max-width: 991px) { .ui.page.grid { padding: 0% 4%; } } @media only screen and (min-width: 992px) { .ui.page.grid { padding: 0% 8%; } } @media only screen and (min-width: 1500px) { .ui.page.grid { padding: 0% 13%; } } @media only screen and (min-width: 1750px) { .ui.page.grid { padding: 0% 18%; } } @media only screen and (min-width: 2000px) { .ui.page.grid { padding: 0% 23%; } } /*------------------- Column Width --------------------*/ /* Sizing Combinations */ .ui.grid > .row > .one.wide.column, .ui.grid > .column.row > .one.wide.column, .ui.grid > .one.wide.column, .ui.column.grid > .one.wide.column { width: 6.25%; } .ui.grid > .row > .two.wide.column, .ui.grid > .column.row > .two.wide.column, .ui.grid > .two.wide.column, .ui.column.grid > .two.wide.column { width: 12.5%; } .ui.grid > .row > .three.wide.column, .ui.grid > .column.row > .three.wide.column, .ui.grid > .three.wide.column, .ui.column.grid > .three.wide.column { width: 18.75%; } .ui.grid > .row > .four.wide.column, .ui.grid > .column.row > .four.wide.column, .ui.grid > .four.wide.column, .ui.column.grid > .four.wide.column { width: 25%; } .ui.grid > .row > .five.wide.column, .ui.grid > .column.row > .five.wide.column, .ui.grid > .five.wide.column, .ui.column.grid > .five.wide.column { width: 31.25%; } .ui.grid > .row > .six.wide.column, .ui.grid > .column.row > .six.wide.column, .ui.grid > .six.wide.column, .ui.column.grid > .six.wide.column { width: 37.5%; } .ui.grid > .row > .seven.wide.column, .ui.grid > .column.row > .seven.wide.column, .ui.grid > .seven.wide.column, .ui.column.grid > .seven.wide.column { width: 43.75%; } .ui.grid > .row > .eight.wide.column, .ui.grid > .column.row > .eight.wide.column, .ui.grid > .eight.wide.column, .ui.column.grid > .eight.wide.column { width: 50%; } .ui.grid > .row > .nine.wide.column, .ui.grid > .column.row > .nine.wide.column, .ui.grid > .nine.wide.column, .ui.column.grid > .nine.wide.column { width: 56.25%; } .ui.grid > .row > .ten.wide.column, .ui.grid > .column.row > .ten.wide.column, .ui.grid > .ten.wide.column, .ui.column.grid > .ten.wide.column { width: 62.5%; } .ui.grid > .row > .eleven.wide.column, .ui.grid > .column.row > .eleven.wide.column, .ui.grid > .eleven.wide.column, .ui.column.grid > .eleven.wide.column { width: 68.75%; } .ui.grid > .row > .twelve.wide.column, .ui.grid > .column.row > .twelve.wide.column, .ui.grid > .twelve.wide.column, .ui.column.grid > .twelve.wide.column { width: 75%; } .ui.grid > .row > .thirteen.wide.column, .ui.grid > .column.row > .thirteen.wide.column, .ui.grid > .thirteen.wide.column, .ui.column.grid > .thirteen.wide.column { width: 81.25%; } .ui.grid > .row > .fourteen.wide.column, .ui.grid > .column.row > .fourteen.wide.column, .ui.grid > .fourteen.wide.column, .ui.column.grid > .fourteen.wide.column { width: 87.5%; } .ui.grid > .row > .fifteen.wide.column, .ui.grid > .column.row > .fifteen.wide.column, .ui.grid > .fifteen.wide.column, .ui.column.grid > .fifteen.wide.column { width: 93.75%; } .ui.grid > .row > .sixteen.wide.column, .ui.grid > .column.row > .sixteen.wide.column, .ui.grid > .sixteen.wide.column, .ui.column.grid > .sixteen.wide.column { width: 100%; } /*------------------- Column Count --------------------*/ /* Assume full width with one column */ .ui.one.column.grid > .row > .column, .ui.one.column.grid > .column, .ui.grid > .one.column.row > .column { width: 100%; } .ui.two.column.grid > .row > .column, .ui.two.column.grid > .column, .ui.grid > .two.column.row > .column { width: 50%; } .ui.three.column.grid > .row > .column, .ui.three.column.grid > .column, .ui.grid > .three.column.row > .column { width: 33.3333%; } .ui.four.column.grid > .row > .column, .ui.four.column.grid > .column, .ui.grid > .four.column.row > .column { width: 25%; } .ui.five.column.grid > .row > .column, .ui.five.column.grid > .column, .ui.grid > .five.column.row > .column { width: 20%; } .ui.six.column.grid > .row > .column, .ui.six.column.grid > .column, .ui.grid > .six.column.row > .column { width: 16.66667%; } .ui.seven.column.grid > .row > .column, .ui.seven.column.grid > .column, .ui.grid > .seven.column.row > .column { width: 14.2857%; } .ui.eight.column.grid > .row > .column, .ui.eight.column.grid > .column, .ui.grid > .eight.column.row > .column { width: 12.5%; } .ui.nine.column.grid > .row > .column, .ui.nine.column.grid > .column, .ui.grid > .nine.column.row > .column { width: 11.1111%; } .ui.ten.column.grid > .row > .column, .ui.ten.column.grid > .column, .ui.grid > .ten.column.row > .column { width: 10%; } .ui.eleven.column.grid > .row > .column, .ui.eleven.column.grid > .column, .ui.grid > .eleven.column.row > .column { width: 9.0909%; } .ui.twelve.column.grid > .row > .column, .ui.twelve.column.grid > .column, .ui.grid > .twelve.column.row > .column { width: 8.3333%; } .ui.thirteen.column.grid > .row > .column, .ui.thirteen.column.grid > .column, .ui.grid > .thirteen.column.row > .column { width: 7.6923%; } .ui.fourteen.column.grid > .row > .column, .ui.fourteen.column.grid > .column, .ui.grid > .fourteen.column.row > .column { width: 7.1428%; } .ui.fifteen.column.grid > .row > .column, .ui.fifteen.column.grid > .column, .ui.grid > .fifteen.column.row > .column { width: 6.6666%; } .ui.sixteen.column.grid > .row > .column, .ui.sixteen.column.grid > .column, .ui.grid > .sixteen.column.row > .column { width: 6.25%; } /* Assume full width with one column */ .ui.grid > .column:only-child, .ui.grid > .row > .column:only-child { width: 100%; } /*---------------------- Relaxed -----------------------*/ .ui.relaxed.grid { margin: 0% -2.5%; } .ui.relaxed.grid > .column, .ui.relaxed.grid > .row > .column { padding-left: 2.5%; padding-right: 2.5%; } /*---------------------- "Floated" -----------------------*/ .ui.grid .left.floated.column { float: left; } .ui.grid .right.floated.column { float: right; } /*---------------------- Divided -----------------------*/ .ui.divided.grid, .ui.divided.grid > .row { display: table; width: 100%; margin-left: 0% !important; margin-right: 0% !important; } .ui.divided.grid > .column:not(.row), .ui.divided.grid > .row > .column { display: table-cell; -webkit-box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.1), -2px 0px 0px 0px rgba(255, 255, 255, 0.8); box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.1), -2px 0px 0px 0px rgba(255, 255, 255, 0.8); } .ui.divided.grid > .column.row { display: table; } .ui.divided.grid > .column:first-child, .ui.divided.grid > .row > .column:first-child { -webkit-box-shadow: none; box-shadow: none; } /* Vertically Divided */ .ui.vertically.divided.grid > .row { -webkit-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1), 0px -2px 0px 0px rgba(255, 255, 255, 0.8) !important; box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1), 0px -2px 0px 0px rgba(255, 255, 255, 0.8) !important; } .ui.vertically.divided.grid > .row > .column, .ui.vertically.divided.grid > .column:not(.row), .ui.vertically.divided.grid > .row:first-child { -webkit-box-shadow: none !important; box-shadow: none !important; } /*---------------------- Celled -----------------------*/ .ui.celled.grid { display: table; width: 100%; margin-left: 0% !important; margin-right: 0% !important; -webkit-box-shadow: 0px 0px 0px 1px #DFDFDF; box-shadow: 0px 0px 0px 1px #DFDFDF; } .ui.celled.grid > .row, .ui.celled.grid > .column.row, .ui.celled.grid > .column.row:first-child { display: table; width: 100%; margin-top: 0em; padding-top: 0em; -webkit-box-shadow: 0px -1px 0px 0px #dfdfdf; box-shadow: 0px -1px 0px 0px #dfdfdf; } .ui.celled.grid > .column:not(.row), .ui.celled.grid > .row > .column { display: table-cell; padding: 0.75em; -webkit-box-shadow: -1px 0px 0px 0px #dfdfdf; box-shadow: -1px 0px 0px 0px #dfdfdf; } .ui.celled.grid > .column:first-child, .ui.celled.grid > .row > .column:first-child { -webkit-box-shadow: none; box-shadow: none; } .ui.celled.page.grid { -webkit-box-shadow: none; box-shadow: none; } /*---------------------- Horizontally Centered -----------------------*/ /* Vertical Centered */ .ui.left.aligned.grid, .ui.left.aligned.grid > .row > .column, .ui.left.aligned.grid > .column, .ui.grid .left.aligned.column, .ui.grid > .left.aligned.row > .column { text-align: left; } .ui.center.aligned.grid, .ui.center.aligned.grid > .row > .column, .ui.center.aligned.grid > .column, .ui.grid .center.aligned.column, .ui.grid > .center.aligned.row > .column { text-align: center; } .ui.right.aligned.grid, .ui.right.aligned.grid > .row > .column, .ui.right.aligned.grid > .column, .ui.grid .right.aligned.column, .ui.grid > .right.aligned.row > .column { text-align: right; } .ui.justified.grid, .ui.justified.grid > .row > .column, .ui.justified.grid > .column, .ui.grid .justified.column, .ui.grid > .justified.row > .column { text-align: justify; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } /*---------------------- Vertically Centered -----------------------*/ /* Vertical Centered */ .ui.top.aligned.grid, .ui.top.aligned.grid > .row > .column, .ui.top.aligned.grid > .column, .ui.grid .top.aligned.column, .ui.grid > .top.aligned.row > .column { vertical-align: top; } .ui.middle.aligned.grid, .ui.middle.aligned.grid > .row > .column, .ui.middle.aligned.grid > .column, .ui.grid .middle.aligned.column, .ui.grid > .middle.aligned.row > .column { vertical-align: middle; } .ui.bottom.aligned.grid, .ui.bottom.aligned.grid > .row > .column, .ui.bottom.aligned.grid > .column, .ui.grid .bottom.aligned.column, .ui.grid > .bottom.aligned.row > .column { vertical-align: bottom; } /*---------------------- Equal Height Columns -----------------------*/ .ui.grid > .equal.height.row { display: table; width: 100%; } .ui.grid > .equal.height.row > .column { display: table-cell; } /*---------------------- Only (Device) -----------------------*/ /* Mobile Only */ @media only screen and (max-width: 767px) { .ui.mobile.only.grid, .ui.grid > .mobile.only.row { display: block !important; } .ui.grid > .row > .mobile.only.column { display: inline-block !important; } .ui.divided.mobile.only.grid, .ui.celled.mobile.only.grid, .ui.divided.mobile.only.grid .row, .ui.celled.mobile.only.grid .row, .ui.divided.grid .mobile.only.row, .ui.celled.grid .mobile.only.row, .ui.grid .mobile.only.equal.height.row, .ui.mobile.only.grid .equal.height.row { display: table !important; } .ui.divided.grid > .row > .mobile.only.column, .ui.celled.grid > .row > .mobile.only.column, .ui.divided.mobile.only.grid > .row > .column, .ui.celled.mobile.only.grid > .row > .column, .ui.divided.mobile.only.grid > .column, .ui.celled.mobile.only.grid > .column { display: table-cell !important; } } @media only screen and (min-width: 768px) { .ui.mobile.only.grid, .ui.grid > .mobile.only.row, .ui.grid > .mobile.only.column, .ui.grid > .row > .mobile.only.column { display: none; } } /* Tablet Only */ @media only screen and (min-width: 768px) and (max-width: 991px) { .ui.tablet.only.grid, .ui.grid > .tablet.only.row { display: block !important; } .ui.grid > .row > .tablet.only.column { display: inline-block !important; } .ui.divided.tablet.only.grid, .ui.celled.tablet.only.grid, .ui.divided.tablet.only.grid .row, .ui.celled.tablet.only.grid .row, .ui.divided.grid .tablet.only.row, .ui.celled.grid .tablet.only.row, .ui.grid .tablet.only.equal.height.row, .ui.tablet.only.grid .equal.height.row { display: table !important; } .ui.divided.grid > .row > .tablet.only.column, .ui.celled.grid > .row > .tablet.only.column, .ui.divided.tablet.only.grid > .row > .column, .ui.celled.tablet.only.grid > .row > .column, .ui.divided.tablet.only.grid > .column, .ui.celled.tablet.only.grid > .column { display: table-cell !important; } } @media only screen and (max-width: 767px), (min-width: 992px) { .ui.tablet.only.grid, .ui.grid > .tablet.only.row, .ui.grid > .tablet.only.column, .ui.grid > .row > .tablet.only.column { display: none; } } /* Computer Only */ @media only screen and (min-width: 992px) { .ui.computer.only.grid, .ui.grid > .computer.only.row { display: block !important; } .ui.grid > .row > .computer.only.column { display: inline-block !important; } .ui.divided.computer.only.grid, .ui.celled.computer.only.grid, .ui.divided.computer.only.grid .row, .ui.celled.computer.only.grid .row, .ui.divided.grid .computer.only.row, .ui.celled.grid .computer.only.row, .ui.grid .computer.only.equal.height.row, .ui.computer.only.grid .equal.height.row { display: table !important; } .ui.divided.grid > .row > .computer.only.column, .ui.celled.grid > .row > .computer.only.column, .ui.divided.computer.only.grid > .row > .column, .ui.celled.computer.only.grid > .row > .column, .ui.divided.computer.only.grid > .column, .ui.celled.computer.only.grid > .column { display: table-cell !important; } } @media only screen and (max-width: 991px) { .ui.computer.only.grid, .ui.grid > .computer.only.row, .ui.grid > .computer.only.column, .ui.grid > .row > .computer.only.column { display: none; } } /*------------------- Doubling --------------------*/ /* Mobily Only */ @media only screen and (max-width: 767px) { .ui.two.column.doubling.grid > .row > .column, .ui.two.column.doubling.grid > .column, .ui.grid > .two.column.doubling.row > .column { width: 100%; } .ui.three.column.doubling.grid > .row > .column, .ui.three.column.doubling.grid > .column, .ui.grid > .three.column.doubling.row > .column { width: 100%; } .ui.four.column.doubling.grid > .row > .column, .ui.four.column.doubling.grid > .column, .ui.grid > .four.column.doubling.row > .column { width: 100%; } .ui.five.column.doubling.grid > .row > .column, .ui.five.column.doubling.grid > .column, .ui.grid > .five.column.doubling.row > .column { width: 100%; } .ui.six.column.doubling.grid > .row > .column, .ui.six.column.doubling.grid > .column, .ui.grid > .six.column.doubling.row > .column { width: 50%; } .ui.seven.column.doubling.grid > .row > .column, .ui.seven.column.doubling.grid > .column, .ui.grid > .seven.column.doubling.row > .column { width: 50%; } .ui.eight.column.doubling.grid > .row > .column, .ui.eight.column.doubling.grid > .column, .ui.grid > .eight.column.doubling.row > .column { width: 50%; } .ui.nine.column.doubling.grid > .row > .column, .ui.nine.column.doubling.grid > .column, .ui.grid > .nine.column.doubling.row > .column { width: 50%; } .ui.ten.column.doubling.grid > .row > .column, .ui.ten.column.doubling.grid > .column, .ui.grid > .ten.column.doubling.row > .column { width: 50%; } .ui.twelve.column.doubling.grid > .row > .column, .ui.twelve.column.doubling.grid > .column, .ui.grid > .twelve.column.doubling.row > .column { width: 33.3333333333333%; } .ui.fourteen.column.doubling.grid > .row > .column, .ui.fourteen.column.doubling.grid > .column, .ui.grid > .fourteen.column.doubling.row > .column { width: 33.3333333333333%; } .ui.sixteen.column.doubling.grid > .row > .column, .ui.sixteen.column.doubling.grid > .column, .ui.grid > .sixteen.column.doubling.row > .column { width: 25%; } } /* Tablet Only */ @media only screen and (min-width: 768px) and (max-width: 991px) { .ui.two.column.doubling.grid > .row > .column, .ui.two.column.doubling.grid > .column, .ui.grid > .two.column.doubling.row > .column { width: 100%; } .ui.three.column.doubling.grid > .row > .column, .ui.three.column.doubling.grid > .column, .ui.grid > .three.column.doubling.row > .column { width: 50%; } .ui.four.column.doubling.grid > .row > .column, .ui.four.column.doubling.grid > .column, .ui.grid > .four.column.doubling.row > .column { width: 50%; } .ui.five.column.doubling.grid > .row > .column, .ui.five.column.doubling.grid > .column, .ui.grid > .five.column.doubling.row > .column { width: 33.3333333%; } .ui.six.column.doubling.grid > .row > .column, .ui.six.column.doubling.grid > .column, .ui.grid > .six.column.doubling.row > .column { width: 33.3333333%; } .ui.eight.column.doubling.grid > .row > .column, .ui.eight.column.doubling.grid > .column, .ui.grid > .eight.column.doubling.row > .column { width: 33.3333333%; } .ui.eight.column.doubling.grid > .row > .column, .ui.eight.column.doubling.grid > .column, .ui.grid > .eight.column.doubling.row > .column { width: 25%; } .ui.nine.column.doubling.grid > .row > .column, .ui.nine.column.doubling.grid > .column, .ui.grid > .nine.column.doubling.row > .column { width: 25%; } .ui.ten.column.doubling.grid > .row > .column, .ui.ten.column.doubling.grid > .column, .ui.grid > .ten.column.doubling.row > .column { width: 20%; } .ui.twelve.column.doubling.grid > .row > .column, .ui.twelve.column.doubling.grid > .column, .ui.grid > .twelve.column.doubling.row > .column { width: 16.6666666%; } .ui.fourteen.column.doubling.grid > .row > .column, .ui.fourteen.column.doubling.grid > .column, .ui.grid > .fourteen.column.doubling.row > .column { width: 14.28571428571429%; } .ui.sixteen.column.doubling.grid > .row > .column, .ui.sixteen.column.doubling.grid > .column, .ui.grid > .sixteen.column.doubling.row > .column { width: 12.5%; } } /*------------------- Stackable --------------------*/ @media only screen and (max-width: 767px) { .ui.stackable.grid { display: block !important; padding: 0em; margin: 0em; } .ui.stackable.grid > .row > .column, .ui.stackable.grid > .column { display: block !important; width: auto !important; margin: 1em 0em 0em !important; padding: 1em 0em 0em !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .ui.stackable.divided.grid .column, .ui.stackable.celled.grid .column { border-top: 1px dotted rgba(0, 0, 0, 0.1); } .ui.stackable.grid > .row:first-child > .column:first-child, .ui.stackable.grid > .column:first-child { margin-top: 0em !important; padding-top: 0em !important; } .ui.stackable.divided.grid > .row:first-child > .column:first-child, .ui.stackable.celled.grid > .row:first-child > .column:first-child, .ui.stackable.divided.grid > .column:first-child, .ui.stackable.celled.grid > .column:first-child { border-top: none !important; } .ui.stackable.page.grid > .row > .column, .ui.stackable.page.grid > .column { padding-left: 1em !important; padding-right: 1em !important; } /* Remove pointers from vertical menus */ .ui.stackable.grid .vertical.pointing.menu .item:after { display: none; } } /* * # Semantic - Menu * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Standard *******************************/ /*-------------- Menu ---------------*/ .ui.menu { margin: 1rem 0rem; background-color: #FFFFFF; font-size: 0px; font-weight: normal; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); border-radius: 0.1875rem; } .ui.menu:first-child { margin-top: 0rem; } .ui.menu:last-child { margin-bottom: 0rem; } .ui.menu:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .ui.menu > .item:first-child { border-radius: 0.1875em 0px 0px 0.1875em; } .ui.menu > .item:last-child { border-radius: 0px 0.1875em 0.1875em 0px; } .ui.menu .item { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); vertical-align: middle; line-height: 1; text-decoration: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-transition: opacity 0.2s ease, background 0.2s ease, -webkit-box-shadow 0.2s ease; -moz-transition: opacity 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; transition: opacity 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } /*-------------- Colors ---------------*/ /* Text Color */ .ui.menu .item, .ui.menu .item > a:not(.button) { color: rgba(0, 0, 0, 0.75); } .ui.menu .item .item, .ui.menu .item .item > a:not(.button) { color: rgba(30, 30, 30, 0.7); } .ui.menu .item .item .item, .ui.menu .item .item .item > a:not(.button) { color: rgba(30, 30, 30, 0.6); } .ui.menu .dropdown .menu .item, .ui.menu .dropdown .menu .item a:not(.button) { color: rgba(0, 0, 0, 0.75); } /* Hover */ .ui.menu .item .menu a.item:hover, .ui.menu .item .menu .link.item:hover { color: rgba(0, 0, 0, 0.85); } .ui.menu .dropdown .menu .item a:not(.button):hover { color: rgba(0, 0, 0, 0.85); } /* Active */ .ui.menu .active.item, .ui.menu .active.item a:not(.button) { color: rgba(0, 0, 0, 0.85); border-radius: 0px; } /*-------------- Items ---------------*/ .ui.menu .item { position: relative; display: inline-block; padding: 0.83em 0.95em; border-top: 0em solid rgba(0, 0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .ui.menu .menu { margin: 0em; } .ui.menu .item.left, .ui.menu .menu.left { float: left; } .ui.menu .item.right, .ui.menu .menu.right { float: right; } /*-------------- Borders ---------------*/ .ui.menu .item:before { position: absolute; content: ''; top: 0%; left: 0px; width: 1px; height: 100%; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.05)), color-stop(50%, rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.05))); background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.05) 100%); background-image: -moz-linear-gradient(rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.05) 100%); background-image: linear-gradient(rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.05) 100%); } .ui.menu > .menu:not(.right):first-child > .item:first-child:before, .ui.menu .item:first-child:before { display: none; } .ui.menu .menu.right .item:before, .ui.menu .item.right:before { right: auto; left: 0px; } /*-------------- Text Content ---------------*/ .ui.menu .text.item > *, .ui.menu .item > p:only-child { -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; line-height: 1.3; color: rgba(0, 0, 0, 0.6); } .ui.menu .item > p:first-child { margin-top: 0px; } .ui.menu .item > p:last-child { margin-bottom: 0px; } /*-------------- Button ---------------*/ .ui.menu:not(.vertical) .item > .button { position: relative; top: -0.05em; margin: -0.55em 0; padding-bottom: 0.55em; padding-top: 0.55em; font-size: 0.875em; } /*-------------- Inputs ---------------*/ .ui.menu:not(.vertical) .item > .input { margin-top: -0.85em; margin-bottom: -0.85em; padding-top: 0.3em; padding-bottom: 0.3em; width: 100%; vertical-align: top; } .ui.menu .item > .input input { padding-top: 0.35em; padding-bottom: 0.35em; } .ui.vertical.menu .item > .input input { margin: 0em; padding-top: 0.63em; padding-bottom: 0.63em; } /* Action Input */ .ui.menu:not(.vertical) .item > .button.labeled > .icon { padding-top: 0.6em; } .ui.menu:not(.vertical) .item .action.input > .button { font-size: 0.8em; padding: 0.55em 0.8em; } /* Resizes */ .ui.small.menu:not(.vertical) .item > .input input { padding-top: 0.4em; padding-bottom: 0.4em; } .ui.large.menu:not(.vertical) .item > .input input { top: -0.125em; padding-bottom: 0.6em; padding-top: 0.6em; } .ui.large.menu:not(.vertical) .item .action.input > .button { font-size: 0.8em; padding: 0.9em; } .ui.large.menu:not(.vertical) .item .action.input > .button > .icon { padding-top: 0.8em; } /*-------------- Header ---------------*/ .ui.menu .header.item { background-color: rgba(0, 0, 0, 0.04); margin: 0em; } .ui.vertical.menu .header.item { font-weight: bold; } /*-------------- Dropdowns ---------------*/ .ui.menu .dropdown .menu .item .icon { float: none; margin: 0em 0.75em 0em 0em; } .ui.menu .dropdown.item .menu { left: 1px; margin: 0px; min-width: -webkit-calc(99%); min-width: -moz-calc(99%); min-width: calc(99%); -webkit-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.1); } .ui.secondary.menu .dropdown.item .menu { left: 0px; min-width: 100%; } .ui.menu .pointing.dropdown.item .menu { margin-top: 0.75em; } .ui.menu .simple.dropdown.item .menu { margin: 0px !important; } .ui.menu .dropdown.item .menu .item { width: 100%; color: rgba(0, 0, 0, 0.75); } .ui.menu .dropdown.item .menu .active.item { -webkit-box-shadow: none !important; box-shadow: none !important; } .ui.menu .ui.dropdown .menu .item:before { display: none; } /*-------------- Labels ---------------*/ .ui.menu .item > .label { background-color: rgba(0, 0, 0, 0.35); color: #FFFFFF; margin: -0.15em 0em -0.15em 0.5em; padding: 0.3em 0.8em; vertical-align: baseline; } .ui.menu .item > .floating.label { padding: 0.3em 0.8em; } /*-------------- Images ---------------*/ .ui.menu .item > img:only-child { display: block; max-width: 100%; margin: 0em auto; } /******************************* States *******************************/ /*-------------- Hover ---------------*/ .ui.link.menu .item:hover, .ui.menu .link.item:hover, .ui.menu a.item:hover, .ui.menu .ui.dropdown .menu .item:hover { cursor: pointer; background-color: rgba(0, 0, 0, 0.02); } .ui.menu .ui.dropdown.item.active { background-color: rgba(0, 0, 0, 0.02); -webkit-box-shadow: none; box-shadow: none; -moz-border-bottom-right-radius: 0em; border-bottom-right-radius: 0em; -moz-border-bottom-left-radius: 0em; border-bottom-left-radius: 0em; } /*-------------- Down ---------------*/ .ui.link.menu .item:active, .ui.menu .link.item:active, .ui.menu a.item:active, .ui.menu .ui.dropdown .menu .item:active { background-color: rgba(0, 0, 0, 0.05); } /*-------------- Active ---------------*/ .ui.menu .active.item { background-color: rgba(0, 0, 0, 0.01); color: rgba(0, 0, 0, 0.95); -webkit-box-shadow: 0em 0.2em 0em inset; box-shadow: 0em 0.2em 0em inset; } .ui.vertical.menu .active.item { border-radius: 0em; -webkit-box-shadow: 0.2em 0em 0em inset; box-shadow: 0.2em 0em 0em inset; } .ui.vertical.menu > .active.item:first-child { border-radius: 0em 0.1875em 0em 0em; } .ui.vertical.menu > .active.item:last-child { border-radius: 0em 0em 0.1875em 0em; } .ui.vertical.menu > .active.item:only-child { border-radius: 0em 0.1875em 0.1875em 0em; } .ui.vertical.menu .active.item .menu .active.item { border-left: none; } .ui.vertical.menu .active.item .menu .active.item { padding-left: 1.5rem; } .ui.vertical.menu .item .menu .active.item { background-color: rgba(0, 0, 0, 0.03); -webkit-box-shadow: none; box-shadow: none; } /*-------------- Disabled ---------------*/ .ui.menu .item.disabled, .ui.menu .item.disabled:hover { cursor: default; color: rgba(0, 0, 0, 0.2); background-color: transparent !important; } /*-------------------- Loading ---------------------*/ /* On Form */ .ui.menu.loading { position: relative; } .ui.menu.loading:after { position: absolute; top: 0%; left: 0%; content: ''; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8) url(../images/loader-large.gif) no-repeat 50% 50%; visibility: visible; } /******************************* Types *******************************/ /*-------------- Vertical ---------------*/ .ui.vertical.menu .item { display: block; height: auto !important; border-top: none; border-left: 0em solid rgba(0, 0, 0, 0); border-right: none; } .ui.vertical.menu > .item:first-child { border-radius: 0.1875em 0.1875em 0px 0px; } .ui.vertical.menu > .item:last-child { border-radius: 0px 0px 0.1875em 0.1875em; } .ui.vertical.menu .item > .label { float: right; text-align: center; } .ui.vertical.menu .item > i.icon { float: right; width: 1.22em; margin: 0em 0em 0em 0.5em; } .ui.vertical.menu .item > .label + i.icon { float: none; margin: 0em 0.25em 0em 0em; } /*--- Border ---*/ .ui.vertical.menu .item:before { position: absolute; content: ''; top: 0%; left: 0px; width: 100%; height: 1px; background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%); background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%); background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.03)), color-stop(1.5em, rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.03))); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%); } .ui.vertical.menu .item:first-child:before { background-image: none !important; } /*--- Dropdown ---*/ .ui.vertical.menu .dropdown.item > i { float: right; content: "\f0da"; } .ui.vertical.menu .dropdown.item .menu { top: 0% !important; left: 100%; margin: 0px 0px 0px 1px; -webkit-box-shadow: 0 0px 1px 1px #DDDDDD; box-shadow: 0 0px 1px 1px #DDDDDD; } .ui.vertical.menu .dropdown.item.active { border-top-right-radius: 0em; border-bottom-right-radius: 0em; } .ui.vertical.menu .dropdown.item .menu .item { font-size: 1rem; } .ui.vertical.menu .dropdown.item .menu .item i.icon { margin-right: 0em; } .ui.vertical.menu .dropdown.item.active { -webkit-box-shadow: none; box-shadow: none; } /*--- Sub Menu ---*/ .ui.vertical.menu .item > .menu { margin: 0.5em -0.95em 0em; } .ui.vertical.menu .item > .menu > .item { padding: 0.5rem 1.5rem; font-size: 0.875em; } .ui.vertical.menu .item > .menu > .item:before { display: none; } /*-------------- Tiered ---------------*/ .ui.tiered.menu > .sub.menu > .item { color: rgba(0, 0, 0, 0.4); } .ui.tiered.menu > .menu > .item:hover { color: rgba(0, 0, 0, 0.8); } .ui.tiered.menu .item.active { color: rgba(0, 0, 0, 0.8); } .ui.tiered.menu > .menu .item.active:after { position: absolute; content: ''; margin-top: -1px; top: 100%; left: 0px; width: 100%; height: 2px; background-color: #FBFBFB; } .ui.tiered.menu .sub.menu { background-color: rgba(0, 0, 0, 0.01); border-radius: 0em; border-top: 1px solid rgba(0, 0, 0, 0.1); -webkit-box-shadow: none; box-shadow: none; color: #FFFFFF; } .ui.tiered.menu .sub.menu .item { font-size: 0.875rem; } .ui.tiered.menu .sub.menu .item:before { background-image: none; } .ui.tiered.menu .sub.menu .active.item { padding-top: 0.83em; background-color: transparent; border-radius: 0 0 0 0; border-top: medium none; -webkit-box-shadow: none; box-shadow: none; color: rgba(0, 0, 0, 0.7) !important; } .ui.tiered.menu .sub.menu .active.item:after { display: none; } /* Inverted */ .ui.inverted.tiered.menu > .menu > .item { color: rgba(255, 255, 255, 0.5); } .ui.inverted.tiered.menu .sub.menu { background-color: rgba(0, 0, 0, 0.2); } .ui.inverted.tiered.menu .sub.menu .item { color: rgba(255, 255, 255, 0.6); } .ui.inverted.tiered.menu > .menu > .item:hover { color: rgba(255, 255, 255, 0.9); } .ui.inverted.tiered.menu .active.item:after { display: none; } .ui.inverted.tiered.menu > .sub.menu > .active.item, .ui.inverted.tiered.menu > .menu > .active.item { color: #ffffff !important; -webkit-box-shadow: none; box-shadow: none; } /* Tiered pointing */ .ui.pointing.tiered.menu > .menu > .item:after { display: none; } .ui.pointing.tiered.menu > .sub.menu > .item:after { display: block; } /*-------------- Tabular ---------------*/ .ui.tabular.menu { background-color: transparent; border-bottom: 1px solid #DCDDDE; border-radius: 0em; -webkit-box-shadow: none !important; box-shadow: none !important; } .ui.tabular.menu .item { background-color: transparent; border-left: 1px solid transparent; border-right: 1px solid transparent; border-top: 1px solid transparent; padding-left: 1.4em; padding-right: 1.4em; color: rgba(0, 0, 0, 0.6); } .ui.tabular.menu .item:before { display: none; } /* Hover */ .ui.tabular.menu .item:hover { background-color: transparent; color: rgba(0, 0, 0, 0.8); } /* Active */ .ui.tabular.menu .active.item { position: relative; background-color: #FFFFFF; color: rgba(0, 0, 0, 0.8); border-color: #DCDDDE; font-weight: bold; margin-bottom: -1px; border-bottom: 1px solid #FFFFFF; -webkit-box-shadow: none; box-shadow: none; border-radius: 5px 5px 0 0; } /* Coupling with segment for attachment */ .ui.attached.tabular.menu { position: relative; z-index: 2; } .ui.tabular.menu ~ .bottom.attached.segment { margin: 1px 0px 0px 1px; } /*-------------- Pagination ---------------*/ .ui.pagination.menu { margin: 0em; display: inline-block; vertical-align: middle; } .ui.pagination.menu .item { min-width: 3em; text-align: center; } .ui.pagination.menu .icon.item i.icon { vertical-align: top; } .ui.pagination.menu.floated { display: block; } /* active */ .ui.pagination.menu .active.item { border-top: none; padding-top: 0.83em; background-color: rgba(0, 0, 0, 0.05); -webkit-box-shadow: none; box-shadow: none; } /*-------------- Secondary ---------------*/ .ui.secondary.menu { background-color: transparent; border-radius: 0px; -webkit-box-shadow: none; box-shadow: none; } .ui.secondary.menu > .menu > .item, .ui.secondary.menu > .item { -webkit-box-shadow: none; box-shadow: none; border: none; height: auto !important; margin: 0em 0.25em; padding: 0.5em 1em; border-radius: 0.3125em; } .ui.secondary.menu > .menu > .item:before, .ui.secondary.menu > .item:before { display: none !important; } .ui.secondary.menu .item > .input input { background-color: transparent; border: none; } .ui.secondary.menu .link.item, .ui.secondary.menu a.item { opacity: 0.8; -webkit-transition: none; -moz-transition: none; transition: none; } .ui.secondary.menu .header.item { border-right: 0.1em solid rgba(0, 0, 0, 0.1); background-color: transparent; border-radius: 0em; } /* hover */ .ui.secondary.menu .link.item:hover, .ui.secondary.menu a.item:hover { opacity: 1; } /* active */ .ui.secondary.menu > .menu > .active.item, .ui.secondary.menu > .active.item { background-color: rgba(0, 0, 0, 0.08); opacity: 1; -webkit-box-shadow: none; box-shadow: none; } .ui.secondary.vertical.menu > .active.item { border-radius: 0.3125em; } /* inverted */ .ui.secondary.inverted.menu .link.item, .ui.secondary.inverted.menu a.item { color: rgba(255, 255, 255, 0.5); } .ui.secondary.inverted.menu .link.item:hover, .ui.secondary.inverted.menu a.item:hover { color: rgba(255, 255, 255, 0.9); } .ui.secondary.inverted.menu .active.item { background-color: rgba(255, 255, 255, 0.1); } /* disable variations */ .ui.secondary.item.menu > .item { margin: 0em; } .ui.secondary.attached.menu { -webkit-box-shadow: none; box-shadow: none; } /*--------------------- Secondary Pointing -----------------------*/ .ui.secondary.pointing.menu { border-bottom: 3px solid rgba(0, 0, 0, 0.1); } .ui.secondary.pointing.menu > .menu > .item, .ui.secondary.pointing.menu > .item { margin: 0em 0em -3px; padding: 0.6em 0.95em; border-bottom: 3px solid rgba(0, 0, 0, 0); border-radius: 0em; -webkit-transition: color 0.2s ; -moz-transition: color 0.2s ; transition: color 0.2s ; } /* Item Types */ .ui.secondary.pointing.menu .header.item { margin-bottom: -3px; background-color: transparent !important; border-right-width: 0px !important; font-weight: bold !important; color: rgba(0, 0, 0, 0.8) !important; } .ui.secondary.pointing.menu .text.item { -webkit-box-shadow: none !important; box-shadow: none !important; } .ui.secondary.pointing.menu > .menu > .item:after, .ui.secondary.pointing.menu > .item:after { display: none; } /* Hover */ .ui.secondary.pointing.menu > .menu > .link.item:hover, .ui.secondary.pointing.menu > .link.item:hover, .ui.secondary.pointing.menu > .menu > a.item:hover, .ui.secondary.pointing.menu > a.item:hover { background-color: transparent; color: rgba(0, 0, 0, 0.7); } /* Down */ .ui.secondary.pointing.menu > .menu > .link.item:active, .ui.secondary.pointing.menu > .link.item:active, .ui.secondary.pointing.menu > .menu > a.item:active, .ui.secondary.pointing.menu > a.item:active { background-color: transparent; border-color: rgba(0, 0, 0, 0.2); } /* Active */ .ui.secondary.pointing.menu > .menu > .item.active, .ui.secondary.pointing.menu > .item.active { background-color: transparent; border-color: rgba(0, 0, 0, 0.4); -webkit-box-shadow: none; box-shadow: none; } /*--------------------- Secondary Vertical -----------------------*/ .ui.secondary.vertical.pointing.menu { border: none; border-right: 3px solid rgba(0, 0, 0, 0.1); } .ui.secondary.vertical.menu > .item { border: none; margin: 0em 0em 0.3em; padding: 0.6em 0.8em; border-radius: 0.1875em; } .ui.secondary.vertical.menu > .header.item { border-radius: 0em; } .ui.secondary.vertical.pointing.menu > .item { margin: 0em -3px 0em 0em; border-bottom: none; border-right: 3px solid transparent; border-radius: 0em; } /* Hover */ .ui.secondary.vertical.pointing.menu > .item:hover { background-color: transparent; color: rgba(0, 0, 0, 0.7); } /* Down */ .ui.secondary.vertical.pointing.menu > .item:active { background-color: transparent; border-color: rgba(0, 0, 0, 0.2); } /* Active */ .ui.secondary.vertical.pointing.menu > .item.active { background-color: transparent; border-color: rgba(0, 0, 0, 0.4); color: rgba(0, 0, 0, 0.85); } /*-------------- Inverted ---------------*/ .ui.secondary.inverted.menu { background-color: transparent; } .ui.secondary.inverted.pointing.menu { border-bottom: 3px solid rgba(255, 255, 255, 0.1); } .ui.secondary.inverted.pointing.menu > .item { color: rgba(255, 255, 255, 0.7); } .ui.secondary.inverted.pointing.menu > .header.item { color: #FFFFFF !important; } /* Hover */ .ui.secondary.inverted.pointing.menu > .menu > .item:hover, .ui.secondary.inverted.pointing.menu > .item:hover { color: rgba(255, 255, 255, 0.85); } /* Down */ .ui.secondary.inverted.pointing.menu > .menu > .item:active, .ui.secondary.inverted.pointing.menu > .item:active { border-color: rgba(255, 255, 255, 0.4); } /* Active */ .ui.secondary.inverted.pointing.menu > .menu > .item.active, .ui.secondary.inverted.pointing.menu > .item.active { border-color: rgba(255, 255, 255, 0.8); color: #ffffff; } /*--------------------- Inverted Vertical ----------------------*/ .ui.secondary.inverted.vertical.pointing.menu { border-right: 3px solid rgba(255, 255, 255, 0.1); border-bottom: none; } /*-------------- Text Menu ---------------*/ .ui.text.menu { background-color: transparent; margin: 1rem -1rem; border-radius: 0px; -webkit-box-shadow: none; box-shadow: none; } .ui.text.menu > .item { opacity: 0.8; margin: 0em 1em; padding: 0em; height: auto !important; border-radius: 0px; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: opacity 0.2s ease ; -moz-transition: opacity 0.2s ease ; transition: opacity 0.2s ease ; } .ui.text.menu > .item:before { display: none !important; } .ui.text.menu .header.item { background-color: transparent; opacity: 1; color: rgba(50, 50, 50, 0.8); font-size: 0.875rem; padding: 0em; text-transform: uppercase; font-weight: bold; } /*--- fluid text ---*/ .ui.text.item.menu .item { margin: 0em; } /*--- vertical text ---*/ .ui.vertical.text.menu { margin: 1rem 0em; } .ui.vertical.text.menu:first-child { margin-top: 0rem; } .ui.vertical.text.menu:last-child { margin-bottom: 0rem; } .ui.vertical.text.menu .item { float: left; clear: left; margin: 0.5em 0em; } .ui.vertical.text.menu .item > i.icon { float: none; margin: 0em 0.83em 0em 0em; } .ui.vertical.text.menu .header.item { margin: 0.8em 0em; } /*--- hover ---*/ .ui.text.menu .item:hover { opacity: 1; background-color: transparent; } /*--- active ---*/ .ui.text.menu .active.item { background-color: transparent; padding: 0em; border: none; opacity: 1; font-weight: bold; -webkit-box-shadow: none; box-shadow: none; } /* disable variations */ .ui.text.pointing.menu .active.item:after { -webkit-box-shadow: none; box-shadow: none; } .ui.text.attached.menu { -webkit-box-shadow: none; box-shadow: none; } .ui.inverted.text.menu, .ui.inverted.text.menu .item, .ui.inverted.text.menu .item:hover, .ui.inverted.text.menu .item.active { background-color: transparent; } /*-------------- Icon Only ---------------*/ .ui.icon.menu, .ui.vertical.icon.menu { width: auto; display: inline-block; height: auto; } .ui.icon.menu > .item { height: auto; text-align: center; color: rgba(60, 60, 60, 0.7); } .ui.icon.menu > .item > .icon { display: block; float: none !important; opacity: 1; margin: 0em auto !important; } .ui.icon.menu .icon:before { opacity: 1; } /* Item Icon Only */ .ui.menu .icon.item .icon { margin: 0em; } .ui.vertical.icon.menu { float: none; } /*--- inverted ---*/ .ui.inverted.icon.menu .item { color: rgba(255, 255, 255, 0.8); } .ui.inverted.icon.menu .icon { color: #ffffff; } /*-------------- Labeled Icon ---------------*/ .ui.labeled.icon.menu { text-align: center; } .ui.labeled.icon.menu > .item > .icon { display: block; font-size: 1.5em !important; margin: 0em auto 0.3em !important; } /******************************* Variations *******************************/ /*-------------- Colors ---------------*/ /*--- Light Colors ---*/ .ui.menu .green.active.item, .ui.green.menu .active.item { border-color: #A1CF64 !important; color: #A1CF64 !important; } .ui.menu .red.active.item, .ui.red.menu .active.item { border-color: #D95C5C !important; color: #D95C5C !important; } .ui.menu .blue.active.item, .ui.blue.menu .active.item { border-color: #6ECFF5 !important; color: #6ECFF5 !important; } .ui.menu .purple.active.item, .ui.purple.menu .active.item { border-color: #564F8A !important; color: #564F8A !important; } .ui.menu .orange.active.item, .ui.orange.menu .active.item { border-color: #F05940 !important; color: #F05940 !important; } .ui.menu .teal.active.item, .ui.teal.menu .active.item { border-color: #00B5AD !important; color: #00B5AD !important; } /*-------------- Inverted ---------------*/ .ui.inverted.menu { background-color: #333333; -webkit-box-shadow: none; box-shadow: none; } .ui.inverted.menu .header.item { margin: 0em; background-color: rgba(0, 0, 0, 0.3); -webkit-box-shadow: none; box-shadow: none; } .ui.inverted.menu .item, .ui.inverted.menu .item > a { color: #FFFFFF; } .ui.inverted.menu .item .item, .ui.inverted.menu .item .item > a { color: rgba(255, 255, 255, 0.8); } .ui.inverted.menu .dropdown .menu .item, .ui.inverted.menu .dropdown .menu .item a { color: rgba(0, 0, 0, 0.75) !important; } .ui.inverted.menu .item.disabled, .ui.inverted.menu .item.disabled:hover { color: rgba(255, 255, 255, 0.2); } /*--- Border ---*/ .ui.inverted.menu .item:before { background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.03) 100%); background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.03) 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.03)), color-stop(50%, rgba(255, 255, 255, 0.1)), to(rgba(255, 255, 255, 0.03))); background-image: linear-gradient(rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.03) 100%); } .ui.vertical.inverted.menu .item:before { background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.03) 100%); background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.03) 100%); background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.03)), color-stop(50%, rgba(255, 255, 255, 0.1)), to(rgba(255, 255, 255, 0.03))); background-image: linear-gradient(to right, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.03) 100%); } /*--- Hover ---*/ .ui.link.inverted.menu .item:hover, .ui.inverted.menu .link.item:hover, .ui.inverted.menu a.item:hover, .ui.inverted.menu .dropdown.item:hover { background-color: rgba(255, 255, 255, 0.1); } .ui.inverted.menu a.item:hover, .ui.inverted.menu .item > a:hover, .ui.inverted.menu .item .menu a.item:hover, .ui.inverted.menu .item .menu .link.item:hover { color: #ffffff; } /*--- Down ---*/ .ui.inverted.menu a.item:active, .ui.inverted.menu .dropdown.item:active, .ui.inverted.menu .link.item:active, .ui.inverted.menu a.item:active { background-color: rgba(255, 255, 255, 0.15); } /*--- Active ---*/ .ui.inverted.menu .active.item { -webkit-box-shadow: none !important; box-shadow: none !important; background-color: rgba(255, 255, 255, 0.2); } .ui.inverted.menu .active.item, .ui.inverted.menu .active.item a { color: #ffffff !important; } .ui.inverted.vertical.menu .item .menu .active.item { background-color: rgba(255, 255, 255, 0.2); color: #ffffff; } /*--- Pointers ---*/ .ui.inverted.pointing.menu .active.item:after { background-color: #5B5B5B; -webkit-box-shadow: none; box-shadow: none; } .ui.inverted.pointing.menu .active.item:hover:after { background-color: #4A4A4A; } /*-------------- Selection ---------------*/ .ui.selection.menu > .item { color: rgba(0, 0, 0, 0.4); } .ui.selection.menu > .item:hover { color: rgba(0, 0, 0, 0.6); } .ui.selection.menu > .item.active { color: rgba(0, 0, 0, 0.85); } .ui.inverted.selection.menu > .item { color: rgba(255, 255, 255, 0.4); } .ui.inverted.selection.menu > .item:hover { color: rgba(255, 255, 255, 0.9); } .ui.inverted.selection.menu > .item.active { color: #FFFFFF; } /*-------------- Floated ---------------*/ .ui.floated.menu { float: left; margin: 0rem 0.5rem 0rem 0rem; } .ui.right.floated.menu { float: right; margin: 0rem 0rem 0rem 0.5rem; } /*-------------- Inverted Colors ---------------*/ /*--- Light Colors ---*/ .ui.grey.menu { background-color: #F0F0F0; } /*--- Inverted Colors ---*/ .ui.inverted.green.menu { background-color: #A1CF64; } .ui.inverted.green.pointing.menu .active.item:after { background-color: #A1CF64; } .ui.inverted.red.menu { background-color: #D95C5C; } .ui.inverted.red.pointing.menu .active.item:after { background-color: #F16883; } .ui.inverted.blue.menu { background-color: #6ECFF5; } .ui.inverted.blue.pointing.menu .active.item:after { background-color: #6ECFF5; } .ui.inverted.purple.menu { background-color: #564F8A; } .ui.inverted.purple.pointing.menu .active.item:after { background-color: #564F8A; } .ui.inverted.orange.menu { background-color: #F05940; } .ui.inverted.orange.pointing.menu .active.item:after { background-color: #F05940; } .ui.inverted.teal.menu { background-color: #00B5AD; } .ui.inverted.teal.pointing.menu .active.item:after { background-color: #00B5AD; } /*-------------- Fitted ---------------*/ .ui.fitted.menu .item, .ui.fitted.menu .item .menu .item, .ui.menu .fitted.item { padding: 0em; } .ui.horizontally.fitted.menu .item, .ui.horizontally.fitted.menu .item .menu .item, .ui.menu .horizontally.fitted.item { padding-top: 0.83em; padding-bottom: 0.83em; } .ui.vertically.fitted.menu .item, .ui.vertically.fitted.menu .item .menu .item, .ui.menu .vertically.fitted.item { padding-left: 0.95em; padding-right: 0.95em; } /*-------------- Borderless ---------------*/ .ui.borderless.menu .item:before, .ui.borderless.menu .item .menu .item:before, .ui.menu .borderless.item:before { background-image: none; } /*------------------- Compact --------------------*/ .ui.compact.menu { display: inline-block; margin: 0em; vertical-align: middle; } .ui.compact.vertical.menu { width: auto !important; } .ui.compact.vertical.menu .item:last-child::before { display: block; } /*------------------- Fluid --------------------*/ .ui.menu.fluid, .ui.vertical.menu.fluid { display: block; width: 100% !important; } /*------------------- Evenly Sized --------------------*/ .ui.item.menu, .ui.item.menu .item { width: 100%; padding-left: 0px !important; padding-right: 0px !important; text-align: center; } .ui.menu.two.item .item { width: 50%; } .ui.menu.three.item .item { width: 33.333%; } .ui.menu.four.item .item { width: 25%; } .ui.menu.five.item .item { width: 20%; } .ui.menu.six.item .item { width: 16.666%; } .ui.menu.seven.item .item { width: 14.285%; } .ui.menu.eight.item .item { width: 12.500%; } .ui.menu.nine.item .item { width: 11.11%; } .ui.menu.ten.item .item { width: 10.0%; } .ui.menu.eleven.item .item { width: 9.09%; } .ui.menu.twelve.item .item { width: 8.333%; } /*-------------- Fixed ---------------*/ .ui.menu.fixed { position: fixed; z-index: 999; margin: 0em; border: none; width: 100%; } .ui.menu.fixed, .ui.menu.fixed .item:first-child, .ui.menu.fixed .item:last-child { border-radius: 0px !important; } .ui.menu.fixed.top { top: 0px; left: 0px; right: auto; bottom: auto; } .ui.menu.fixed.right { top: 0px; right: 0px; left: auto; bottom: auto; width: auto; height: 100%; } .ui.menu.fixed.bottom { bottom: 0px; left: 0px; top: auto; right: auto; } .ui.menu.fixed.left { top: 0px; left: 0px; right: auto; bottom: auto; width: auto; height: 100%; } /* Coupling with Grid */ .ui.fixed.menu + .ui.grid { padding-top: 2.75rem; } /*------------------- Pointing --------------------*/ .ui.pointing.menu .active.item:after { position: absolute; bottom: -0.3em; left: 50%; content: ""; margin-left: -0.3em; width: 0.6em; height: 0.6em; border: none; border-bottom: 1px solid rgba(0, 0, 0, 0.1); border-right: 1px solid rgba(0, 0, 0, 0.1); background-image: none; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: 2; -webkit-transition: background 0.2s ease ; -moz-transition: background 0.2s ease ; transition: background 0.2s ease ; } /* Don't double up pointers */ .ui.pointing.menu .active.item .menu .active.item:after { display: none; } .ui.vertical.pointing.menu .active.item:after { position: absolute; top: 50%; margin-top: -0.3em; right: -0.4em; bottom: auto; left: auto; border: none; border-top: 1px solid rgba(0, 0, 0, 0.1); border-right: 1px solid rgba(0, 0, 0, 0.1); } /* Colors */ .ui.pointing.menu .active.item:after { background-color: #FCFCFC; } .ui.pointing.menu .active.item:hover:after { background-color: #FAFAFA; } .ui.vertical.pointing.menu .menu .active.item:after { background-color: #F4F4F4; } .ui.pointing.menu a.active.item:active:after { background-color: #F0F0F0; } /*-------------- Attached ---------------*/ .ui.menu.attached { margin: 0rem; border-radius: 0px; /* avoid rgba multiplying */ -webkit-box-shadow: 0px 0px 0px 1px #DDDDDD; box-shadow: 0px 0px 0px 1px #DDDDDD; } .ui.top.attached.menu { border-radius: 0.1875em 0.1875em 0px 0px; } .ui.menu.bottom.attached { border-radius: 0px 0px 0.1875em 0.1875em; } /*-------------- Sizes ---------------*/ .ui.small.menu .item { font-size: 0.875rem; } .ui.small.vertical.menu { width: 13rem; } .ui.menu .item { font-size: 1rem; } .ui.vertical.menu { width: 15rem; } .ui.large.menu .item { font-size: 1.125rem; } .ui.large.menu .item .item { font-size: 0.875rem; } .ui.large.menu .dropdown .item { font-size: 1rem; } .ui.large.vertical.menu { width: 18rem; } /* * # Semantic - Message * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Message *******************************/ .ui.message { position: relative; min-height: 18px; margin: 1em 0em; height: auto; background-color: #EFEFEF; padding: 1em; line-height: 1.33; color: rgba(0, 0, 0, 0.6); -webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; -moz-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease; transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; border-radius: 0.325em 0.325em 0.325em 0.325em; } .ui.message:first-child { margin-top: 0em; } .ui.message:last-child { margin-bottom: 0em; } /*-------------- Content ---------------*/ /* block with headers */ .ui.message .header { margin: 0em; font-size: 1.33em; font-weight: bold; } /* block with paragraphs */ .ui.message p { opacity: 0.85; margin: 1em 0em; } .ui.message p:first-child { margin-top: 0em; } .ui.message p:last-child { margin-bottom: 0em; } .ui.message .header + p { margin-top: 0.3em; } .ui.message > :first-child { margin-top: 0em; } .ui.message > :last-child { margin-bottom: 0em; } /* block with child list */ .ui.message ul.list { opacity: 0.85; list-style-position: inside; margin: 0.2em 0em; padding: 0em; } .ui.message ul.list li { position: relative; list-style-type: none; margin: 0em 0em 0.3em 1em; padding: 0em; } .ui.message ul.list li:before { position: absolute; content: '\2022'; top: -0.05em; left: -0.8em; height: 100%; vertical-align: baseline; opacity: 0.5; } .ui.message ul.list li:first-child { margin-top: 0em; } /* dismissable block */ .ui.message > .close.icon { cursor: pointer; position: absolute; right: 0em; top: 0em; width: 2.5em; height: 2.5em; opacity: 0.7; padding: 0.75em 0em 0em 0.75em; z-index: 2; -webkit-transition: opacity 0.1s linear ; -moz-transition: opacity 0.1s linear ; transition: opacity 0.1s linear ; z-index: 10; } .ui.message > .close.icon:hover { opacity: 1; } /******************************* States *******************************/ .ui.message.visible { display: block !important; } .ui.icon.message.animating, .ui.icon.message.visible { display: table !important; } .ui.message.hidden { display: none !important; } /******************************* Variations *******************************/ /*-------------- Compact ---------------*/ .ui.compact.message { display: inline-block; } /*-------------- Attached ---------------*/ .ui.attached.message { margin-left: -1px; margin-right: -1px; margin-bottom: -1px; border-radius: 0.325em 0.325em 0em 0em; -webkit-box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.1) inset; } .ui.attached + .ui.attached.message:not(.top):not(.bottom) { margin-top: -1px; border-radius: 0em; } .ui.bottom.attached.message { margin-top: -1px; border-radius: 0em 0em 0.325em 0.325em; } .ui.bottom.attached.message:not(:last-child) { margin-bottom: 1em; } .ui.attached.icon.message { display: block; width: auto; } /*-------------- Icon ---------------*/ .ui.icon.message { display: table; width: 100%; } .ui.icon.message > .icon:not(.close) { display: table-cell; vertical-align: middle; font-size: 3.8em; opacity: 0.5; } .ui.icon.message > .icon + .content { padding-left: 1em; } .ui.icon.message > .content { display: table-cell; vertical-align: middle; } /*-------------- Inverted ---------------*/ .ui.inverted.message { background-color: rgba(255, 255, 255, 0.05); color: rgba(255, 255, 255, 0.95); } /*-------------- Floating ---------------*/ .ui.floating.message { -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset; box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset; } /*-------------- Colors ---------------*/ .ui.black.message { background-color: #333333; color: rgba(255, 255, 255, 0.95); } /*-------------- Types ---------------*/ .ui.blue.message, .ui.info.message { background-color: #E6F4F9; color: #4D8796; } /* Green Text Block */ .ui.green.message { background-color: #DEFCD5; color: #52A954; } /* Yellow Text Block */ .ui.yellow.message, .ui.warning.message { background-color: #F6F3D5; color: #96904D; } /* Red Text Block */ .ui.red.message { background-color: #F1D7D7; color: #A95252; } /* Success Text Block */ .ui.success.message, .ui.positive.message { background-color: #DEFCD5; color: #52A954; } /* Error Text Block */ .ui.error.message, .ui.negative.message { background-color: #F1D7D7; color: #A95252; } /*-------------- Sizes ---------------*/ .ui.small.message { font-size: 0.875em; } .ui.message { font-size: 1em; } .ui.large.message { font-size: 1.125em; } .ui.huge.message { font-size: 1.5em; } .ui.massive.message { font-size: 2em; } /* * # Semantic - Table * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Table *******************************/ /* Prototype */ .ui.table { width: 100%; border-collapse: collapse; } /* Table Content */ .ui.table th, .ui.table tr, .ui.table td { border-collapse: collapse; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.1s ease-out; -moz-transition: all 0.1s ease-out; transition: all 0.1s ease-out; } /* Headers */ .ui.table thead { border-bottom: 1px solid rgba(0, 0, 0, 0.03); } .ui.table tfoot th { background-color: rgba(0, 0, 0, 0.03); } .ui.table th { cursor: auto; background-color: rgba(0, 0, 0, 0.05); text-align: left; color: rgba(0, 0, 0, 0.8); padding: 0.5em 0.7em; vertical-align: middle; } .ui.table thead th:first-child { border-radius: 5px 0px 0px 0px; } .ui.table thead th:last-child { border-radius: 0px 5px 0px 0px; } .ui.table tfoot th:first-child { border-radius: 0px 0px 0px 5px; } .ui.table tfoot th:last-child { border-radius: 0px 0px 5px 0px; } .ui.table tfoot th:only-child { border-radius: 0px 0px 5px 5px; } /* Table Cells */ .ui.table td { padding: 0.40em 0.7em; vertical-align: middle; } /* Footer */ .ui.table tfoot { border-top: 1px solid rgba(0, 0, 0, 0.03); } .ui.table tfoot th { font-weight: normal; font-style: italic; } /* Table Striping */ .ui.table tbody tr:nth-child(2n) { background-color: rgba(0, 0, 50, 0.02); } /* Icons */ .ui.table > .icon { vertical-align: baseline; } .ui.table > .icon:only-child { margin: 0em; } /* Table Segment */ .ui.table.segment:after { display: none; } .ui.table.segment.stacked:after { display: block; } /* Responsive */ @media only screen and (max-width: 768px) { .ui.table { display: block; padding: 0em; } .ui.table thead, .ui.table tfoot { display: none; } .ui.table tbody { display: block; } .ui.table tr { display: block; } .ui.table tr > td { width: 100% !important; display: block; border: none !important; padding: 0.25em 0.75em; -webkit-box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.05) !important; box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.05) !important; } .ui.table td:first-child { font-weight: bold; padding-top: 1em; } .ui.table td:last-child { -webkit-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important; box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important; padding-bottom: 1em; } /* Clear BG Colors */ .ui.table tr > td.warning, .ui.table tr > td.error, .ui.table tr > td.active, .ui.table tr > td.positive, .ui.table tr > td.negative { background-color: transparent !important; } } /******************************* States *******************************/ /*-------------- Hover ---------------*/ /* Sortable */ .ui.sortable.table th.disabled:hover { cursor: auto; text-align: left; font-weight: bold; color: #333333; color: rgba(0, 0, 0, 0.8); } .ui.sortable.table thead th:hover { background-color: rgba(0, 0, 0, 0.13); color: rgba(0, 0, 0, 0.8); } /* Inverted Sortable */ .ui.inverted.sortable.table thead th:hover { background-color: rgba(255, 255, 255, 0.13); color: #ffffff; } /*-------------- Positive ---------------*/ .ui.table tr.positive, .ui.table td.positive { -webkit-box-shadow: 2px 0px 0px #119000 inset; box-shadow: 2px 0px 0px #119000 inset; } .ui.table tr.positive td, .ui.table td.positive { background-color: #F2F8F0 !important; color: #119000 !important; } .ui.celled.table tr.positive:hover td, .ui.celled.table tr:hover td.positive, .ui.table tr.positive:hover td, .ui.table td:hover.positive, .ui.table th:hover.positive { background-color: #ECF5E9 !important; color: #119000 !important; } /*-------------- Negative ---------------*/ .ui.table tr.negative, .ui.table td.negative { -webkit-box-shadow: 2px 0px 0px #CD2929 inset; box-shadow: 2px 0px 0px #CD2929 inset; } .ui.table tr.negative td, .ui.table td.negative { background-color: #F9F4F4; color: #CD2929 !important; } .ui.celled.table tr.negative:hover td, .ui.celled.table tr:hover td.negative, .ui.table tr.negative:hover td, .ui.table td:hover.negative, .ui.table th:hover.negative { background-color: #F2E8E8; color: #CD2929; } /*-------------- Error ---------------*/ .ui.table tr.error, .ui.table td.error { -webkit-box-shadow: 2px 0px 0px #CD2929 inset; box-shadow: 2px 0px 0px #CD2929 inset; } .ui.table tr.error td, .ui.table td.error, .ui.table th.error { background-color: #F9F4F4; color: #CD2929; } .ui.celled.table tr.error:hover td, .ui.celled.table tr:hover td.error, .ui.table tr.error:hover td, .ui.table td:hover.error, .ui.table th:hover.error { background-color: #F2E8E8; color: #CD2929; } /*-------------- Warning ---------------*/ .ui.table tr.warning, .ui.table td.warning { -webkit-box-shadow: 2px 0px 0px #7D6C00 inset; box-shadow: 2px 0px 0px #7D6C00 inset; } .ui.table tr.warning td, .ui.table td.warning, .ui.table th.warning { background-color: #FBF6E9; color: #7D6C00; } .ui.celled.table tr.warning:hover td, .ui.celled.table tr:hover td.warning, .ui.table tr.warning:hover td, .ui.table td:hover.warning, .ui.table th:hover.warning { background-color: #F3EDDC; color: #7D6C00; } /*-------------- Active ---------------*/ .ui.table tr.active, .ui.table td.active { -webkit-box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset; box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset; } .ui.table tr.active td, .ui.table tr td.active { background-color: #E0E0E0; color: rgba(50, 50, 50, 0.9); /* border-color: rgba(0, 0, 0, 0.15) !important; */ } /*-------------- Disabled ---------------*/ .ui.table tr.disabled td, .ui.table tr td.disabled, .ui.table tr.disabled:hover td, .ui.table tr:hover td.disabled { color: rgba(150, 150, 150, 0.3); } /******************************* Variations *******************************/ /*-------------- Column Count ---------------*/ .ui.two.column.table td { width: 50%; } .ui.three.column.table td { width: 33.3333%; } .ui.four.column.table td { width: 25%; } .ui.five.column.table td { width: 20%; } .ui.six.column.table td { width: 16.66667%; } .ui.seven.column.table td { width: 14.2857%; } .ui.eight.column.table td { width: 12.5%; } .ui.nine.column.table td { width: 11.1111%; } .ui.ten.column.table td { width: 10%; } .ui.eleven.column.table td { width: 9.0909%; } .ui.twelve.column.table td { width: 8.3333%; } .ui.thirteen.column.table td { width: 7.6923%; } .ui.fourteen.column.table td { width: 7.1428%; } .ui.fifteen.column.table td { width: 6.6666%; } .ui.sixteen.column.table td { width: 6.25%; } /* Column Width */ .ui.table th.one.wide, .ui.table td.one.wide { width: 6.25%; } .ui.table th.two.wide, .ui.table td.two.wide { width: 12.5%; } .ui.table th.three.wide, .ui.table td.three.wide { width: 18.75%; } .ui.table th.four.wide, .ui.table td.four.wide { width: 25%; } .ui.table th.five.wide, .ui.table td.five.wide { width: 31.25%; } .ui.table th.six.wide, .ui.table td.six.wide { width: 37.5%; } .ui.table th.seven.wide, .ui.table td.seven.wide { width: 43.75%; } .ui.table th.eight.wide, .ui.table td.eight.wide { width: 50%; } .ui.table th.nine.wide, .ui.table td.nine.wide { width: 56.25%; } .ui.table th.ten.wide, .ui.table td.ten.wide { width: 62.5%; } .ui.table th.eleven.wide, .ui.table td.eleven.wide { width: 68.75%; } .ui.table th.twelve.wide, .ui.table td.twelve.wide { width: 75%; } .ui.table th.thirteen.wide, .ui.table td.thirteen.wide { width: 81.25%; } .ui.table th.fourteen.wide, .ui.table td.fourteen.wide { width: 87.5%; } .ui.table th.fifteen.wide, .ui.table td.fifteen.wide { width: 93.75%; } .ui.table th.sixteen.wide, .ui.table td.sixteen.wide { width: 100%; } /*-------------- Celled ---------------*/ .ui.celled.table { color: rgba(0, 0, 0, 0.8); } .ui.celled.table tbody tr, .ui.celled.table tfoot tr { border: none; } .ui.celled.table th, .ui.celled.table td { border: 1px solid rgba(0, 0, 0, 0.1); } /* Coupling with segment */ .ui.celled.table.segment th:first-child, .ui.celled.table.segment td:first-child { border-left: none; } .ui.celled.table.segment th:last-child, .ui.celled.table.segment td:last-child { border-right: none; } /*-------------- Sortable ---------------*/ .ui.sortable.table thead th { cursor: pointer; white-space: nowrap; } .ui.sortable.table thead th.sorted, .ui.sortable.table thead th.sorted:hover { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .ui.sortable.table thead th:after { display: inline-block; content: ''; width: 1em; opacity: 0.8; margin: 0em 0em 0em 0.5em; font-family: 'Icons'; font-style: normal; font-weight: normal; text-decoration: inherit; } .ui.sortable.table thead th.ascending:after { content: '\25b4'; } .ui.sortable.table thead th.descending:after { content: '\25be'; } /*-------------- Inverted ---------------*/ /* Text Color */ .ui.inverted.table td { color: rgba(255, 255, 255, 0.9); } .ui.inverted.table th { background-color: rgba(0, 0, 0, 0.15); color: rgba(255, 255, 255, 0.9); } /* Stripes */ .ui.inverted.table tbody tr:nth-child(2n) { background-color: rgba(255, 255, 255, 0.06); } /*-------------- Definition ---------------*/ .ui.definition.table td:first-child { font-weight: bold; } /*-------------- Collapsing ---------------*/ .ui.collapsing.table { width: auto; } /*-------------- Basic ---------------*/ .ui.basic.table th { background-color: transparent; padding: 0.5em; } .ui.basic.table tbody tr { border-bottom: 1px solid rgba(0, 0, 0, 0.03); } .ui.basic.table td { padding: 0.8em 0.5em; } .ui.basic.table tbody tr:nth-child(2n) { background-color: transparent !important; } /*-------------- Padded ---------------*/ .ui.padded.table th, .ui.padded.table td { padding: 0.8em 1em; } .ui.compact.table th { padding: 0.3em 0.5em; } .ui.compact.table td { padding: 0.2em 0.5em; } /*-------------- Sizes ---------------*/ /* Small */ .ui.small.table { font-size: 0.875em; } /* Standard */ .ui.table { font-size: 1em; } /* Large */ .ui.large.table { font-size: 1.1em; } /* * # Semantic - basic.Icon (Basic) * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Basic Icon *******************************/ @font-face { font-family: 'Basic Icons'; src: url(../fonts/basic.icons.eot); src: url(../fonts/basic.icons.eot?#iefix) format('embedded-opentype'), url(../fonts/basic.icons.svg#basic.icons) format('svg'), url(../fonts/basic.icons.woff) format('woff'), url(../fonts/basic.icons.ttf) format('truetype'); font-style: normal; font-weight: normal; font-variant: normal; text-decoration: inherit; text-transform: none; } i.basic.icon { display: inline-block; opacity: 0.75; margin: 0em 0.25em 0em 0em; width: 1.23em; height: 1em; font-family: 'Basic Icons'; font-style: normal; line-height: 1; font-weight: normal; text-decoration: inherit; text-align: center; speak: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; font-smoothing: antialiased; } /* basic.icons available */ i.basic.icon.circle.attention:before { content: '\2757'; } /* '❗' */ i.basic.icon.circle.help:before { content: '\e704'; } /* '' */ i.basic.icon.circle.info:before { content: '\e705'; } /* '' */ i.basic.icon.add:before { content: '\2795'; } /* '➕' */ i.basic.icon.chart:before { content: '📈'; } /* '\1f4c8' */ i.basic.icon.chart.bar:before { content: '📊'; } /* '\1f4ca' */ i.basic.icon.chart.pie:before { content: '\e7a2'; } /* '' */ i.basic.icon.resize.full:before { content: '\e744'; } /* '' */ i.basic.icon.resize.horizontal:before { content: '\2b0d'; } /* '⬍' */ i.basic.icon.resize.small:before { content: '\e746'; } /* '' */ i.basic.icon.resize.vertical:before { content: '\2b0c'; } /* '⬌' */ i.basic.icon.down:before { content: '\2193'; } /* '↓' */ i.basic.icon.down.triangle:before { content: '\25be'; } /* '▾' */ i.basic.icon.down.arrow:before { content: '\e75c'; } /* '' */ i.basic.icon.left:before { content: '\2190'; } /* '←' */ i.basic.icon.left.triangle:before { content: '\25c2'; } /* '◂' */ i.basic.icon.left.arrow:before { content: '\e75d'; } /* '' */ i.basic.icon.right:before { content: '\2192'; } /* '→' */ i.basic.icon.right.triangle:before { content: '\25b8'; } /* '▸' */ i.basic.icon.right.arrow:before { content: '\e75e'; } /* '' */ i.basic.icon.up:before { content: '\2191'; } /* '↑' */ i.basic.icon.up.triangle:before { content: '\25b4'; } /* '▴' */ i.basic.icon.up.arrow:before { content: '\e75f'; } /* '' */ i.basic.icon.folder:before { content: '\e810'; } /* '' */ i.basic.icon.open.folder:before { content: '📂'; } /* '\1f4c2' */ i.basic.icon.globe:before { content: '𝌍'; } /* '\1d30d' */ i.basic.icon.desk.globe:before { content: '🌐'; } /* '\1f310' */ i.basic.icon.star:before { content: '\e801'; } /* '' */ i.basic.icon.star.empty:before { content: '\e800'; } /* '' */ i.basic.icon.star.half:before { content: '\e701'; } /* '' */ i.basic.icon.lock:before { content: '🔒'; } /* '\1f512' */ i.basic.icon.unlock:before { content: '🔓'; } /* '\1f513' */ i.basic.icon.layout.grid:before { content: '\e80c'; } /* '' */ i.basic.icon.layout.block:before { content: '\e708'; } /* '' */ i.basic.icon.layout.list:before { content: '\e80b'; } /* '' */ i.basic.icon.heart.empty:before { content: '\2661'; } /* '♡' */ i.basic.icon.heart:before { content: '\2665'; } /* '♥' */ i.basic.icon.asterisk:before { content: '\2731'; } /* '✱' */ i.basic.icon.attachment:before { content: '📎'; } /* '\1f4ce' */ i.basic.icon.attention:before { content: '\26a0'; } /* '⚠' */ i.basic.icon.trophy:before { content: '🏉'; } /* '\1f3c9' */ i.basic.icon.barcode:before { content: '\e792'; } /* '' */ i.basic.icon.cart:before { content: '\e813'; } /* '' */ i.basic.icon.block:before { content: '🚫'; } /* '\1f6ab' */ i.basic.icon.book:before { content: '📖'; } i.basic.icon.bookmark:before { content: '🔖'; } /* '\1f516' */ i.basic.icon.calendar:before { content: '📅'; } /* '\1f4c5' */ i.basic.icon.cancel:before { content: '\2716'; } /* '✖' */ i.basic.icon.close:before { content: '\e80d'; } /* '' */ i.basic.icon.color:before { content: '\e794'; } /* '' */ i.basic.icon.chat:before { content: '\e720'; } /* '' */ i.basic.icon.check:before { content: '\2611'; } /* '☑' */ i.basic.icon.time:before { content: '🕔'; } /* '\1f554' */ i.basic.icon.cloud:before { content: '\2601'; } /* '☁' */ i.basic.icon.code:before { content: '\e714'; } /* '' */ i.basic.icon.email:before { content: '\40'; } /* '@' */ i.basic.icon.settings:before { content: '\26ef'; } /* '⛯' */ i.basic.icon.setting:before { content: '\2699'; } /* '⚙' */ i.basic.icon.comment:before { content: '\e802'; } /* '' */ i.basic.icon.clockwise.counter:before { content: '\27f2'; } /* '⟲' */ i.basic.icon.clockwise:before { content: '\27f3'; } /* '⟳' */ i.basic.icon.cube:before { content: '\e807'; } /* '' */ i.basic.icon.direction:before { content: '\27a2'; } /* '➢' */ i.basic.icon.doc:before { content: '📄'; } /* '\1f4c4' */ i.basic.icon.docs:before { content: '\e736'; } /* '' */ i.basic.icon.dollar:before { content: '💵'; } /* '\1f4b5' */ i.basic.icon.paint:before { content: '\e7b5'; } /* '' */ i.basic.icon.edit:before { content: '\270d'; } /* '✍' */ i.basic.icon.eject:before { content: '\2ecf'; } /* '⻏' */ i.basic.icon.export:before { content: '\e715'; } /* '' */ i.basic.icon.hide:before { content: '\e70b'; } /* '' */ i.basic.icon.unhide:before { content: '\e80f'; } /* '' */ i.basic.icon.facebook:before { content: '\f301'; } /* '' */ i.basic.icon.fast-forward:before { content: '\e804'; } /* '' */ i.basic.icon.fire:before { content: '🔥'; } /* '\1f525' */ i.basic.icon.flag:before { content: '\2691'; } /* '⚑' */ i.basic.icon.lightning:before { content: '\26a1'; } /* '⚡' */ i.basic.icon.lab:before { content: '\68'; } /* 'h' */ i.basic.icon.flight:before { content: '\2708'; } /* '✈' */ i.basic.icon.forward:before { content: '\27a6'; } /* '➦' */ i.basic.icon.gift:before { content: '🎁'; } /* '\1f381' */ i.basic.icon.github:before { content: '\f308'; } /* '' */ i.basic.icon.globe:before { content: '\e817'; } /* '' */ i.basic.icon.headphones:before { content: '🎧'; } /* '\1f3a7' */ i.basic.icon.question:before { content: '\2753'; } /* '❓' */ i.basic.icon.home:before { content: '\2302'; } /* '⌂' */ i.basic.icon.i:before { content: '\2139'; } /* 'ℹ' */ i.basic.icon.idea:before { content: '💡'; } /* '\1f4a1' */ i.basic.icon.open:before { content: '🔗'; } /* '\1f517' */ i.basic.icon.content:before { content: '\e782'; } /* '' */ i.basic.icon.location:before { content: '\e724'; } /* '' */ i.basic.icon.mail:before { content: '\2709'; } /* '✉' */ i.basic.icon.mic:before { content: '🎤'; } /* '\1f3a4' */ i.basic.icon.minus:before { content: '\2d'; } /* '-' */ i.basic.icon.money:before { content: '💰'; } /* '\1f4b0' */ i.basic.icon.off:before { content: '\e78e'; } /* '' */ i.basic.icon.pause:before { content: '\e808'; } /* '' */ i.basic.icon.photos:before { content: '\e812'; } /* '' */ i.basic.icon.photo:before { content: '🌄'; } /* '\1f304' */ i.basic.icon.pin:before { content: '📌'; } /* '\1f4cc' */ i.basic.icon.play:before { content: '\e809'; } /* '' */ i.basic.icon.plus:before { content: '\2b'; } /* '+' */ i.basic.icon.print:before { content: '\e716'; } /* '' */ i.basic.icon.rss:before { content: '\e73a'; } /* '' */ i.basic.icon.search:before { content: '🔍'; } /* '\1f50d' */ i.basic.icon.shuffle:before { content: '\e803'; } /* '' */ i.basic.icon.tag:before { content: '\e80a'; } /* '' */ i.basic.icon.tags:before { content: '\e70d'; } /* '' */ i.basic.icon.terminal:before { content: '\e7ac'; } /* '' */ i.basic.icon.thumbs.down:before { content: '👎'; } /* '\1f44e' */ i.basic.icon.thumbs.up:before { content: '👍'; } /* '\1f44d' */ i.basic.icon.to-end:before { content: '\e806'; } /* '' */ i.basic.icon.to-start:before { content: '\e805'; } /* '' */ i.basic.icon.top.list:before { content: '🏆'; } /* '\1f3c6' */ i.basic.icon.trash:before { content: '\e729'; } /* '' */ i.basic.icon.twitter:before { content: '\f303'; } /* '' */ i.basic.icon.upload:before { content: '\e711'; } /* '' */ i.basic.icon.user.add:before { content: '\e700'; } /* '' */ i.basic.icon.user:before { content: '👤'; } /* '\1f464' */ i.basic.icon.community:before { content: '\e814'; } /* '' */ i.basic.icon.users:before { content: '👥'; } /* '\1f465' */ i.basic.icon.id:before { content: '\e722'; } /* '' */ i.basic.icon.url:before { content: '🔗'; } /* '\1f517' */ i.basic.icon.zoom.in:before { content: '\e750'; } /* '' */ i.basic.icon.zoom.out:before { content: '\e751'; } /* '' */ /*-------------- Spacing Fix ---------------*/ /* dropdown arrows are to the right */ i.dropdown.basic.icon { margin: 0em 0em 0em 0.5em; } /* stars are usually consecutive */ i.basic.icon.star { width: auto; margin: 0em; } /* left side basic.icons */ i.basic.icon.left, i.basic.icon.left, i.basic.icon.left { width: auto; margin: 0em 0.5em 0em 0em; } /* right side basic.icons */ i.basic.icon.search, i.basic.icon.up, i.basic.icon.down, i.basic.icon.right { width: auto; margin: 0em 0em 0em 0.5em; } /*-------------- Aliases ---------------*/ /* aliases for convenience */ i.basic.icon.delete:before { content: '\e80d'; } /* '' */ i.basic.icon.dropdown:before { content: '\25be'; } /* '▾' */ i.basic.icon.help:before { content: '\e704'; } /* '' */ i.basic.icon.info:before { content: '\e705'; } /* '' */ i.basic.icon.error:before { content: '\e80d'; } /* '' */ i.basic.icon.dislike:before { content: '\2661'; } /* '♡' */ i.basic.icon.like:before { content: '\2665'; } /* '♥' */ i.basic.icon.eye:before { content: '\e80f'; } /* '' */ i.basic.icon.eye.hidden:before { content: '\e70b'; } /* '' */ i.basic.icon.date:before { content: '📅'; } /* '\1f4c5' */ /******************************* States *******************************/ i.basic.icon.hover { opacity: 1; } i.basic.icon.active { opacity: 1; } i.emphasized.basic.icon { opacity: 1; } i.basic.icon.disabled { opacity: 0.3; } /******************************* Variations *******************************/ /*------------------- Link --------------------*/ i.link.basic.icon { cursor: pointer; opacity: 0.7; -webkit-transition: opacity 0.3s ease-out; -moz-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out; } .link.basic.icon:hover { opacity: 1 !important; } /*------------------- Circular --------------------*/ i.circular.basic.icon { border-radius: 500px !important; padding: 0.5em 0em !important; -webkit-box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset; box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset; line-height: 1 !important; width: 2em !important; height: 2em !important; } i.circular.inverted.basic.icon { border: none; -webkit-box-shadow: none; box-shadow: none; } /*------------------- Flipped --------------------*/ i.vertically.flipped.basic.icon { -webkit-transform: scale(1, -1); -moz-transform: scale(1, -1); -ms-transform: scale(1, -1); transform: scale(1, -1); } i.horizontally.flipped.basic.icon { -webkit-transform: scale(-1, 1); -moz-transform: scale(-1, 1); -ms-transform: scale(-1, 1); transform: scale(-1, 1); } /*------------------- Rotated --------------------*/ i.left.rotated.basic.icon { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } i.right.rotated.basic.icon { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } /*------------------- Square --------------------*/ i.square.basic.icon { width: 2em; height: 2em; padding: 0.5em 0.35em !important; -webkit-box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset; box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset; vertical-align: baseline; } i.square.basic.icon:before { vertical-align: middle; } i.square.inverted.basic.icon { border: none; -webkit-box-shadow: none; box-shadow: none; } /*------------------- Inverted --------------------*/ i.inverted.basic.icon { background-color: #222222; color: #FFFFFF; } /*------------------- Colors --------------------*/ i.blue.basic.icon { color: #6ECFF5 !important; } i.black.basic.icon { color: #5C6166 !important; } i.green.basic.icon { color: #A1CF64 !important; } i.red.basic.icon { color: #D95C5C !important; } i.purple.basic.icon { color: #564F8A !important; } i.teal.basic.icon { color: #00B5AD !important; } /*------------------- Inverted Colors --------------------*/ i.inverted.black.basic.icon { background-color: #5C6166 !important; color: #FFFFFF !important; } i.inverted.blue.basic.icon { background-color: #6ECFF5 !important; color: #FFFFFF !important; } i.inverted.green.basic.icon { background-color: #A1CF64 !important; color: #FFFFFF !important; } i.inverted.red.basic.icon { background-color: #D95C5C !important; color: #FFFFFF !important; } i.inverted.purple.basic.icon { background-color: #564F8A !important; color: #FFFFFF !important; } i.inverted.teal.basic.icon { background-color: #00B5AD !important; color: #FFFFFF !important; } /*------------------- Sizes --------------------*/ i.small.basic.icon { font-size: 0.875em; } i.basic.icon { font-size: 1em; } i.large.basic.icon { font-size: 1.5em; margin-right: 0.2em; vertical-align: middle; } i.big.basic.icon { font-size: 2em; margin-right: 0.5em; vertical-align: middle; } i.huge.basic.icon { font-size: 4em; margin-right: 0.75em; vertical-align: middle; } i.massive.basic.icon { font-size: 8em; margin-right: 1em; vertical-align: middle; } /* * # Semantic - Button * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Button *******************************/ /* Prototype */ .ui.button { cursor: pointer; display: inline-block; vertical-align: middle; min-height: 1em; outline: none; border: none; background-color: #FAFAFA; color: #808080; margin: 0em; padding: 0.8em 1.5em; font-size: 1rem; text-transform: uppercase; line-height: 1; font-weight: bold; font-style: normal; text-align: center; text-decoration: none; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.05))); background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05)); background-image: -moz-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05)); background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05)); border-radius: 0.25em; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.08) inset; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-transition: opacity 0.25s ease, background-color 0.25s ease, color 0.25s ease, background 0.25s ease, -webkit-box-shadow 0.25s ease; -moz-transition: opacity 0.25s ease, background-color 0.25s ease, color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease; transition: opacity 0.25s ease, background-color 0.25s ease, color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease; } /******************************* States *******************************/ /*-------------- Active ---------------*/ .ui.buttons .active.button, .ui.active.button { background-color: #EAEAEA; background-image: none; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important; color: rgba(0, 0, 0, 0.7); } /*-------------- Hover ---------------*/ .ui.button:hover { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.08))); background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.08)); background-image: -moz-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.08)); background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.08)); color: rgba(0, 0, 0, 0.7); } .ui.button.active:hover { background-image: none; } .ui.button:hover .icon, .ui.button.hover .icon { opacity: 0.85; } /*-------------- Down ---------------*/ .ui.button:active, .ui.active.button:active { background-color: #F1F1F1; color: rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset !important; } /*-------------- Loading ---------------*/ .ui.loading.button { position: relative; cursor: default; background-color: #FFFFFF !important; color: transparent !important; -webkit-transition: all 0s linear; -moz-transition: all 0s linear; transition: all 0s linear; } .ui.loading.button:after { position: absolute; top: 0em; left: 0em; width: 100%; height: 100%; content: ''; background: transparent url(../images/loader-mini.gif) no-repeat 50% 50%; } .ui.labeled.icon.loading.button .icon { background-color: transparent; -webkit-box-shadow: none; box-shadow: none; } /*------------------- Disabled --------------------*/ .ui.disabled.button, .ui.disabled.button:hover, .ui.disabled.button.active { background-color: #DDDDDD !important; cursor: default; color: rgba(0, 0, 0, 0.5) !important; opacity: 0.3 !important; background-image: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; } /******************************* Types *******************************/ /*------------------- Animated --------------------*/ .ui.animated.button { position: relative; overflow: hidden; } .ui.animated.button .visible.content { position: relative; } .ui.animated.button .hidden.content { position: absolute; width: 100%; } /* Horizontal */ .ui.animated.button .visible.content, .ui.animated.button .hidden.content { -webkit-transition: right 0.3s ease 0s; -moz-transition: right 0.3s ease 0s; transition: right 0.3s ease 0s; } .ui.animated.button .visible.content { left: auto; right: 0%; } .ui.animated.button .hidden.content { top: 50%; left: auto; right: -100%; margin-top: -0.55em; } .ui.animated.button:hover .visible.content { left: auto; right: 200%; } .ui.animated.button:hover .hidden.content { left: auto; right: 0%; } /* Vertical */ .ui.vertical.animated.button .visible.content, .ui.vertical.animated.button .hidden.content { -webkit-transition: top 0.3s ease 0s, -webkit-transform 0.3s ease 0s; -moz-transition: top 0.3s ease 0s, -moz-transform 0.3s ease 0s; transition: top 0.3s ease 0s, transform 0.3s ease 0s; } .ui.vertical.animated.button .visible.content { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); right: auto; } .ui.vertical.animated.button .hidden.content { top: -100%; left: 0%; right: auto; } .ui.vertical.animated.button:hover .visible.content { -webkit-transform: translateY(200%); -moz-transform: translateY(200%); -ms-transform: translateY(200%); transform: translateY(200%); right: auto; } .ui.vertical.animated.button:hover .hidden.content { top: 50%; right: auto; } /* Fade */ .ui.fade.animated.button .visible.content, .ui.fade.animated.button .hidden.content { -webkit-transition: opacity 0.3s ease 0s, -webkit-transform 0.3s ease 0s; -moz-transition: opacity 0.3s ease 0s, -moz-transform 0.3s ease 0s; transition: opacity 0.3s ease 0s, transform 0.3s ease 0s; } .ui.fade.animated.button .visible.content { left: auto; right: auto; opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .ui.fade.animated.button .hidden.content { opacity: 0; left: 0%; right: auto; -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .ui.fade.animated.button:hover .visible.content { left: auto; right: auto; opacity: 0; -webkit-transform: scale(0.7); -moz-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); } .ui.fade.animated.button:hover .hidden.content { left: 0%; right: auto; opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } /*------------------- Primary --------------------*/ .ui.primary.buttons .button, .ui.primary.button { background-color: #D95C5C; color: #FFFFFF; } .ui.primary.buttons .button:hover, .ui.primary.button:hover, .ui.primary.buttons .active.button, .ui.primary.button.active { background-color: #E75859; color: #FFFFFF; } .ui.primary.buttons .button:active, .ui.primary.button:active { background-color: #D24B4C; color: #FFFFFF; } /*------------------- Secondary --------------------*/ .ui.secondary.buttons .button, .ui.secondary.button { background-color: #00B5AD; color: #FFFFFF; } .ui.secondary.buttons .button:hover, .ui.secondary.button:hover, .ui.secondary.buttons .active.button, .ui.secondary.button.active { background-color: #009A93; color: #FFFFFF; } .ui.secondary.buttons .button:active, .ui.secondary.button:active { background-color: #00847E; color: #FFFFFF; } /*------------------- Social --------------------*/ /* Facebook */ .ui.facebook.button { background-color: #3B579D; color: #FFFFFF; } .ui.facebook.button:hover { background-color: #3A59A9; color: #FFFFFF; } .ui.facebook.button:active { background-color: #334F95; color: #FFFFFF; } /* Twitter */ .ui.twitter.button { background-color: #4092CC; color: #FFFFFF; } .ui.twitter.button:hover { background-color: #399ADE; color: #FFFFFF; } .ui.twitter.button:active { background-color: #3283BC; color: #FFFFFF; } /* Google Plus */ .ui.google.plus.button { background-color: #D34836; color: #FFFFFF; } .ui.google.plus.button:hover { background-color: #E3432E; color: #FFFFFF; } .ui.google.plus.button:active { background-color: #CA3A27; color: #FFFFFF; } /* Linked In */ .ui.linkedin.button { background-color: #1F88BE; color: #FFFFFF; } .ui.linkedin.button:hover { background-color: #1394D6; color: #FFFFFF; } .ui.linkedin.button:active { background-color: #1179AE; color: #FFFFFF; } /* YouTube */ .ui.youtube.button { background-color: #CC181E; color: #FFFFFF; } .ui.youtube.button:hover { background-color: #DF0209; color: #FFFFFF; } .ui.youtube.button:active { background-color: #A50006; color: #FFFFFF; } /* Instagram */ .ui.instagram.button { background-color: #49769C; color: #FFFFFF; } .ui.instagram.button:hover { background-color: #4781B1; color: #FFFFFF; } .ui.instagram.button:active { background-color: #38658A; color: #FFFFFF; } /* Pinterest */ .ui.pinterest.button { background-color: #00ACED; color: #FFFFFF; } .ui.pinterest.button:hover { background-color: #00B9FF; color: #FFFFFF; } .ui.pinterest.button:active { background-color: #009EDA; color: #FFFFFF; } /* vk.com */ .ui.vk.button { background-color: #4D7198; color: #FFFFFF; } .ui.vk.button:hover { background-color: #537AA5; color: #FFFFFF; } .ui.vk.button:active { background-color: #405E7E; color: #FFFFFF; } /*-------------- Icon ---------------*/ .ui.button > .icon { margin-right: 0.6em; line-height: 1; -webkit-transition: opacity 0.1s ease ; -moz-transition: opacity 0.1s ease ; transition: opacity 0.1s ease ; } /******************************* Variations *******************************/ /*------------------- Floated --------------------*/ .ui.left.floated.buttons, .ui.left.floated.button { float: left; margin-right: 0.25em; } .ui.right.floated.buttons, .ui.right.floated.button { float: right; margin-left: 0.25em; } /*------------------- Sizes --------------------*/ .ui.buttons .button, .ui.button { font-size: 1rem; } .ui.mini.buttons .button, .ui.mini.buttons .or, .ui.mini.button { font-size: 0.8rem; } .ui.mini.buttons .button, .ui.mini.button { padding: 0.6em 0.8em; } .ui.mini.icon.buttons .button, .ui.mini.buttons .icon.button { padding: 0.6em 0.6em; } .ui.tiny.buttons .button, .ui.tiny.buttons .or, .ui.tiny.button { font-size: 0.875em; } .ui.tiny.buttons .button, .ui.tiny.buttons .button, .ui.tiny.button { padding: 0.6em 0.8em; } .ui.tiny.icon.buttons .button, .ui.tiny.buttons .icon.button { padding: 0.6em 0.6em; } .ui.small.buttons .button, .ui.small.buttons .or, .ui.small.button { font-size: 0.875rem; } .ui.large.buttons .button, .ui.large.buttons .or, .ui.large.button { font-size: 1.125rem; } .ui.big.buttons .button, .ui.big.buttons .or, .ui.big.button { font-size: 1.25rem; } .ui.huge.buttons .button, .ui.huge.buttons .or, .ui.huge.button { font-size: 1.375rem; } .ui.massive.buttons .button, .ui.massive.buttons .or, .ui.massive.button { font-size: 1.5rem; font-weight: bold; } /* Or resize */ .ui.tiny.buttons .or:before, .ui.mini.buttons .or:before { width: 1.45em; height: 1.55em; line-height: 1.4; margin-left: -0.725em; margin-top: -0.25em; } .ui.tiny.buttons .or:after, .ui.mini.buttons .or:after { height: 1.45em; } /* loading */ .ui.huge.loading.button:after { background-image: url(../images/loader-small.gif); } .ui.massive.buttons .loading.button:after, .ui.gigantic.buttons .loading.button:after, .ui.massive.loading.button:after, .ui.gigantic.loading.button:after { background-image: url(../images/loader-medium.gif); } .ui.huge.loading.button:after, .ui.huge.loading.button.active:after { background-image: url(../images/loader-small.gif); } .ui.massive.buttons .loading.button:after, .ui.gigantic.buttons .loading.button:after, .ui.massive.loading.button:after, .ui.gigantic.loading.button:after, .ui.massive.buttons .loading.button.active:after, .ui.gigantic.buttons .loading.button.active:after, .ui.massive.loading.button.active:after, .ui.gigantic.loading.button.active:after { background-image: url(../images/loader-medium.gif); } /*-------------- Icon Only ---------------*/ .ui.icon.buttons .button, .ui.icon.button { padding: 0.8em; } .ui.icon.buttons .button > .icon, .ui.icon.button > .icon { opacity: 0.9; margin: 0em; vertical-align: top; } /*------------------- Basic --------------------*/ .ui.basic.buttons .button, .ui.basic.button { background-color: transparent !important; background-image: none; color: #808080 !important; font-weight: normal; text-transform: none; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; } .ui.basic.buttons { -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; border-radius: 0.25em; } .ui.basic.buttons .button:hover, .ui.basic.button:hover { background-image: none; color: #7F7F7F !important; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.18) inset; } .ui.basic.buttons .button:active, .ui.basic.button:active { background-color: rgba(0, 0, 0, 0.02) !important; color: #7F7F7F !important; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; } .ui.basic.buttons .button.active, .ui.basic.button.active { background-color: rgba(0, 0, 0, 0.05); color: #7F7F7F; -webkit-box-shadow: 0px 0px 0px 1px #BDBDBD inset; box-shadow: 0px 0px 0px 1px #BDBDBD inset; } .ui.basic.buttons .button.active:hover, .ui.basic.button.active:hover { background-color: rgba(0, 0, 0, 0.1); } /* Inverted */ .ui.basic.inverted.buttons .button, .ui.basic.inverted.button { color: #FAFAFA !important; -webkit-box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.3) inset; box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.3) inset; } .ui.basic.inverted.buttons .button:hover, .ui.basic.inverted.button:hover { background-image: none; color: #FFFFFF !important; -webkit-box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.5) inset; box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.5) inset; } .ui.basic.inverted.buttons .button:active, .ui.basic.inverted.button:active { background-color: rgba(255, 255, 255, 0.05) !important; color: #FFFFFF !important; -webkit-box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.8) inset !important; box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.8) inset !important; } .ui.basic.inverted.buttons .button.active, .ui.basic.inverted.button.active { background-color: rgba(255, 255, 255, 0.5); color: #FFFFFF; -webkit-box-shadow: none; box-shadow: none; } .ui.basic.inverted.buttons .button.active:hover, .ui.basic.inverted.button.active:hover { background-color: rgba(0, 0, 0, 0.1); } /* Basic Group */ .ui.basic.buttons .button { border-left: 1px solid rgba(0, 0, 0, 0.1); -webkit-box-shadow: none; box-shadow: none; } .ui.basic.buttons .button:hover, .ui.basic.buttons .button:active { -webkit-box-shadow: none; box-shadow: none; } .ui.basic.buttons .button.active, .ui.basic.buttons .button.active:hover { -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset; } /*-------------- Labeled Icon ---------------*/ .ui.labeled.icon.buttons .button, .ui.labeled.icon.button { position: relative; padding-left: 4em !important; padding-right: 1.4em !important; } .ui.labeled.icon.buttons > .button > .icon, .ui.labeled.icon.button > .icon { position: absolute; top: 0em; left: 0em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; width: 2.75em; height: 100%; padding-top: 0.8em; background-color: rgba(0, 0, 0, 0.05); text-align: center; border-radius: 0.25em 0px 0px 0.25em; line-height: 1; -webkit-box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset; box-shadow: -1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset; } .ui.labeled.icon.buttons .button > .icon { border-radius: 0em; } .ui.labeled.icon.buttons .button:first-child > .icon { border-top-left-radius: 0.25em; border-bottom-left-radius: 0.25em; } .ui.labeled.icon.buttons .button:last-child > .icon { border-top-right-radius: 0.25em; border-bottom-right-radius: 0.25em; } .ui.vertical.labeled.icon.buttons .button:first-child > .icon { border-radius: 0em; border-top-left-radius: 0.25em; } .ui.vertical.labeled.icon.buttons .button:last-child > .icon { border-radius: 0em; border-bottom-left-radius: 0.25em; } .ui.right.labeled.icon.button { padding-left: 1.4em !important; padding-right: 4em !important; } .ui.left.fluid.labeled.icon.button, .ui.right.fluid.labeled.icon.button { padding-left: 1.4em !important; padding-right: 1.4em !important; } .ui.right.labeled.icon.button .icon { left: auto; right: 0em; border-radius: 0em 0.25em 0.25em 0em; -webkit-box-shadow: 1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset; box-shadow: 1px 0px 0px 0px rgba(0, 0, 0, 0.05) inset; } /*-------------- Toggle ---------------*/ /* Toggle (Modifies active state to give affordances) */ .ui.toggle.buttons .active.button, .ui.buttons .button.toggle.active, .ui.button.toggle.active { background-color: #5BBD72 !important; color: #FFFFFF !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .ui.button.toggle.active:hover { background-color: #58CB73 !important; color: #FFFFFF !important; -webkit-box-shadow: none !important; box-shadow: none !important; } /*-------------- Circular ---------------*/ .ui.circular.button { border-radius: 10em; } /*-------------- Attached ---------------*/ .ui.attached.button { display: block; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important; } .ui.attached.top.button { border-radius: 0.25em 0.25em 0em 0em; } .ui.attached.bottom.button { border-radius: 0em 0em 0.25em 0.25em; } .ui.attached.left.button { display: inline-block; border-left: none; padding-right: 0.75em; text-align: right; border-radius: 0.25em 0em 0em 0.25em; } .ui.attached.right.button { display: inline-block; padding-left: 0.75em; text-align: left; border-radius: 0em 0.25em 0.25em 0em; } /*------------------- Or Buttons --------------------*/ .ui.buttons .or { position: relative; float: left; width: 0.3em; height: 1.1em; z-index: 3; } .ui.buttons .or:before { position: absolute; top: 50%; left: 50%; content: 'or'; background-color: #FFFFFF; margin-top: -0.1em; margin-left: -0.9em; width: 1.8em; height: 1.8em; line-height: 1.55; color: #AAAAAA; font-style: normal; font-weight: normal; text-align: center; border-radius: 500px; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.buttons .or[data-text]:before { content: attr(data-text); } .ui.buttons .or:after { position: absolute; top: 0em; left: 0em; content: ' '; width: 0.3em; height: 1.7em; background-color: transparent; border-top: 0.5em solid #FFFFFF; border-bottom: 0.5em solid #FFFFFF; } /* Fluid Or */ .ui.fluid.buttons .or { width: 0em !important; } .ui.fluid.buttons .or:after { display: none; } /*------------------- Attached --------------------*/ /* Plural Attached */ .attached.ui.buttons { margin: 0px; border-radius: 4px 4px 0px 0px; } .attached.ui.buttons .button:first-child { border-radius: 4px 0px 0px 0px; } .attached.ui.buttons .button:last-child { border-radius: 0px 4px 0px 0px; } /* Bottom Side */ .bottom.attached.ui.buttons { margin-top: -1px; border-radius: 0px 0px 4px 4px; } .bottom.attached.ui.buttons .button:first-child { border-radius: 0px 0px 0px 4px; } .bottom.attached.ui.buttons .button:last-child { border-radius: 0px 0px 4px 0px; } /* Left Side */ .left.attached.ui.buttons { margin-left: -1px; border-radius: 0px 4px 4px 0px; } .left.attached.ui.buttons .button:first-child { margin-left: -1px; border-radius: 0px 4px 0px 0px; } .left.attached.ui.buttons .button:last-child { margin-left: -1px; border-radius: 0px 0px 4px 0px; } /* Right Side */ .right.attached.ui.buttons, .right.attached.ui.buttons .button { margin-right: -1px; border-radius: 4px 0px 0px 4px; } .right.attached.ui.buttons .button:first-child { margin-left: -1px; border-radius: 4px 0px 0px 0px; } .right.attached.ui.buttons .button:last-child { margin-left: -1px; border-radius: 0px 0px 0px 4px; } /* Fluid */ .ui.fluid.buttons, .ui.button.fluid, .ui.fluid.buttons > .button { display: block; width: 100%; } .ui.\32.buttons > .button, .ui.two.buttons > .button { width: 50%; } .ui.\33.buttons > .button, .ui.three.buttons > .button { width: 33.333%; } .ui.\34.buttons > .button, .ui.four.buttons > .button { width: 25%; } .ui.\35.buttons > .button, .ui.five.buttons > .button { width: 20%; } .ui.\36.buttons > .button, .ui.six.buttons > .button { width: 16.666%; } .ui.\37.buttons > .button, .ui.seven.buttons > .button { width: 14.285%; } .ui.\38.buttons > .button, .ui.eight.buttons > .button { width: 12.500%; } .ui.\39.buttons > .button, .ui.nine.buttons > .button { width: 11.11%; } .ui.\31\30.buttons > .button, .ui.ten.buttons > .button { width: 10%; } .ui.\31\31.buttons > .button, .ui.eleven.buttons > .button { width: 9.09%; } .ui.\31\32.buttons > .button, .ui.twelve.buttons > .button { width: 8.3333%; } /* Fluid Vertical Buttons */ .ui.fluid.vertical.buttons, .ui.fluid.vertical.buttons > .button { display: block; width: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.\32.vertical.buttons > .button, .ui.two.vertical.buttons > .button { height: 50%; } .ui.\33.vertical.buttons > .button, .ui.three.vertical.buttons > .button { height: 33.333%; } .ui.\34.vertical.buttons > .button, .ui.four.vertical.buttons > .button { height: 25%; } .ui.\35.vertical.buttons > .button, .ui.five.vertical.buttons > .button { height: 20%; } .ui.\36.vertical.buttons > .button, .ui.six.vertical.buttons > .button { height: 16.666%; } .ui.\37.vertical.buttons > .button, .ui.seven.vertical.buttons > .button { height: 14.285%; } .ui.\38.vertical.buttons > .button, .ui.eight.vertical.buttons > .button { height: 12.500%; } .ui.\39.vertical.buttons > .button, .ui.nine.vertical.buttons > .button { height: 11.11%; } .ui.\31\30.vertical.buttons > .button, .ui.ten.vertical.buttons > .button { height: 10%; } .ui.\31\31.vertical.buttons > .button, .ui.eleven.vertical.buttons > .button { height: 9.09%; } .ui.\31\32.vertical.buttons > .button, .ui.twelve.vertical.buttons > .button { height: 8.3333%; } /*------------------- Colors --------------------*/ /*--- Black ---*/ .ui.black.buttons .button, .ui.black.button { background-color: #5C6166; color: #FFFFFF; } .ui.black.buttons .button:hover, .ui.black.button:hover { background-color: #4C4C4C; color: #FFFFFF; } .ui.black.buttons .button:active, .ui.black.button:active { background-color: #333333; color: #FFFFFF; } /*--- Green ---*/ .ui.green.buttons .button, .ui.green.button { background-color: #5BBD72; color: #FFFFFF; } .ui.green.buttons .button:hover, .ui.green.button:hover, .ui.green.buttons .active.button, .ui.green.button.active { background-color: #58cb73; color: #FFFFFF; } .ui.green.buttons .button:active, .ui.green.button:active { background-color: #4CB164; color: #FFFFFF; } /*--- Red ---*/ .ui.red.buttons .button, .ui.red.button { background-color: #D95C5C; color: #FFFFFF; } .ui.red.buttons .button:hover, .ui.red.button:hover, .ui.red.buttons .active.button, .ui.red.button.active { background-color: #E75859; color: #FFFFFF; } .ui.red.buttons .button:active, .ui.red.button:active { background-color: #D24B4C; color: #FFFFFF; } /*--- Orange ---*/ .ui.orange.buttons .button, .ui.orange.button { background-color: #E96633; color: #FFFFFF; } .ui.orange.buttons .button:hover, .ui.orange.button:hover, .ui.orange.buttons .active.button, .ui.orange.button.active { background-color: #FF7038; color: #FFFFFF; } .ui.orange.buttons .button:active, .ui.orange.button:active { background-color: #DA683B; color: #FFFFFF; } /*--- Blue ---*/ .ui.blue.buttons .button, .ui.blue.button { background-color: #6ECFF5; color: #FFFFFF; } .ui.blue.buttons .button:hover, .ui.blue.button:hover, .ui.blue.buttons .active.button, .ui.blue.button.active { background-color: #1AB8F3; color: #FFFFFF; } .ui.blue.buttons .button:active, .ui.blue.button:active { background-color: #0AA5DF; color: #FFFFFF; } /*--- Purple ---*/ .ui.purple.buttons .button, .ui.purple.button { background-color: #564F8A; color: #FFFFFF; } .ui.purple.buttons .button:hover, .ui.purple.button:hover, .ui.purple.buttons .active.button, .ui.purple.button.active { background-color: #3E3773; color: #FFFFFF; } .ui.purple.buttons .button:active, .ui.purple.button:active { background-color: #2E2860; color: #FFFFFF; } /*--- Teal ---*/ .ui.teal.buttons .button, .ui.teal.button { background-color: #00B5AD; color: #FFFFFF; } .ui.teal.buttons .button:hover, .ui.teal.button:hover, .ui.teal.buttons .active.button, .ui.teal.button.active { background-color: #009A93; color: #FFFFFF; } .ui.teal.buttons .button:active, .ui.teal.button:active { background-color: #00847E; color: #FFFFFF; } /*--------------- Positive ----------------*/ .ui.positive.buttons .button, .ui.positive.button { background-color: #5BBD72 !important; color: #FFFFFF; } .ui.positive.buttons .button:hover, .ui.positive.button:hover, .ui.positive.buttons .active.button, .ui.positive.button.active { background-color: #58CB73 !important; color: #FFFFFF; } .ui.positive.buttons .button:active, .ui.positive.button:active { background-color: #4CB164 !important; color: #FFFFFF; } /*--------------- Negative ----------------*/ .ui.negative.buttons .button, .ui.negative.button { background-color: #D95C5C !important; color: #FFFFFF; } .ui.negative.buttons .button:hover, .ui.negative.button:hover, .ui.negative.buttons .active.button, .ui.negative.button.active { background-color: #E75859 !important; color: #FFFFFF; } .ui.negative.buttons .button:active, .ui.negative.button:active { background-color: #D24B4C !important; color: #FFFFFF; } /******************************* Groups *******************************/ .ui.buttons { display: inline-block; vertical-align: middle; } .ui.buttons:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .ui.buttons .button:first-child { border-left: none; } .ui.buttons .button { float: left; border-radius: 0em; } .ui.buttons .button:first-child { margin-left: 0em; border-top-left-radius: 0.25em; border-bottom-left-radius: 0.25em; } .ui.buttons .button:last-child { border-top-right-radius: 0.25em; border-bottom-right-radius: 0.25em; } /* Vertical Style */ .ui.vertical.buttons { display: inline-block; } .ui.vertical.buttons .button { display: block; float: none; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; } .ui.vertical.buttons .button:first-child, .ui.vertical.buttons .mini.button:first-child, .ui.vertical.buttons .tiny.button:first-child, .ui.vertical.buttons .small.button:first-child, .ui.vertical.buttons .massive.button:first-child, .ui.vertical.buttons .huge.button:first-child { margin-top: 0px; border-radius: 0.25em 0.25em 0px 0px; } .ui.vertical.buttons .button:last-child, .ui.vertical.buttons .mini.button:last-child, .ui.vertical.buttons .tiny.button:last-child, .ui.vertical.buttons .small.button:last-child, .ui.vertical.buttons .massive.button:last-child, .ui.vertical.buttons .huge.button:last-child, .ui.vertical.buttons .gigantic.button:last-child { border-radius: 0px 0px 0.25em 0.25em; } /* * # Semantic - Divider * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Divider *******************************/ .ui.divider { margin: 1rem 0rem; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.8); line-height: 1; height: 0em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .ui.vertical.divider, .ui.horizontal.divider { position: absolute; border: none; height: 0em; margin: 0em; background-color: transparent; font-size: 0.875rem; font-weight: bold; text-align: center; text-transform: uppercase; color: rgba(0, 0, 0, 0.8); } /*-------------- Vertical ---------------*/ .ui.vertical.divider { position: absolute; z-index: 2; top: 50%; left: 50%; margin: 0% 0% 0% -3%; width: 6%; height: 50%; line-height: 0; padding: 0em; } .ui.vertical.divider:before, .ui.vertical.divider:after { position: absolute; left: 50%; content: " "; z-index: 3; border-left: 1px solid rgba(0, 0, 0, 0.1); border-right: 1px solid rgba(255, 255, 255, 0.8); width: 0%; height: 80%; } .ui.vertical.divider:before { top: -100%; } .ui.vertical.divider:after { top: auto; bottom: 0px; } /*-------------- Horizontal ---------------*/ .ui.horizontal.divider { position: relative; top: 0%; left: 0%; margin: 1rem 1.5rem; height: auto; padding: 0em; line-height: 1; } .ui.horizontal.divider:before, .ui.horizontal.divider:after { position: absolute; content: " "; z-index: 3; width: 50%; top: 50%; height: 0%; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.8); } .ui.horizontal.divider:before { left: 0%; margin-left: -1.5rem; } .ui.horizontal.divider:after { left: auto; right: 0%; margin-right: -1.5rem; } /*-------------- Icon ---------------*/ .ui.divider > .icon { margin: 0em; font-size: 1rem; vertical-align: middle; } /******************************* Variations *******************************/ /*-------------- Inverted ---------------*/ .ui.divider.inverted { color: #ffffff; } .ui.vertical.inverted.divider, .ui.horizontal.inverted.divider { color: rgba(255, 255, 255, 0.9); } .ui.divider.inverted, .ui.divider.inverted:after, .ui.divider.inverted:before { border-top-color: rgba(0, 0, 0, 0.15); border-bottom-color: rgba(255, 255, 255, 0.15); border-left-color: rgba(0, 0, 0, 0.15); border-right-color: rgba(255, 255, 255, 0.15); } /*-------------- Fitted ---------------*/ .ui.fitted.divider { margin: 0em; } /*-------------- Clearing ---------------*/ .ui.clearing.divider { clear: both; } /*-------------- Section ---------------*/ .ui.section.divider { margin-top: 2rem; margin-bottom: 2rem; } /* * # Semantic - Header * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Header *******************************/ /* Standard */ .ui.header { border: none; margin: 1em 0em 1rem; padding: 0em; font-size: 1.33em; font-weight: bold; line-height: 1.33; } .ui.header .sub.header { font-size: 1rem; font-weight: normal; margin: 0em; padding: 0em; line-height: 1.2; color: rgba(0, 0, 0, 0.5); } .ui.header .icon { display: table-cell; vertical-align: middle; padding-right: 0.5em; } .ui.header .icon:only-child { display: inline-block; vertical-align: baseline; } .ui.header .content { display: inline-block; vertical-align: top; } .ui.header .icon + .content { padding-left: 0.5em; display: table-cell; } /* Positioning */ .ui.header:first-child { margin-top: 0em; } .ui.header:last-child { margin-bottom: 0em; } .ui.header + p { margin-top: 0em; } /*-------------- Page Heading ---------------*/ h1.ui.header { min-height: 1rem; line-height: 1.33; font-size: 2rem; } h2.ui.header { line-height: 1.33; font-size: 1.75rem; } h3.ui.header { line-height: 1.33; font-size: 1.33rem; } h4.ui.header { line-height: 1.33; font-size: 1.1rem; } h5.ui.header { line-height: 1.2; font-size: 1rem; } /*-------------- Content Heading ---------------*/ .ui.huge.header { min-height: 1em; font-size: 2em; } .ui.large.header { font-size: 1.75em; } .ui.medium.header { font-size: 1.33em; } .ui.small.header { font-size: 1.1em; } .ui.tiny.header { font-size: 1em; } /******************************* Types *******************************/ /*------------------- Icon --------------------*/ .ui.icon.header { display: inline-block; text-align: center; } .ui.icon.header .icon { float: none; display: block; font-size: 3em; margin: 0em auto 0.2em; padding: 0em; } .ui.icon.header .content { display: block; } .ui.icon.header .circular.icon, .ui.icon.header .square.icon { font-size: 2em; } .ui.block.icon.header .icon { margin-bottom: 0em; } .ui.icon.header.aligned { margin-left: auto; margin-right: auto; display: block; } /******************************* States *******************************/ .ui.disabled.header { opacity: 0.5; } /******************************* Variations *******************************/ /*------------------- Colors --------------------*/ .ui.blue.header { color: #6ECFF5 !important; } .ui.black.header { color: #5C6166 !important; } .ui.green.header { color: #A1CF64 !important; } .ui.red.header { color: #D95C5C !important; } .ui.purple.header { color: #564F8A !important; } .ui.teal.header { color: #00B5AD !important; } .ui.blue.dividing.header { border-bottom: 3px solid #6ECFF5; } .ui.black.dividing.header { border-bottom: 3px solid #5C6166; } .ui.green.dividing.header { border-bottom: 3px solid #A1CF64; } .ui.red.dividing.header { border-bottom: 3px solid #D95C5C; } .ui.purple.dividing.header { border-bottom: 3px solid #564F8A; } .ui.teal.dividing.header { border-bottom: 3px solid #00B5AD; } /*------------------- Inverted --------------------*/ .ui.inverted.header { color: #FFFFFF; } .ui.inverted.header .sub.header { color: rgba(255, 255, 255, 0.85); } /*------------------- Inverted Colors --------------------*/ .ui.inverted.black.header { background-color: #5C6166 !important; color: #FFFFFF !important; } .ui.inverted.blue.header { background-color: #6ECFF5 !important; color: #FFFFFF !important; } .ui.inverted.green.header { background-color: #A1CF64 !important; color: #FFFFFF !important; } .ui.inverted.red.header { background-color: #D95C5C !important; color: #FFFFFF !important; } .ui.inverted.purple.header { background-color: #564F8A !important; color: #FFFFFF !important; } .ui.inverted.teal.header { background-color: #00B5AD !important; color: #FFFFFF !important; } .ui.inverted.block.header { border-bottom: none; } /*------------------- Aligned --------------------*/ .ui.left.aligned.header { text-align: left; } .ui.right.aligned.header { text-align: right; } .ui.center.aligned.header { text-align: center; } .ui.justified.header { text-align: justify; } .ui.justified.header:after { display: inline-block; content: ''; width: 100%; } /*------------------- Floated --------------------*/ .ui.floated.header, .ui.left.floated.header { float: left; margin-top: 0em; margin-right: 0.5em; } .ui.right.floated.header { float: right; margin-top: 0em; margin-left: 0.5em; } /*------------------- Fittted --------------------*/ .ui.fitted.header { padding: 0em; } /*------------------- Dividing --------------------*/ .ui.dividing.header { padding-bottom: 0.2rem; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .ui.dividing.header .sub.header { padding-bottom: 0.5em; } .ui.dividing.header .icon { margin-bottom: 0.2em; } /*------------------- Block --------------------*/ .ui.block.header { background-color: rgba(0, 0, 0, 0.05); padding: 0.5em 1em; } /*------------------- Attached --------------------*/ .ui.attached.header { background-color: #E0E0E0; padding: 0.5em 1rem; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); } .ui.top.attached.header { margin-bottom: 0em; border-radius: 0.3125em 0.3125em 0em 0em; } .ui.bottom.attached.header { margin-top: 0em; border-radius: 0em 0em 0.3125em 0.3125em; } /* * # Semantic - Icon * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /*! * Font Awesome 3.2.1 * the iconic font designed for Bootstrap * ------------------------------------------------------------------------------ * The full suite of pictographic icons, examples, and documentation can be * found at http://fon.io. Stay up to date on Twitter at * http://twitter.com/fon. * * License * ------------------------------------------------------------------------------ * - The Font Awesome font is licensed under SIL OFL 1.1 - * http://scripts.sil.org/OFL /******************************* Icon *******************************/ @font-face { font-family: 'Icons'; src: url(../fonts/icons.eot); src: url(../fonts/icons.eot?#iefix) format('embedded-opentype'), url(../fonts/icons.svg#icons) format('svg'), url(../fonts/icons.woff) format('woff'), url(../fonts/icons.ttf) format('truetype'); font-style: normal; font-weight: normal; font-variant: normal; text-decoration: inherit; text-transform: none; } i.icon { display: inline-block; opacity: 0.75; margin: 0em 0.25em 0em 0em; width: 1.23em; height: 1em; font-family: 'Icons'; font-style: normal; line-height: 1; font-weight: normal; text-decoration: inherit; text-align: center; speak: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } i.icon.left:before { content: "\f060"; } i.icon.right:before { content: "\f061"; } i.icon.add.sign.box:before { content: "\f0fe"; } i.icon.add.sign:before { content: "\f055"; } i.icon.add:before { content: "\f067"; } i.icon.adjust:before { content: "\f042"; } i.icon.adn:before { content: "\f170"; } i.icon.align.center:before { content: "\f037"; } i.icon.align.justify:before { content: "\f039"; } i.icon.align.left:before { content: "\f036"; } i.icon.align.right:before { content: "\f038"; } i.icon.ambulance:before { content: "\f0f9"; } i.icon.anchor:before { content: "\f13d"; } i.icon.android:before { content: "\f17b"; } i.icon.angle.down:before { content: "\f107"; } i.icon.angle.left:before { content: "\f104"; } i.icon.angle.right:before { content: "\f105"; } i.icon.angle.up:before { content: "\f106"; } i.icon.apple:before { content: "\f179"; } i.icon.archive:before { content: "\f187"; } i.icon.arrow.down:before { content: "\f078"; } i.icon.arrow.left:before { content: "\f053"; } i.icon.arrow.right:before { content: "\f054"; } i.icon.arrow.sign.down:before { content: "\f13a"; } i.icon.arrow.sign.left:before { content: "\f137"; } i.icon.arrow.sign.right:before { content: "\f138"; } i.icon.arrow.sign.up:before { content: "\f139"; } i.icon.arrow.up:before { content: "\f077"; } i.icon.asterisk:before { content: "\f069"; } i.icon.attachment:before { content: "\f0c6"; } i.icon.attention:before { content: "\f06a"; } i.icon.backward:before { content: "\f04a"; } i.icon.ban.circle:before { content: "\f05e"; } i.icon.bar.chart:before { content: "\f080"; } i.icon.barcode:before { content: "\f02a"; } i.icon.beer:before { content: "\f0fc"; } i.icon.bell.outline:before { content: "\f0a2"; } i.icon.bell:before { content: "\f0f3"; } i.icon.bitbucket.sign:before { content: "\f172"; } i.icon.bitbucket:before { content: "\f171"; } i.icon.bitcoin:before { content: "\f15a"; } i.icon.bold:before { content: "\f032"; } i.icon.bolt:before { content: "\f0e7"; } i.icon.book:before { content: "\f02d"; } i.icon.bookmark.empty:before { content: "\f097"; } i.icon.bookmark:before { content: "\f02e"; } i.icon.box.arrow.down:before { content: "\f150"; } /*rtl:ignore*/ i.icon.box.arrow.right:before { content: "\f152"; } i.icon.box.arrow.up:before { content: "\f151"; } i.icon.briefcase:before { content: "\f0b1"; } i.icon.browser:before { content: "\f022"; } i.icon.bug:before { content: "\f188"; } i.icon.building:before { content: "\f0f7"; } i.icon.bullhorn:before { content: "\f0a1"; } i.icon.bullseye:before { content: "\f140"; } i.icon.calendar.empty:before { content: "\f133"; } i.icon.calendar:before { content: "\f073"; } i.icon.camera.retro:before { content: "\f083"; } i.icon.camera:before { content: "\f030"; } i.icon.triangle.down:before { content: "\f0d7"; } i.icon.triangle.left:before { content: "\f0d9"; } i.icon.triangle.right:before { content: "\f0da"; } i.icon.triangle.up:before { content: "\f0d8"; } i.icon.cart:before { content: "\f07a"; } i.icon.certificate:before { content: "\f0a3"; } i.icon.chat.outline:before { content: "\f0e6"; } i.icon.chat:before { content: "\f086"; } i.icon.checkbox.empty:before { content: "\f096"; } i.icon.checkbox.minus:before { content: "\f147"; } i.icon.checked.checkbox:before { content: "\f046"; } i.icon.checkmark.sign:before { content: "\f14a"; } i.icon.checkmark:before { content: "\f00c"; } i.icon.circle.blank:before { content: "\f10c"; } i.icon.circle.down:before { content: "\f0ab"; } i.icon.circle.left:before { content: "\f0a8"; } i.icon.circle.right:before { content: "\f0a9"; } i.icon.circle.up:before { content: "\f0aa"; } i.icon.circle:before { content: "\f111"; } i.icon.cloud.download:before { content: "\f0ed"; } i.icon.cloud.upload:before { content: "\f0ee"; } i.icon.cloud:before { content: "\f0c2"; } i.icon.code.fork:before { content: "\f126"; } i.icon.code:before { content: "\f121"; } i.icon.coffee:before { content: "\f0f4"; } i.icon.collapse:before { content: "\f117"; } i.icon.comment.outline:before { content: "\f0e5"; } i.icon.comment:before { content: "\f075"; } i.icon.copy:before { content: "\f0c5"; } i.icon.crop:before { content: "\f125"; } i.icon.css3:before { content: "\f13c"; } i.icon.cut:before { content: "\f0c4"; } i.icon.dashboard:before { content: "\f0e4"; } i.icon.desktop:before { content: "\f108"; } i.icon.doctor:before { content: "\f0f0"; } i.icon.dollar:before { content: "\f155"; } i.icon.double.angle.down:before { content: "\f103"; } i.icon.double.angle.left:before { content: "\f100"; } i.icon.double.angle.right:before { content: "\f101"; } i.icon.double.angle.up:before { content: "\f102"; } i.icon.down:before { content: "\f063"; } i.icon.download.disk:before { content: "\f019"; } i.icon.download:before { content: "\f01a"; } i.icon.dribbble:before { content: "\f17d"; } i.icon.dropbox:before { content: "\f16b"; } i.icon.edit.sign:before { content: "\f14b"; } i.icon.edit:before { content: "\f044"; } i.icon.eject:before { content: "\f052"; } i.icon.ellipsis.horizontal:before { content: "\f141"; } i.icon.ellipsis.vertical:before { content: "\f142"; } i.icon.eraser:before { content: "\f12d"; } i.icon.euro:before { content: "\f153"; } i.icon.exchange:before { content: "\f0ec"; } i.icon.exclamation:before { content: "\f12a"; } i.icon.expand:before { content: "\f116"; } i.icon.external.url.sign:before { content: "\f14c"; } i.icon.external.url:before { content: "\f08e"; } i.icon.facebook.sign:before { content: "\f082"; } i.icon.facebook:before { content: "\f09a"; } i.icon.facetime.video:before { content: "\f03d"; } i.icon.fast.backward:before { content: "\f049"; } i.icon.fast.forward:before { content: "\f050"; } i.icon.female:before { content: "\f182"; } i.icon.fighter.jet:before { content: "\f0fb"; } i.icon.file.outline:before { content: "\f016"; } i.icon.file.text.outline:before { content: "\f0f6"; } i.icon.file.text:before { content: "\f15c"; } i.icon.file:before { content: "\f15b"; } i.icon.filter:before { content: "\f0b0"; } i.icon.fire.extinguisher:before { content: "\f134"; } i.icon.fire:before { content: "\f06d"; } i.icon.flag.checkered:before { content: "\f11e"; } i.icon.flag.empty:before { content: "\f11d"; } i.icon.flag:before { content: "\f024"; } i.icon.flickr:before { content: "\f16e"; } i.icon.folder.open.outline:before { content: "\f115"; } i.icon.folder.open:before { content: "\f07c"; } i.icon.folder.outline:before { content: "\f114"; } i.icon.folder:before { content: "\f07b"; } i.icon.font:before { content: "\f031"; } i.icon.food:before { content: "\f0f5"; } i.icon.forward.mail:before { content: "\f064"; } i.icon.forward:before { content: "\f04e"; } i.icon.foursquare:before { content: "\f180"; } i.icon.frown:before { content: "\f119"; } i.icon.fullscreen:before { content: "\f0b2"; } i.icon.gamepad:before { content: "\f11b"; } i.icon.gift:before { content: "\f06b"; } i.icon.github.alternate:before { content: "\f09b"; } i.icon.github.sign:before { content: "\f092"; } i.icon.github:before { content: "\f113"; } i.icon.gittip:before { content: "\f184"; } i.icon.glass:before { content: "\f000"; } i.icon.globe:before { content: "\f0ac"; } i.icon.google.plus.sign:before { content: "\f0d4"; } i.icon.google.plus:before { content: "\f0d5"; } i.icon.h.sign:before { content: "\f0fd"; } i.icon.hand.down:before { content: "\f0a7"; } i.icon.hand.left:before { content: "\f0a5"; } i.icon.hand.right:before { content: "\f0a4"; } i.icon.hand.up:before { content: "\f0a6"; } i.icon.hdd:before { content: "\f0a0"; } i.icon.headphones:before { content: "\f025"; } i.icon.heart.empty:before { content: "\f08a"; } i.icon.heart:before { content: "\f004"; } i.icon.help:before { content: "\f059"; } i.icon.hide:before { content: "\f070"; } i.icon.home:before { content: "\f015"; } i.icon.hospital:before { content: "\f0f8"; } i.icon.html5:before { content: "\f13b"; } i.icon.inbox:before { content: "\f01c"; } i.icon.indent.left:before { content: "\f03b"; } i.icon.indent.right:before { content: "\f03c"; } i.icon.info.letter:before { content: "\f129"; } i.icon.info:before { content: "\f05a"; } i.icon.instagram:before { content: "\f16d"; } i.icon.italic:before { content: "\f033"; } i.icon.key:before { content: "\f084"; } i.icon.keyboard:before { content: "\f11c"; } i.icon.lab:before { content: "\f0c3"; } i.icon.laptop:before { content: "\f109"; } i.icon.layout.block:before { content: "\f009"; } i.icon.layout.column:before { content: "\f0db"; } i.icon.layout.grid:before { content: "\f00a"; } i.icon.layout.list:before { content: "\f00b"; } i.icon.leaf:before { content: "\f06c"; } i.icon.legal:before { content: "\f0e3"; } i.icon.lemon:before { content: "\f094"; } i.icon.level.down:before { content: "\f149"; } i.icon.level.up:before { content: "\f148"; } i.icon.lightbulb:before { content: "\f0eb"; } i.icon.linkedin.sign:before { content: "\f08c"; } i.icon.linkedin:before { content: "\f0e1"; } i.icon.linux:before { content: "\f17c"; } i.icon.list.ordered:before { content: "\f0cb"; } i.icon.list.unordered:before { content: "\f0ca"; } i.icon.list:before { content: "\f03a"; } i.icon.loading:before { content: "\f110"; } i.icon.location:before { content: "\f124"; } i.icon.lock:before { content: "\f023"; } i.icon.long.arrow.down:before { content: "\f175"; } i.icon.long.arrow.left:before { content: "\f177"; } i.icon.long.arrow.right:before { content: "\f178"; } i.icon.long.arrow.up:before { content: "\f176"; } i.icon.magic:before { content: "\f0d0"; } i.icon.magnet:before { content: "\f076"; } i.icon.mail.outline:before { content: "\f003"; } i.icon.mail.reply:before { content: "\f112"; } i.icon.mail:before { content: "\f0e0"; } i.icon.male:before { content: "\f183"; } i.icon.map.marker:before { content: "\f041"; } i.icon.map:before { content: "\f14e"; } i.icon.maxcdn:before { content: "\f136"; } i.icon.medkit:before { content: "\f0fa"; } i.icon.meh:before { content: "\f11a"; } i.icon.minus.sign.alternate:before { content: "\f146"; } i.icon.minus.sign:before { content: "\f056"; } i.icon.minus:before { content: "\f068"; } i.icon.mobile:before { content: "\f10b"; } i.icon.money:before { content: "\f0d6"; } i.icon.moon:before { content: "\f186"; } i.icon.move:before { content: "\f047"; } i.icon.music:before { content: "\f001"; } i.icon.mute:before { content: "\f131"; } i.icon.off:before { content: "\f011"; } i.icon.ok.circle:before { content: "\f05d"; } i.icon.ok.sign:before { content: "\f058"; } i.icon.paste:before { content: "\f0ea"; } i.icon.pause:before { content: "\f04c"; } i.icon.payment:before { content: "\f09d"; } i.icon.pencil:before { content: "\f040"; } i.icon.phone.sign:before { content: "\f098"; } i.icon.phone:before { content: "\f095"; } i.icon.photo:before { content: "\f03e"; } i.icon.pin:before { content: "\f08d"; } i.icon.pinterest.sign:before { content: "\f0d3"; } i.icon.pinterest:before { content: "\f0d2"; } i.icon.plane:before { content: "\f072"; } i.icon.play.circle:before { content: "\f01d"; } i.icon.play.sign:before { content: "\f144"; } i.icon.play:before { content: "\f04b"; } i.icon.pound:before { content: "\f154"; } i.icon.print:before { content: "\f02f"; } i.icon.puzzle.piece:before { content: "\f12e"; } i.icon.qr.code:before { content: "\f029"; } i.icon.question:before { content: "\f128"; } i.icon.quote.left:before { content: "\f10d"; } i.icon.quote.right:before { content: "\f10e"; } i.icon.refresh:before { content: "\f021"; } i.icon.remove.circle:before { content: "\f05c"; } i.icon.remove.sign:before { content: "\f057"; } i.icon.remove:before { content: "\f00d"; } i.icon.renren:before { content: "\f18b"; } i.icon.reorder:before { content: "\f0c9"; } i.icon.repeat:before { content: "\f01e"; } i.icon.reply.all.mail:before { content: "\f122"; } i.icon.resize.full:before { content: "\f065"; } i.icon.resize.horizontal:before { content: "\f07e"; } i.icon.resize.small:before { content: "\f066"; } i.icon.resize.vertical:before { content: "\f07d"; } i.icon.retweet:before { content: "\f079"; } i.icon.road:before { content: "\f018"; } i.icon.rocket:before { content: "\f135"; } i.icon.rss.sign:before { content: "\f143"; } i.icon.rss:before { content: "\f09e"; } i.icon.rupee:before { content: "\f156"; } i.icon.save:before { content: "\f0c7"; } i.icon.screenshot:before { content: "\f05b"; } i.icon.search:before { content: "\f002"; } i.icon.setting:before { content: "\f013"; } i.icon.settings:before { content: "\f085"; } i.icon.share.sign:before { content: "\f14d"; } i.icon.share:before { content: "\f045"; } i.icon.shield:before { content: "\f132"; } i.icon.shuffle:before { content: "\f074"; } i.icon.sign.in:before { content: "\f090"; } i.icon.sign.out:before { content: "\f08b"; } i.icon.sign:before { content: "\f0c8"; } i.icon.signal:before { content: "\f012"; } i.icon.sitemap:before { content: "\f0e8"; } i.icon.skype:before { content: "\f17e"; } i.icon.smile:before { content: "\f118"; } i.icon.sort.ascending:before { content: "\f0de"; } i.icon.sort.descending:before { content: "\f0dd"; } i.icon.sort.alphabet.descending:before { content: "\f15e"; } i.icon.sort.alphabet:before { content: "\f15d"; } i.icon.sort.attributes.descending:before { content: "\f161"; } i.icon.sort.attributes:before { content: "\f160"; } i.icon.sort.order.descending:before { content: "\f163"; } i.icon.sort.order:before { content: "\f162"; } i.icon.sort:before { content: "\f0dc"; } i.icon.stackexchange:before { content: "\f16c"; } i.icon.star.empty:before { content: "\f006"; } i.icon.star.half.empty:before { content: "\f123"; } i.icon.star.half.full:before, i.icon.star.half:before { content: "\f089"; } i.icon.star:before { content: "\f005"; } i.icon.step.backward:before { content: "\f048"; } i.icon.step.forward:before { content: "\f051"; } i.icon.stethoscope:before { content: "\f0f1"; } i.icon.stop:before { content: "\f04d"; } i.icon.strikethrough:before { content: "\f0cc"; } i.icon.subscript:before { content: "\f12c"; } i.icon.suitcase:before { content: "\f0f2"; } i.icon.sun:before { content: "\f185"; } i.icon.superscript:before { content: "\f12b"; } i.icon.table:before { content: "\f0ce"; } i.icon.tablet:before { content: "\f10a"; } i.icon.tag:before { content: "\f02b"; } i.icon.tags:before { content: "\f02c"; } i.icon.tasks:before { content: "\f0ae"; } i.icon.terminal:before { content: "\f120"; } i.icon.text.height:before { content: "\f034"; } i.icon.text.width:before { content: "\f035"; } i.icon.thumbs.down.outline:before { content: "\f088"; } i.icon.thumbs.down:before { content: "\f165"; } i.icon.thumbs.up.outline:before { content: "\f087"; } i.icon.thumbs.up:before { content: "\f164"; } i.icon.ticket:before { content: "\f145"; } i.icon.time:before { content: "\f017"; } i.icon.tint:before { content: "\f043"; } i.icon.trash:before { content: "\f014"; } i.icon.trello:before { content: "\f181"; } i.icon.trophy:before { content: "\f091"; } i.icon.truck:before { content: "\f0d1"; } i.icon.tumblr.sign:before { content: "\f174"; } i.icon.tumblr:before { content: "\f173"; } i.icon.twitter.sign:before { content: "\f081"; } i.icon.twitter:before { content: "\f099"; } i.icon.umbrella:before { content: "\f0e9"; } i.icon.underline:before { content: "\f0cd"; } i.icon.undo:before { content: "\f0e2"; } i.icon.unhide:before { content: "\f06e"; } i.icon.unlink:before { content: "\f127"; } i.icon.unlock.alternate:before { content: "\f13e"; } i.icon.unlock:before { content: "\f09c"; } i.icon.unmute:before { content: "\f130"; } i.icon.up:before { content: "\f062"; } i.icon.upload.disk:before { content: "\f093"; } i.icon.upload:before { content: "\f01b"; } i.icon.url:before { content: "\f0c1"; } i.icon.user:before { content: "\f007"; } i.icon.users:before { content: "\f0c0"; } i.icon.video:before { content: "\f008"; } i.icon.vk:before { content: "\f189"; } i.icon.volume.down:before { content: "\f027"; } i.icon.volume.off:before { content: "\f026"; } i.icon.volume.up:before { content: "\f028"; } i.icon.warning:before { content: "\f071"; } i.icon.weibo:before { content: "\f18a"; } i.icon.windows:before { content: "\f17a"; } i.icon.won:before { content: "\f159"; } i.icon.wrench:before { content: "\f0ad"; } i.icon.xing.sign:before { content: "\f169"; } i.icon.xing:before { content: "\f168"; } i.icon.yen:before { content: "\f157"; } i.icon.youtube.play:before { content: "\f16a"; } i.icon.youtube.sign:before { content: "\f166"; } i.icon.youtube:before { content: "\f167"; } i.icon.yuan:before { content: "\f158"; } i.icon.zoom.in:before { content: "\f00e"; } i.icon.zoom.out:before { content: "\f010"; } /*-------------- Aliases ---------------*/ i.icon.check:before { content: "\f00c"; } i.icon.close:before { content: "\f00d"; } i.icon.delete:before { content: "\f00d"; } i.icon.like:before { content: "\f004"; } i.icon.plus:before { content: "\f067"; } i.icon.signup:before { content: "\f044"; } /*-------------- Spacing Fix ---------------*/ /* stars are usually consecutive */ i.icon.star { width: auto; margin: 0em; } /* left side icons */ i.icon.left { width: auto; margin: 0em 0.5em 0em 0em; } /* right side icons */ i.icon.search, i.icon.right { width: auto; margin: 0em 0em 0em 0.5em; } /******************************* Types *******************************/ /*-------------- Loading ---------------*/ i.icon.loading { -webkit-animation: icon-loading 2s linear infinite; -moz-animation: icon-loading 2s linear infinite; -ms-animation: icon-loading 2s linear infinite; animation: icon-loading 2s linear infinite; } @keyframes icon-loading { from { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } } @-moz-keyframes icon-loading { from { -moz-transform: rotate(0deg); transform: rotate(0deg); } to { -moz-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes icon-loading { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-ms-keyframes icon-loading { from { -ms-transform: rotate(0deg); transform: rotate(0deg); } to { -ms-transform: rotate(360deg); transform: rotate(360deg); } } /******************************* States *******************************/ i.icon.hover { opacity: 1; } i.icon.active { opacity: 1; } i.emphasized.icon { opacity: 1; } i.icon.disabled { opacity: 0.3; } /******************************* Variations *******************************/ /*------------------- Link --------------------*/ i.link.icon { cursor: pointer; opacity: 0.7; -webkit-transition: opacity 0.3s ease-out; -moz-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out; } i.link.icon:hover { opacity: 1 !important; } /*------------------- Circular --------------------*/ i.circular.icon { border-radius: 500em !important; padding: 0.5em 0.35em !important; -webkit-box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset; box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset; line-height: 1 !important; width: 2em !important; height: 2em !important; } i.circular.inverted.icon { border: none; -webkit-box-shadow: none; box-shadow: none; } /*------------------- Flipped --------------------*/ i.flipped.icon, i.horizontally.flipped.icon { -webkit-transform: scale(-1, 1); -moz-transform: scale(-1, 1); -ms-transform: scale(-1, 1); transform: scale(-1, 1); } i.vertically.flipped.icon { -webkit-transform: scale(1, -1); -moz-transform: scale(1, -1); -ms-transform: scale(1, -1); transform: scale(1, -1); } /*------------------- Rotated --------------------*/ i.rotated.icon, i.right.rotated.icon, i.clockwise.rotated.icon { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } i.left.rotated.icon, i.counterclockwise.rotated.icon { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } /*------------------- Square --------------------*/ i.square.icon { width: 2em; height: 2em; padding: 0.5em 0.35em !important; -webkit-box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset; box-shadow: 0em 0em 0em 0.1em rgba(0, 0, 0, 0.1) inset; vertical-align: baseline; } i.square.inverted.icon { border: none; -webkit-box-shadow: none; box-shadow: none; } /*------------------- Inverted --------------------*/ i.inverted.icon { background-color: #222222; color: #FFFFFF; -moz-osx-font-smoothing: grayscale; } /*------------------- Colors --------------------*/ i.blue.icon { color: #6ECFF5 !important; } i.black.icon { color: #5C6166 !important; } i.green.icon { color: #A1CF64 !important; } i.red.icon { color: #D95C5C !important; } i.purple.icon { color: #564F8A !important; } i.orange.icon { color: #F05940 !important; } i.teal.icon { color: #00B5AD !important; } /*------------------- Inverted Colors --------------------*/ i.inverted.black.icon { background-color: #5C6166 !important; color: #FFFFFF !important; } i.inverted.blue.icon { background-color: #6ECFF5 !important; color: #FFFFFF !important; } i.inverted.green.icon { background-color: #A1CF64 !important; color: #FFFFFF !important; } i.inverted.red.icon { background-color: #D95C5C !important; color: #FFFFFF !important; } i.inverted.purple.icon { background-color: #564F8A !important; color: #FFFFFF !important; } i.inverted.orange.icon { background-color: #F05940 !important; color: #FFFFFF !important; } i.inverted.teal.icon { background-color: #00B5AD !important; color: #FFFFFF !important; } /*------------------- Sizes --------------------*/ i.small.icon { font-size: 0.875em; } i.icon { font-size: 1em; } i.large.icon { font-size: 1.5em; vertical-align: middle; } i.big.icon { font-size: 2em; vertical-align: middle; } i.huge.icon { font-size: 4em; vertical-align: middle; } i.massive.icon { font-size: 8em; vertical-align: middle; } /* * # Semantic - Image * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Image *******************************/ .ui.image { position: relative; display: inline-block; vertical-align: middle; max-width: 100%; background-color: rgba(0, 0, 0, 0.05); } img.ui.image { display: block; background: none; } .ui.image img { display: block; max-width: 100%; height: auto; } /******************************* States *******************************/ .ui.disabled.image { cursor: default; opacity: 0.3; } /******************************* Variations *******************************/ /*-------------- Rounded ---------------*/ .ui.rounded.images .image, .ui.rounded.images img, .ui.rounded.image img, .ui.rounded.image { border-radius: 0.3125em; } /*-------------- Circular ---------------*/ .ui.circular.images .image, .ui.circular.images img, .ui.circular.image img, .ui.circular.image { border-radius: 500rem; } /*-------------- Fluid ---------------*/ .ui.fluid.images, .ui.fluid.image, .ui.fluid.images img, .ui.fluid.image img { display: block; width: 100%; } /*-------------- Avatar ---------------*/ .ui.avatar.images .image, .ui.avatar.images img, .ui.avatar.image img, .ui.avatar.image { margin-right: 0.5em; display: inline-block; width: 2em; height: 2em; border-radius: 500rem; } /*------------------- Floated --------------------*/ .ui.floated.image, .ui.floated.images { float: left; margin-right: 1em; margin-bottom: 1em; } .ui.right.floated.images, .ui.right.floated.image { float: right; margin-bottom: 1em; margin-left: 1em; } /*-------------- Sizes ---------------*/ .ui.tiny.images .image, .ui.tiny.images img, .ui.tiny.image { width: 20px; font-size: 0.7rem; } .ui.mini.images .image, .ui.mini.images img, .ui.mini.image { width: 35px; font-size: 0.8rem; } .ui.small.images .image, .ui.small.images img, .ui.small.image { width: 80px; font-size: 0.9rem; } .ui.medium.images .image, .ui.medium.images img, .ui.medium.image { width: 300px; font-size: 1rem; } .ui.large.images .image, .ui.large.images img, .ui.large.image { width: 450px; font-size: 1.1rem; } .ui.huge.images .image, .ui.huge.images img, .ui.huge.image { width: 600px; font-size: 1.2rem; } /******************************* Groups *******************************/ .ui.images { font-size: 0em; margin: 0em -0.25rem 0rem; } .ui.images .image, .ui.images img { display: inline-block; margin: 0em 0.25em 0.5em; } /* * # Semantic - Input * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Standard *******************************/ /*-------------------- Inputs ---------------------*/ .ui.input { display: inline-block; position: relative; color: rgba(0, 0, 0, 0.7); } .ui.input input { width: 100%; font-family: "Helvetica Neue", "Helvetica", Arial; margin: 0em; padding: 0.65em 1em; font-size: 1em; background-color: #FFFFFF; border: 1px solid rgba(0, 0, 0, 0.15); outline: none; color: rgba(0, 0, 0, 0.7); border-radius: 0.3125em; -webkit-transition: background-color 0.3s ease-out, -webkit-box-shadow 0.2s ease, border-color 0.2s ease; -moz-transition: background-color 0.3s ease-out, box-shadow 0.2s ease, border-color 0.2s ease; transition: background-color 0.3s ease-out, box-shadow 0.2s ease, border-color 0.2s ease; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } /*-------------------- Placeholder ---------------------*/ /* browsers require these rules separate */ .ui.input::-webkit-input-placeholder { color: #BBBBBB; } .ui.input::-moz-placeholder { color: #BBBBBB; } /******************************* States *******************************/ /*-------------------- Active ---------------------*/ .ui.input input:active, .ui.input.down input { border-color: rgba(0, 0, 0, 0.3); background-color: #FAFAFA; } /*-------------------- Loading ---------------------*/ .ui.loading.input > .icon { background: url(../images/loader-mini.gif) no-repeat 50% 50%; } .ui.loading.input > .icon:before, .ui.loading.input > .icon:after { display: none; } /*-------------------- Focus ---------------------*/ .ui.input.focus input, .ui.input input:focus { border-color: rgba(0, 0, 0, 0.2); color: rgba(0, 0, 0, 0.85); } .ui.input.focus input input::-webkit-input-placeholder, .ui.input input:focus input::-webkit-input-placeholder { color: #AAAAAA; } .ui.input.focus input input::-moz-placeholder, .ui.input input:focus input::-moz-placeholder { color: #AAAAAA; } /*-------------------- Error ---------------------*/ .ui.input.error input { background-color: #FFFAFA; border-color: #E7BEBE; color: #D95C5C; } /* Error Placeholder */ .ui.input.error input ::-webkit-input-placeholder { color: rgba(255, 80, 80, 0.4); } .ui.input.error input ::-moz-placeholder { color: rgba(255, 80, 80, 0.4); } .ui.input.error input :focus::-webkit-input-placeholder { color: rgba(255, 80, 80, 0.7); } .ui.input.error input :focus::-moz-placeholder { color: rgba(255, 80, 80, 0.7); } /******************************* Variations *******************************/ /*-------------------- Transparent ---------------------*/ .ui.transparent.input input { border: none; background-color: transparent; } /*-------------------- Icon ---------------------*/ .ui.icon.input > .icon { cursor: default; position: absolute; opacity: 0.5; top: 0px; right: 0px; margin: 0em; width: 2.6em; height: 100%; padding-top: 0.82em; text-align: center; border-radius: 0em 0.3125em 0.3125em 0em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-transition: opacity 0.3s ease-out; -moz-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out; } .ui.icon.input > .link.icon { cursor: pointer; } .ui.icon.input input { padding-right: 3em !important; } .ui.icon.input > .circular.icon { top: 0.35em; right: 0.5em; } /* Left Side */ .ui.left.icon.input > .icon { right: auto; left: 1px; border-radius: 0.3125em 0em 0em 0.3125em; } .ui.left.icon.input > .circular.icon { right: auto; left: 0.5em; } .ui.left.icon.input > input { padding-left: 3em !important; padding-right: 1.2em !important; } /* Focus */ .ui.icon.input > input:focus ~ .icon { opacity: 1; } /*-------------------- Labeled ---------------------*/ .ui.labeled.input .corner.label { font-size: 0.7em; border-radius: 0 0.3125em; } .ui.labeled.input .left.corner.label { border-radius: 0.3125em 0; } .ui.labeled.input input { padding-right: 2.5em !important; } /* Spacing with corner label */ .ui.labeled.icon.input:not(.left) > input { padding-right: 3.25em !important; } .ui.labeled.icon.input:not(.left) > .icon { margin-right: 1.25em; } /*-------------------- Action ---------------------*/ .ui.action.input { display: table; } .ui.action.input > input { display: table-cell; border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; border-right: none; } .ui.action.input > .button, .ui.action.input > .buttons { display: table-cell; border-top-left-radius: 0px; border-bottom-left-radius: 0px; white-space: nowrap; } .ui.action.input > .button > .icon, .ui.action.input > .buttons > .button > .icon { display: inline; vertical-align: top; } .ui.fluid.action.input { display: table; width: 100%; } .ui.fluid.action.input > .button { width: 0.01%; } /*-------------------- Fluid ---------------------*/ .ui.fluid.input { display: block; } /*-------------------- Size ---------------------*/ .ui.mini.input { font-size: 0.8125em; } .ui.small.input { font-size: 0.875em; } .ui.input { font-size: 1em; } .ui.large.input { font-size: 1.125em; } .ui.big.input { font-size: 1.25em; } .ui.huge.input { font-size: 1.375em; } .ui.massive.input { font-size: 1.5em; } /* * # Semantic - Label * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Label *******************************/ .ui.label { display: inline-block; vertical-align: middle; margin: -0.25em 0.25em 0em; background-color: #E8E8E8; border-color: #E8E8E8; padding: 0.5em 0.8em; color: rgba(0, 0, 0, 0.65); text-transform: uppercase; font-weight: normal; border-radius: 0.325em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-transition: background 0.1s linear ; -moz-transition: background 0.1s linear ; transition: background 0.1s linear ; } .ui.label:first-child { margin-left: 0em; } .ui.label:last-child { margin-right: 0em; } /* Link */ a.ui.label { cursor: pointer; } /* Inside Link */ .ui.label a { cursor: pointer; color: inherit; opacity: 0.8; -webkit-transition: 0.2s opacity ease; -moz-transition: 0.2s opacity ease; transition: 0.2s opacity ease; } .ui.label a:hover { opacity: 1; } /* Detail */ .ui.label .detail { display: inline-block; margin-left: 0.5em; font-weight: bold; opacity: 0.8; } /* Icon */ .ui.label .icon { width: auto; } /* Removable label */ .ui.label .delete.icon { cursor: pointer; margin: 0em 0em 0em 0.5em; opacity: 0.7; -webkit-transition: background 0.1s linear ; -moz-transition: background 0.1s linear ; transition: background 0.1s linear ; } .ui.label .delete.icon:hover { opacity: 0.99; } /*------------------- Coupling --------------------*/ /* Padding on next content after a label */ .ui.segment > .attached.label:first-child + * { margin-top: 2.5em; } .ui.segment > .bottom.attached.label:first-child ~ :last-child { margin-top: 0em; margin-bottom: 2.5em; } /******************************* Types *******************************/ .ui.image.label { width: auto !important; margin-top: 0em; margin-bottom: 0em; padding-top: 0.4em; padding-bottom: 0.4em; line-height: 1.5em; vertical-align: baseline; text-transform: none; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; } .ui.image.label img { display: inline-block; height: 2.25em; margin: -0.4em 0.8em -0.4em -0.8em; vertical-align: top; border-radius: 0.325em 0em 0em 0.325em; } /******************************* States *******************************/ /*------------------- Disabled --------------------*/ .ui.label.disabled { opacity: 0.5; } /*------------------- Hover --------------------*/ a.ui.labels .label:hover, a.ui.label:hover { background-color: #E0E0E0; border-color: #E0E0E0; color: rgba(0, 0, 0, 0.7); } .ui.labels a.label:hover:before, a.ui.label:hover:before { background-color: #E0E0E0; color: rgba(0, 0, 0, 0.7); } /*------------------- Visible --------------------*/ .ui.labels.visible .label, .ui.label.visible { display: inline-block !important; } /*------------------- Hidden --------------------*/ .ui.labels.hidden .label, .ui.label.hidden { display: none !important; } /******************************* Variations *******************************/ /*------------------- Tag --------------------*/ .ui.tag.labels .label, .ui.tag.label { margin-left: 1em; position: relative; padding: 0.33em 1.3em 0.33em 1.4em; border-radius: 0px 3px 3px 0px; } .ui.tag.labels .label:before, .ui.tag.label:before { position: absolute; top: 0.3em; left: 0.3em; content: ''; margin-left: -1em; background-image: none; width: 1.5em; height: 1.5em; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: background 0.1s linear ; -moz-transition: background 0.1s linear ; transition: background 0.1s linear ; } .ui.tag.labels .label:after, .ui.tag.label:after { position: absolute; content: ''; top: 50%; left: -0.25em; margin-top: -0.3em; background-color: #FFFFFF; width: 0.55em; height: 0.55em; -webkit-box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3); border-radius: 100px 100px 100px 100px; } /*------------------- Ribbon --------------------*/ .ui.ribbon.label { position: relative; margin: 0em 0.2em; left: -2rem; padding-left: 2rem; border-radius: 0px 4px 4px 0px; border-color: rgba(0, 0, 0, 0.15); } .ui.ribbon.label:after { position: absolute; content: ""; top: 100%; left: 0%; border-top: 0em solid transparent; border-right-width: 1em; border-right-color: inherit; border-right-style: solid; border-bottom: 1em solid transparent; border-left: 0em solid transparent; width: 0em; height: 0em; } /*------------------- Attached --------------------*/ .ui.top.attached.label, .ui.attached.label { width: 100%; position: absolute; margin: 0em; top: 0em; left: 0em; padding: 0.75em 1em; border-radius: 4px 4px 0em 0em; } .ui.bottom.attached.label { top: auto; bottom: 0em; border-radius: 0em 0em 4px 4px; } .ui.top.left.attached.label { width: auto; margin-top: 0em !important; border-radius: 4px 0em 4px 0em; } .ui.top.right.attached.label { width: auto; left: auto; right: 0em; border-radius: 0em 4px 0em 4px; } .ui.bottom.left.attached.label { width: auto; top: auto; bottom: 0em; border-radius: 4px 0em 0em 4px; } .ui.bottom.right.attached.label { top: auto; bottom: 0em; left: auto; right: 0em; width: auto; border-radius: 4px 0em 4px 0em; } /*------------------- Corner Label --------------------*/ .ui.corner.label { background-color: transparent; position: absolute; top: 0em; right: 0em; z-index: 10; margin: 0em; width: 3em; height: 3em; padding: 0em; text-align: center; -webkit-transition: color 0.2s ease; -moz-transition: color 0.2s ease; transition: color 0.2s ease; } .ui.corner.label:after { position: absolute; content: ""; right: 0em; top: 0em; z-index: -1; width: 0em; height: 0em; border-top: 0em solid transparent; border-right: 3em solid transparent; border-bottom: 3em solid transparent; border-left: 0em solid transparent; border-right-color: inherit; -webkit-transition: border-color 0.2s ease; -moz-transition: border-color 0.2s ease; transition: border-color 0.2s ease; } .ui.corner.label .icon { font-size: 0.875em; margin: 0.5em 0em 0em 1.25em; } .ui.corner.label .text { display: inline-block; font-weight: bold; margin: 0.5em 0em 0em 1em; width: 2.5em; font-size: 0.875em; text-align: center; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } /* Coupling */ .ui.rounded.image > .ui.corner.label, .ui.input > .ui.corner.label, .ui.segment > .ui.corner.label { overflow: hidden; } .ui.segment > .ui.corner.label { top: -1px; right: -1px; } .ui.segment > .ui.left.corner.label { right: auto; left: -1px; } .ui.input > .ui.corner.label { top: 1px; right: 1px; } .ui.input > .ui.right.corner.label { right: auto; left: 1px; } /* Left Corner */ .ui.left.corner.label, .ui.left.corner.label:after { right: auto; left: 0em; } .ui.left.corner.label:after { border-top: 3em solid transparent; border-right: 3em solid transparent; border-bottom: 0em solid transparent; border-left: 0em solid transparent; border-top-color: inherit; } .ui.left.corner.label .icon { margin: 0.5em 0em 0em -1em; } .ui.left.corner.label .text { margin: 0.5em 0em 0em -1em; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } /* Hover */ .ui.corner.label:hover { background-color: transparent; } /*------------------- Fluid --------------------*/ .ui.label.fluid, .ui.fluid.labels > .label { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } /*------------------- Inverted --------------------*/ .ui.inverted.labels .label, .ui.inverted.label { color: #FFFFFF !important; } /*------------------- Colors --------------------*/ /*--- Black ---*/ .ui.black.labels .label, .ui.black.label { background-color: #5C6166 !important; border-color: #5C6166 !important; color: #FFFFFF !important; } .ui.labels .black.label:before, .ui.black.labels .label:before, .ui.black.label:before { background-color: #5C6166 !important; } /* Hover */ a.ui.black.labels .label:hover, a.ui.black.label:hover { background-color: #333333 !important; border-color: #333333 !important; } .ui.labels a.black.label:hover:before, .ui.black.labels a.label:hover:before, a.ui.black.label:hover:before { background-color: #333333 !important; } /* Corner */ .ui.black.corner.label, .ui.black.corner.label:hover { background-color: transparent !important; } /* Ribbon */ .ui.black.ribbon.label { border-color: #333333 !important; } /*--- Green ---*/ .ui.green.labels .label, .ui.green.label { background-color: #A1CF64 !important; border-color: #A1CF64 !important; color: #FFFFFF !important; } .ui.labels .green.label:before, .ui.green.labels .label:before, .ui.green.label:before { background-color: #A1CF64 !important; } /* Hover */ a.ui.green.labels .label:hover, a.ui.green.label:hover { background-color: #89B84C !important; border-color: #89B84C !important; } .ui.labels a.green.label:hover:before, .ui.green.labels a.label:hover:before, a.ui.green.label:hover:before { background-color: #89B84C !important; } /* Corner */ .ui.green.corner.label, .ui.green.corner.label:hover { background-color: transparent !important; } /* Ribbon */ .ui.green.ribbon.label { border-color: #89B84C !important; } /*--- Red ---*/ .ui.red.labels .label, .ui.red.label { background-color: #D95C5C !important; border-color: #D95C5C !important; color: #FFFFFF !important; } .ui.labels .red.label:before, .ui.red.labels .label:before, .ui.red.label:before { background-color: #D95C5C !important; } /* Corner */ .ui.red.corner.label, .ui.red.corner.label:hover { background-color: transparent !important; } /* Hover */ a.ui.red.labels .label:hover, a.ui.red.label:hover { background-color: #DE3859 !important; border-color: #DE3859 !important; color: #FFFFFF !important; } .ui.labels a.red.label:hover:before, .ui.red.labels a.label:hover:before, a.ui.red.label:hover:before { background-color: #DE3859 !important; } /* Ribbon */ .ui.red.ribbon.label { border-color: #DE3859 !important; } /*--- Blue ---*/ .ui.blue.labels .label, .ui.blue.label { background-color: #6ECFF5 !important; border-color: #6ECFF5 !important; color: #FFFFFF !important; } .ui.labels .blue.label:before, .ui.blue.labels .label:before, .ui.blue.label:before { background-color: #6ECFF5 !important; } /* Hover */ a.ui.blue.labels .label:hover, .ui.blue.labels a.label:hover, a.ui.blue.label:hover { background-color: #1AB8F3 !important; border-color: #1AB8F3 !important; color: #FFFFFF !important; } .ui.labels a.blue.label:hover:before, .ui.blue.labels a.label:hover:before, a.ui.blue.label:hover:before { background-color: #1AB8F3 !important; } /* Corner */ .ui.blue.corner.label, .ui.blue.corner.label:hover { background-color: transparent !important; } /* Ribbon */ .ui.blue.ribbon.label { border-color: #1AB8F3 !important; } /*--- Purple ---*/ .ui.purple.labels .label, .ui.purple.label { background-color: #564F8A !important; border-color: #564F8A !important; color: #FFFFFF !important; } .ui.labels .purple.label:before, .ui.purple.labels .label:before, .ui.purple.label:before { background-color: #564F8A !important; } /* Hover */ a.ui.purple.labels .label:hover, .ui.purple.labels a.label:hover, a.ui.purple.label:hover { background-color: #3E3773 !important; border-color: #3E3773 !important; color: #FFFFFF !important; } .ui.labels a.purple.label:hover:before, .ui.purple.labels a.label:hover:before, a.ui.purple.label:hover:before { background-color: #3E3773 !important; } /* Corner */ .ui.purple.corner.label, .ui.purple.corner.label:hover { background-color: transparent !important; } /* Ribbon */ .ui.purple.ribbon.label { border-color: #3E3773 !important; } /*--- Orange ---*/ .ui.orange.labels .label, .ui.orange.label { background-color: #F05940 !important; border-color: #F05940 !important; color: #FFFFFF !important; } .ui.labels .orange.label:before, .ui.orange.labels .label:before, .ui.orange.label:before { background-color: #F05940 !important; } /* Hover */ a.ui.orange.labels .label:hover, .ui.orange.labels a.label:hover, a.ui.orange.label:hover { background-color: #FF4121 !important; border-color: #FF4121 !important; color: #FFFFFF !important; } .ui.labels a.orange.label:hover:before, .ui.orange.labels a.label:hover:before, a.ui.orange.label:hover:before { background-color: #FF4121 !important; } /* Corner */ .ui.orange.corner.label, .ui.orange.corner.label:hover { background-color: transparent !important; } /* Ribbon */ .ui.orange.ribbon.label { border-color: #FF4121 !important; } /*--- Teal ---*/ .ui.teal.labels .label, .ui.teal.label { background-color: #00B5AD !important; border-color: #00B5AD !important; color: #FFFFFF !important; } .ui.labels .teal.label:before, .ui.teal.labels .label:before, .ui.teal.label:before { background-color: #00B5AD !important; } /* Hover */ a.ui.teal.labels .label:hover, .ui.teal.labels a.label:hover, a.ui.teal.label:hover { background-color: #009A93 !important; border-color: #009A93 !important; color: #FFFFFF !important; } .ui.labels a.teal.label:hover:before, .ui.teal.labels a.label:hover:before, a.ui.teal.label:hover:before { background-color: #009A93 !important; } /* Corner */ .ui.teal.corner.label, .ui.teal.corner.label:hover { background-color: transparent !important; } /* Ribbon */ .ui.teal.ribbon.label { border-color: #009A93 !important; } /*------------------- Horizontal --------------------*/ .ui.horizontal.labels .label, .ui.horizontal.label { margin: -0.125em 0.5em -0.125em 0em; padding: 0.35em 1em; min-width: 6em; text-align: center; } /*------------------- Circular --------------------*/ .ui.circular.labels .label, .ui.circular.label { min-height: 1em; max-height: 2em; padding: 0.5em !important; line-height: 1em; text-align: center; border-radius: 500rem; } /*------------------- Pointing --------------------*/ .ui.pointing.label { position: relative; } .ui.attached.pointing.label { position: absolute; } .ui.pointing.label:before { position: absolute; content: ""; width: 0.6em; height: 0.6em; background-image: none; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: 2; -webkit-transition: background 0.1s linear ; -moz-transition: background 0.1s linear ; transition: background 0.1s linear ; } /*--- Above ---*/ .ui.pointing.label:before { background-color: #E8E8E8; } .ui.pointing.label, .ui.pointing.above.label { margin-top: 1em; } .ui.pointing.label:before, .ui.pointing.above.label:before { margin-left: -0.3em; top: -0.3em; left: 50%; } /*--- Below ---*/ .ui.pointing.below.label { margin-top: 0em; margin-bottom: 1em; } .ui.pointing.below.label:before { margin-left: -0.3em; top: auto; right: auto; bottom: -0.3em; left: 50%; } /*--- Left ---*/ .ui.pointing.left.label { margin-top: 0em; margin-left: 1em; } .ui.pointing.left.label:before { margin-top: -0.3em; bottom: auto; right: auto; top: 50%; left: 0em; } /*--- Right ---*/ .ui.pointing.right.label { margin-top: 0em; margin-right: 1em; } .ui.pointing.right.label:before { margin-top: -0.3em; right: -0.3em; top: 50%; bottom: auto; left: auto; } /*------------------ Floating Label -------------------*/ .ui.floating.label { position: absolute; z-index: 100; top: -1em; left: 100%; margin: 0em 0em 0em -1.5em !important; } /*------------------- Sizes --------------------*/ .ui.small.labels .label, .ui.small.label { font-size: 0.75rem; } .ui.label { font-size: 0.8125rem; } .ui.large.labels .label, .ui.large.label { font-size: 0.875rem; } .ui.huge.labels .label, .ui.huge.label { font-size: 1rem; } /* * # Semantic - Loader * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Loader *******************************/ /* Standard Size */ .ui.loader { display: none; position: absolute; top: 50%; left: 50%; margin: 0px; z-index: 1000; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .ui.dimmer .loader { display: block; } /******************************* Types *******************************/ /*------------------- Text --------------------*/ .ui.text.loader { width: auto !important; height: auto !important; text-align: center; font-style: normal; } .ui.mini.text.loader { min-width: 16px; padding-top: 2em; font-size: 0.875em; } .ui.small.text.loader { min-width: 24px; padding-top: 2.5em; font-size: 0.875em; } .ui.text.loader { min-width: 32px; font-size: 1em; padding-top: 3em; } .ui.large.text.loader { min-width: 64px; padding-top: 5em; font-size: 1.2em; } /******************************* States *******************************/ .ui.loader.active, .ui.loader.visible { display: block; } .ui.loader.disabled, .ui.loader.hidden { display: none; } /******************************* Variations *******************************/ /*------------------- Inverted --------------------*/ .ui.dimmer .ui.text.loader, .ui.inverted.text.loader { color: rgba(255, 255, 255, 0.8); } .ui.inverted.dimmer .ui.text.loader { color: rgba(0, 0, 0, 0.8); } /* Tiny Size */ .ui.dimmer .mini.ui.loader, .ui.inverted .mini.ui.loader { background-image: url(../images/loader-mini-inverted.gif); } /* Small Size */ .ui.dimmer .small.ui.loader, .ui.inverted .small.ui.loader { background-image: url(../images/loader-small-inverted.gif); } /* Standard Size */ .ui.dimmer .ui.loader, .ui.inverted.loader { background-image: url(../images/loader-medium-inverted.gif); } /* Large Size */ .ui.dimmer .large.ui.loader, .ui.inverted .large.ui.loader { background-image: url(../images/loader-large-inverted.gif); } /*------------------- Sizes --------------------*/ /* Tiny Size */ .ui.inverted.dimmer .ui.mini.loader, .ui.mini.loader { width: 16px; height: 16px; background-image: url(../images/loader-mini.gif); } /* Small Size */ .ui.inverted.dimmer .ui.small.loader, .ui.small.loader { width: 24px; height: 24px; background-image: url(../images/loader-small.gif); } .ui.inverted.dimmer .ui.loader, .ui.loader { width: 32px; height: 32px; background: url(../images/loader-medium.gif) no-repeat; background-position: 48% 0px; } /* Large Size */ .ui.inverted.dimmer .ui.loader.large, .ui.loader.large { width: 64px; height: 64px; background-image: url(../images/loader-large.gif); } /*------------------- Inline --------------------*/ .ui.inline.loader { position: static; vertical-align: middle; margin: 0em; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; } .ui.inline.loader.active, .ui.inline.loader.visible { display: inline-block; } /* * # Semantic - Progress Bar * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Progress Bar *******************************/ .ui.progress { border: 1px solid rgba(0, 0, 0, 0.1); width: 100%; height: 35px; background-color: #FAFAFA; padding: 5px; border-radius: 0.3125em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.progress .bar { display: inline-block; height: 100%; background-color: #CCCCCC; border-radius: 3px; -webkit-transition: width 1s ease-in-out, background-color 1s ease-out; -moz-transition: width 1s ease-in-out, background-color 1s ease-out; transition: width 1s ease-in-out, background-color 1s ease-out; } /******************************* States *******************************/ /*-------------- Successful ---------------*/ .ui.successful.progress .bar { background-color: #73E064 !important; } .ui.successful.progress .bar, .ui.successful.progress .bar::after { -webkit-animation: none !important; -moz-animation: none !important; animation: none !important; } .ui.warning.progress .bar { background-color: #E96633 !important; } .ui.warning.progress .bar, .ui.warning.progress .bar::after { -webkit-animation: none !important; -moz-animation: none !important; animation: none !important; } /*-------------- Failed ---------------*/ .ui.failed.progress .bar { background-color: #DF9BA4 !important; } .ui.failed.progress .bar, .ui.failed.progress .bar::after { -webkit-animation: none !important; -moz-animation: none !important; animation: none !important; } /*-------------- Active ---------------*/ .ui.active.progress .bar { position: relative; } .ui.active.progress .bar::after { content: ''; opacity: 0; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; background: #FFFFFF; border-radius: 3px; -webkit-animation: progress-active 2s ease-out infinite; -moz-animation: progress-active 2s ease-out infinite; animation: progress-active 2s ease-out infinite; } @-webkit-keyframes progress-active { 0% { opacity: 0; width: 0; } 50% { opacity: 0.3; } 100% { opacity: 0; width: 95%; } } @-moz-keyframes progress-active { 0% { opacity: 0; width: 0; } 50% { opacity: 0.3; } 100% { opacity: 0; width: 100%; } } @keyframes progress-active { 0% { opacity: 0; width: 0; } 50% { opacity: 0.3; } 100% { opacity: 0; width: 100%; } } /*-------------- Disabled ---------------*/ .ui.disabled.progress { opacity: 0.35; } .ui.disabled.progress .bar, .ui.disabled.progress .bar::after { -webkit-animation: none !important; -moz-animation: none !important; animation: none !important; } /******************************* Variations *******************************/ /*-------------- Attached ---------------*/ /* bottom attached */ .ui.progress.attached { position: relative; border: none; } .ui.progress.attached, .ui.progress.attached .bar { display: block; height: 3px; padding: 0px; overflow: hidden; border-radius: 0em 0em 0.3125em 0.3125em; } .ui.progress.attached .bar { border-radius: 0em; } /* top attached */ .ui.progress.top.attached, .ui.progress.top.attached .bar { top: -2px; border-radius: 0.3125em 0.3125em 0em 0em; } .ui.progress.top.attached .bar { border-radius: 0em; } /*-------------- Colors ---------------*/ .ui.blue.progress .bar { background-color: #6ECFF5; } .ui.black.progress .bar { background-color: #5C6166; } .ui.green.progress .bar { background-color: #A1CF64; } .ui.red.progress .bar { background-color: #EF4D6D; } .ui.purple.progress .bar { background-color: #564F8A; } .ui.teal.progress .bar { background-color: #00B5AD; } /*-------------- Striped ---------------*/ .ui.progress.striped .bar { -webkit-background-size: 30px 30px; background-size: 30px 30px; background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent)); background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -moz-linear-gradient(135deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -webkit-linear-gradient(315deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -moz-linear-gradient(315deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); } .ui.progress.active.striped .bar:after { -webkit-animation: none; -moz-animation: none; -ms-animation: none; animation: none; } .ui.progress.active.striped .bar { -webkit-animation: progress-striped 3s linear infinite; -moz-animation: progress-striped 3s linear infinite; animation: progress-striped 3s linear infinite; } @-webkit-keyframes progress-striped { 0% { background-position: 0px 0; } 100% { background-position: 60px 0; } } @-moz-keyframes progress-striped { 0% { background-position: 0px 0; } 100% { background-position: 60px 0; } } @keyframes progress-striped { 0% { background-position: 0px 0; } 100% { background-position: 60px 0; } } /*-------------- Sizes ---------------*/ .ui.small.progress .bar { height: 14px; } /* * # Semantic - Reveal * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Reveal *******************************/ .ui.reveal { display: inline-block; position: relative !important; z-index: 2 !important; font-size: 0em !important; } .ui.reveal > .content { font-size: 1rem !important; } .ui.reveal > .visible.content { -webkit-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; -moz-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; } .ui.reveal > .visible.content { position: absolute !important; top: 0em !important; left: 0em !important; z-index: 4 !important; -webkit-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; -moz-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; } .ui.reveal > .hidden.content { position: relative !important; z-index: 3 !important; } /*------------------ Loose Coupling -------------------*/ .ui.reveal.button { overflow: hidden; } /******************************* Types *******************************/ /*-------------- Slide ---------------*/ .ui.slide.reveal { position: relative !important; display: block; overflow: hidden !important; white-space: nowrap; } .ui.slide.reveal > .content { display: block; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; margin: 0em; -webkit-transition: top 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, left 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, right 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, bottom 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; -moz-transition: top 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, left 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, right 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, bottom 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; transition: top 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, left 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, right 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s, bottom 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; } .ui.slide.reveal > .visible.content { position: relative !important; } .ui.slide.reveal > .hidden.content { position: absolute !important; left: 100% !important; width: 100% !important; } .ui.slide.reveal:hover > .visible.content, .ui.slide.reveal:focus > .visible.content { left: -100% !important; } .ui.slide.reveal:hover > .hidden.content, .ui.slide.reveal:focus > .hidden.content { left: 0% !important; } .ui.right.slide.reveal > .visible.content { left: 0%; } .ui.right.slide.reveal > .hidden.content { left: auto !important; right: 100% !important; } .ui.right.slide.reveal:hover > .visible.content, .ui.right.slide.reveal:focus > .visible.content { left: 100% !important; right: auto !important; } .ui.right.slide.reveal:hover > .hidden.content, .ui.right.slide.reveal:focus > .hidden.content { left: auto !important; right: 0% !important; } .ui.up.slide.reveal > .visible.content { top: 0% !important; left: 0% !important; right: auto !important; bottom: auto !important; } .ui.up.slide.reveal > .hidden.content { top: 100% !important; left: 0% !important; right: auto !important; bottom: auto !important; } .ui.slide.up.reveal:hover > .visible.content, .ui.slide.up.reveal:focus > .visible.content { top: -100% !important; left: 0% !important; } .ui.slide.up.reveal:hover > .hidden.content, .ui.slide.up.reveal:focus > .hidden.content { top: 0% !important; left: 0% !important; } .ui.down.slide.reveal > .visible.content { top: auto !important; right: auto !important; bottom: auto !important; bottom: 0% !important; } .ui.down.slide.reveal > .hidden.content { top: auto !important; right: auto !important; bottom: 100% !important; left: 0% !important; } .ui.slide.down.reveal:hover > .visible.content, .ui.slide.down.reveal:focus > .visible.content { left: 0% !important; bottom: -100% !important; } .ui.slide.down.reveal:hover > .hidden.content, .ui.slide.down.reveal:focus > .hidden.content { left: 0% !important; bottom: 0% !important; } /*-------------- Fade ---------------*/ .ui.fade.reveal > .hidden.content { -webkit-transition: opacity 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; -moz-transition: opacity 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; transition: opacity 0.8s cubic-bezier(0.175, 0.885, 0.32, 1) 0.15s; } .ui.fade.reveal > .hidden.content { z-index: 5 !important; opacity: 0; } .ui.fade.reveal:hover > .hidden.content { opacity: 1; } /*-------------- Move ---------------*/ .ui.move.reveal > .visible.content, .ui.move.left.reveal > .visible.content { left: auto !important; top: auto !important; bottom: auto !important; right: 0% !important; } .ui.move.reveal:hover > .visible.content, .ui.move.left.reveal:hover > .visible.content, .ui.move.reveal:focus > .visible.content, .ui.move.left.reveal:focus > .visible.content { right: 100% !important; } .ui.move.right.reveal > .visible.content { right: auto !important; top: auto !important; bottom: auto !important; left: 0% !important; } .ui.move.right.reveal:hover > .visible.content, .ui.move.right.reveal:focus > .visible.content { left: 100% !important; } .ui.move.up.reveal > .visible.content { right: auto !important; left: auto !important; top: auto !important; bottom: 0% !important; } .ui.move.up.reveal:hover > .visible.content, .ui.move.up.reveal:focus > .visible.content { bottom: 100% !important; } .ui.move.down.reveal > .visible.content { right: auto !important; left: auto !important; top: 0% !important; bottom: auto !important; } .ui.move.down.reveal:hover > .visible.content, .ui.move.down.reveal:focus > .visible.content { top: 100% !important; } /*-------------- Rotate ---------------*/ .ui.rotate.reveal > .visible.content { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } .ui.rotate.reveal > .visible.content, .ui.rotate.right.reveal > .visible.content { -webkit-transform-origin: bottom right; -moz-transform-origin: bottom right; -ms-transform-origin: bottom right; transform-origin: bottom right; } .ui.rotate.reveal:hover > .visible.content, .ui.rotate.right.reveal:hover > .visible.content, .ui.rotate.reveal:focus > .visible.content, .ui.rotate.right.reveal:focus > .visible.content { -webkit-transform: rotate(110deg); -moz-transform: rotate(110deg); -ms-transform: rotate(110deg); transform: rotate(110deg); } .ui.rotate.left.reveal > .visible.content { -webkit-transform-origin: bottom left; -moz-transform-origin: bottom left; -ms-transform-origin: bottom left; transform-origin: bottom left; } .ui.rotate.left.reveal:hover > .visible.content, .ui.rotate.left.reveal:focus > .visible.content { -webkit-transform: rotate(-110deg); -moz-transform: rotate(-110deg); -ms-transform: rotate(-110deg); transform: rotate(-110deg); } /******************************* States *******************************/ .ui.disabled.reveal { opacity: 1 !important; } .ui.disabled.reveal > .content { -webkit-transition: none !important; -moz-transition: none !important; transition: none !important; } .ui.disabled.reveal:hover > .visible.content, .ui.disabled.reveal:focus > .visible.content { position: static !important; display: block !important; opacity: 1 !important; top: 0 !important; left: 0 !important; right: auto !important; bottom: auto !important; -webkit-transform: none !important; -moz-transform: none !important; -ms-transform: none !important; transform: none !important; } .ui.disabled.reveal:hover > .hidden.content, .ui.disabled.reveal:focus > .hidden.content { display: none !important; } /******************************* Variations *******************************/ /*-------------- Masked ---------------*/ .ui.masked.reveal { overflow: hidden; } /*-------------- Instant ---------------*/ .ui.instant.reveal > .content { -webkit-transition-delay: 0s !important; -moz-transition-delay: 0s !important; transition-delay: 0s !important; } /* * # Semantic - Segment * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Segment *******************************/ .ui.segment { position: relative; background-color: #FFFFFF; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); margin: 1em 0em; padding: 1em; border-radius: 5px 5px 5px 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.segment:first-child { margin-top: 0em; } .ui.segment:last-child { margin-bottom: 0em; } .ui.segment:after { content: ''; display: block; height: 0; clear: both; visibility: hidden; } .ui.vertical.segment { margin: 0em; padding-left: 0em; padding-right: 0em; background-color: transparent; border-radius: 0px; -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.1); } .ui.vertical.segment:first-child { padding-top: 0em; } .ui.horizontal.segment { margin: 0em; padding-top: 0em; padding-bottom: 0em; background-color: transparent; border-radius: 0px; -webkit-box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.1); box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.1); } .ui.horizontal.segment:first-child { padding-left: 0em; } /*------------------- Loose Coupling --------------------*/ .ui.pointing.menu ~ .ui.attached.segment { top: 1px; } .ui.page.grid.segment .ui.grid .ui.segment.column { padding-top: 2rem; padding-bottom: 2rem; } .ui.grid.segment, .ui.grid .ui.segment.row, .ui.grid .ui.segment.column { border-radius: 0em; -webkit-box-shadow: none; box-shadow: none; border: none; } /* No padding on edge content */ .ui.segment > :first-child { margin-top: 0em; } .ui.segment > :last-child { margin-bottom: 0em; } /******************************* Types *******************************/ /*------------------- Piled --------------------*/ .ui.piled.segment { margin: 2em 0em; -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15); -ms-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15); -o-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15); box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15); } .ui.piled.segment:first-child { margin-top: 0em; } .ui.piled.segment:last-child { margin-bottom: 0em; } .ui.piled.segment:after, .ui.piled.segment:before { background-color: #FFFFFF; visibility: visible; content: ""; display: block; height: 100%; left: -1px; position: absolute; width: 100%; -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1); } .ui.piled.segment:after { -webkit-transform: rotate(1.2deg); -moz-transform: rotate(1.2deg); -ms-transform: rotate(1.2deg); transform: rotate(1.2deg); top: 0; z-index: -1; } .ui.piled.segment:before { -webkit-transform: rotate(-1.2deg); -moz-transform: rotate(-1.2deg); -ms-transform: rotate(-1.2deg); transform: rotate(-1.2deg); top: 0; z-index: -2; } /*------------------- Stacked --------------------*/ .ui.stacked.segment { padding-bottom: 1.7em; } .ui.stacked.segment:after, .ui.stacked.segment:before { content: ''; position: absolute; bottom: -3px; left: 0%; border-top: 1px solid rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.02); width: 100%; height: 5px; visibility: visible; } .ui.stacked.segment:before { bottom: 0px; } /* Inverted */ .ui.stacked.inverted.segment:after, .ui.stacked.inverted.segment:before { background-color: rgba(255, 255, 255, 0.1); border-top: 1px solid rgba(255, 255, 255, 0.35); } /*------------------- Circular --------------------*/ .ui.circular.segment { display: table-cell; padding: 2em; text-align: center; vertical-align: middle; border-radius: 500em; } /*------------------- Raised --------------------*/ .ui.raised.segment { -webkit-box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1); } /******************************* States *******************************/ .ui.disabled.segment { opacity: 0.8; color: #DDDDDD; } /******************************* Variations *******************************/ /*------------------- Basic --------------------*/ .ui.basic.segment { position: relative; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; border-radius: 0px; } .ui.basic.segment:first-child { padding-top: 0em; } .ui.basic.segment:last-child { padding-bottom: 0em; } /*------------------- Fittted --------------------*/ .ui.fitted.segment { padding: 0em; } /*------------------- Colors --------------------*/ .ui.blue.segment { border-top: 0.2em solid #6ECFF5; } .ui.green.segment { border-top: 0.2em solid #A1CF64; } .ui.red.segment { border-top: 0.2em solid #D95C5C; } .ui.orange.segment { border-top: 0.2em solid #F05940; } .ui.purple.segment { border-top: 0.2em solid #564F8A; } .ui.teal.segment { border-top: 0.2em solid #00B5AD; } /*------------------- Inverted Colors --------------------*/ .ui.inverted.black.segment { background-color: #5C6166 !important; color: #FFFFFF !important; } .ui.inverted.blue.segment { background-color: #6ECFF5 !important; color: #FFFFFF !important; } .ui.inverted.green.segment { background-color: #A1CF64 !important; color: #FFFFFF !important; } .ui.inverted.red.segment { background-color: #D95C5C !important; color: #FFFFFF !important; } .ui.inverted.orange.segment { background-color: #F05940 !important; color: #FFFFFF !important; } .ui.inverted.purple.segment { background-color: #564F8A !important; color: #FFFFFF !important; } .ui.inverted.teal.segment { background-color: #00B5AD !important; color: #FFFFFF !important; } /*------------------- Aligned --------------------*/ .ui.left.aligned.segment { text-align: left; } .ui.right.aligned.segment { text-align: right; } .ui.center.aligned.segment { text-align: center; } .ui.justified.segment { text-align: justify; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } /*------------------- Floated --------------------*/ .ui.floated.segment, .ui.left.floated.segment { float: left; } .ui.right.floated.segment { float: right; } /*------------------- Inverted --------------------*/ .ui.inverted.segment { border: none; -webkit-box-shadow: none; box-shadow: none; } .ui.inverted.segment .segment { color: rgba(0, 0, 0, 0.7); } .ui.inverted.segment .inverted.segment { color: #FFFFFF; } .ui.inverted.segment, .ui.primary.inverted.segment { background-color: #222222; color: #FFFFFF; } /*------------------- Ordinality --------------------*/ .ui.primary.segment { background-color: #FFFFFF; color: #555555; } .ui.secondary.segment { background-color: #FAF9FA; color: #777777; } .ui.tertiary.segment { background-color: #EBEBEB; color: #B0B0B0; } .ui.secondary.inverted.segment { background-color: #555555; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.3))); background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%); background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.3)), to(rgba(255, 255, 255, 0.3))); background-image: linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%); color: #FAFAFA; } .ui.tertiary.inverted.segment { background-color: #555555; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(255, 255, 255, 0.6)), to(rgba(255, 255, 255, 0.6))); background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.6) 100%); background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.6) 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.6)), to(rgba(255, 255, 255, 0.6))); background-image: linear-gradient(rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.6) 100%); color: #EEEEEE; } /*------------------- Attached --------------------*/ .ui.segment.attached { top: -1px; bottom: -1px; border-radius: 0px; margin: 0em; -webkit-box-shadow: 0px 0px 0px 1px #DDDDDD; box-shadow: 0px 0px 0px 1px #DDDDDD; } .ui.top.attached.segment { top: 0px; bottom: -1px; margin-top: 1em; margin-bottom: 0em; border-radius: 5px 5px 0px 0px; } .ui.segment.top.attached:first-child { margin-top: 0em; } .ui.segment.bottom.attached { top: -1px; bottom: 0px; margin-top: 0em; margin-bottom: 1em; border-radius: 0px 0px 5px 5px; } .ui.segment.bottom.attached:last-child { margin-bottom: 0em; } /* * # Semantic - Steps * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Step *******************************/ .ui.step, .ui.steps .step { display: inline-block; position: relative; padding: 1em 2em 1em 3em; vertical-align: top; background-color: #FFFFFF; color: #888888; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.step:after, .ui.steps .step:after { position: absolute; z-index: 2; content: ''; top: 0.42em; right: -1em; border: medium none; background-color: #FFFFFF; width: 2.2em; height: 2.2em; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-box-shadow: -1px -1px 0 0 rgba(0, 0, 0, 0.15) inset; box-shadow: -1px -1px 0 0 rgba(0, 0, 0, 0.15) inset; } .ui.step, .ui.steps .step, .ui.steps .step:after { -webkit-transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease; -moz-transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease; transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, box-shadow 0.1s ease; } /******************************* Types *******************************/ /* Vertical */ .ui.vertical.steps { overflow: visible; } .ui.vertical.steps .step { display: block; border-radius: 0em; padding: 1em 2em; } .ui.vertical.steps .step:first-child { padding: 1em 2em; border-radius: 0em; border-top-left-radius: 0.3125rem; border-top-right-radius: 0.3125rem; } .ui.vertical.steps .active.step:first-child { border-top-right-radius: 0rem; } .ui.vertical.steps .step:last-child { border-radius: 0em; border-bottom-left-radius: 0.3125rem; border-bottom-right-radius: 0.3125rem; } .ui.vertical.steps .active.step:last-child { border-bottom-right-radius: 0rem; } /* Arrow */ .ui.vertical.steps .step:after { display: none; } /* Active Arrow */ .ui.vertical.steps .active.step:after { display: block; } /* Two Line */ .ui.vertical.steps .two.line.step { line-height: 1.3; } .ui.vertical.steps .two.line.active.step:after { position: absolute; z-index: 2; content: ''; top: 0em; right: -1.45em; background-color: transparent; border-bottom: 2.35em solid transparent; border-left: 1.55em solid #555555; border-top: 2.35em solid transparent; width: 0em; height: 0em; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; } /******************************* Group *******************************/ .ui.steps { cursor: pointer; display: inline-block; font-size: 0em; overflow: hidden; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); line-height: 1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; border-radius: 0.3125rem; } .ui.steps .step:first-child { padding-left: 1.35em; border-radius: 0.3125em 0em 0em 0.3125em; } .ui.steps .step:last-child { border-radius: 0em 0.3125em 0.3125em 0em; } .ui.steps .step:only-child { border-radius: 0.3125em; } .ui.steps .step:last-child { margin-right: 0em; } .ui.steps .step:last-child:after { display: none; } /******************************* States *******************************/ /* Hover */ .ui.step:hover, .ui.step.hover { background-color: #F7F7F7; color: rgba(0, 0, 0, 0.8); } .ui.steps .step.hover:after, .ui.steps .step:hover:after, .ui.step:hover, .ui.step.hover::after { background-color: #F7F7F7; } /* Hover */ .ui.steps .step.down, .ui.steps .step:active, .ui.step.down, .ui.step:active { background-color: #F0F0F0; } .ui.steps .step.down:after, .ui.steps .step:active:after, .ui.steps.down::after, .ui.steps:active::after { background-color: #F0F0F0; } /* Active */ .ui.steps .step.active, .ui.active.step { cursor: auto; background-color: #555555; color: #FFFFFF; font-weight: bold; } .ui.steps .step.active:after, .ui.active.steps:after { background-color: #555555; -webkit-box-shadow: none; box-shadow: none; } /* Disabled */ .ui.steps .disabled.step, .ui.disabled.step { cursor: auto; background-color: #FFFFFF; color: #CBCBCB; } .ui.steps .disabled.step:after, .ui.disabled.step:after { background-color: #FFFFFF; } /******************************* Variations *******************************/ /* Attached */ .attached.ui.steps { margin: 0em; border-radius: 0.3125em 0.3125em 0em 0em; } .attached.ui.steps .step:first-child { border-radius: 0.3125em 0em 0em 0em; } .attached.ui.steps .step:last-child { border-radius: 0em 0.3125em 0em 0em; } /* Bottom Side */ .bottom.attached.ui.steps { margin-top: -1px; border-radius: 0em 0em 0.3125em 0.3125em; } .bottom.attached.ui.steps .step:first-child { border-radius: 0em 0em 0em 0.3125em; } .bottom.attached.ui.steps .step:last-child { border-radius: 0em 0em 0.3125em 0em; } /* Evenly divided */ .ui.one.steps, .ui.two.steps, .ui.three.steps, .ui.four.steps, .ui.five.steps, .ui.six.steps, .ui.seven.steps, .ui.eight.steps { display: block; } .ui.one.steps > .step { width: 100%; } .ui.two.steps > .step { width: 50%; } .ui.three.steps > .step { width: 33.333%; } .ui.four.steps > .step { width: 25%; } .ui.five.steps > .step { width: 20%; } .ui.six.steps > .step { width: 16.666%; } .ui.seven.steps > .step { width: 14.285%; } .ui.eight.steps > .step { width: 12.500%; } /******************************* Sizes *******************************/ .ui.small.step, .ui.small.steps .step { font-size: 0.8rem; } .ui.step, .ui.steps .step { font-size: 1rem; } .ui.large.step, .ui.large.steps .step { font-size: 1.25rem; } /* * # Semantic - Accordion * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Accordion *******************************/ .ui.accordion, .ui.accordion .accordion { width: 600px; max-width: 100%; font-size: 1rem; border-radius: 0.3125em; background-color: #FFFFFF; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); } .ui.accordion .title, .ui.accordion .accordion .title { cursor: pointer; margin: 0em; padding: 0.75em 1em; color: rgba(0, 0, 0, 0.6); border-top: 1px solid rgba(0, 0, 0, 0.05); -webkit-transition: background-color 0.2s ease-out; -moz-transition: background-color 0.2s ease-out; transition: background-color 0.2s ease-out; } .ui.accordion .title:first-child, .ui.accordion .accordion .title:first-child { border-top: none; } /* Content */ .ui.accordion .content, .ui.accordion .accordion .content { display: none; margin: 0em; padding: 1.3em 1em; } /* Arrow */ .ui.accordion .title .dropdown.icon, .ui.accordion .accordion .title .dropdown.icon { display: inline-block; float: none; margin: 0em 0.5em 0em 0em; -webkit-transition: -webkit-transform 0.2s ease, opacity 0.2s ease; -moz-transition: -moz-transform 0.2s ease, opacity 0.2s ease; transition: transform 0.2s ease, opacity 0.2s ease ; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } .ui.accordion .title .dropdown.icon:before, .ui.accordion .accordion .title .dropdown.icon:before { content: '\f0da' /*rtl:'\f0d9'*/; } /*-------------- Loose Coupling ---------------*/ .ui.basic.accordion.menu { background-color: #FFFFFF; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); } .ui.basic.accordion.menu .title, .ui.basic.accordion.menu .content { padding: 0em; } /******************************* Types *******************************/ /*-------------- Basic ---------------*/ .ui.basic.accordion { background-color: transparent; -webkit-box-shadow: none; box-shadow: none; } .ui.basic.accordion .title, .ui.basic.accordion .accordion .title { background-color: transparent; border-top: none; padding-left: 0em; padding-right: 0em; } .ui.basic.accordion .content, .ui.basic.accordion .accordion .content { padding: 0.5em 0em; } .ui.basic.accordion .active.title, .ui.basic.accordion .accordion .active.title { background-color: transparent; } /******************************* States *******************************/ /*-------------- Hover ---------------*/ .ui.accordion .title:hover, .ui.accordion .active.title, .ui.accordion .accordion .title:hover, .ui.accordion .accordion .active.title { color: rgba(0, 0, 0, 0.8); } /*-------------- Active ---------------*/ .ui.accordion .active.title, .ui.accordion .accordion .active.title { background-color: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.8); } .ui.accordion .active.title .dropdown.icon, .ui.accordion .accordion .active.title .dropdown.icon { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .ui.accordion .active.content, .ui.accordion .accordion .active.content { display: block; } /******************************* Variations *******************************/ /*-------------- Fluid ---------------*/ .ui.fluid.accordion, .ui.fluid.accordion .accordion { width: 100%; } /* * # Semantic - Chat Room * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Chat Room *******************************/ .ui.chatroom { background-color: #F8F8F8; width: 330px; height: 370px; padding: 0px; } .ui.chatroom .room { position: relative; background-color: #FFFFFF; overflow: hidden; height: 286px; border: 1px solid rgba(0, 0, 0, 0.1); border-top: none; border-bottom: none; } .ui.chatroom .room .loader { display: none; margin: -25px 0px 0px -25px; } /* Chat Room Actions */ .ui.chatroom .actions { overflow: hidden; background-color: #EEEEEE; padding: 4px; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 5px 5px 0px 0px; } .ui.chatroom .actions .button { float: right; margin-left: 3px; } /* Online User Count */ .ui.chatroom .actions .message { float: left; margin-left: 6px; font-size: 11px; color: #AAAAAA; text-shadow: 0px -1px 0px rgba(255, 255, 255, 0.8); line-height: 28px; } .ui.chatroom .actions .message .loader { display: inline-block; margin-right: 8px; } /* Chat Room Text Log */ .ui.chatroom .log { float: left; overflow: auto; overflow-x: hidden; overflow-y: auto; } .ui.chatroom .log .message { padding: 3px 0px; border-top: 1px dotted #DADADA; } .ui.chatroom .log .message:first-child { border-top: none; } /* status event */ .ui.chatroom .status { padding: 5px 0px; color: #AAAAAA; font-size: 12px; font-style: italic; line-height: 1.33; border-top: 1px dotted #DADADA; } .ui.chatroom .log .status:first-child { border-top: none; } .ui.chatroom .log .flag { float: left; } .ui.chatroom .log p { margin-left: 0px; } .ui.chatroom .log .author { font-weight: bold; -webkit-transition: color 0.3s ease-out; -moz-transition: color 0.3s ease-out; transition: color 0.3s ease-out; } .ui.chatroom .log a.author:hover { opacity: 0.8; } .ui.chatroom .log .message.admin p { font-weight: bold; margin: 1px 0px 0px 23px; } .ui.chatroom .log .divider { margin: -1px 0px; font-size: 11px; padding: 10px 0px; border-top: 1px solid #F8F8F8; border-bottom: 1px solid #F8F8F8; } .ui.chatroom .log .divider .rule { top: 50%; width: 15%; } .ui.chatroom .log .divider .label { color: #777777; margin: 0px; } /* Chat Room User List */ .ui.chatroom .room .list { position: relative; overflow: auto; overflow-x: hidden; overflow-y: auto; float: left; background-color: #EEEEEE; border-left: 1px solid #DDDDDD; } .ui.chatroom .room .list .user { display: table; padding: 3px 7px; border-bottom: 1px solid #DDDDDD; } .ui.chatroom .room .list .user:hover { background-color: #F8F8F8; } .ui.chatroom .room .list .image { display: table-cell; vertical-align: middle; width: 20px; } .ui.chatroom .room .list .image img { width: 20px; height: 20px; vertical-align: middle; } .ui.chatroom .room .list p { display: table-cell; vertical-align: middle; padding-left: 7px; padding-right: 14px; font-size: 11px; line-height: 1.2; font-weight: bold; } .ui.chatroom .room .list a:hover { opacity: 0.8; } /* User List Loading */ .ui.chatroom.loading .loader { display: block; } /* Chat Room Talk Input */ .ui.chatroom .talk { border: 1px solid rgba(0, 0, 0, 0.1); padding: 5px 0px 0px; background-color: #EEEEEE; border-radius: 0px 0px 5px 5px; } .ui.chatroom .talk .avatar, .ui.chatroom .talk input, .ui.chatroom .talk .button { float: left; } .ui.chatroom .talk .avatar img { display: block; width: 30px; height: 30px; margin-right: 4px; border-radius: 500rem; } .ui.chatroom .talk input { border: 1px solid #CCCCCC; margin: 0px; width: 196px; height: 14px; padding: 8px 5px; font-size: 12px; color: #555555; } .ui.chatroom .talk input.focus { border: 1px solid #AAAAAA; } .ui.chatroom .send { width: 80px; height: 32px; margin-left: -1px; padding: 4px 12px; font-size: 12px; line-height: 23px; -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset; border-radius: 0 5px 5px 0; } .ui.chatroom .talk .log-in.button { display: block; float: none; margin-top: -6px; height: 22px; border-radius: 0px 0px 4px 4px; } .ui.chatroom .talk .log-in.button i { vertical-align: text-top; } /* Quirky Flags */ .ui.chatroom .log .team.flag { width: 18px; } /* Chat room Loaded */ .ui.chatroom.loading .loader { display: block; } /* Standard Size */ .ui.chatroom { width: 330px; height: 370px; } .ui.chatroom .room .container { width: 3000px; } .ui.chatroom .log { width: 314px; height: 278px; padding: 4px 7px; } .ui.chatroom .room .list { width: 124px; height: 278px; padding: 4px 0px; } .ui.chatroom .room .list .user { width: 110px; } .ui.chatroom .talk { height: 40px; } /* * # Semantic - Checkbox * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Checkbox *******************************/ /*-------------- Standard ---------------*/ /*--- Content ---*/ .ui.checkbox { position: relative; display: inline-block; min-width: 1em; min-height: 1.25em; line-height: 1em; outline: none; vertical-align: middle; } .ui.checkbox input { position: absolute; top: 0px; left: 0px; opacity: 0; outline: none; } /*--- Box ---*/ .ui.checkbox .box, .ui.checkbox label { cursor: pointer; padding-left: 2em; outline: none; } .ui.checkbox .box:before, .ui.checkbox label:before { position: absolute; top: 0em; line-height: 1; width: 1em; height: 1em; left: 0em; content: ''; border-radius: 4px; background: #FFFFFF; -webkit-transition: background-color 0.3s ease, -webkit-box-shadow 0.3s ease; -moz-transition: background-color 0.3s ease, box-shadow 0.3s ease; transition: background-color 0.3s ease, box-shadow 0.3s ease; -webkit-box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.2); box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.2); } /*--- Checkbox ---*/ .ui.checkbox .box:after, .ui.checkbox label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; content: ''; position: absolute; background: transparent; border: 0.2em solid #333333; border-top: none; border-right: none; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .ui.checkbox .box:after, .ui.checkbox label:after { top: 0.275em; left: 0.2em; width: 0.45em; height: 0.15em; } /*--- Inside Label ---*/ .ui.checkbox label { display: block; color: rgba(0, 0, 0, 0.6); -webkit-transition: color 0.2s ease; -moz-transition: color 0.2s ease; transition: color 0.2s ease; } .ui.checkbox label:hover { color: rgba(0, 0, 0, 0.8); } .ui.checkbox input:focus ~ label { color: rgba(0, 0, 0, 0.8); } /*--- Outside Label ---*/ .ui.checkbox ~ label { cursor: pointer; opacity: 0.85; vertical-align: middle; } .ui.checkbox ~ label:hover { opacity: 1; } /******************************* States *******************************/ /*--- Hover ---*/ .ui.checkbox .box:hover::before, .ui.checkbox label:hover::before { -webkit-box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.3); box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.3); } /*--- Down ---*/ .ui.checkbox .box:active::before, .ui.checkbox label:active::before { background-color: #F5F5F5; } /*--- Focus ---*/ .ui.checkbox input:focus ~ .box:before, .ui.checkbox input:focus ~ label:before { -webkit-box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.3); box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.3); } /*--- Active ---*/ .ui.checkbox input:checked ~ .box:after, .ui.checkbox input:checked ~ label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } /*--- Disabled ---*/ .ui.disabled.checkbox ~ .box:after, .ui.checkbox input[disabled] ~ .box:after, .ui.disabled.checkbox label, .ui.checkbox input[disabled] ~ label { opacity: 0.4; color: rgba(0, 0, 0, 0.3); } /******************************* Variations *******************************/ /*-------------- Radio ---------------*/ .ui.radio.checkbox .box:before, .ui.radio.checkbox label:before { min-width: 1em; height: 1em; border-radius: 500px; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; } .ui.radio.checkbox .box:after, .ui.radio.checkbox label:after { border: none; top: 0.2em; left: 0.2em; width: 0.6em; height: 0.6em; background-color: #555555; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; border-radius: 500px; } /*-------------- Slider ---------------*/ .ui.slider.checkbox { cursor: pointer; min-width: 3em; } /* Line */ .ui.slider.checkbox:after { position: absolute; top: 0.5em; left: 0em; content: ''; width: 3em; height: 2px; background-color: rgba(0, 0, 0, 0.1); } /* Button */ .ui.slider.checkbox .box, .ui.slider.checkbox label { padding-left: 4em; } .ui.slider.checkbox .box:before, .ui.slider.checkbox label:before { cursor: pointer; display: block; position: absolute; top: -0.25em; left: 0em; z-index: 1; width: 1.5em; height: 1.5em; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; border-radius: 50rem; -webkit-transition: left 0.3s ease 0s; -moz-transition: left 0.3s ease 0s; transition: left 0.3s ease 0s; } /* Button Activation Light */ .ui.slider.checkbox .box:after, .ui.slider.checkbox label:after { opacity: 1; position: absolute; content: ''; top: 0.15em; left: 0em; z-index: 2; margin-left: 0.375em; border: none; width: 0.75em; height: 0.75em; border-radius: 50rem; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; -webkit-transition: background 0.3s ease 0s, left 0.3s ease 0s ; -moz-transition: background 0.3s ease 0s, left 0.3s ease 0s ; transition: background 0.3s ease 0s, left 0.3s ease 0s ; } /* Selected Slider Toggle */ .ui.slider.checkbox input:checked ~ .box:before, .ui.slider.checkbox input:checked ~ label:before, .ui.slider.checkbox input:checked ~ .box:after, .ui.slider.checkbox input:checked ~ label:after { left: 1.75em; } /* Off Color */ .ui.slider.checkbox .box:after, .ui.slider.checkbox label:after { background-color: #D95C5C; } /* On Color */ .ui.slider.checkbox input:checked ~ .box:after, .ui.slider.checkbox input:checked ~ label:after { background-color: #89B84C; } /*-------------- Toggle ---------------*/ .ui.toggle.checkbox { cursor: pointer; } .ui.toggle.checkbox .box, .ui.toggle.checkbox label { padding-left: 4em; } /* Switch */ .ui.toggle.checkbox .box:before, .ui.toggle.checkbox label:before { cursor: pointer; display: block; position: absolute; content: ''; top: -0.25em; left: 0em; z-index: 1; background-color: #FFFFFF; width: 3em; height: 1.5em; -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset; border-radius: 50rem; } /* Activation Light */ .ui.toggle.checkbox .box:after, .ui.toggle.checkbox label:after { opacity: 1; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; content: ''; position: absolute; top: 0.15em; left: 0.5em; z-index: 2; border: none; width: 0.75em; height: 0.75em; background-color: #D95C5C; border-radius: 50rem; -webkit-transition: background 0.3s ease 0s, left 0.3s ease 0s ; -moz-transition: background 0.3s ease 0s, left 0.3s ease 0s ; transition: background 0.3s ease 0s, left 0.3s ease 0s ; } /* Active */ .ui.toggle.checkbox:active .box:before, .ui.toggle.checkbox:active label:before { background-color: #F5F5F5; } /* Active */ .ui.toggle.checkbox input:checked ~ .box:after, .ui.toggle.checkbox input:checked ~ label:after { left: 1.75em; background-color: #89B84C; } /*-------------- Sizes ---------------*/ .ui.checkbox { font-size: 1em; } .ui.large.checkbox { font-size: 1.25em; } .ui.huge.checkbox { font-size: 1.5em; } /* * # Semantic - Dimmer * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Dimmer *******************************/ .ui.dimmable { position: relative; } .ui.dimmer { display: none; position: absolute; top: 0em !important; left: 0em !important; width: 0%; height: 0%; text-align: center; vertical-align: middle; background-color: rgba(0, 0, 0, 0.85); opacity: 0; line-height: 1; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 0.5s; -moz-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-transition: background-color 0.5s linear; -moz-transition: background-color 0.5s linear; transition: background-color 0.5s linear; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; z-index: 1000; } /* Dimmer Content */ .ui.dimmer > .content { width: 100%; height: 100%; display: table; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } .ui.dimmer > .content > div { display: table-cell; vertical-align: middle; color: #FFFFFF; } /* Loose Coupling */ .ui.segment > .ui.dimmer { border-radius: 5px; } .ui.horizontal.segment > .ui.dimmer, .ui.vertical.segment > .ui.dimmer { border-radius: 5px; } /******************************* States *******************************/ .ui.dimmed.dimmable:not(body) { overflow: hidden; } .ui.dimmed.dimmable > .ui.animating.dimmer, .ui.dimmed.dimmable > .ui.visible.dimmer, .ui.active.dimmer { display: block; width: 100%; height: 100%; opacity: 1; } .ui.disabled.dimmer { width: 0em !important; height: 0em !important; } /******************************* Variations *******************************/ /*-------------- Page ---------------*/ .ui.page.dimmer { position: fixed; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-perspective: 2000px; -moz-perspective: 2000px; -ms-perspective: 2000px; perspective: 2000px; -webkit-transform-origin: center center; -moz-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; } .ui.scrolling.dimmable > .dimmer, .ui.scrolling.page.dimmer { position: absolute; } /* Blurred Background body.ui.dimmed.dimmable > :not(.dimmer){ filter: ~"blur(15px) grayscale(0.7)"; } */ /*-------------- Aligned ---------------*/ .ui.dimmer > .top.aligned.content > * { vertical-align: top; } .ui.dimmer > .bottom.aligned.content > * { vertical-align: bottom; } /*-------------- Inverted ---------------*/ .ui.inverted.dimmer { background-color: rgba(255, 255, 255, 0.85); } .ui.inverted.dimmer > .content > * { color: rgba(0, 0, 0, 0.8); } /*-------------- Simple ---------------*/ /* Displays without javascript */ .ui.simple.dimmer { display: block; overflow: hidden; opacity: 1; z-index: -100; background-color: rgba(0, 0, 0, 0); } .ui.dimmed.dimmable > .ui.simple.dimmer { overflow: visible; opacity: 1; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.85); z-index: 1; } .ui.simple.inverted.dimmer { background-color: rgba(255, 255, 255, 0); } .ui.dimmed.dimmable > .ui.simple.inverted.dimmer { background-color: rgba(255, 255, 255, 0.85); } /* * # Semantic - Dropdown * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Dropdown *******************************/ .ui.dropdown { cursor: pointer; position: relative; display: inline-block; line-height: 1; -webkit-transition: border-radius 0.1s ease, width 0.2s ease; -moz-transition: border-radius 0.1s ease, width 0.2s ease; transition: border-radius 0.1s ease, width 0.2s ease; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -moz-tap-highlight-color: rgba(0, 0, 0, 0); tap-highlight-color: rgba(0, 0, 0, 0); } /******************************* Content *******************************/ /*-------------- Menu ---------------*/ .ui.dropdown .menu { cursor: auto; position: absolute; display: none; top: 100%; margin: 0em; background-color: #FFFFFF; min-width: 100%; white-space: nowrap; font-size: 0.875em; text-shadow: none; -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1); border-radius: 0px 0px 0.325em 0.325em; -webkit-transition: opacity 0.2s ease; -moz-transition: opacity 0.2s ease; transition: opacity 0.2s ease; z-index: 11; } /*-------------- Icon ---------------*/ .ui.dropdown > .dropdown.icon { width: auto; margin: 0em 0em 0em 1em; } .ui.dropdown > .dropdown.icon:before { content: "\f0d7"; } .ui.dropdown .menu .item .dropdown.icon { width: auto; float: right; margin: 0em 0em 0em 0.5em; } .ui.dropdown .menu .item .dropdown.icon:before { content: "\f0da" /*rtl:"\f0d9"*/; } /*-------------- Text ---------------*/ .ui.dropdown > .text { display: inline-block; -webkit-transition: color 0.2s ease; -moz-transition: color 0.2s ease; transition: color 0.2s ease; } /* Flyout Direction */ .ui.dropdown .menu { left: 0px; } /*-------------- Sub Menu ---------------*/ .ui.dropdown .menu .menu { top: 0% !important; left: 100% !important; margin: 0em !important; border-radius: 0 0.325em 0.325em 0em !important; } .ui.dropdown .menu .menu:after { display: none; } .ui.dropdown .menu .item { cursor: pointer; border: none; border-top: 1px solid rgba(0, 0, 0, 0.05); height: auto; font-size: 0.875em; display: block; color: rgba(0, 0, 0, 0.75); padding: 0.85em 1em !important; font-size: 0.875rem; text-transform: none; font-weight: normal; text-align: left; -webkit-touch-callout: none; } .ui.dropdown .menu .item:before { display: none; } .ui.dropdown .menu .item .icon { margin-right: 0.75em; } .ui.dropdown .menu .item:first-child { border-top: none; } /******************************* Coupling *******************************/ /* Opposite on last menu on right */ .ui.menu .right.menu .dropdown:last-child .menu, .ui.buttons > .ui.dropdown:last-child .menu { left: auto; right: 0px; } .ui.vertical.menu .dropdown.item > .dropdown.icon:before { content: "\f0da" /*rtl:"\f0d9"*/; } .ui.dropdown.icon.button > .dropdown.icon { margin: 0em; } /******************************* States *******************************/ /* Dropdown Visible */ .ui.visible.dropdown > .menu { display: block; } /*-------------------- Hover ----------------------*/ /* Menu Item Hover */ .ui.dropdown .menu .item:hover { background-color: rgba(0, 0, 0, 0.02); z-index: 12; } /*-------------------- Active ----------------------*/ /* Menu Item Active */ .ui.dropdown .menu .active.item { background-color: rgba(0, 0, 0, 0.06) !important; border-left: none; border-color: transparent !important; -webkit-box-shadow: none; -moz-shadow: none; -webkit-box-shadow: none; box-shadow: none; z-index: 12; } /*-------------------- Default Text ----------------------*/ .ui.dropdown > .default.text, .ui.default.dropdown > .text { color: rgba(0, 0, 0, 0.5); } .ui.dropdown:hover > .default.text, .ui.default.dropdown:hover > .text { color: rgba(0, 0, 0, 0.8); } /*-------------------- Error ----------------------*/ .ui.dropdown.error, .ui.dropdown.error > .text, .ui.dropdown.error > .default.text { color: #D95C5C !important; } .ui.selection.dropdown.error { background-color: #FFFAFA; -webkit-box-shadow: 0px 0px 0px 1px #e7bebe !important; box-shadow: 0px 0px 0px 1px #e7bebe !important; } .ui.selection.dropdown.error:hover { -webkit-box-shadow: 0px 0px 0px 1px #e7bebe !important; box-shadow: 0px 0px 0px 1px #e7bebe !important; } .ui.dropdown.error > .menu, .ui.dropdown.error > .menu .menu { -webkit-box-shadow: 0px 0px 1px 1px #E7BEBE !important; box-shadow: 0px 0px 1px 1px #E7BEBE !important; } .ui.dropdown.error > .menu .item { color: #D95C5C !important; } /* Item Hover */ .ui.dropdown.error > .menu .item:hover { background-color: #FFF2F2 !important; } /* Item Active */ .ui.dropdown.error > .menu .active.item { background-color: #FDCFCF !important; } /******************************* Variations *******************************/ /*-------------- Simple ---------------*/ /* Displays without javascript */ .ui.simple.dropdown .menu:before, .ui.simple.dropdown .menu:after { display: none; } .ui.simple.dropdown .menu { display: block; overflow: hidden; top: -9999px !important; position: absolute; opacity: 0; width: 0; height: 0; -webkit-transition: opacity 0.2s ease-out; -moz-transition: opacity 0.2s ease-out; transition: opacity 0.2s ease-out; } .ui.simple.active.dropdown, .ui.simple.dropdown:hover { border-bottom-left-radius: 0em !important; border-bottom-right-radius: 0em !important; } .ui.simple.active.dropdown > .menu, .ui.simple.dropdown:hover > .menu { overflow: visible; width: auto; height: auto; top: 100% !important; opacity: 1; } .ui.simple.dropdown > .menu .item:active > .menu, .ui.simple.dropdown:hover > .menu .item:hover > .menu { overflow: visible; width: auto; height: auto; top: 0% !important; left: 100% !important; opacity: 1; } .ui.simple.disabled.dropdown:hover .menu { display: none; height: 0px; width: 0px; overflow: hidden; } /*-------------- Selection ---------------*/ /* Displays like a select box */ .ui.selection.dropdown { cursor: pointer; display: inline-block; word-wrap: break-word; white-space: normal; background-color: #FFFFFF; padding: 0.65em 1em; line-height: 1.33; color: rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important; box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) !important; border-radius: 0.3125em !important; } .ui.selection.dropdown select { display: none; } .ui.selection.dropdown > .dropdown.icon { opacity: 0.7; margin: 0.2em 0em 0.2em 1.25em; -webkit-transition: opacity 0.2s ease-out; -moz-transition: opacity 0.2s ease-out; transition: opacity 0.2s ease-out; } .ui.selection.dropdown, .ui.selection.dropdown .menu { -webkit-transition: -webkit-box-shadow 0.2s ease-out; -moz-transition: box-shadow 0.2s ease-out; transition: box-shadow 0.2s ease-out; } .ui.selection.dropdown .menu { top: 100%; max-height: 312px; overflow-x: hidden; overflow-y: auto; -webkit-box-shadow: 0px 1px 0px 1px #E0E0E0; box-shadow: 0px 1px 0px 1px #E0E0E0; border-radius: 0px 0px 0.325em 0.325em; } .ui.selection.dropdown .menu:after, .ui.selection.dropdown .menu:before { display: none; } .ui.selection.dropdown .menu img { height: 2.5em; display: inline-block; vertical-align: middle; margin-right: 0.5em; } /* Visible */ .ui.visible.selection.dropdown { border-bottom-left-radius: 0em !important; border-bottom-right-radius: 0em !important; } /* Active */ .ui.active.selection.dropdown { border-radius: 0.3125em 0.3125em 0em 0em !important; } .ui.active.selection.dropdown > .dropdown.icon { opacity: 1; } /*-------------- Fluid ---------------*/ .ui.fluid.dropdown { display: block; } .ui.fluid.dropdown > .dropdown.icon { float: right; } /*-------------- Inline ---------------*/ .ui.inline.dropdown { cursor: pointer; display: inline-block; color: inherit; } .ui.inline.dropdown .dropdown.icon { margin: 0em 0.5em 0em 0.25em; } .ui.inline.dropdown .text { font-weight: bold; } .ui.inline.dropdown .menu { cursor: auto; margin-top: 0.25em; border-radius: 0.325em; } /*-------------- Floating ---------------*/ .ui.floating.dropdown .menu { left: 0; right: auto; margin-top: 0.5em !important; border-radius: 0.325em; } /*-------------- Pointing ---------------*/ .ui.pointing.dropdown .menu { top: 100%; margin-top: 0.75em; border-radius: 0.325em; } .ui.pointing.dropdown .menu:after { display: block; position: absolute; pointer-events: none; content: " "; visibility: visible; width: 0.5em; height: 0.5em; -webkit-box-shadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.05); box-shadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.05); background-image: none; background-color: #FFFFFF; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: 2; } .ui.pointing.dropdown .menu .active.item:first-child { background: transparent -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.03)); background: transparent -moz-linear-gradient(transparent, rgba(0, 0, 0, 0.03)); background: transparent linear-gradient(transparent, rgba(0, 0, 0, 0.03)); } /* Directions */ .ui.pointing.dropdown .menu:after { top: -0.25em; left: 50%; margin: 0em 0em 0em -0.25em; } .ui.top.left.pointing.dropdown .menu { top: 100%; bottom: auto; left: 0%; right: auto; margin: 0.75em 0em 0em; } .ui.top.left.pointing.dropdown .menu:after { top: -0.25em; left: 1.25em; right: auto; margin: 0em; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .ui.top.right.pointing.dropdown .menu { top: 100%; bottom: auto; right: 0%; left: auto; margin: 0.75em 0em 0em; } .ui.top.right.pointing.dropdown .menu:after { top: -0.25em; left: auto; right: 1.25em; margin: 0em; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .ui.left.pointing.dropdown .menu { top: 0%; left: 100%; right: auto; margin: 0em 0em 0em 0.75em; } .ui.left.pointing.dropdown .menu:after { top: 1em; left: -0.25em; margin: 0em 0em 0em 0em; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .ui.right.pointing.dropdown .menu { top: 0%; left: auto; right: 100%; margin: 0em 0.75em 0em 0em; } .ui.right.pointing.dropdown .menu:after { top: 1em; left: auto; right: -0.25em; margin: 0em 0em 0em 0em; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); } /* * # Semantic - Modal * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Modal *******************************/ .ui.modal { display: none; position: fixed; z-index: 1001; top: 50%; left: 50%; text-align: left; width: 90%; margin-left: -45%; background-color: #FFFFFF; border: 1px solid #DDDDDD; border-radius: 5px; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } /******************************* Content *******************************/ /*-------------- Close ---------------*/ .ui.modal > .close { cursor: pointer; position: absolute; z-index: 1; opacity: 0.8; font-size: 1.25em; top: -1.75em; right: -1.75em; color: #FFFFFF; } .ui.modal > .close:hover { opacity: 1; } /*-------------- Header ---------------*/ .ui.modal > .header { margin: 0em; padding: 1.5rem 2rem; font-size: 1.6em; font-weight: bold; border-radius: 0.325em 0.325em 0px 0px; } /*-------------- Content ---------------*/ .ui.modal > .content { display: table; width: 100%; position: relative; padding: 2em; background-color: #F4F4F4; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.modal > .content > .left:not(.ui) { display: table-cell; padding-right: 1.5%; min-width: 25%; } .ui.modal > .content > .right:not(.ui) { display: table-cell; padding-left: 1.5%; vertical-align: top; } /*rtl:ignore*/ .ui.modal > .content > .left:not(.ui) > i.icon { font-size: 8em; margin: 0em; } .ui.modal > .content p { line-height: 1.6; } /*-------------- Actions ---------------*/ .ui.modal .actions { padding: 1rem 2rem; text-align: right; } .ui.modal .actions > .button { margin-left: 0.75em; } /*------------------- Sizing --------------------*/ /* Mobile Only */ @media only screen and (max-width: 768px) { /*rtl:ignore*/ .ui.modal .content > .left:not(.ui) { display: block; padding: 0em 0em 1em; } /*rtl:ignore*/ .ui.modal .content > .right:not(.ui) { display: block; padding: 1em 0em 0em; -webkit-box-shadow: none; box-shadow: none; } .ui.modal .content .image { width: auto !important; max-width: 100%; } .ui.modal .actions { padding-bottom: 0em; } .ui.modal .actions > .buttons, .ui.modal .actions > .button { margin-bottom: 1em; } } /* Tablet and Mobile */ @media only screen and (max-width: 998px) { .ui.modal { width: 92%; margin-left: -46%; } .ui.modal > .close { color: rgba(0, 0, 0, 0.8); top: 1.5rem; right: 1rem; } } /* Computer / Responsive */ @media only screen and (min-width: 998px) { .ui.modal { width: 74%; margin-left: -37%; } } @media only screen and (min-width: 1500px) { .ui.modal { width: 56%; margin-left: -28%; } } @media only screen and (min-width: 1750px) { .ui.modal { width: 42%; margin-left: -21%; } } @media only screen and (min-width: 2000px) { .ui.modal { width: 36%; margin-left: -18%; } } /******************************* Types *******************************/ .ui.basic.modal { background-color: transparent; border: none; color: #FFFFFF; } .ui.basic.modal > .close { top: 1.5rem; right: 1rem; } .ui.basic.modal .content { background-color: transparent; } /******************************* Variations *******************************/ /* A modal that cannot fit on the page */ .ui.modal.scrolling { position: absolute; margin-top: 10px; } /******************************* States *******************************/ .ui.active.modal { display: block; } /*-------------- Size ---------------*/ /* Small */ .ui.small.modal > .header { font-size: 1.3em; } @media only screen and (min-width: 998px) { .ui.small.modal { width: 58%; margin-left: -29%; } } @media only screen and (min-width: 1500px) { .ui.small.modal { width: 40%; margin-left: -20%; } } @media only screen and (min-width: 1750px) { .ui.small.modal { width: 26%; margin-left: -13%; } } @media only screen and (min-width: 2000px) { .ui.small.modal { width: 20%; margin-left: -10%; } } /* Large */ @media only screen and (min-width: 998px) { .ui.large.modal { width: 74%; margin-left: -37%; } } @media only screen and (min-width: 1500px) { .ui.large.modal { width: 64%; margin-left: -32%; } } @media only screen and (min-width: 1750px) { .ui.large.modal { width: 54%; margin-left: -27%; } } @media only screen and (min-width: 2000px) { .ui.large.modal { width: 44%; margin-left: -22%; } } /* * # Semantic - Nag * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Nag *******************************/ .ui.nag { display: none; opacity: 0.95; position: relative; top: 0px; left: 0%; z-index: 101; min-height: 0; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; margin: 0em; line-height: 3em; padding: 0em 1em; background-color: #555555; -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); font-size: 1em; text-align: center; color: rgba(255, 255, 255, 0.8); border-radius: 0px 0px 5px 5px; -webkit-transition: 0.2s background; -moz-transition: 0.2s background; transition: 0.2s background; } a.ui.nag { cursor: pointer; } .ui.nag > .title { display: inline-block; margin: 0em 0.5em; color: #FFFFFF; } .ui.nag > .close.icon { cursor: pointer; opacity: 0.4; position: absolute; top: 50%; right: 1em; margin-top: -0.5em; color: #FFFFFF; -webkit-transition: 0.1s opacity; -moz-transition: 0.1s opacity; transition: 0.1s opacity; } /******************************* States *******************************/ /* Hover */ .ui.nag:hover { opacity: 1; } .ui.nag .close:hover { opacity: 1; } /******************************* Variations *******************************/ /*-------------- Static ---------------*/ .ui.overlay.nag { position: absolute; display: block; } /*-------------- Fixed ---------------*/ .ui.fixed.nag { position: fixed; } /*-------------- Bottom ---------------*/ .ui.bottom.nag { border-radius: 5px 5px 0px 0px; } .ui.fixed.bottom.nags, .ui.fixed.bottom.nag { top: auto; bottom: 0px; } /*-------------- White ---------------*/ .ui.white.nags .nag, .ui.white.nag { background-color: #F1F1F1; text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8); color: #ACACAC; } .ui.white.nags .nag .close, .ui.white.nags .nag .title, .ui.white.nag .close, .ui.white.nag .title { color: #333333; } /******************************* Groups *******************************/ .ui.nags .nag { border-radius: 0px; } /* * # Semantic - Popup * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Popup *******************************/ .ui.popup { display: none; position: absolute; top: 0px; right: 0px; z-index: 900; border: 1px solid rgba(0, 0, 0, 0.1); max-width: 250px; background-color: #FFFFFF; padding: 0.8em 1.2em; font-size: 0.875rem; font-weight: normal; font-style: normal; color: rgba(0, 0, 0, 0.7); border-radius: 0.2em; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); } .ui.popup .header { padding: 0em 0em 0.5em; font-size: 1.125em; line-height: 1.2; font-weight: bold; } .ui.popup:before { position: absolute; content: ""; width: 0.75em; height: 0.75rem; background-image: none; background-color: #FFFFFF; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: 2; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); } .ui.popup .ui.button { width: 100%; } /******************************* Types *******************************/ /*-------------- Spacing ---------------*/ .ui.popup { margin: 0em; } .ui.popup.bottom { margin: 0.75em 0em 0em; } .ui.popup.top { margin: 0em 0em 0.75em; } .ui.popup.left.center { margin: 0em 0.75em 0em 0em; } .ui.popup.right.center { margin: 0em 0em 0em 0.75em; } .ui.popup.center { margin-left: -1.25em; } /*-------------- Pointer ---------------*/ /*--- Below ---*/ .ui.bottom.center.popup:before { margin-left: -0.4em; top: -0.4em; left: 50%; right: auto; bottom: auto; -webkit-box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.2); box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.2); } .ui.bottom.left.popup { margin-right: -2em; } .ui.bottom.left.popup:before { top: -0.4em; right: 1em; bottom: auto; left: auto; margin-left: 0em; -webkit-box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.2); box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.2); } .ui.bottom.right.popup { margin-left: -2em; } .ui.bottom.right.popup:before { top: -0.4em; left: 1em; right: auto; bottom: auto; margin-left: 0em; -webkit-box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.2); box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.2); } /*--- Above ---*/ .ui.top.center.popup:before { top: auto; right: auto; bottom: -0.4em; left: 50%; margin-left: -0.4em; } .ui.top.left.popup { margin-right: -2em; } .ui.top.left.popup:before { bottom: -0.4em; right: 1em; top: auto; left: auto; margin-left: 0em; } .ui.top.right.popup { margin-left: -2em; } .ui.top.right.popup:before { bottom: -0.4em; left: 1em; top: auto; right: auto; margin-left: 0em; } /*--- Left Center ---*/ .ui.left.center.popup:before { top: 50%; right: -0.35em; bottom: auto; left: auto; margin-top: -0.4em; -webkit-box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.2); box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.2); } /*--- Right Center ---*/ .ui.right.center.popup:before { top: 50%; left: -0.35em; bottom: auto; right: auto; margin-top: -0.4em; -webkit-box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2); box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2); } /******************************* States *******************************/ .ui.loading.popup { display: block; visibility: hidden; } .ui.animating.popup, .ui.visible.popup { display: block; } /******************************* Variations *******************************/ /*-------------- Size ---------------*/ .ui.small.popup { font-size: 0.75rem; } .ui.large.popup { font-size: 1rem; } /*-------------- Colors ---------------*/ /* Inverted colors */ .ui.inverted.popup { background-color: #333333; border: none; color: #FFFFFF; -webkit-box-shadow: none; box-shadow: none; } .ui.inverted.popup .header { background-color: rgba(0, 0, 0, 0.2); color: #FFFFFF; } .ui.inverted.popup:before { background-color: #333333; -webkit-box-shadow: none; box-shadow: none; } /* * # Semantic - Rating * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Rating *******************************/ .ui.rating { display: inline-block; font-size: 0em; vertical-align: middle; margin: 0em 0.5rem 0em 0em; } .ui.rating:last-child { margin-right: 0em; } .ui.rating:before { display: block; content: ''; visibility: hidden; clear: both; height: 0; } /* Icon */ .ui.rating .icon { cursor: pointer; margin: 0em; width: 1em; height: auto; padding: 0em; color: rgba(0, 0, 0, 0.15); font-weight: normal; font-style: normal; } .ui.rating .icon:before { content: "\2605"; } /******************************* Types *******************************/ /*------------------- Star --------------------*/ .ui.star.rating .icon { width: 1.2em; } /* Star */ .ui.star.rating .icon:before { content: '\f006'; font-family: 'Icons'; } /* Active Star */ .ui.star.rating .active.icon:before { content: '\f005'; font-family: 'Icons'; } /*------------------- Heart --------------------*/ .ui.heart.rating .icon { width: 1.2em; } .ui.heart.rating .icon:before { content: '\f08a'; font-family: 'Icons'; } /* Active */ .ui.heart.rating .active.icon:before { content: '\f004'; font-family: 'Icons'; } .ui.heart.rating .active.icon { color: #EF404A !important; } /* Hovered */ .ui.heart.rating .hover.icon, .ui.heart.rating .active.hover.icon { color: #FF2733 !important; } /******************************* States *******************************/ /*------------------- Active --------------------*/ /* disabled rating */ .ui.disabled.rating .icon { cursor: default; } /* active icons */ .ui.rating .active.icon { color: #FFCB08 !important; } /*------------------- Hover --------------------*/ /* rating */ .ui.rating.hover .active.icon { opacity: 0.5; } /* icon */ .ui.rating .icon.hover, .ui.rating .icon.hover.active { opacity: 1; color: #FFB70A !important; } /******************************* Variations *******************************/ .ui.small.rating .icon { font-size: 0.75rem; } .ui.rating .icon { font-size: 1rem; } .ui.large.rating .icon { font-size: 1.5rem; vertical-align: middle; } .ui.huge.rating .icon { font-size: 2rem; vertical-align: middle; } /* * # Semantic - Search * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Search *******************************/ .ui.search { position: relative; text-shadow: none; font-style: normal; font-weight: normal; } .ui.search input { border-radius: 500rem; } /*-------------- Button ---------------*/ .ui.search > .button { position: relative; z-index: 2; float: right; margin: 0px 0px 0px -15px; padding: 6px 15px 7px; border-radius: 0px 15px 15px 0px; -webkit-box-shadow: none; box-shadow: none; } /*-------------- Results ---------------*/ .ui.search .results { display: none; position: absolute; z-index: 999; top: 100%; left: 0px; overflow: hidden; background-color: #FFFFFF; margin-top: 0.5em; width: 380px; font-size: 0.875em; line-height: 1.2; color: #555555; border-radius: 3px; -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1), 0px -2px 0px 0px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1), 0px -2px 0px 0px rgba(0, 0, 0, 0.1) inset; } .ui.search .result { cursor: pointer; overflow: hidden; padding: 0.5em 1em; } .ui.search .result:first-child { border-top: none; } .ui.search .result .image { background: #F0F0F0; margin-right: 10px; float: left; overflow: hidden; border-radius: 3px; width: 38px; height: 38px; } .ui.search .result .image img { display: block; width: 38px; height: 38px; } .ui.search .result .image ~ .info { float: none; margin-left: 50px; } .ui.search .result .info { float: left; } .ui.search .result .title { font-weight: bold; color: rgba(0, 0, 0, 0.8); } .ui.search .result .description { color: rgba(0, 0, 0, 0.6); } .ui.search .result .price { float: right; color: #5BBD72; font-weight: bold; } /*-------------- Message ---------------*/ .ui.search .message { padding: 1em; } .ui.search .message .text .title { margin: 0em 0em 0.5rem; font-size: 1.25rem; font-weight: bold; color: rgba(0, 0, 0, 0.8); } .ui.search .message .text .description { margin: 0em; font-size: 1rem; color: rgba(0, 0, 0, 0.5); } /*-------------- Categories ---------------*/ .ui.search .results .category { background-color: #FAFAFA; border-top: 1px solid rgba(0, 0, 0, 0.1); -webkit-transition: background 0.2s ease-in; -moz-transition: background 0.2s ease-in; transition: background 0.2s ease-in; } .ui.search .results .category:first-child { border-top: none; } .ui.search .results .category > .name { float: left; padding: 12px 0px 0px 8px; font-weight: bold; color: #777777; text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8); } .ui.search .results .category .result { background-color: #FFFFFF; margin-left: 80px; border-left: 1px solid rgba(0, 0, 0, 0.1); } /* View All Results */ .ui.search .all { display: block; border-top: 1px solid rgba(0, 0, 0, 0.1); background-color: #FAFAFA; height: 2em; line-height: 2em; color: rgba(0, 0, 0, 0.6); font-weight: bold; text-align: center; } /******************************* States *******************************/ /*-------------- Hover ---------------*/ .ui.search .result:hover, .ui.search .category .result:hover { background-color: #F8F8F8; } .ui.search .all:hover { background-color: #F0F0F0; } /*-------------- Loading ---------------*/ .ui.search.loading .input .icon { background: url(../images/loader-mini.gif) no-repeat 50% 50%; } .ui.search.loading .input .icon:before, .ui.search.loading .input .icon:after { display: none; } /*-------------- Active ---------------*/ .ui.search .results .category.active { background-color: #F1F1F1; } .ui.search .results .category.active > .name { color: #333333; } .ui.search .result.active, .ui.search .category .result.active { background-color: #FBFBFB; } .ui.search .result.active .title { color: #000000; } .ui.search .result.active .description { color: #555555; } /******************************* Variations *******************************/ /* Large */ .ui.search .large.result .image, .ui.search .large.result .image img { width: 50px; height: 50px; } .ui.search .large.results .indented.info { margin-left: 65px; } .ui.search .large.results .info .title { font-size: 16px; } .ui.search .large.results .info .description { font-size: 11px; } /* * # Semantic - Shape * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Shape *******************************/ .ui.shape { display: inline-block; position: relative; -webkit-perspective: 2000px; -moz-perspective: 2000px; -ms-perspective: 2000px; perspective: 2000px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.shape .sides { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; } .ui.shape .side { opacity: 1; width: 100%; margin: 0em !important; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .ui.shape .side { display: none; } /******************************* Types *******************************/ .ui.cube.shape .side { min-width: 15em; height: 15em; padding: 2em; background-color: #E6E6E6; color: rgba(0, 0, 0, 0.6); -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3); box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3); } .ui.cube.shape .side > .content { width: 100%; height: 100%; display: table; text-align: center; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } .ui.cube.shape .side > .content > div { display: table-cell; vertical-align: middle; font-size: 2em; } /******************************* Variations *******************************/ .ui.text.shape.animating .sides { position: static; } .ui.text.shape .side { white-space: nowrap; } .ui.text.shape .side > * { white-space: normal; } /******************************* States *******************************/ /*-------------- Loading ---------------*/ .ui.loading.shape { position: absolute; top: -9999px; left: -9999px; } /*-------------- Animating ---------------*/ .ui.shape .animating.side { position: absolute; top: 0px; left: 0px; z-index: 100; } .ui.shape .hidden.side { opacity: 0.4; } /*-------------- CSS ---------------*/ .ui.shape.animating { -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .ui.shape.animating .sides { position: absolute; } .ui.shape.animating .sides { -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .ui.shape.animating .side { -webkit-transition: opacity 0.6s ease-in-out; -moz-transition: opacity 0.6s ease-in-out; transition: opacity 0.6s ease-in-out; } /*-------------- Active ---------------*/ .ui.shape .active.side { display: block; } /* * # Semantic - Sidebar * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Sidebar *******************************/ body { -webkit-transition: margin 0.3s ease, -webkit-transform 0.3s ease /*rtl:append:, padding 0.3s ease*/; -moz-transition: margin 0.3s ease, -moz-transform 0.3s ease /*rtl:append:, padding 0.3s ease*/; transition: margin 0.3s ease, transform 0.3s ease /*rtl:append:, padding 0.3s ease*/; } .ui.sidebar { position: fixed; margin: 0 !important; height: 100% !important; border-radius: 0px !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -ms-overflow-y: auto; overflow-y: auto; top: 0px; left: 0px; z-index: 999; -webkit-transition: margin-left 0.3s ease, margin-top 0.3s ease; -moz-transition: margin-left 0.3s ease, margin-top 0.3s ease; transition: margin-left 0.3s ease, margin-top 0.3s ease; } /*------------------- Coupling --------------------*/ body.pushed.scrolling.ui.dimmable { position: static; } /******************************* Types *******************************/ /*------------------- Direction --------------------*/ .ui.right.very.thin.sidebar, .ui.right.thin.sidebar, .ui.right.sidebar, .ui.right.wide.sidebar, .ui.right.very.wide.sidebar { left: 100%; margin: 0px !important; } .ui.top.sidebar { width: 100% !important; } .ui.bottom.sidebar { width: 100% !important; top: 100%; margin: 0px !important; } /******************************* States *******************************/ .ui.active.sidebar { margin-left: 0px !important; } .ui.active.top.sidebar, .ui.active.bottom.sidebar { margin-top: 0px !important; } /******************************* Variations *******************************/ /*------------------- Formatted --------------------*/ .ui.styled.sidebar { padding: 1em 1.5em; background-color: #FFFFFF; -webkit-box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.1); box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.1); } .ui.styled.very.thin.sidebar { padding: 0.5em; } .ui.styled.thin.sidebar { padding: 1em; } /*------------------- Floating --------------------*/ .ui.floating.sidebar { -webkit-box-shadow: 2px 0px 2px rgba(0, 0, 0, 0.2); box-shadow: 2px 0px 2px rgba(0, 0, 0, 0.2); } .ui.right.floating.sidebar { -webkit-box-shadow: -2px 0px 2px rgba(0, 0, 0, 0.2); box-shadow: -2px 0px 2px rgba(0, 0, 0, 0.2); } .ui.top.floating.sidebar { -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2); } .ui.bottom.floating.sidebar { -webkit-box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.2); } /*------------------- Width --------------------*/ /* Very Thin */ .ui.very.thin.sidebar { width: 60px !important; margin-left: -60px !important; } .ui.active.very.thin.sidebar { margin-left: 0px !important; } .ui.active.right.very.thin.sidebar { margin-left: -60px !important; } /* Thin */ .ui.thin.sidebar { width: 200px !important; margin-left: -200px !important; } .ui.active.thin.sidebar { margin-left: 0px !important; } .ui.active.right.thin.sidebar { margin-left: -200px !important; } /* Standard */ .ui.sidebar { width: 275px !important; margin-left: -275px !important; } .ui.active.sidebar { margin-left: 0px !important; } .ui.active.right.sidebar { margin-left: -275px !important; } /* Wide */ .ui.wide.sidebar { width: 350px !important; margin-left: -350px !important; } .ui.active.wide.sidebar { margin-left: 0px !important; } .ui.active.right.wide.sidebar { margin-left: -350px !important; } /* Very Wide */ .ui.very.wide.sidebar { width: 475px !important; margin-left: -475px !important; } .ui.active.very.wide.sidebar { margin-left: 0px !important; } .ui.active.right.very.wide.sidebar { margin-left: -475px !important; } /*------------------- Height --------------------*/ /* Standard */ .ui.top.sidebar { margin: -40px 0px 0px 0px !important; } .ui.top.sidebar, .ui.bottom.sidebar { height: 40px !important; } .ui.active.bottom.sidebar { margin-top: -40px !important; } /* * # Semantic - Tab * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* UI Tabs *******************************/ .ui.tab { display: none; } /******************************* States *******************************/ /*-------------------- Active ---------------------*/ .ui.tab.active, .ui.tab.open { display: block; } /*-------------------- Loading ---------------------*/ .ui.tab.loading { position: relative; overflow: hidden; display: block; min-height: 250px; text-indent: -10000px; } .ui.tab.loading * { position: relative !important; left: -10000px !important; } .ui.tab.loading:after { position: absolute; top: 50px; left: 50%; content: 'Loading...'; margin-left: -32px; text-indent: 5px; color: rgba(0, 0, 0, 0.4); width: 100%; height: 100%; padding-top: 75px; background: url(../images/loader-large.gif) no-repeat 0px 0px; visibility: visible; } /******************************* Semantic - Transition Author: Jack Lukic CSS animation definitions for transition module *******************************/ /* Some transitions adapted from Animate CSS https://github.com/daneden/animate.css */ .ui.transition { -webkit-animation-iteration-count: 1; -moz-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease; -moz-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; } /******************************* States *******************************/ .ui.animating.transition { display: block; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } /* Loading */ .ui.loading.transition { position: absolute; top: -999999px; left: -99999px; } /* Hidden */ .ui.hidden.transition { display: none !important; } /* Visible */ .ui.visible.transition { display: block; visibility: visible; } /* Disabled */ .ui.disabled.transition { -webkit-animation-play-state: paused; -moz-animation-play-state: paused; animation-play-state: paused; } /******************************* Variations *******************************/ .ui.looping.transition { -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; } /******************************* Types *******************************/ /*-------------- Emphasis ---------------*/ .ui.flash.transition { -webkit-animation-name: flash; -moz-animation-name: flash; animation-name: flash; } .ui.shake.transition { -webkit-animation-name: shake; -moz-animation-name: shake; animation-name: shake; } .ui.bounce.transition { -webkit-animation-name: bounce; -moz-animation-name: bounce; animation-name: bounce; } .ui.tada.transition { -webkit-animation-name: tada; -moz-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ .ui.pulse.transition { -webkit-animation-name: pulse; -moz-animation-name: pulse; animation-name: pulse; } /*-------------- Flips ---------------*/ .ui.flip.transition.in, .ui.flip.transition.out { -webkit-perspective: 2000px; -moz-perspective: 2000px; -ms-perspective: 2000px; perspective: 2000px; } .ui.horizontal.flip.transition.in, .ui.horizontal.flip.transition.out { -webkit-animation-name: horizontalFlip; -moz-animation-name: horizontalFlip; animation-name: horizontalFlip; } .ui.horizontal.flip.transition.out { -webkit-animation-name: horizontalFlipOut; -moz-animation-name: horizontalFlipOut; animation-name: horizontalFlipOut; } .ui.vertical.flip.transition.in, .ui.vertical.flip.transition.out { -webkit-animation-name: verticalFlip; -moz-animation-name: verticalFlip; animation-name: verticalFlip; } .ui.vertical.flip.transition.out { -webkit-animation-name: verticalFlipOut; -moz-animation-name: verticalFlipOut; animation-name: verticalFlipOut; } /*-------------- Fades ---------------*/ .ui.fade.transition.in { -webkit-animation-name: fade; -moz-animation-name: fade; animation-name: fade; } .ui.fade.transition.out { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; animation-name: fadeOut; } .ui.fade.up.transition.in { -webkit-animation-name: fadeUp; -moz-animation-name: fadeUp; animation-name: fadeUp; } .ui.fade.up.transition.out { -webkit-animation-name: fadeUpOut; -moz-animation-name: fadeUpOut; animation-name: fadeUpOut; } .ui.fade.down.transition.in { -webkit-animation-name: fadeDown; -moz-animation-name: fadeDown; animation-name: fadeDown; } .ui.fade.down.transition.out { -webkit-animation-name: fadeDownOut; -moz-animation-name: fadeDownOut; animation-name: fadeDownOut; } /*-------------- Scale ---------------*/ .ui.scale.transition.in { -webkit-animation-name: scale; -moz-animation-name: scale; animation-name: scale; } .ui.scale.transition.out { -webkit-animation-name: scaleOut; -moz-animation-name: scaleOut; animation-name: scaleOut; } /*-------------- Slide ---------------*/ .ui.slide.down.transition.in { -webkit-animation-name: slide; -moz-animation-name: slide; animation-name: slide; -moz-transform-origin: 50% 0%; transform-origin: 50% 0%; -ms-transform-origin: 50% 0%; -webkit-transform-origin: 50% 0%; } .ui.slide.down.transition.out { -webkit-animation-name: slideOut; -moz-animation-name: slideOut; animation-name: slideOut; -webkit-transform-origin: 50% 0%; -moz-transform-origin: 50% 0%; -ms-transform-origin: 50% 0%; transform-origin: 50% 0%; } .ui.slide.up.transition.in { -webkit-animation-name: slide; -moz-animation-name: slide; animation-name: slide; -webkit-transform-origin: 50% 100%; -moz-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; transform-origin: 50% 100%; } .ui.slide.up.transition.out { -webkit-animation-name: slideOut; -moz-animation-name: slideOut; animation-name: slideOut; -webkit-transform-origin: 50% 100%; -moz-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; transform-origin: 50% 100%; } @-webkit-keyframes slide { 0% { opacity: 0; -webkit-transform: scaleY(0); transform: scaleY(0); } 100% { opacity: 1; -webkit-transform: scaleY(1); transform: scaleY(1); } } @-moz-keyframes slide { 0% { opacity: 0; -moz-transform: scaleY(0); transform: scaleY(0); } 100% { opacity: 1; -moz-transform: scaleY(1); transform: scaleY(1); } } @keyframes slide { 0% { opacity: 0; -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transform: scaleY(0); } 100% { opacity: 1; -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transform: scaleY(1); } } @-webkit-keyframes slideOut { 0% { opacity: 1; -webkit-transform: scaleY(1); transform: scaleY(1); } 100% { opacity: 0; -webkit-transform: scaleY(0); transform: scaleY(0); } } @-moz-keyframes slideOut { 0% { opacity: 1; -moz-transform: scaleY(1); transform: scaleY(1); } 100% { opacity: 0; -moz-transform: scaleY(0); transform: scaleY(0); } } @keyframes slideOut { 0% { opacity: 1; -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transform: scaleY(1); } 100% { opacity: 0; -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transform: scaleY(0); } } /******************************* Animations *******************************/ /*-------------- Emphasis ---------------*/ /* Flash */ @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @-moz-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } /* Shake */ @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } } @-moz-keyframes shake { 0%, 100% { -moz-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -moz-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -moz-transform: translateX(10px); transform: translateX(10px); } } @keyframes shake { 0%, 100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); -moz-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); -moz-transform: translateX(10px); transform: translateX(10px); } } /* Bounce */ @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -moz-transform: translateY(0); transform: translateY(0); } 40% { -moz-transform: translateY(-30px); transform: translateY(-30px); } 60% { -moz-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -moz-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); transform: translateY(-15px); } } /* Tada */ @-webkit-keyframes tada { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @-moz-keyframes tada { 0% { -moz-transform: scale(1); transform: scale(1); } 10%, 20% { -moz-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -moz-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -moz-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -moz-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); -moz-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); -moz-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); -moz-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); -moz-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } /* Pulse */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } 50% { -webkit-transform: scale(0.9); transform: scale(0.9); opacity: 0.7; } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @-moz-keyframes pulse { 0% { -moz-transform: scale(1); transform: scale(1); opacity: 1; } 50% { -moz-transform: scale(0.9); transform: scale(0.9); opacity: 0.7; } 100% { -moz-transform: scale(1); transform: scale(1); opacity: 1; } } @keyframes pulse { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); opacity: 1; } 50% { -webkit-transform: scale(0.9); -moz-transform: scale(0.9); transform: scale(0.9); opacity: 0.7; } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); opacity: 1; } } /*-------------- Flips ---------------*/ /* Horizontal */ @-webkit-keyframes horizontalFlip { 0% { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); opacity: 0; } 100% { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } } @-moz-keyframes horizontalFlip { 0% { -moz-transform: rotateY(-90deg); transform: rotateY(-90deg); opacity: 0; } 100% { -moz-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } } @keyframes horizontalFlip { 0% { -webkit-transform: rotateY(-90deg); -moz-transform: rotateY(-90deg); transform: rotateY(-90deg); opacity: 0; } 100% { -webkit-transform: rotateY(0deg); -moz-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } } /* Horizontal */ @-webkit-keyframes horizontalFlipOut { 0% { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } 100% { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); opacity: 0; } } @-moz-keyframes horizontalFlipOut { 0% { -moz-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } 100% { -moz-transform: rotateY(90deg); transform: rotateY(90deg); opacity: 0; } } @keyframes horizontalFlipOut { 0% { -webkit-transform: rotateY(0deg); -moz-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } 100% { -webkit-transform: rotateY(90deg); -moz-transform: rotateY(90deg); transform: rotateY(90deg); opacity: 0; } } /* Vertical */ @-webkit-keyframes verticalFlip { 0% { -webkit-transform: rotateX(-90deg); transform: rotateX(-90deg); opacity: 0; } 100% { -webkit-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } } @-moz-keyframes verticalFlip { 0% { -moz-transform: rotateX(-90deg); transform: rotateX(-90deg); opacity: 0; } 100% { -moz-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } } @keyframes verticalFlip { 0% { -webkit-transform: rotateX(-90deg); -moz-transform: rotateX(-90deg); transform: rotateX(-90deg); opacity: 0; } 100% { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } } @-webkit-keyframes verticalFlipOut { 0% { -webkit-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } 100% { -webkit-transform: rotateX(-90deg); transform: rotateX(-90deg); opacity: 0; } } @-moz-keyframes verticalFlipOut { 0% { -moz-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } 100% { -moz-transform: rotateX(-90deg); transform: rotateX(-90deg); opacity: 0; } } @keyframes verticalFlipOut { 0% { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } 100% { -webkit-transform: rotateX(-90deg); -moz-transform: rotateX(-90deg); transform: rotateX(-90deg); opacity: 0; } } /*-------------- Fades ---------------*/ /* Fade */ @-webkit-keyframes fade { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes fade { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fade { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* Fade Up */ @-webkit-keyframes fadeUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-moz-keyframes fadeUp { 0% { opacity: 0; -moz-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -moz-transform: translateY(0); transform: translateY(0); } } @keyframes fadeUp { 0% { opacity: 0; -webkit-transform: translateY(20px); -moz-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes fadeUpOut { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } } @-moz-keyframes fadeUpOut { 0% { opacity: 1; -moz-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(20px); transform: translateY(20px); } } @keyframes fadeUpOut { 0% { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); -moz-transform: translateY(20px); transform: translateY(20px); } } /* Fade Down */ @-webkit-keyframes fadeDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-moz-keyframes fadeDown { 0% { opacity: 0; -moz-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -moz-transform: translateY(0); transform: translateY(0); } } @keyframes fadeDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); -moz-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes fadeDownOut { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } } @-moz-keyframes fadeDownOut { 0% { opacity: 1; -moz-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-20px); transform: translateY(-20px); } } @keyframes fadeDownOut { 0% { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); -moz-transform: translateY(-20px); transform: translateY(-20px); } } /*-------------- Scale ---------------*/ /* Scale */ @-webkit-keyframes scale { 0% { opacity: 0; -webkit-transform: scale(0.7); transform: scale(0.7); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes scale { 0% { opacity: 0; -moz-transform: scale(0.7); transform: scale(0.7); } 100% { opacity: 1; -moz-transform: scale(1); transform: scale(1); } } @keyframes scale { 0% { opacity: 0; -webkit-transform: scale(0.7); -moz-transform: scale(0.7); transform: scale(0.7); } 100% { opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } } @-webkit-keyframes scaleOut { 0% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0; -webkit-transform: scale(0.7); transform: scale(0.7); } } @-moz-keyframes scaleOut { 0% { opacity: 1; -moz-transform: scale(1); transform: scale(1); } 100% { opacity: 0; -moz-transform: scale(0.7); transform: scale(0.7); } } @keyframes scaleOut { 0% { opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } 100% { opacity: 0; -webkit-transform: scale(0.7); -moz-transform: scale(0.7); transform: scale(0.7); } } /* * # Semantic - Video * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */ /******************************* Video *******************************/ .ui.video { position: relative; max-width: 100%; } /*-------------- Content ---------------*/ /* Placeholder Image */ .ui.video .placeholder { background-color: #333333; } /* Play Icon Overlay */ .ui.video .play { cursor: pointer; position: absolute; top: 0px; left: 0px; z-index: 10; width: 100%; height: 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60); opacity: 0.6; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; } .ui.video .play.icon:before { position: absolute; top: 50%; left: 50%; z-index: 11; font-size: 6rem; margin: -3rem 0em 0em -3rem; color: #FFFFFF; text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.4); } .ui.video .placeholder { display: block; width: 100%; height: 100%; } /* IFrame Embed */ .ui.video .embed { display: none; } /******************************* States *******************************/ /*-------------- Hover ---------------*/ .ui.video .play:hover { opacity: 1; } /*-------------- Active ---------------*/ .ui.video.active .play, .ui.video.active .placeholder { display: none; } .ui.video.active .embed { display: block; } /* * # Semantic Comment View * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * * Released: April 17 2013 */ /******************************* Standard *******************************/ /*-------------- Comments ---------------*/ .ui.comments a { cursor: pointer; } /*-------------- Comment ---------------*/ .ui.comments .comment { position: relative; margin-top: 0.5em; padding-top: 0.5em; } .ui.comments .comment:first-child { margin-top: 0em; padding-top: 0em; } /*-------------------- Avatar (Optional) ---------------------*/ .ui.comments .comment .avatar { display: block; float: left; width: 4em; } .ui.comments .comment .avatar img { display: block; margin: 0em auto; width: 3em; height: 3em; border-radius: 500px; } /*-------------- Content ---------------*/ .ui.comments .comment > .content, .ui.comments .comment > .avatar { display: block; } .ui.comments .comment .avatar ~ .content { padding: 0em 1em; } /* If there is an avatar move content over */ .ui.comments .comment > .avatar ~ .content { padding-top: 0.25em; margin-left: 3.5em; } .ui.comments .comment .metadata { display: inline-block; margin-left: 0.3em; color: rgba(0, 0, 0, 0.4); } .ui.comments .comment .metadata > * { display: inline-block; margin: 0em 0.3em 0em 0em; } /*-------------------- Comment Text ---------------------*/ .ui.comments .comment .text { margin: 0.25em 0em 0.5em; word-wrap: break-word; } /*-------------------- User Actions ---------------------*/ .ui.comments .comment .actions { font-size: 0.9em; } .ui.comments .comment .actions a { display: inline-block; margin: 0em 0.3em 0em 0em; color: rgba(0, 0, 0, 0.3); } .ui.comments .comment .actions a.active, .ui.comments .comment .actions a:hover { color: rgba(0, 0, 0, 0.6); } /*-------------------- Reply Form ---------------------*/ .ui.comments .reply.form { margin-top: 0.75em; width: 100%; max-width: 30em; } .ui.comments .comment .reply.form { margin-left: 2em; } .ui.comments > .reply.form { margin-top: 1.5em; max-width: 40em; } .ui.comments .reply.form textarea { height: 12em; } /*-------------------- Nested Comments ---------------------*/ .ui.comments .comment .comments { margin-top: 0.5em; padding-top: 0.5em; padding-bottom: 1em; } .ui.comments .comment .comments:before { position: absolute; top: 0px; left: 0px; } /* One Deep */ .ui.comments > .comment .comments { margin-left: 2em; } /* Two Deep */ .ui.comments > .comment > .comments > .comment > .comments { margin-left: 1.75em; } /* Three Deep */ .ui.comments > .comment > .comments > .comment > .comments > .comment > .comments { margin-left: 1.5em; } /* Four Deep or more */ .ui.comments > .comment > .comments > .comment > .comments > .comment > .comments > .comment .comments { margin-left: 0.5em; } /******************************* Variations *******************************/ /*-------------------- Threaded ---------------------*/ .ui.threaded.comments .comment .comments { margin-left: 2em !important; padding-left: 2em !important; -webkit-box-shadow: -1px 0px 0px rgba(0, 0, 0, 0.05); box-shadow: -1px 0px 0px rgba(0, 0, 0, 0.05); } /*-------------------- Minimal ---------------------*/ .ui.minimal.comments .comment .actions { opacity: 0; -webkit-transition: opacity 0.1s ease-out; -moz-transition: opacity 0.1s ease-out; transition: opacity 0.1s ease-out; -webkit-transition-delay: 0.1s; -moz-transition-delay: 0.1s; transition-delay: 0.1s; } .ui.minimal.comments .comment > .content:hover > .actions { opacity: 1; } /*-------------------- Sizes ---------------------*/ .ui.small.comments { font-size: 0.875em; } /* * # Activity Feed View * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * * Released: May 22, 2013 */ /******************************* Activity Feed *******************************/ .ui.feed a { cursor: pointer; } .ui.feed, .ui.feed .event, .ui.feed .label, .ui.feed .content, .ui.feed .extra { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } /******************************* Content *******************************/ /* Event */ .ui.feed .event { width: 100%; display: table; padding: 1em; } .ui.feed .event:first-child { border-top: 0px; } .ui.feed .event:last-child { margin-bottom: 1em; } /* Event Label */ .ui.feed .label { width: 3em; display: table-cell; vertical-align: top; text-align: left; } .ui.feed .label .icon { font-size: 1.5em; padding: 0.5em; margin: 0em; } .ui.feed .label img { width: 3em; margin: 0em; border-radius: 50em; } .ui.feed .label + .content { padding: 0.75em 1em 0em; } /* Content */ .ui.feed .content { display: table-cell; vertical-align: top; text-align: left; word-wrap: break-word; } /* Date */ .ui.feed .content .date { float: right; padding-left: 1em; color: rgba(0, 0, 0, 0.4); } /* Summary */ .ui.feed .content .summary { color: rgba(0, 0, 0, 0.75); } .ui.feed .content .summary img { display: inline-block; margin-right: 0.25em; width: 4em; border-radius: 500px; } /* Additional Information */ .ui.feed .content .extra { margin: 1em 0em 0em; padding: 0.5em 0em 0em; color: rgba(0, 0, 0, 0.5); } .ui.feed .content .extra.images img { display: inline-block; margin-right: 0.25em; width: 6em; } .ui.feed .content .extra.text { padding: 0.5em 1em; border-left: 0.2em solid rgba(0, 0, 0, 0.1); } /******************************* Variations *******************************/ .ui.small.feed { font-size: 0.875em; } .ui.small.feed .label img { width: 2.5em; } .ui.small.feed .label .icon { font-size: 1.25em; } .ui.feed .event { padding: 0.75em 0em; } .ui.small.feed .label + .content { padding: 0.5em 0.5em 0; } .ui.small.feed .content .extra.images img { width: 5em; } .ui.small.feed .content .extra { margin: 0.5em 0em 0em; } .ui.small.feed .content .extra.text { padding: 0.25em 0.5em; } /* * # Semantic Item View * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * * Released: April 17 2013 */ /******************************* Standard *******************************/ /*-------------- Items ---------------*/ .ui.items { margin: 1em 0em 0em; } .ui.items:first-child { margin-top: 0em; } .ui.items:last-child { margin-bottom: -1em; } /* Force Clearing */ .ui.items:after { display: block; content: ' '; height: 0px; clear: both; overflow: hidden; visibility: hidden; } /*-------------- Item ---------------*/ .ui.items > .row > .item, .ui.items > .item { display: block; float: left; position: relative; top: 0px; width: 316px; min-height: 375px; margin: 0em 0.5em 2.5em; padding: 0em; background-color: #FFFFFF; line-height: 1.2; font-size: 1em; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); border-bottom: 0.2em solid rgba(0, 0, 0, 0.2); border-radius: 0.33em; -webkit-transition: -webkit-box-shadow 0.2s ease; -moz-transition: box-shadow 0.2s ease; transition: box-shadow 0.2s ease; padding: 0.5em; } .ui.items a.item, .ui.items .item a { cursor: pointer; } .ui.items .item, .ui.items .item > .image, .ui.items .item > .image .overlay, .ui.items .item > .content, .ui.items .item > .content > .meta, .ui.items .item > .content > .extra { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } /*-------------- Images ---------------*/ .ui.items .item > .image { display: block; position: relative; background-color: rgba(0, 0, 0, 0.05); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; border-radius: 0.2em; } .ui.items .item > .image > img { display: block; width: 100%; } /*-------------- Content ---------------*/ .ui.items .item > .content { padding: 0.75em 0.5em; } .ui.items .item > .content > .name { display: block; font-size: 1.25em; font-weight: bold; margin-bottom: 0.2em; color: rgba(0, 0, 0, 0.7); } .ui.items .item > .content > .description { clear: both; margin: 0em 0em; color: rgba(0, 0, 0, 0.45); } .ui.items .item > .content > .description p { margin: 0em 0em 0.2em; } .ui.items .item > .content > .description p:last-child { margin-bottom: 0em; } /*-------------- Meta ---------------*/ .ui.items .item .meta { float: right; color: rgba(0, 0, 0, 0.35); } .ui.items .item > .content > .meta + .name { float: left; } /*-------------- Labels ---------------*/ /*-----star----- */ /* hover */ .ui.items .item .star.label:hover::after { border-right-color: #F6EFC3; } .ui.items .item .star.label:hover::after { border-top-color: #F6EFC3; } .ui.items .item .star.label:hover .icon { color: #ac9400; } /* active */ .ui.items .item .star.label.active::after { border-right-color: #F6EFC3; } .ui.items .item .star.label.active::after { border-top-color: #F6EFC3; } .ui.items .item .star.label.active .icon { color: #ac9400; } /*-----like----- */ /* hover */ .ui.items .item .like.label:hover::after { border-right-color: #F5E1E2; } .ui.items .item .like.label.active::after { border-top-color: #F5E1E2; } .ui.items .item .like.label:hover .icon { color: #ef404a; } /* active */ .ui.items .item .like.label.active::after { border-right-color: #F5E1E2; } .ui.items .item .like.label.active::after { border-top-color: #F5E1E2; } .ui.items .item .like.label.active .icon { color: #ef404a; } /*-------------- Extra ---------------*/ .ui.items .item .extra { position: absolute; width: 100%; padding: 0em 0.5em; bottom: -2em; left: 0em; height: 1.5em; color: rgba(0, 0, 0, 0.25); -webkit-transition: color 0.2s ease; -moz-transition: color 0.2s ease; transition: color 0.2s ease; } .ui.items .item .extra > img { display: inline-block; border-radius: 500px 500px 500px 500px; margin-right: 0.25em; vertical-align: middle; width: 2em; } .ui.items .item .extra .left { float: left; } .ui.items .item .extra .right { float: right; } /******************************* States *******************************/ .ui.items .item:hover { cursor: pointer; z-index: 5; -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2); } .ui.items .item:hover .extra { color: rgba(0, 0, 0, 0.5); } .ui.items .item:nth-of-type(6n+1):hover { border-bottom-color: #6ECFF5 !important; } .ui.items .item:nth-of-type(6n+2):hover { border-bottom-color: #5C6166 !important; } .ui.items .item:nth-of-type(6n+3):hover { border-bottom-color: #A1CF64 !important; } .ui.items .item:nth-of-type(6n+4):hover { border-bottom-color: #D95C5C !important; } .ui.items .item:nth-of-type(6n+5):hover { border-bottom-color: #00B5AD !important; } .ui.items .item:nth-of-type(6n+6):hover { border-bottom-color: #564F8A !important; } /******************************* Variations *******************************/ /*-------------- Connected ---------------*/ .ui.connected.items { display: table; width: 100%; margin-left: 0em !important; margin-right: 0em !important; } .ui.connected.items > .row > .item, .ui.connected.items > .item { float: none; display: table-cell; vertical-align: top; height: auto; border-radius: 0px; margin: 0em; width: 33.33%; } .ui.connected.items > .row { display: table; margin: 0.5em 0em; } .ui.connected.items > .row:first-child { margin-top: 0em; } /* Borders */ .ui.connected.items > .item, .ui.connected.items > .row:last-child > .item { border-bottom: 0.2em solid rgba(0, 0, 0, 0.2); } .ui.connected.items > .row:last-child > .item:first-child, .ui.connected.items > .item:first-child { border-radius: 0em 0em 0em 0.33em; } .ui.connected.items > .row:last-child > .item:last-child, .ui.connected.items > .item:last-child { border-radius: 0em 0em 0.33em 0em; } /* Hover */ .ui.connected.items .item:hover { border-bottom-width: 0.2em; } /* Item Count */ .ui.one.connected.items > .row > .item, .ui.one.connected.items > .item { width: 50%; padding-left: 2%; padding-right: 2%; } .ui.two.connected.items > .row > .item, .ui.two.connected.items > .item { width: 50%; padding-left: 1%; padding-right: 1%; } .ui.three.connected.items > .row > .item, .ui.three.connected.items > .item { width: 33.333%; padding-left: 1%; padding-right: 1%; } .ui.four.connected.items > .row > .item, .ui.four.connected.items > .item { width: 25%; padding-left: 0.5%; padding-right: 0.5%; } .ui.five.connected.items > .row > .item, .ui.five.connected.items > .item { width: 20%; padding-left: 0.5%; padding-right: 0.5%; } .ui.six.connected.items > .row > .item, .ui.six.connected.items > .item { width: 16.66%; padding-left: 0.5%; padding-right: 0.5%; } .ui.seven.connected.items > .row > .item, .ui.seven.connected.items > .item { width: 14.28%; padding-left: 0.5%; padding-right: 0.5%; } .ui.eight.connected.items > .row > .item, .ui.eight.connected.items > .item { width: 12.5%; padding-left: 0.25%; padding-right: 0.25%; } .ui.nine.connected.items > .row > .item, .ui.nine.connected.items > .item { width: 11.11%; padding-left: 0.25%; padding-right: 0.25%; } .ui.ten.connected.items > .row > .item, .ui.ten.connected.items > .item { width: 10%; padding-left: 0.2%; padding-right: 0.2%; } .ui.eleven.connected.items > .row > .item, .ui.eleven.connected.items > .item { width: 9.09%; padding-left: 0.2%; padding-right: 0.2%; } .ui.twelve.connected.items > .row > .item, .ui.twelve.connected.items > .item { width: 8.3333%; padding-left: 0.1%; padding-right: 0.1%; } /*------------------- Responsive --------------------*/ @media only screen and (max-width: 768px) { .ui.stackable.items { display: block !important; } .ui.stackable.items > .item, .ui.stackable.items > .row > .item { display: block !important; height: auto !important; width: 100% !important; padding: 0% !important; } } /*-------------------- Horizontal ---------------------*/ .ui.horizontal.items > .item, .ui.items > .horizontal.item { display: table; } .ui.horizontal.items > .item > .image, .ui.items > .horizontal.item > .image { display: table-cell; width: 50%; } .ui.horizontal.items > .item > .image + .content, .ui.items > .horizontal.item > .image + .content { width: 50%; display: table-cell; } .ui.horizontal.items > .item > .content, .ui.items > .horizontal.item > .content { padding: 1% 1.7% 11% 3%; vertical-align: top; } .ui.horizontal.items > .item > .meta, .ui.items > .horizontal.item > .meta { position: absolute; padding: 0%; bottom: 7%; left: 3%; width: 94%; } .ui.horizontal.items > .item > .image + .content + .meta, .ui.items > .horizontal.item > .image + .content + .meta { bottom: 7%; left: 53%; width: 44%; } .ui.horizontal.items > .item .avatar, .ui.items > .horizontal.item .avatar { width: 11.5%; } .ui.items > .item .avatar { max-width: 25px; } /*-------------- Item Count ---------------*/ .ui.one.items { margin-left: -2%; margin-right: -2%; } .ui.one.items > .item { width: 100%; margin-left: 2%; margin-right: 2%; } .ui.two.items { margin-left: -1%; margin-right: -1%; } .ui.two.items > .item { width: 48%; margin-left: 1%; margin-right: 1%; } .ui.two.items > .item:nth-child(2n+1) { clear: left; } .ui.three.items { margin-left: -1%; margin-right: -1%; } .ui.three.items > .item { width: 31.333%; margin-left: 1%; margin-right: 1%; } .ui.three.items > .item:nth-child(3n+1) { clear: left; } .ui.four.items { margin-left: -0.5%; margin-right: -0.5%; } .ui.four.items > .item { width: 24%; margin-left: 0.5%; margin-right: 0.5%; } .ui.four.items > .item:nth-child(4n+1) { clear: left; } .ui.five.items { margin-left: -0.5%; margin-right: -0.5%; } .ui.five.items > .item { width: 19%; margin-left: 0.5%; margin-right: 0.5%; } .ui.five.items > .item:nth-child(5n+1) { clear: left; } .ui.six.items { margin-left: -0.5%; margin-right: -0.5%; } .ui.six.items > .item { width: 15.66%; margin-left: 0.5%; margin-right: 0.5%; } .ui.six.items > .item:nth-child(6n+1) { clear: left; } .ui.seven.items { margin-left: -0.5%; margin-right: -0.5%; } .ui.seven.items > .item { width: 13.28%; margin-left: 0.5%; margin-right: 0.5%; font-size: 11px; } .ui.seven.items > .item:nth-child(7n+1) { clear: left; } .ui.eight.items { margin-left: -0.25%; margin-right: -0.25%; } .ui.eight.items > .item { width: 12.0%; margin-left: 0.25%; margin-right: 0.25%; font-size: 11px; } .ui.eight.items > .item:nth-child(8n+1) { clear: left; } .ui.nine.items { margin-left: -0.25%; margin-right: -0.25%; } .ui.nine.items > .item { width: 10.61%; margin-left: 0.25%; margin-right: 0.25%; font-size: 10px; } .ui.nine.items > .item:nth-child(9n+1) { clear: left; } .ui.ten.items { margin-left: -0.2%; margin-right: -0.2%; } .ui.ten.items > .item { width: 9.6%; margin-left: 0.2%; margin-right: 0.2%; font-size: 10px; } .ui.ten.items > .item:nth-child(10n+1) { clear: left; } .ui.eleven.items { margin-left: -0.2%; margin-right: -0.2%; } .ui.eleven.items > .item { width: 8.69%; margin-left: 0.2%; margin-right: 0.2%; font-size: 9px; } .ui.eleven.items > .item:nth-child(11n+1) { clear: left; } .ui.twelve.items { margin-left: -0.1%; margin-right: -0.1%; } .ui.twelve.items > .item { width: 8.1333%; margin-left: 0.1%; margin-right: 0.1%; font-size: 9px; } .ui.twelve.items > .item:nth-child(12n+1) { clear: left; } /* * # Semantic List - Flat * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * * Released: April 26 2013 */ /******************************* List *******************************/ ul.ui.list, ol.ui.list, .ui.list { list-style-type: none; margin: 1em 0em; padding: 0em; } ul.ui.list ul, ol.ui.list ol, .ui.list .list { margin: 0em; padding: 0.5em 0em 0.5em 1em; } ul.ui.list:first-child, ol.ui.list:first-child, .ui.list:first-child { margin-top: 0em; } ul.ui.list:last-child, ol.ui.list:last-child, .ui.list:last-child { margin-bottom: 0em; } /******************************* Content *******************************/ /* List Item */ ul.ui.list li, ol.ui.list li, .ui.list .item { display: list-item; list-style-type: none; list-style-position: inside; padding: 0.3em 0em; line-height: 1.2em; } .ui.list .item:after { content: ''; display: block; height: 0; clear: both; visibility: hidden; } /* Sub-List */ .ui.list .list { clear: both; } /* Icon */ .ui.list .item > .icon { display: block; float: left; margin: 0em 1em 0em 0em; padding: 0.1em 0em 0em 0em; } .ui.list .item > .icon:only-child { display: inline-block; } .ui.horizontal.list .item > .icon { margin: 0em; padding: 0em 0.25em 0em 0em; } .ui.horizontal.list .item > .icon, .ui.horizontal.list .item > .icon + .content { float: none; display: inline-block; } /* Image */ .ui.list .item > img { display: block; float: left; margin-right: 1em; vertical-align: middle; } /* Content */ .ui.list .item > .content { display: inline-block; vertical-align: middle; line-height: 1.2em; } .ui.list .item > .icon + .content { display: table-cell; vertical-align: top; } /* Link */ .ui.list a { cursor: pointer; } .ui.list a .icon { color: rgba(0, 0, 0, 0.6); -webkit-transition: color 0.2s ease; -moz-transition: color 0.2s ease; transition: color 0.2s ease; } /* Header */ .ui.list .header { font-weight: bold; } .ui.list .description { color: rgba(0, 0, 0, 0.5); } /* Floated Content */ .ui.list .item > .left.floated { margin-right: 1em; float: left; } .ui.list .item > .right.floated { margin-left: 1em; float: right; } /******************************* Types *******************************/ /*------------------- Horizontal --------------------*/ .ui.horizontal.list { display: inline-block; font-size: 0em; } .ui.horizontal.list > .item { display: inline-block; margin-left: 1em; font-size: 1rem; } .ui.horizontal.list > .item:first-child { margin-left: 0em; } .ui.horizontal.list .list { padding-left: 0em; padding-bottom: 0em; } /******************************* States *******************************/ /*------------------- Hover --------------------*/ .ui.list a:hover .icon { color: rgba(0, 0, 0, 0.8); } /******************************* Variations *******************************/ /*------------------- Inverted --------------------*/ .ui.inverted.list a .icon { color: rgba(255, 255, 255, 0.6); } .ui.inverted.list .description { color: rgba(255, 255, 255, 0.8); } .ui.inverted.link.list .item { color: rgba(255, 255, 255, 0.4); } /*------------------- Link --------------------*/ .ui.link.list .item { color: rgba(0, 0, 0, 0.3); } .ui.link.list a.item, .ui.link.list .item a { color: rgba(0, 0, 0, 0.5); } .ui.link.list a.item:hover, .ui.link.list .item a:hover { color: rgba(0, 0, 0, 0.8); } .ui.link.list a.item:active, .ui.link.list .item a:active { color: rgba(0, 0, 0, 0.8); } .ui.link.list a.active.item, .ui.link.list .active.item a { color: rgba(0, 0, 0, 0.8); } /* Inverted */ .ui.inverted.link.list a.item, .ui.inverted.link.list .item a { color: rgba(255, 255, 255, 0.6); } .ui.inverted.link.list a.item:hover, .ui.inverted.link.list .item a:hover { color: rgba(255, 255, 255, 0.8); } .ui.inverted.link.list a.item:active, .ui.inverted.link.list .item a:active { color: rgba(255, 255, 255, 0.9); } .ui.inverted.link.list a.active.item, .ui.inverted.link.list .active.item a { color: rgba(255, 255, 255, 0.8); } /*------------------- Selection --------------------*/ .ui.selection.list .item { cursor: pointer; color: rgba(0, 0, 0, 0.4); padding: 0.5em; -webkit-transition: 0.2s color ease, 0.2s padding-left ease, 0.2s background-color ease; -moz-transition: 0.2s color ease, 0.2s padding-left ease, 0.2s background-color ease; transition: 0.2s color ease, 0.2s padding-left ease, 0.2s background-color ease; } .ui.selection.list .item:hover { background-color: rgba(0, 0, 0, 0.02); color: rgba(0, 0, 0, 0.7); } .ui.selection.list .item:active { background-color: rgba(0, 0, 0, 0.05); color: rgba(0, 0, 0, 0.7); } .ui.selection.list .item.active { background-color: rgba(0, 0, 0, 0.04); color: rgba(0, 0, 0, 0.7); } .ui.animated.list .item { -webkit-transition: 0.2s color ease, 0.2s padding-left ease, 0.2s background-color ease; -moz-transition: 0.2s color ease, 0.2s padding-left ease, 0.2s background-color ease; transition: 0.2s color ease, 0.2s padding-left ease, 0.2s background-color ease; } .ui.animated.list:not(.horizontal) .item:hover { padding-left: 1em; } .ui.animated.list:not(.horizontal) .item:hover .item:hover { padding-left: 0.5em; } /* Inverted */ .ui.inverted.selection.list .item { color: rgba(255, 255, 255, 0.6); } .ui.inverted.selection.list .item:hover { background-color: rgba(255, 255, 255, 0.04); color: rgba(255, 255, 255, 0.8); } .ui.inverted.selection.list .item:active { background-color: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.7); } .ui.inverted.selection.list .item.active { background-color: rgba(255, 255, 255, 0.08); color: #FFFFFF; } /*------------------- Bulleted --------------------*/ ul.ui.list, .ui.bulleted.list { margin-left: 1.5em; } ul.ui.list li, .ui.bulleted.list .item { position: relative; } ul.ui.list li:before, .ui.bulleted.list .item:before { position: absolute; left: -1.5em; content: '•'; } ul.ui.list ul, .ui.bulleted.list .list { padding-left: 1.5em; } /* Horizontal Bulleted */ ul.ui.horizontal.bulleted.list, .ui.horizontal.bulleted.list { margin-left: 0em; } ul.ui.horizontal.bulleted.list li, .ui.horizontal.bulleted.list .item { margin-left: 1.5em; } ul.ui.horizontal.bulleted.list li:before, .ui.horizontal.bulleted.list .item:before { left: -0.9em; } ul.ui.horizontal.bulleted.list li:first-child, .ui.horizontal.bulleted.list .item:first-child { margin-left: 0em; } ul.ui.horizontal.bulleted.list li:first-child::before, .ui.horizontal.bulleted.list .item:first-child::before { display: none; } /*------------------- Ordered --------------------*/ ol.ui.list, .ui.ordered.list { counter-reset: ordered; margin-left: 2em; list-style-type: none; } ol.ui.list li, .ui.ordered.list .item { list-style-type: none; position: relative; } ol.ui.list li:before, .ui.ordered.list .item:before { position: absolute; left: -2em; counter-increment: ordered; content: counters(ordered, "."); text-align: right; vertical-align: top; opacity: 0.75; } ol.ui.list ol, .ui.ordered.list .list { counter-reset: ordered; padding-left: 2.5em; } ol.ui.list ol li:before, .ui.ordered.list .list .item:before { left: -2.5em; } /* Horizontal Ordered */ ol.ui.horizontal.list, .ui.ordered.horizontal.list { margin-left: 0em; } ol.ui.horizontal.list li:before, .ui.ordered.horizontal.list .item:before { position: static; left: 0em; margin: 0em 0.5em 0em 0em; } /*------------------- Divided --------------------*/ .ui.divided.list > .item, .ui.divided.list:not(.horizontal) > .list { border-top: 1px solid rgba(0, 0, 0, 0.1); padding-left: 0.5em; padding-right: 0.5em; } .ui.divided.list .item .menu .item { border-width: 0px; } .ui.divided.list .item:first-child { border-top-width: 0px; } /* Sub Menu */ .ui.divided.list:not(.horizontal) .list { margin-left: -0.5em; margin-right: -0.5em; } .ui.divided.list:not(.horizontal) .list .item { padding-left: 1em; padding-right: 1em; } .ui.divided.list:not(.horizontal) .list .item:first-child { border-top-width: 1px; } /* Divided bulleted */ .ui.divided.bulleted.list { margin-left: 0em; } .ui.divided.bulleted.list .item { padding-left: 1.5em; } .ui.divided.bulleted.list .item:before { left: 0.5em; } /* Divided ordered */ .ui.divided.ordered.list { margin-left: 0em; } .ui.divided.ordered.list > .item { padding-left: 2em; padding-right: 2em; } .ui.divided.ordered.list > .item:before { left: 0.5em; } .ui.divided.ordered.list .item .list { margin-left: -2em; margin-right: -2em; } /* Divided horizontal */ .ui.divided.horizontal.list { margin-left: 0em; } .ui.divided.horizontal.list > .item { border-top: none; border-left: 1px solid rgba(0, 0, 0, 0.1); margin: 0em; padding-left: 0.75em; padding-right: 0.75em; line-height: 0.6em; } .ui.horizontal.divided.list > .item:first-child { border-left: none; padding-left: 0em; } /* Inverted */ .ui.divided.inverted.list > .item, .ui.divided.inverted.list > .list { border-color: rgba(255, 255, 255, 0.2); } .ui.divided.inverted.horizontal.list .item { border-color: rgba(255, 255, 255, 0.2); } /*------------------- Celled --------------------*/ .ui.celled.list > .item, .ui.celled.list > .list { border-top: 1px solid rgba(0, 0, 0, 0.1); padding-left: 0.5em; padding-right: 0.5em; } .ui.celled.list > .item:last-child { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } /* Sub Menu */ .ui.celled.list .item .list { margin-left: -0.5em; margin-right: -0.5em; } .ui.celled.list .item .list .item { border-width: 0px; } .ui.celled.list .list .item:first-child { border-top-width: 0px; } /* Celled Bulleted */ .ui.celled.bulleted.list { margin-left: 0em; } .ui.celled.bulleted.list > .item { padding-left: 1.5em; } .ui.celled.bulleted.list > .item:before { left: 0.5em; } /* Celled Ordered */ .ui.celled.ordered.list { margin-left: 0em; } .ui.celled.ordered.list .item { padding-left: 2em; padding-right: 2em; } .ui.celled.ordered.list .item:before { left: 0.5em; } .ui.celled.ordered.list .item .list { margin-left: -2em; margin-right: -2em; } /* Celled Horizontal */ .ui.horizontal.celled.list { margin-left: 0em; } .ui.horizontal.celled.list .item { border-top: none; border-left: 1px solid rgba(0, 0, 0, 0.1); margin: 0em; padding-left: 0.75em; padding-right: 0.75em; line-height: 0.6em; } .ui.horizontal.celled.list .item:last-child { border-bottom: none; border-right: 1px solid rgba(0, 0, 0, 0.1); } /* Inverted */ .ui.celled.inverted.list > .item, .ui.celled.inverted.list > .list { border-color: rgba(255, 255, 255, 0.2); } .ui.celled.inverted.horizontal.list .item { border-color: rgba(255, 255, 255, 0.2); } /*------------------- Relaxed --------------------*/ .ui.relaxed.list:not(.horizontal) .item { padding-top: 0.5em; padding-bottom: 0.5em; } .ui.relaxed.list .header { margin-bottom: 0.25em; } .ui.horizontal.relaxed.list .item { padding-left: 1.25em; padding-right: 1.25em; } .ui.very.relaxed.list:not(.horizontal) .item { padding-top: 1em; padding-bottom: 1em; } .ui.very.relaxed.list .header { margin-bottom: 0.5em; } .ui.horizontal.very.relaxed.list .item { padding-left: 2em; padding-right: 2em; } /*------------------- Sizes --------------------*/ .ui.mini.list .item { font-size: 0.7rem; } .ui.tiny.list .item { font-size: 0.8125rem; } .ui.small.list .item { font-size: 0.875rem; } .ui.list .item { font-size: 1em; } .ui.large.list .item { font-size: 1.125rem; } .ui.big.list .item { font-size: 1.25rem; } .ui.huge.list .item { font-size: 1.375rem; } .ui.massive.list .item { font-size: 1.5rem; } /* * # Statistic * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * * Released: Aug 20, 2013 */ /******************************* Statistic *******************************/ .ui.statistic { text-align: center; } /******************************* Content *******************************/ .ui.statistic > .number { font-size: 4em; font-weight: bold; color: rgba(0, 0, 0, 0.7); } .ui.statistic > .description { opacity: 0.8; } css-3.0.0/benchmark/small.css000066400000000000000000000171471367726301600161030ustar00rootroot00000000000000/*! normalize.css v3.0.1 | MIT License | git.io/normalize */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ a { background: transparent; } /** * Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari and Chrome. */ dfn { font-style: italic; } /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari, and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9/10. */ img { border: 0; } /** * Correct overflow not hidden in IE 9/10/11. */ svg:not(:root) { overflow: hidden; } /* Grouping content ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari. */ figure { margin: 1em 40px; } /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Contain overflow in all browsers. */ pre { overflow: auto; } /** * Address odd `em`-unit font size rendering in all browsers. */ code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } /* Forms ========================================================================== */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited * styling of `select`, unless a `border` property is set. */ /** * 1. Correct color not being inherited. * Known issue: affects color of disabled elements. * 2. Correct font properties not being inherited. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ } /** * Address `overflow` set to `hidden` in IE 8/9/10/11. */ button { overflow: visible; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. * Correct `select` style inheritance in Firefox. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ input { line-height: normal; } /** * It's recommended that you don't attempt to style these elements. * Firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. * Safari (but not Chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct `color` not being inherited in IE 8/9/10/11. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ } /** * Remove default vertical scrollbar in IE 8/9/10/11. */ textarea { overflow: auto; } /** * Don't inherit the `font-weight` (applied by a rule above). * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ optgroup { font-weight: bold; } /* Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } css-3.0.0/generate-tests.js000066400000000000000000000030431367726301600156050ustar00rootroot00000000000000// Generates missing output source and AST files for the test cases // IMPORTANT: Always verify the generated files when using this! var fs = require('fs'); var path = require('path'); var parse = require('./').parse; var stringify = require('./').stringify; var casesDir = path.join(__dirname, 'test', 'cases'); var cases = fs.readdirSync(casesDir) .map(function(f) { return path.join(casesDir, f); }); cases.forEach(function(dir) { var inputFile = path.join(dir, 'input.css'); if (!fs.existsSync(inputFile)) throw new Error('Missing input file ' + inputFile); var input = fs.readFileSync(inputFile, 'utf8'); var parsed; try { parsed = parse(input, { source: 'input.css' }); } catch(e) { console.log('Failed to parse', inputFile); throw e; } var outputFile = path.join(dir, 'output.css'); if (!fs.existsSync(outputFile)) { console.log('Generating', outputFile); var output = stringify(parsed); fs.writeFileSync(outputFile, output, 'utf8'); } var compressedFile = path.join(dir, 'compressed.css'); if (!fs.existsSync(compressedFile)) { console.log('Generating', compressedFile); var compressed = stringify(parsed, { compress: true }); fs.writeFileSync(compressedFile, compressed, 'utf8'); } var astFile = path.join(dir, 'ast.json'); if (!fs.existsSync(astFile)) { console.log('Generating', astFile); var ast = JSON.stringify(parsed, null, ' '); fs.writeFileSync(astFile, ast, 'utf8'); } }); css-3.0.0/index.js000066400000000000000000000001301367726301600137540ustar00rootroot00000000000000exports.parse = require('./lib/parse'); exports.stringify = require('./lib/stringify'); css-3.0.0/lib/000077500000000000000000000000001367726301600130635ustar00rootroot00000000000000css-3.0.0/lib/parse/000077500000000000000000000000001367726301600141755ustar00rootroot00000000000000css-3.0.0/lib/parse/index.js000066400000000000000000000251341367726301600156470ustar00rootroot00000000000000// http://www.w3.org/TR/CSS21/grammar.html // https://github.com/visionmedia/css-parse/pull/49#issuecomment-30088027 var commentre = /\/\*[^*]*\*+([^/*][^*]*\*+)*\//g module.exports = function(css, options){ options = options || {}; /** * Positional. */ var lineno = 1; var column = 1; /** * Update lineno and column based on `str`. */ function updatePosition(str) { var lines = str.match(/\n/g); if (lines) lineno += lines.length; var i = str.lastIndexOf('\n'); column = ~i ? str.length - i : column + str.length; } /** * Mark position and patch `node.position`. */ function position() { var start = { line: lineno, column: column }; return function(node){ node.position = new Position(start); whitespace(); return node; }; } /** * Store position information for a node */ function Position(start) { this.start = start; this.end = { line: lineno, column: column }; this.source = options.source; } /** * Non-enumerable source string */ Position.prototype.content = css; /** * Error `msg`. */ var errorsList = []; function error(msg) { var err = new Error(options.source + ':' + lineno + ':' + column + ': ' + msg); err.reason = msg; err.filename = options.source; err.line = lineno; err.column = column; err.source = css; if (options.silent) { errorsList.push(err); } else { throw err; } } /** * Parse stylesheet. */ function stylesheet() { var rulesList = rules(); return { type: 'stylesheet', stylesheet: { source: options.source, rules: rulesList, parsingErrors: errorsList } }; } /** * Opening brace. */ function open() { return match(/^{\s*/); } /** * Closing brace. */ function close() { return match(/^}/); } /** * Parse ruleset. */ function rules() { var node; var rules = []; whitespace(); comments(rules); while (css.length && css.charAt(0) != '}' && (node = atrule() || rule())) { if (node !== false) { rules.push(node); comments(rules); } } return rules; } /** * Match `re` and return captures. */ function match(re) { var m = re.exec(css); if (!m) return; var str = m[0]; updatePosition(str); css = css.slice(str.length); return m; } /** * Parse whitespace. */ function whitespace() { match(/^\s*/); } /** * Parse comments; */ function comments(rules) { var c; rules = rules || []; while (c = comment()) { if (c !== false) { rules.push(c); } } return rules; } /** * Parse comment. */ function comment() { var pos = position(); if ('/' != css.charAt(0) || '*' != css.charAt(1)) return; var i = 2; while ("" != css.charAt(i) && ('*' != css.charAt(i) || '/' != css.charAt(i + 1))) ++i; i += 2; if ("" === css.charAt(i-1)) { return error('End of comment missing'); } var str = css.slice(2, i - 2); column += 2; updatePosition(str); css = css.slice(i); column += 2; return pos({ type: 'comment', comment: str }); } /** * Parse selector. */ function selector() { var m = match(/^([^{]+)/); if (!m) return; /* @fix Remove all comments from selectors * http://ostermiller.org/findcomment.html */ return trim(m[0]) .replace(/\/\*([^*]|[\r\n]|(\*+([^*/]|[\r\n])))*\*\/+/g, '') .replace(/"(?:\\"|[^"])*"|'(?:\\'|[^'])*'/g, function(m) { return m.replace(/,/g, '\u200C'); }) .split(/\s*(?![^(]*\)),\s*/) .map(function(s) { return s.replace(/\u200C/g, ','); }); } /** * Parse declaration. */ function declaration() { var pos = position(); // prop var prop = match(/^(\*?[-#\/\*\\\w]+(\[[0-9a-z_-]+\])?)\s*/); if (!prop) return; prop = trim(prop[0]); // : if (!match(/^:\s*/)) return error("property missing ':'"); // val var val = match(/^((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^\)]*?\)|[^};])+)/); var ret = pos({ type: 'declaration', property: prop.replace(commentre, ''), value: val ? trim(val[0]).replace(commentre, '') : '' }); // ; match(/^[;\s]*/); return ret; } /** * Parse declarations. */ function declarations() { var decls = []; if (!open()) return error("missing '{'"); comments(decls); // declarations var decl; while (decl = declaration()) { if (decl !== false) { decls.push(decl); comments(decls); } } if (!close()) return error("missing '}'"); return decls; } /** * Parse keyframe. */ function keyframe() { var m; var vals = []; var pos = position(); while (m = match(/^((\d+\.\d+|\.\d+|\d+)%?|[a-z]+)\s*/)) { vals.push(m[1]); match(/^,\s*/); } if (!vals.length) return; return pos({ type: 'keyframe', values: vals, declarations: declarations() }); } /** * Parse keyframes. */ function atkeyframes() { var pos = position(); var m = match(/^@([-\w]+)?keyframes\s*/); if (!m) return; var vendor = m[1]; // identifier var m = match(/^([-\w]+)\s*/); if (!m) return error("@keyframes missing name"); var name = m[1]; if (!open()) return error("@keyframes missing '{'"); var frame; var frames = comments(); while (frame = keyframe()) { frames.push(frame); frames = frames.concat(comments()); } if (!close()) return error("@keyframes missing '}'"); return pos({ type: 'keyframes', name: name, vendor: vendor, keyframes: frames }); } /** * Parse supports. */ function atsupports() { var pos = position(); var m = match(/^@supports *([^{]+)/); if (!m) return; var supports = trim(m[1]); if (!open()) return error("@supports missing '{'"); var style = comments().concat(rules()); if (!close()) return error("@supports missing '}'"); return pos({ type: 'supports', supports: supports, rules: style }); } /** * Parse host. */ function athost() { var pos = position(); var m = match(/^@host\s*/); if (!m) return; if (!open()) return error("@host missing '{'"); var style = comments().concat(rules()); if (!close()) return error("@host missing '}'"); return pos({ type: 'host', rules: style }); } /** * Parse media. */ function atmedia() { var pos = position(); var m = match(/^@media *([^{]+)/); if (!m) return; var media = trim(m[1]); if (!open()) return error("@media missing '{'"); var style = comments().concat(rules()); if (!close()) return error("@media missing '}'"); return pos({ type: 'media', media: media, rules: style }); } /** * Parse custom-media. */ function atcustommedia() { var pos = position(); var m = match(/^@custom-media\s+(--[^\s]+)\s*([^{;]+);/); if (!m) return; return pos({ type: 'custom-media', name: trim(m[1]), media: trim(m[2]) }); } /** * Parse paged media. */ function atpage() { var pos = position(); var m = match(/^@page */); if (!m) return; var sel = selector() || []; if (!open()) return error("@page missing '{'"); var decls = comments(); // declarations var decl; while (decl = declaration()) { decls.push(decl); decls = decls.concat(comments()); } if (!close()) return error("@page missing '}'"); return pos({ type: 'page', selectors: sel, declarations: decls }); } /** * Parse document. */ function atdocument() { var pos = position(); var m = match(/^@([-\w]+)?document *([^{]+)/); if (!m) return; var vendor = trim(m[1]); var doc = trim(m[2]); if (!open()) return error("@document missing '{'"); var style = comments().concat(rules()); if (!close()) return error("@document missing '}'"); return pos({ type: 'document', document: doc, vendor: vendor, rules: style }); } /** * Parse font-face. */ function atfontface() { var pos = position(); var m = match(/^@font-face\s*/); if (!m) return; if (!open()) return error("@font-face missing '{'"); var decls = comments(); // declarations var decl; while (decl = declaration()) { decls.push(decl); decls = decls.concat(comments()); } if (!close()) return error("@font-face missing '}'"); return pos({ type: 'font-face', declarations: decls }); } /** * Parse import */ var atimport = _compileAtrule('import'); /** * Parse charset */ var atcharset = _compileAtrule('charset'); /** * Parse namespace */ var atnamespace = _compileAtrule('namespace'); /** * Parse non-block at-rules */ function _compileAtrule(name) { var re = new RegExp('^@' + name + '\\s*([^;]+);'); return function() { var pos = position(); var m = match(re); if (!m) return; var ret = { type: name }; ret[name] = m[1].trim(); return pos(ret); } } /** * Parse at rule. */ function atrule() { if (css[0] != '@') return; return atkeyframes() || atmedia() || atcustommedia() || atsupports() || atimport() || atcharset() || atnamespace() || atdocument() || atpage() || athost() || atfontface(); } /** * Parse rule. */ function rule() { var pos = position(); var sel = selector(); if (!sel) return error('selector missing'); comments(); return pos({ type: 'rule', selectors: sel, declarations: declarations() }); } return addParent(stylesheet()); }; /** * Trim `str`. */ function trim(str) { return str ? str.replace(/^\s+|\s+$/g, '') : ''; } /** * Adds non-enumerable parent node reference to each node. */ function addParent(obj, parent) { var isNode = obj && typeof obj.type === 'string'; var childParent = isNode ? obj : parent; for (var k in obj) { var value = obj[k]; if (Array.isArray(value)) { value.forEach(function(v) { addParent(v, childParent); }); } else if (value && typeof value === 'object') { addParent(value, childParent); } } if (isNode) { Object.defineProperty(obj, 'parent', { configurable: true, writable: true, enumerable: false, value: parent || null }); } return obj; } css-3.0.0/lib/stringify/000077500000000000000000000000001367726301600151015ustar00rootroot00000000000000css-3.0.0/lib/stringify/compiler.js000066400000000000000000000013421367726301600172510ustar00rootroot00000000000000 /** * Expose `Compiler`. */ module.exports = Compiler; /** * Initialize a compiler. * * @param {Type} name * @return {Type} * @api public */ function Compiler(opts) { this.options = opts || {}; } /** * Emit `str` */ Compiler.prototype.emit = function(str) { return str; }; /** * Visit `node`. */ Compiler.prototype.visit = function(node){ return this[node.type](node); }; /** * Map visit over array of `nodes`, optionally using a `delim` */ Compiler.prototype.mapVisit = function(nodes, delim){ var buf = ''; delim = delim || ''; for (var i = 0, length = nodes.length; i < length; i++) { buf += this.visit(nodes[i]); if (delim && i < length - 1) buf += this.emit(delim); } return buf; }; css-3.0.0/lib/stringify/compress.js000066400000000000000000000070051367726301600172740ustar00rootroot00000000000000 /** * Module dependencies. */ var Base = require('./compiler'); var inherits = require('inherits'); /** * Expose compiler. */ module.exports = Compiler; /** * Initialize a new `Compiler`. */ function Compiler(options) { Base.call(this, options); } /** * Inherit from `Base.prototype`. */ inherits(Compiler, Base); /** * Compile `node`. */ Compiler.prototype.compile = function(node){ return node.stylesheet .rules.map(this.visit, this) .join(''); }; /** * Visit comment node. */ Compiler.prototype.comment = function(node){ return this.emit('', node.position); }; /** * Visit import node. */ Compiler.prototype.import = function(node){ return this.emit('@import ' + node.import + ';', node.position); }; /** * Visit media node. */ Compiler.prototype.media = function(node){ return this.emit('@media ' + node.media, node.position) + this.emit('{') + this.mapVisit(node.rules) + this.emit('}'); }; /** * Visit document node. */ Compiler.prototype.document = function(node){ var doc = '@' + (node.vendor || '') + 'document ' + node.document; return this.emit(doc, node.position) + this.emit('{') + this.mapVisit(node.rules) + this.emit('}'); }; /** * Visit charset node. */ Compiler.prototype.charset = function(node){ return this.emit('@charset ' + node.charset + ';', node.position); }; /** * Visit namespace node. */ Compiler.prototype.namespace = function(node){ return this.emit('@namespace ' + node.namespace + ';', node.position); }; /** * Visit supports node. */ Compiler.prototype.supports = function(node){ return this.emit('@supports ' + node.supports, node.position) + this.emit('{') + this.mapVisit(node.rules) + this.emit('}'); }; /** * Visit keyframes node. */ Compiler.prototype.keyframes = function(node){ return this.emit('@' + (node.vendor || '') + 'keyframes ' + node.name, node.position) + this.emit('{') + this.mapVisit(node.keyframes) + this.emit('}'); }; /** * Visit keyframe node. */ Compiler.prototype.keyframe = function(node){ var decls = node.declarations; return this.emit(node.values.join(','), node.position) + this.emit('{') + this.mapVisit(decls) + this.emit('}'); }; /** * Visit page node. */ Compiler.prototype.page = function(node){ var sel = node.selectors.length ? node.selectors.join(', ') : ''; return this.emit('@page ' + sel, node.position) + this.emit('{') + this.mapVisit(node.declarations) + this.emit('}'); }; /** * Visit font-face node. */ Compiler.prototype['font-face'] = function(node){ return this.emit('@font-face', node.position) + this.emit('{') + this.mapVisit(node.declarations) + this.emit('}'); }; /** * Visit host node. */ Compiler.prototype.host = function(node){ return this.emit('@host', node.position) + this.emit('{') + this.mapVisit(node.rules) + this.emit('}'); }; /** * Visit custom-media node. */ Compiler.prototype['custom-media'] = function(node){ return this.emit('@custom-media ' + node.name + ' ' + node.media + ';', node.position); }; /** * Visit rule node. */ Compiler.prototype.rule = function(node){ var decls = node.declarations; if (!decls.length) return ''; return this.emit(node.selectors.join(','), node.position) + this.emit('{') + this.mapVisit(decls) + this.emit('}'); }; /** * Visit declaration node. */ Compiler.prototype.declaration = function(node){ return this.emit(node.property + ':' + node.value, node.position) + this.emit(';'); }; css-3.0.0/lib/stringify/identity.js000066400000000000000000000115321367726301600172720ustar00rootroot00000000000000 /** * Module dependencies. */ var Base = require('./compiler'); var inherits = require('inherits'); /** * Expose compiler. */ module.exports = Compiler; /** * Initialize a new `Compiler`. */ function Compiler(options) { options = options || {}; Base.call(this, options); this.indentation = options.indent; } /** * Inherit from `Base.prototype`. */ inherits(Compiler, Base); /** * Compile `node`. */ Compiler.prototype.compile = function(node){ return this.stylesheet(node); }; /** * Visit stylesheet node. */ Compiler.prototype.stylesheet = function(node){ return this.mapVisit(node.stylesheet.rules, '\n\n'); }; /** * Visit comment node. */ Compiler.prototype.comment = function(node){ return this.emit(this.indent() + '/*' + node.comment + '*/', node.position); }; /** * Visit import node. */ Compiler.prototype.import = function(node){ return this.emit('@import ' + node.import + ';', node.position); }; /** * Visit media node. */ Compiler.prototype.media = function(node){ return this.emit('@media ' + node.media, node.position) + this.emit( ' {\n' + this.indent(1)) + this.mapVisit(node.rules, '\n\n') + this.emit( this.indent(-1) + '\n}'); }; /** * Visit document node. */ Compiler.prototype.document = function(node){ var doc = '@' + (node.vendor || '') + 'document ' + node.document; return this.emit(doc, node.position) + this.emit( ' ' + ' {\n' + this.indent(1)) + this.mapVisit(node.rules, '\n\n') + this.emit( this.indent(-1) + '\n}'); }; /** * Visit charset node. */ Compiler.prototype.charset = function(node){ return this.emit('@charset ' + node.charset + ';', node.position); }; /** * Visit namespace node. */ Compiler.prototype.namespace = function(node){ return this.emit('@namespace ' + node.namespace + ';', node.position); }; /** * Visit supports node. */ Compiler.prototype.supports = function(node){ return this.emit('@supports ' + node.supports, node.position) + this.emit( ' {\n' + this.indent(1)) + this.mapVisit(node.rules, '\n\n') + this.emit( this.indent(-1) + '\n}'); }; /** * Visit keyframes node. */ Compiler.prototype.keyframes = function(node){ return this.emit('@' + (node.vendor || '') + 'keyframes ' + node.name, node.position) + this.emit( ' {\n' + this.indent(1)) + this.mapVisit(node.keyframes, '\n') + this.emit( this.indent(-1) + '}'); }; /** * Visit keyframe node. */ Compiler.prototype.keyframe = function(node){ var decls = node.declarations; return this.emit(this.indent()) + this.emit(node.values.join(', '), node.position) + this.emit( ' {\n' + this.indent(1)) + this.mapVisit(decls, '\n') + this.emit( this.indent(-1) + '\n' + this.indent() + '}\n'); }; /** * Visit page node. */ Compiler.prototype.page = function(node){ var sel = node.selectors.length ? node.selectors.join(', ') + ' ' : ''; return this.emit('@page ' + sel, node.position) + this.emit('{\n') + this.emit(this.indent(1)) + this.mapVisit(node.declarations, '\n') + this.emit(this.indent(-1)) + this.emit('\n}'); }; /** * Visit font-face node. */ Compiler.prototype['font-face'] = function(node){ return this.emit('@font-face ', node.position) + this.emit('{\n') + this.emit(this.indent(1)) + this.mapVisit(node.declarations, '\n') + this.emit(this.indent(-1)) + this.emit('\n}'); }; /** * Visit host node. */ Compiler.prototype.host = function(node){ return this.emit('@host', node.position) + this.emit( ' {\n' + this.indent(1)) + this.mapVisit(node.rules, '\n\n') + this.emit( this.indent(-1) + '\n}'); }; /** * Visit custom-media node. */ Compiler.prototype['custom-media'] = function(node){ return this.emit('@custom-media ' + node.name + ' ' + node.media + ';', node.position); }; /** * Visit rule node. */ Compiler.prototype.rule = function(node){ var indent = this.indent(); var decls = node.declarations; if (!decls.length) return ''; return this.emit(node.selectors.map(function(s){ return indent + s }).join(',\n'), node.position) + this.emit(' {\n') + this.emit(this.indent(1)) + this.mapVisit(decls, '\n') + this.emit(this.indent(-1)) + this.emit('\n' + this.indent() + '}'); }; /** * Visit declaration node. */ Compiler.prototype.declaration = function(node){ return this.emit(this.indent()) + this.emit(node.property + ': ' + node.value, node.position) + this.emit(';'); }; /** * Increase, decrease or return current indentation. */ Compiler.prototype.indent = function(level) { this.level = this.level || 1; if (null != level) { this.level += level; return ''; } return Array(this.level).join(this.indentation || ' '); }; css-3.0.0/lib/stringify/index.js000066400000000000000000000016331367726301600165510ustar00rootroot00000000000000 /** * Module dependencies. */ var Compressed = require('./compress'); var Identity = require('./identity'); /** * Stringfy the given AST `node`. * * Options: * * - `compress` space-optimized output * - `sourcemap` return an object with `.code` and `.map` * * @param {Object} node * @param {Object} [options] * @return {String} * @api public */ module.exports = function(node, options){ options = options || {}; var compiler = options.compress ? new Compressed(options) : new Identity(options); // source maps if (options.sourcemap) { var sourcemaps = require('./source-map-support'); sourcemaps(compiler); var code = compiler.compile(node); compiler.applySourceMaps(); var map = options.sourcemap === 'generator' ? compiler.map : compiler.map.toJSON(); return { code: code, map: map }; } var code = compiler.compile(node); return code; }; css-3.0.0/lib/stringify/source-map-support.js000066400000000000000000000056761367726301600212420ustar00rootroot00000000000000 /** * Module dependencies. */ var SourceMap = require('source-map').SourceMapGenerator; var SourceMapConsumer = require('source-map').SourceMapConsumer; var sourceMapResolve = require('source-map-resolve'); var fs = require('fs'); var path = require('path'); /** * Expose `mixin()`. */ module.exports = mixin; /** * Ensure Windows-style paths are formatted properly */ const makeFriendlyPath = function(aPath) { return path.sep === "\\" ? aPath.replace(/\\/g, "/").replace(/^[a-z]:\/?/i, "/") : aPath; } /** * Mixin source map support into `compiler`. * * @param {Compiler} compiler * @api public */ function mixin(compiler) { compiler._comment = compiler.comment; compiler.map = new SourceMap(); compiler.position = { line: 1, column: 1 }; compiler.files = {}; for (var k in exports) compiler[k] = exports[k]; } /** * Update position. * * @param {String} str * @api private */ exports.updatePosition = function(str) { var lines = str.match(/\n/g); if (lines) this.position.line += lines.length; var i = str.lastIndexOf('\n'); this.position.column = ~i ? str.length - i : this.position.column + str.length; }; /** * Emit `str`. * * @param {String} str * @param {Object} [pos] * @return {String} * @api private */ exports.emit = function(str, pos) { if (pos) { var sourceFile = makeFriendlyPath(pos.source || 'source.css'); this.map.addMapping({ source: sourceFile, generated: { line: this.position.line, column: Math.max(this.position.column - 1, 0) }, original: { line: pos.start.line, column: pos.start.column - 1 } }); this.addFile(sourceFile, pos); } this.updatePosition(str); return str; }; /** * Adds a file to the source map output if it has not already been added * @param {String} file * @param {Object} pos */ exports.addFile = function(file, pos) { if (typeof pos.content !== 'string') return; if (Object.prototype.hasOwnProperty.call(this.files, file)) return; this.files[file] = pos.content; }; /** * Applies any original source maps to the output and embeds the source file * contents in the source map. */ exports.applySourceMaps = function() { Object.keys(this.files).forEach(function(file) { var content = this.files[file]; this.map.setSourceContent(file, content); if (this.options.inputSourcemaps !== false) { var originalMap = sourceMapResolve.resolveSync( content, file, fs.readFileSync); if (originalMap) { var map = new SourceMapConsumer(originalMap.map); var relativeTo = originalMap.sourcesRelativeTo; this.map.applySourceMap(map, file, makeFriendlyPath(path.dirname(relativeTo))); } } }, this); }; /** * Process comments, drops sourceMap comments. * @param {Object} node */ exports.comment = function(node) { if (/^# sourceMappingURL=/.test(node.comment)) return this.emit('', node.position); else return this._comment(node); }; css-3.0.0/package.json000066400000000000000000000013661367726301600146110ustar00rootroot00000000000000{ "name": "css", "version": "3.0.0", "description": "CSS parser / stringifier", "main": "index", "files": [ "index.js", "lib", "Readme.md" ], "dependencies": { "inherits": "^2.0.4", "source-map": "^0.6.1", "source-map-resolve": "^0.6.0" }, "devDependencies": { "mocha": "^8.0.1", "should": "^13.2.3", "matcha": "^0.7.0", "bytes": "^3.1.0" }, "scripts": { "benchmark": "matcha", "test": "mocha --require should --reporter spec test/*.js" }, "author": "TJ Holowaychuk ", "license": "MIT", "repository": { "type": "git", "url": "https://github.com/reworkcss/css.git" }, "keywords": [ "css", "parser", "stringifier", "stylesheet" ] } css-3.0.0/test/000077500000000000000000000000001367726301600132745ustar00rootroot00000000000000css-3.0.0/test/cases.js000066400000000000000000000024541367726301600147350ustar00rootroot00000000000000var fs = require('fs'); var path = require('path'); var parse = require('../').parse; var stringify = require('../').stringify; var cases = fs.readdirSync(path.join(__dirname, 'cases')); cases.forEach(function(name) { describe('cases/' + name, function() { var dir = path.join(__dirname, 'cases', name); var inputFile = path.join(dir, 'input.css'); var astFile = path.join(dir, 'ast.json'); var outputFile = path.join(dir, 'output.css'); var compressedFile = path.join(dir, 'compressed.css'); it('should match ast.json', function() { var ast = parseInput(); ast.should.containDeep(JSON.parse(readFile(astFile))); }); it('should match output.css', function() { var output = stringify(parseInput()); output.should.equal(readFile(outputFile).trim()); }); it('should match compressed.css', function() { var compressed = stringify(parseInput(), { compress: true }); compressed.should.equal(readFile(compressedFile)); }); function parseInput() { return parse(readFile(inputFile), { source: 'input.css' }); } }); }); function readFile(file) { var src = fs.readFileSync(file, 'utf8'); // normalize line endings src = src.replace(/\r\n/, '\n'); // remove trailing newline src = src.replace(/\n$/, ''); return src; } css-3.0.0/test/cases/000077500000000000000000000000001367726301600143725ustar00rootroot00000000000000css-3.0.0/test/cases/at-namespace/000077500000000000000000000000001367726301600167305ustar00rootroot00000000000000css-3.0.0/test/cases/at-namespace/ast.json000066400000000000000000000006201367726301600204100ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "namespace", "namespace": "svg \"http://www.w3.org/2000/svg\"", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 45 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/at-namespace/compressed.css000066400000000000000000000000551367726301600216060ustar00rootroot00000000000000@namespace svg "http://www.w3.org/2000/svg"; css-3.0.0/test/cases/at-namespace/input.css000066400000000000000000000000551367726301600206010ustar00rootroot00000000000000@namespace svg "http://www.w3.org/2000/svg"; css-3.0.0/test/cases/at-namespace/output.css000066400000000000000000000000551367726301600210020ustar00rootroot00000000000000@namespace svg "http://www.w3.org/2000/svg"; css-3.0.0/test/cases/charset-linebreak/000077500000000000000000000000001367726301600177555ustar00rootroot00000000000000css-3.0.0/test/cases/charset-linebreak/ast.json000066400000000000000000000005611367726301600214410ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "charset", "charset": "\"UTF-8\"", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 3, "column": 6 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/charset-linebreak/compressed.css000066400000000000000000000000211367726301600226240ustar00rootroot00000000000000@charset "UTF-8";css-3.0.0/test/cases/charset-linebreak/input.css000066400000000000000000000000331367726301600216220ustar00rootroot00000000000000@charset "UTF-8" ; css-3.0.0/test/cases/charset-linebreak/output.css000066400000000000000000000000211367726301600220200ustar00rootroot00000000000000@charset "UTF-8";css-3.0.0/test/cases/charset/000077500000000000000000000000001367726301600160235ustar00rootroot00000000000000css-3.0.0/test/cases/charset/ast.json000066400000000000000000000026021367726301600175050ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "charset", "charset": "\"UTF-8\"", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 18 }, "source": "input.css" } }, { "type": "comment", "comment": " Set the encoding of the style sheet to Unicode UTF-8 ", "position": { "start": { "line": 1, "column": 25 }, "end": { "line": 1, "column": 83 }, "source": "input.css" } }, { "type": "charset", "charset": "'iso-8859-15'", "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 2, "column": 24 }, "source": "input.css" } }, { "type": "comment", "comment": " Set the encoding of the style sheet to Latin-9 (Western European languages, with euro sign) ", "position": { "start": { "line": 2, "column": 25 }, "end": { "line": 2, "column": 122 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/charset/compressed.css000066400000000000000000000000511367726301600206750ustar00rootroot00000000000000@charset "UTF-8";@charset 'iso-8859-15'; css-3.0.0/test/cases/charset/input.css000066400000000000000000000003151367726301600176730ustar00rootroot00000000000000@charset "UTF-8"; /* Set the encoding of the style sheet to Unicode UTF-8 */ @charset 'iso-8859-15'; /* Set the encoding of the style sheet to Latin-9 (Western European languages, with euro sign) */ css-3.0.0/test/cases/charset/output.css000066400000000000000000000003121367726301600200710ustar00rootroot00000000000000@charset "UTF-8"; /* Set the encoding of the style sheet to Unicode UTF-8 */ @charset 'iso-8859-15'; /* Set the encoding of the style sheet to Latin-9 (Western European languages, with euro sign) */ css-3.0.0/test/cases/colon-space/000077500000000000000000000000001367726301600165755ustar00rootroot00000000000000css-3.0.0/test/cases/colon-space/ast.json000066400000000000000000000022611367726301600202600ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "a" ], "declarations": [ { "type": "declaration", "property": "margin", "value": "auto", "position": { "start": { "line": 2, "column": 5 }, "end": { "line": 2, "column": 19 }, "source": "input.css" } }, { "type": "declaration", "property": "padding", "value": "0", "position": { "start": { "line": 3, "column": 5 }, "end": { "line": 3, "column": 16 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 4, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/colon-space/compressed.css000066400000000000000000000000321367726301600214460ustar00rootroot00000000000000a{margin:auto;padding:0;} css-3.0.0/test/cases/colon-space/input.css000066400000000000000000000000531367726301600204440ustar00rootroot00000000000000a { margin : auto; padding : 0; } css-3.0.0/test/cases/colon-space/output.css000066400000000000000000000000441367726301600206450ustar00rootroot00000000000000a { margin: auto; padding: 0; } css-3.0.0/test/cases/comma-attribute/000077500000000000000000000000001367726301600174675ustar00rootroot00000000000000css-3.0.0/test/cases/comma-attribute/ast.json000066400000000000000000000106061367726301600211540ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ ".foo[bar=\"baz,quz\"]" ], "declarations": [ { "type": "declaration", "property": "foobar", "value": "123", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 14 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 3, "column": 2 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".bar", "#bar[baz=\"qux,foo\"]", "#qux" ], "declarations": [ { "type": "declaration", "property": "foobar", "value": "456", "position": { "start": { "line": 8, "column": 3 }, "end": { "line": 8, "column": 14 }, "source": "input.css" } } ], "position": { "start": { "line": 5, "column": 1 }, "end": { "line": 9, "column": 2 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".baz[qux=\",foo\"]", ".baz[qux=\"foo,\"]", ".baz[qux=\"foo,bar,baz\"]", ".baz[qux=\",foo,bar,baz,\"]", ".baz[qux=\" , foo , bar , baz , \"]" ], "declarations": [ { "type": "declaration", "property": "foobar", "value": "789", "position": { "start": { "line": 16, "column": 3 }, "end": { "line": 16, "column": 14 }, "source": "input.css" } } ], "position": { "start": { "line": 11, "column": 1 }, "end": { "line": 17, "column": 2 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".qux[foo='bar,baz']", ".qux[bar=\"baz,foo\"]", "#qux[foo=\"foobar\"]", "#qux[foo=',bar,baz, ']" ], "declarations": [ { "type": "declaration", "property": "foobar", "value": "012", "position": { "start": { "line": 23, "column": 3 }, "end": { "line": 23, "column": 14 }, "source": "input.css" } } ], "position": { "start": { "line": 19, "column": 1 }, "end": { "line": 24, "column": 2 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#foo[foo=\"\"]", "#foo[bar=\" \"]", "#foo[bar=\",\"]", "#foo[bar=\", \"]", "#foo[bar=\" ,\"]", "#foo[bar=\" , \"]", "#foo[baz='']", "#foo[qux=' ']", "#foo[qux=',']", "#foo[qux=', ']", "#foo[qux=' ,']", "#foo[qux=' , ']" ], "declarations": [ { "type": "declaration", "property": "foobar", "value": "345", "position": { "start": { "line": 38, "column": 3 }, "end": { "line": 38, "column": 14 }, "source": "input.css" } } ], "position": { "start": { "line": 26, "column": 1 }, "end": { "line": 39, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/comma-attribute/compressed.css000066400000000000000000000007451367726301600223530ustar00rootroot00000000000000.foo[bar="baz,quz"]{foobar:123;}.bar,#bar[baz="qux,foo"],#qux{foobar:456;}.baz[qux=",foo"],.baz[qux="foo,"],.baz[qux="foo,bar,baz"],.baz[qux=",foo,bar,baz,"],.baz[qux=" , foo , bar , baz , "]{foobar:789;}.qux[foo='bar,baz'],.qux[bar="baz,foo"],#qux[foo="foobar"],#qux[foo=',bar,baz, ']{foobar:012;}#foo[foo=""],#foo[bar=" "],#foo[bar=","],#foo[bar=", "],#foo[bar=" ,"],#foo[bar=" , "],#foo[baz=''],#foo[qux=' '],#foo[qux=','],#foo[qux=', '],#foo[qux=' ,'],#foo[qux=' , ']{foobar:345;} css-3.0.0/test/cases/comma-attribute/input.css000066400000000000000000000010371367726301600213410ustar00rootroot00000000000000.foo[bar="baz,quz"] { foobar: 123; } .bar, #bar[baz="qux,foo"], #qux { foobar: 456; } .baz[qux=",foo"], .baz[qux="foo,"], .baz[qux="foo,bar,baz"], .baz[qux=",foo,bar,baz,"], .baz[qux=" , foo , bar , baz , "] { foobar: 789; } .qux[foo='bar,baz'], .qux[bar="baz,foo"], #qux[foo="foobar"], #qux[foo=',bar,baz, '] { foobar: 012; } #foo[foo=""], #foo[bar=" "], #foo[bar=","], #foo[bar=", "], #foo[bar=" ,"], #foo[bar=" , "], #foo[baz=''], #foo[qux=' '], #foo[qux=','], #foo[qux=', '], #foo[qux=' ,'], #foo[qux=' , '] { foobar: 345; } css-3.0.0/test/cases/comma-attribute/output.css000066400000000000000000000010371367726301600215420ustar00rootroot00000000000000.foo[bar="baz,quz"] { foobar: 123; } .bar, #bar[baz="qux,foo"], #qux { foobar: 456; } .baz[qux=",foo"], .baz[qux="foo,"], .baz[qux="foo,bar,baz"], .baz[qux=",foo,bar,baz,"], .baz[qux=" , foo , bar , baz , "] { foobar: 789; } .qux[foo='bar,baz'], .qux[bar="baz,foo"], #qux[foo="foobar"], #qux[foo=',bar,baz, '] { foobar: 012; } #foo[foo=""], #foo[bar=" "], #foo[bar=","], #foo[bar=", "], #foo[bar=" ,"], #foo[bar=" , "], #foo[baz=''], #foo[qux=' '], #foo[qux=','], #foo[qux=', '], #foo[qux=' ,'], #foo[qux=' , '] { foobar: 345; } css-3.0.0/test/cases/comma-selector-function/000077500000000000000000000000001367726301600211275ustar00rootroot00000000000000css-3.0.0/test/cases/comma-selector-function/ast.json000066400000000000000000000034251367726301600226150ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ ".foo:matches(.bar,.baz)", ".foo:matches(.bar, .baz)", ".foo:matches(.bar , .baz)", ".foo:matches(.bar ,.baz)" ], "declarations": [ { "type": "declaration", "property": "prop", "value": "value", "position": { "start": { "line": 5, "column": 3 }, "end": { "line": 5, "column": 14 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 6, "column": 2 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".foo:matches(.bar,.baz,.foobar)", ".foo:matches(.bar, .baz,)", ".foo:matches(,.bar , .baz)" ], "declarations": [ { "type": "declaration", "property": "anotherprop", "value": "anothervalue", "position": { "start": { "line": 11, "column": 3 }, "end": { "line": 11, "column": 28 }, "source": "input.css" } } ], "position": { "start": { "line": 8, "column": 1 }, "end": { "line": 12, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/comma-selector-function/compressed.css000066400000000000000000000003401367726301600240020ustar00rootroot00000000000000.foo:matches(.bar,.baz),.foo:matches(.bar, .baz),.foo:matches(.bar , .baz),.foo:matches(.bar ,.baz){prop:value;}.foo:matches(.bar,.baz,.foobar),.foo:matches(.bar, .baz,),.foo:matches(,.bar , .baz){anotherprop:anothervalue;} css-3.0.0/test/cases/comma-selector-function/input.css000066400000000000000000000003631367726301600230020ustar00rootroot00000000000000.foo:matches(.bar,.baz), .foo:matches(.bar, .baz), .foo:matches(.bar , .baz), .foo:matches(.bar ,.baz) { prop: value; } .foo:matches(.bar,.baz,.foobar), .foo:matches(.bar, .baz,), .foo:matches(,.bar , .baz) { anotherprop: anothervalue; } css-3.0.0/test/cases/comma-selector-function/output.css000066400000000000000000000003631367726301600232030ustar00rootroot00000000000000.foo:matches(.bar,.baz), .foo:matches(.bar, .baz), .foo:matches(.bar , .baz), .foo:matches(.bar ,.baz) { prop: value; } .foo:matches(.bar,.baz,.foobar), .foo:matches(.bar, .baz,), .foo:matches(,.bar , .baz) { anotherprop: anothervalue; } css-3.0.0/test/cases/comment-in/000077500000000000000000000000001367726301600164405ustar00rootroot00000000000000css-3.0.0/test/cases/comment-in/ast.json000066400000000000000000000037251367726301600201310ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "a" ], "declarations": [ { "type": "declaration", "property": "color", "value": "12px", "position": { "start": { "line": 2, "column": 5 }, "end": { "line": 2, "column": 20 }, "source": "input.css" } }, { "type": "declaration", "property": "padding", "value": "1px 2px 3px", "position": { "start": { "line": 3, "column": 5 }, "end": { "line": 3, "column": 51 }, "source": "input.css" } }, { "type": "declaration", "property": "border", "value": "solid", "position": { "start": { "line": 4, "column": 5 }, "end": { "line": 4, "column": 24 }, "source": "input.css" } }, { "type": "declaration", "property": "border-top", "value": "none\\9", "position": { "start": { "line": 4, "column": 26 }, "end": { "line": 4, "column": 50 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 5, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/comment-in/compressed.css000066400000000000000000000001041367726301600213110ustar00rootroot00000000000000a{color:12px;padding:1px 2px 3px;border:solid;border-top:none\9;} css-3.0.0/test/cases/comment-in/input.css000066400000000000000000000002021367726301600203030ustar00rootroot00000000000000a { color/**/: 12px; padding/*4815162342*/: 1px /**/ 2px /*13*/ 3px; border/*\**/: solid; border-top/*\**/: none\9; } css-3.0.0/test/cases/comment-in/output.css000066400000000000000000000001261367726301600205110ustar00rootroot00000000000000a { color: 12px; padding: 1px 2px 3px; border: solid; border-top: none\9; } css-3.0.0/test/cases/comment-url/000077500000000000000000000000001367726301600166345ustar00rootroot00000000000000css-3.0.0/test/cases/comment-url/ast.json000066400000000000000000000047271367726301600203300ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "comment", "comment": " http://foo.com/bar/baz.html ", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 34 }, "source": "input.css" } }, { "type": "comment", "comment": "", "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 2, "column": 5 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "foo" ], "declarations": [ { "type": "comment", "comment": "/", "position": { "start": { "line": 4, "column": 7 }, "end": { "line": 4, "column": 12 }, "source": "input.css" } }, { "type": "comment", "comment": " something ", "position": { "start": { "line": 5, "column": 3 }, "end": { "line": 5, "column": 18 }, "source": "input.css" } }, { "type": "declaration", "property": "bar", "value": "baz", "position": { "start": { "line": 6, "column": 3 }, "end": { "line": 6, "column": 11 }, "source": "input.css" } }, { "type": "comment", "comment": " http://foo.com/bar/baz.html ", "position": { "start": { "line": 6, "column": 13 }, "end": { "line": 6, "column": 46 }, "source": "input.css" } } ], "position": { "start": { "line": 4, "column": 1 }, "end": { "line": 7, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/comment-url/compressed.css000066400000000000000000000000161367726301600215070ustar00rootroot00000000000000foo{bar:baz;} css-3.0.0/test/cases/comment-url/input.css000066400000000000000000000001661367726301600205100ustar00rootroot00000000000000/* http://foo.com/bar/baz.html */ /**/ foo { /*/*/ /* something */ bar: baz; /* http://foo.com/bar/baz.html */ } css-3.0.0/test/cases/comment-url/output.css000066400000000000000000000001731367726301600207070ustar00rootroot00000000000000/* http://foo.com/bar/baz.html */ /**/ foo { /*/*/ /* something */ bar: baz; /* http://foo.com/bar/baz.html */ } css-3.0.0/test/cases/comment/000077500000000000000000000000001367726301600160345ustar00rootroot00000000000000css-3.0.0/test/cases/comment/ast.json000066400000000000000000000060721367726301600175230ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "comment", "comment": " 1 ", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 8 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "head", "body" ], "declarations": [ { "type": "comment", "comment": " 2 ", "position": { "start": { "line": 3, "column": 37 }, "end": { "line": 3, "column": 44 }, "source": "input.css" } }, { "type": "comment", "comment": " 3 ", "position": { "start": { "line": 4, "column": 3 }, "end": { "line": 4, "column": 10 }, "source": "input.css" } }, { "type": "comment", "comment": "", "position": { "start": { "line": 5, "column": 3 }, "end": { "line": 5, "column": 7 }, "source": "input.css" } }, { "type": "declaration", "property": "foo", "value": "'bar'", "position": { "start": { "line": 5, "column": 7 }, "end": { "line": 5, "column": 17 }, "source": "input.css" } }, { "type": "comment", "comment": " 4 ", "position": { "start": { "line": 6, "column": 3 }, "end": { "line": 6, "column": 10 }, "source": "input.css" } } ], "position": { "start": { "line": 3, "column": 1 }, "end": { "line": 7, "column": 2 }, "source": "input.css" } }, { "type": "comment", "comment": " 5 ", "position": { "start": { "line": 7, "column": 3 }, "end": { "line": 7, "column": 10 }, "source": "input.css" } }, { "type": "comment", "comment": " 6 ", "position": { "start": { "line": 9, "column": 1 }, "end": { "line": 9, "column": 8 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/comment/compressed.css000066400000000000000000000000261367726301600207100ustar00rootroot00000000000000head,body{foo:'bar';} css-3.0.0/test/cases/comment/input.css000066400000000000000000000001561367726301600177070ustar00rootroot00000000000000/* 1 */ head, /* footer, */body/*, nav */ { /* 2 */ /* 3 */ /**/foo: 'bar'; /* 4 */ } /* 5 */ /* 6 */ css-3.0.0/test/cases/comment/output.css000066400000000000000000000001351367726301600201050ustar00rootroot00000000000000/* 1 */ head, body { /* 2 */ /* 3 */ /**/ foo: 'bar'; /* 4 */ } /* 5 */ /* 6 */ css-3.0.0/test/cases/custom-media-linebreak/000077500000000000000000000000001367726301600207135ustar00rootroot00000000000000css-3.0.0/test/cases/custom-media-linebreak/ast.json000066400000000000000000000006271367726301600224020ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "custom-media", "name": "--test", "media": "(min-width: 200px)", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 4, "column": 2 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/custom-media-linebreak/compressed.css000066400000000000000000000000501367726301600235640ustar00rootroot00000000000000@custom-media --test (min-width: 200px);css-3.0.0/test/cases/custom-media-linebreak/input.css000066400000000000000000000000621367726301600225620ustar00rootroot00000000000000@custom-media --test (min-width: 200px) ; css-3.0.0/test/cases/custom-media-linebreak/output.css000066400000000000000000000000501367726301600227600ustar00rootroot00000000000000@custom-media --test (min-width: 200px);css-3.0.0/test/cases/custom-media/000077500000000000000000000000001367726301600167615ustar00rootroot00000000000000css-3.0.0/test/cases/custom-media/ast.json000066400000000000000000000014051367726301600204430ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "custom-media", "name": "--narrow-window", "media": "(max-width: 30em)", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 49 }, "source": "input.css" } }, { "type": "custom-media", "name": "--wide-window", "media": "screen and (min-width: 40em)", "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 2, "column": 58 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/custom-media/compressed.css000066400000000000000000000001521367726301600216350ustar00rootroot00000000000000@custom-media --narrow-window (max-width: 30em);@custom-media --wide-window screen and (min-width: 40em); css-3.0.0/test/cases/custom-media/input.css000066400000000000000000000001531367726301600206310ustar00rootroot00000000000000@custom-media --narrow-window (max-width: 30em); @custom-media --wide-window screen and (min-width: 40em); css-3.0.0/test/cases/custom-media/output.css000066400000000000000000000001541367726301600210330ustar00rootroot00000000000000@custom-media --narrow-window (max-width: 30em); @custom-media --wide-window screen and (min-width: 40em); css-3.0.0/test/cases/document-linebreak/000077500000000000000000000000001367726301600201425ustar00rootroot00000000000000css-3.0.0/test/cases/document-linebreak/ast.json000066400000000000000000000024371367726301600216320ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "document", "document": "url-prefix()", "vendor": "", "rules": [ { "type": "rule", "selectors": [ ".test" ], "declarations": [ { "type": "declaration", "property": "color", "value": "blue", "position": { "start": { "line": 6, "column": 13 }, "end": { "line": 6, "column": 24 }, "source": "input.css" } } ], "position": { "start": { "line": 5, "column": 9 }, "end": { "line": 7, "column": 10 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 9, "column": 6 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/document-linebreak/compressed.css000066400000000000000000000000521367726301600230150ustar00rootroot00000000000000@document url-prefix(){.test{color:blue;}}css-3.0.0/test/cases/document-linebreak/input.css000066400000000000000000000001341367726301600220110ustar00rootroot00000000000000@document url-prefix() { .test { color: blue; } } css-3.0.0/test/cases/document-linebreak/output.css000066400000000000000000000000721367726301600222130ustar00rootroot00000000000000@document url-prefix() { .test { color: blue; } }css-3.0.0/test/cases/document/000077500000000000000000000000001367726301600162105ustar00rootroot00000000000000css-3.0.0/test/cases/document/ast.json000066400000000000000000000057061367726301600177020ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "document", "document": "url-prefix()", "vendor": "-moz-", "rules": [ { "type": "comment", "comment": " ui above ", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 17 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".ui-select .ui-btn select" ], "declarations": [ { "type": "comment", "comment": " ui inside ", "position": { "start": { "line": 4, "column": 5 }, "end": { "line": 4, "column": 20 }, "source": "input.css" } }, { "type": "declaration", "property": "opacity", "value": ".0001", "position": { "start": { "line": 5, "column": 5 }, "end": { "line": 6, "column": 3 }, "source": "input.css" } } ], "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 6, "column": 4 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".icon-spin" ], "declarations": [ { "type": "declaration", "property": "height", "value": ".9em", "position": { "start": { "line": 9, "column": 5 }, "end": { "line": 9, "column": 17 }, "source": "input.css" } } ], "position": { "start": { "line": 8, "column": 3 }, "end": { "line": 10, "column": 4 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 11, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/document/compressed.css000066400000000000000000000001371367726301600210670ustar00rootroot00000000000000@-moz-document url-prefix(){.ui-select .ui-btn select{opacity:.0001;}.icon-spin{height:.9em;}} css-3.0.0/test/cases/document/input.css000066400000000000000000000002371367726301600200630ustar00rootroot00000000000000@-moz-document url-prefix() { /* ui above */ .ui-select .ui-btn select { /* ui inside */ opacity:.0001 } .icon-spin { height: .9em; } } css-3.0.0/test/cases/document/output.css000066400000000000000000000002431367726301600202610ustar00rootroot00000000000000@-moz-document url-prefix() { /* ui above */ .ui-select .ui-btn select { /* ui inside */ opacity: .0001; } .icon-spin { height: .9em; } } css-3.0.0/test/cases/empty/000077500000000000000000000000001367726301600155305ustar00rootroot00000000000000css-3.0.0/test/cases/empty/ast.json000066400000000000000000000001021367726301600172030ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [] } } css-3.0.0/test/cases/empty/compressed.css000066400000000000000000000000011367726301600203750ustar00rootroot00000000000000 css-3.0.0/test/cases/empty/input.css000066400000000000000000000000011367726301600173700ustar00rootroot00000000000000 css-3.0.0/test/cases/empty/output.css000066400000000000000000000000011367726301600175710ustar00rootroot00000000000000 css-3.0.0/test/cases/escapes/000077500000000000000000000000001367726301600160155ustar00rootroot00000000000000css-3.0.0/test/cases/escapes/ast.json000066400000000000000000001022151367726301600175000ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "comment", "comment": " tests compressed for easy testing ", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 40 }, "source": "input.css" } }, { "type": "comment", "comment": " http://mathiasbynens.be/notes/css-escapes ", "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 2, "column": 48 }, "source": "input.css" } }, { "type": "comment", "comment": " will match elements with class=\":`(\" ", "position": { "start": { "line": 3, "column": 1 }, "end": { "line": 3, "column": 43 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".\\3A \\`\\(" ], "declarations": [], "position": { "start": { "line": 4, "column": 1 }, "end": { "line": 4, "column": 12 }, "source": "input.css" } }, { "type": "comment", "comment": " will match elements with class=\"1a2b3c\" ", "position": { "start": { "line": 5, "column": 1 }, "end": { "line": 5, "column": 46 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".\\31 a2b3c" ], "declarations": [], "position": { "start": { "line": 6, "column": 1 }, "end": { "line": 6, "column": 13 }, "source": "input.css" } }, { "type": "comment", "comment": " will match the element with id=\"#fake-id\" ", "position": { "start": { "line": 7, "column": 1 }, "end": { "line": 7, "column": 48 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\#fake-id" ], "declarations": [], "position": { "start": { "line": 8, "column": 1 }, "end": { "line": 8, "column": 13 }, "source": "input.css" } }, { "type": "comment", "comment": " will match the element with id=\"---\" ", "position": { "start": { "line": 9, "column": 1 }, "end": { "line": 9, "column": 43 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\---" ], "declarations": [], "position": { "start": { "line": 10, "column": 1 }, "end": { "line": 10, "column": 8 }, "source": "input.css" } }, { "type": "comment", "comment": " will match the element with id=\"-a-b-c-\" ", "position": { "start": { "line": 11, "column": 1 }, "end": { "line": 11, "column": 47 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#-a-b-c-" ], "declarations": [], "position": { "start": { "line": 12, "column": 1 }, "end": { "line": 12, "column": 11 }, "source": "input.css" } }, { "type": "comment", "comment": " will match the element with id=\"©\" ", "position": { "start": { "line": 13, "column": 1 }, "end": { "line": 13, "column": 41 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#©" ], "declarations": [], "position": { "start": { "line": 14, "column": 1 }, "end": { "line": 14, "column": 5 }, "source": "input.css" } }, { "type": "comment", "comment": " More tests from http://mathiasbynens.be/demo/html5-id ", "position": { "start": { "line": 15, "column": 1 }, "end": { "line": 15, "column": 60 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "html" ], "declarations": [ { "type": "declaration", "property": "font", "value": "1.2em/1.6 Arial", "position": { "start": { "line": 16, "column": 6 }, "end": { "line": 16, "column": 26 }, "source": "input.css" } } ], "position": { "start": { "line": 16, "column": 1 }, "end": { "line": 16, "column": 28 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "code" ], "declarations": [ { "type": "declaration", "property": "font-family", "value": "Consolas", "position": { "start": { "line": 17, "column": 6 }, "end": { "line": 17, "column": 26 }, "source": "input.css" } } ], "position": { "start": { "line": 17, "column": 1 }, "end": { "line": 17, "column": 28 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "li code" ], "declarations": [ { "type": "declaration", "property": "background", "value": "rgba(255, 255, 255, .5)", "position": { "start": { "line": 18, "column": 9 }, "end": { "line": 18, "column": 43 }, "source": "input.css" } }, { "type": "declaration", "property": "padding", "value": ".3em", "position": { "start": { "line": 18, "column": 44 }, "end": { "line": 18, "column": 56 }, "source": "input.css" } } ], "position": { "start": { "line": 18, "column": 1 }, "end": { "line": 18, "column": 58 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "li" ], "declarations": [ { "type": "declaration", "property": "background", "value": "orange", "position": { "start": { "line": 19, "column": 4 }, "end": { "line": 19, "column": 21 }, "source": "input.css" } } ], "position": { "start": { "line": 19, "column": 1 }, "end": { "line": 19, "column": 23 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#♥" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 20, "column": 4 }, "end": { "line": 20, "column": 19 }, "source": "input.css" } } ], "position": { "start": { "line": 20, "column": 1 }, "end": { "line": 20, "column": 21 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#©" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 21, "column": 4 }, "end": { "line": 21, "column": 19 }, "source": "input.css" } } ], "position": { "start": { "line": 21, "column": 1 }, "end": { "line": 21, "column": 21 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#“‘’”" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 22, "column": 7 }, "end": { "line": 22, "column": 22 }, "source": "input.css" } } ], "position": { "start": { "line": 22, "column": 1 }, "end": { "line": 22, "column": 24 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#☺☃" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 23, "column": 5 }, "end": { "line": 23, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 23, "column": 1 }, "end": { "line": 23, "column": 22 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#⌘⌥" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 24, "column": 5 }, "end": { "line": 24, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 24, "column": 1 }, "end": { "line": 24, "column": 22 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#𝄞♪♩♫♬" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 25, "column": 9 }, "end": { "line": 25, "column": 24 }, "source": "input.css" } } ], "position": { "start": { "line": 25, "column": 1 }, "end": { "line": 25, "column": 26 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\?" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 26, "column": 5 }, "end": { "line": 26, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 26, "column": 1 }, "end": { "line": 26, "column": 22 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\@" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 27, "column": 5 }, "end": { "line": 27, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 27, "column": 1 }, "end": { "line": 27, "column": 22 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\." ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 28, "column": 5 }, "end": { "line": 28, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 28, "column": 1 }, "end": { "line": 28, "column": 22 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\3A \\)" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 29, "column": 9 }, "end": { "line": 29, "column": 24 }, "source": "input.css" } } ], "position": { "start": { "line": 29, "column": 1 }, "end": { "line": 29, "column": 26 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\3A \\`\\(" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 30, "column": 11 }, "end": { "line": 30, "column": 26 }, "source": "input.css" } } ], "position": { "start": { "line": 30, "column": 1 }, "end": { "line": 30, "column": 28 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\31 23" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 31, "column": 9 }, "end": { "line": 31, "column": 24 }, "source": "input.css" } } ], "position": { "start": { "line": 31, "column": 1 }, "end": { "line": 31, "column": 26 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\31 a2b3c" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 32, "column": 12 }, "end": { "line": 32, "column": 27 }, "source": "input.css" } } ], "position": { "start": { "line": 32, "column": 1 }, "end": { "line": 32, "column": 29 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 33, "column": 8 }, "end": { "line": 33, "column": 23 }, "source": "input.css" } } ], "position": { "start": { "line": 33, "column": 1 }, "end": { "line": 33, "column": 25 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\<\\>\\<\\<\\<\\>\\>\\<\\>" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 34, "column": 21 }, "end": { "line": 34, "column": 36 }, "source": "input.css" } } ], "position": { "start": { "line": 34, "column": 1 }, "end": { "line": 34, "column": 38 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\+\\+\\+\\+\\+\\+\\+\\+\\+\\+\\[\\>\\+\\+\\+\\+\\+\\+\\+\\>\\+\\+\\+\\+\\+\\+\\+\\+\\+\\+\\>\\+\\+\\+\\>\\+\\<\\<\\<\\<\\-\\]\\>\\+\\+\\.\\>\\+\\.\\+\\+\\+\\+\\+\\+\\+\\.\\.\\+\\+\\+\\.\\>\\+\\+\\.\\<\\<\\+\\+\\+\\+\\+\\+\\+\\+\\+\\+\\+\\+\\+\\+\\+\\.\\>\\.\\+\\+\\+\\.\\-\\-\\-\\-\\-\\-\\.\\-\\-\\-\\-\\-\\-\\-\\-\\.\\>\\+\\.\\>\\." ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 35, "column": 225 }, "end": { "line": 35, "column": 240 }, "source": "input.css" } } ], "position": { "start": { "line": 35, "column": 1 }, "end": { "line": 35, "column": 242 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\#" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 36, "column": 5 }, "end": { "line": 36, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 36, "column": 1 }, "end": { "line": 36, "column": 22 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\#\\#" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 37, "column": 7 }, "end": { "line": 37, "column": 22 }, "source": "input.css" } } ], "position": { "start": { "line": 37, "column": 1 }, "end": { "line": 37, "column": 24 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\#\\.\\#\\.\\#" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 38, "column": 13 }, "end": { "line": 38, "column": 28 }, "source": "input.css" } } ], "position": { "start": { "line": 38, "column": 1 }, "end": { "line": 38, "column": 30 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\_" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 39, "column": 5 }, "end": { "line": 39, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 39, "column": 1 }, "end": { "line": 39, "column": 22 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\.fake\\-class" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 40, "column": 16 }, "end": { "line": 40, "column": 31 }, "source": "input.css" } } ], "position": { "start": { "line": 40, "column": 1 }, "end": { "line": 40, "column": 33 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#foo\\.bar" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 41, "column": 11 }, "end": { "line": 41, "column": 26 }, "source": "input.css" } } ], "position": { "start": { "line": 41, "column": 1 }, "end": { "line": 41, "column": 28 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\3A hover" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 42, "column": 12 }, "end": { "line": 42, "column": 27 }, "source": "input.css" } } ], "position": { "start": { "line": 42, "column": 1 }, "end": { "line": 42, "column": 29 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\3A hover\\3A focus\\3A active" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 43, "column": 31 }, "end": { "line": 43, "column": 46 }, "source": "input.css" } } ], "position": { "start": { "line": 43, "column": 1 }, "end": { "line": 43, "column": 48 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#\\[attr\\=value\\]" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 44, "column": 18 }, "end": { "line": 44, "column": 33 }, "source": "input.css" } } ], "position": { "start": { "line": 44, "column": 1 }, "end": { "line": 44, "column": 35 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#f\\/o\\/o" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 45, "column": 10 }, "end": { "line": 45, "column": 25 }, "source": "input.css" } } ], "position": { "start": { "line": 45, "column": 1 }, "end": { "line": 45, "column": 27 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#f\\\\o\\\\o" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 46, "column": 10 }, "end": { "line": 46, "column": 25 }, "source": "input.css" } } ], "position": { "start": { "line": 46, "column": 1 }, "end": { "line": 46, "column": 27 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#f\\*o\\*o" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 47, "column": 10 }, "end": { "line": 47, "column": 25 }, "source": "input.css" } } ], "position": { "start": { "line": 47, "column": 1 }, "end": { "line": 47, "column": 27 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#f\\!o\\!o" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 48, "column": 10 }, "end": { "line": 48, "column": 25 }, "source": "input.css" } } ], "position": { "start": { "line": 48, "column": 1 }, "end": { "line": 48, "column": 27 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#f\\'o\\'o" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 49, "column": 10 }, "end": { "line": 49, "column": 25 }, "source": "input.css" } } ], "position": { "start": { "line": 49, "column": 1 }, "end": { "line": 49, "column": 27 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#f\\~o\\~o" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 50, "column": 10 }, "end": { "line": 50, "column": 25 }, "source": "input.css" } } ], "position": { "start": { "line": 50, "column": 1 }, "end": { "line": 50, "column": 27 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "#f\\+o\\+o" ], "declarations": [ { "type": "declaration", "property": "background", "value": "lime", "position": { "start": { "line": 51, "column": 10 }, "end": { "line": 51, "column": 25 }, "source": "input.css" } } ], "position": { "start": { "line": 51, "column": 1 }, "end": { "line": 51, "column": 27 }, "source": "input.css" } }, { "type": "comment", "comment": " css-parse does not yet pass this test ", "position": { "start": { "line": 53, "column": 1 }, "end": { "line": 53, "column": 44 }, "source": "input.css" } }, { "type": "comment", "comment": "#\\{\\}{background:lime;}", "position": { "start": { "line": 54, "column": 1 }, "end": { "line": 54, "column": 28 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/escapes/compressed.css000066400000000000000000000022671367726301600207020ustar00rootroot00000000000000html{font:1.2em/1.6 Arial;}code{font-family:Consolas;}li code{background:rgba(255, 255, 255, .5);padding:.3em;}li{background:orange;}#♥{background:lime;}#©{background:lime;}#“‘’”{background:lime;}#☺☃{background:lime;}#⌘⌥{background:lime;}#𝄞♪♩♫♬{background:lime;}#\?{background:lime;}#\@{background:lime;}#\.{background:lime;}#\3A \){background:lime;}#\3A \`\({background:lime;}#\31 23{background:lime;}#\31 a2b3c{background:lime;}#\{background:lime;}#\<\>\<\<\<\>\>\<\>{background:lime;}#\+\+\+\+\+\+\+\+\+\+\[\>\+\+\+\+\+\+\+\>\+\+\+\+\+\+\+\+\+\+\>\+\+\+\>\+\<\<\<\<\-\]\>\+\+\.\>\+\.\+\+\+\+\+\+\+\.\.\+\+\+\.\>\+\+\.\<\<\+\+\+\+\+\+\+\+\+\+\+\+\+\+\+\.\>\.\+\+\+\.\-\-\-\-\-\-\.\-\-\-\-\-\-\-\-\.\>\+\.\>\.{background:lime;}#\#{background:lime;}#\#\#{background:lime;}#\#\.\#\.\#{background:lime;}#\_{background:lime;}#\.fake\-class{background:lime;}#foo\.bar{background:lime;}#\3A hover{background:lime;}#\3A hover\3A focus\3A active{background:lime;}#\[attr\=value\]{background:lime;}#f\/o\/o{background:lime;}#f\\o\\o{background:lime;}#f\*o\*o{background:lime;}#f\!o\!o{background:lime;}#f\'o\'o{background:lime;}#f\~o\~o{background:lime;}#f\+o\+o{background:lime;} css-3.0.0/test/cases/escapes/input.css000066400000000000000000000034031367726301600176660ustar00rootroot00000000000000/* tests compressed for easy testing */ /* http://mathiasbynens.be/notes/css-escapes */ /* will match elements with class=":`(" */ .\3A \`\({} /* will match elements with class="1a2b3c" */ .\31 a2b3c{} /* will match the element with id="#fake-id" */ #\#fake-id{} /* will match the element with id="---" */ #\---{} /* will match the element with id="-a-b-c-" */ #-a-b-c-{} /* will match the element with id="©" */ #©{} /* More tests from http://mathiasbynens.be/demo/html5-id */ html{font:1.2em/1.6 Arial;} code{font-family:Consolas;} li code{background:rgba(255, 255, 255, .5);padding:.3em;} li{background:orange;} #♥{background:lime;} #©{background:lime;} #“‘’”{background:lime;} #☺☃{background:lime;} #⌘⌥{background:lime;} #𝄞♪♩♫♬{background:lime;} #\?{background:lime;} #\@{background:lime;} #\.{background:lime;} #\3A \){background:lime;} #\3A \`\({background:lime;} #\31 23{background:lime;} #\31 a2b3c{background:lime;} #\{background:lime;} #\<\>\<\<\<\>\>\<\>{background:lime;} #\+\+\+\+\+\+\+\+\+\+\[\>\+\+\+\+\+\+\+\>\+\+\+\+\+\+\+\+\+\+\>\+\+\+\>\+\<\<\<\<\-\]\>\+\+\.\>\+\.\+\+\+\+\+\+\+\.\.\+\+\+\.\>\+\+\.\<\<\+\+\+\+\+\+\+\+\+\+\+\+\+\+\+\.\>\.\+\+\+\.\-\-\-\-\-\-\.\-\-\-\-\-\-\-\-\.\>\+\.\>\.{background:lime;} #\#{background:lime;} #\#\#{background:lime;} #\#\.\#\.\#{background:lime;} #\_{background:lime;} #\.fake\-class{background:lime;} #foo\.bar{background:lime;} #\3A hover{background:lime;} #\3A hover\3A focus\3A active{background:lime;} #\[attr\=value\]{background:lime;} #f\/o\/o{background:lime;} #f\\o\\o{background:lime;} #f\*o\*o{background:lime;} #f\!o\!o{background:lime;} #f\'o\'o{background:lime;} #f\~o\~o{background:lime;} #f\+o\+o{background:lime;} /* css-parse does not yet pass this test */ /*#\{\}{background:lime;}*/ css-3.0.0/test/cases/escapes/output.css000066400000000000000000000037311367726301600200730ustar00rootroot00000000000000/* tests compressed for easy testing */ /* http://mathiasbynens.be/notes/css-escapes */ /* will match elements with class=":`(" */ /* will match elements with class="1a2b3c" */ /* will match the element with id="#fake-id" */ /* will match the element with id="---" */ /* will match the element with id="-a-b-c-" */ /* will match the element with id="©" */ /* More tests from http://mathiasbynens.be/demo/html5-id */ html { font: 1.2em/1.6 Arial; } code { font-family: Consolas; } li code { background: rgba(255, 255, 255, .5); padding: .3em; } li { background: orange; } #♥ { background: lime; } #© { background: lime; } #“‘’” { background: lime; } #☺☃ { background: lime; } #⌘⌥ { background: lime; } #𝄞♪♩♫♬ { background: lime; } #\? { background: lime; } #\@ { background: lime; } #\. { background: lime; } #\3A \) { background: lime; } #\3A \`\( { background: lime; } #\31 23 { background: lime; } #\31 a2b3c { background: lime; } #\ { background: lime; } #\<\>\<\<\<\>\>\<\> { background: lime; } #\+\+\+\+\+\+\+\+\+\+\[\>\+\+\+\+\+\+\+\>\+\+\+\+\+\+\+\+\+\+\>\+\+\+\>\+\<\<\<\<\-\]\>\+\+\.\>\+\.\+\+\+\+\+\+\+\.\.\+\+\+\.\>\+\+\.\<\<\+\+\+\+\+\+\+\+\+\+\+\+\+\+\+\.\>\.\+\+\+\.\-\-\-\-\-\-\.\-\-\-\-\-\-\-\-\.\>\+\.\>\. { background: lime; } #\# { background: lime; } #\#\# { background: lime; } #\#\.\#\.\# { background: lime; } #\_ { background: lime; } #\.fake\-class { background: lime; } #foo\.bar { background: lime; } #\3A hover { background: lime; } #\3A hover\3A focus\3A active { background: lime; } #\[attr\=value\] { background: lime; } #f\/o\/o { background: lime; } #f\\o\\o { background: lime; } #f\*o\*o { background: lime; } #f\!o\!o { background: lime; } #f\'o\'o { background: lime; } #f\~o\~o { background: lime; } #f\+o\+o { background: lime; } /* css-parse does not yet pass this test */ /*#\{\}{background:lime;}*/ css-3.0.0/test/cases/font-face-linebreak/000077500000000000000000000000001367726301600201665ustar00rootroot00000000000000css-3.0.0/test/cases/font-face-linebreak/ast.json000066400000000000000000000037651367726301600216630ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "font-face", "declarations": [ { "type": "declaration", "property": "font-family", "value": "\"Bitstream Vera Serif Bold\"", "position": { "start": { "line": 4, "column": 3 }, "end": { "line": 4, "column": 43 }, "source": "input.css" } }, { "type": "declaration", "property": "src", "value": "url(\"http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf\")", "position": { "start": { "line": 5, "column": 3 }, "end": { "line": 5, "column": 78 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 6, "column": 2 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "font-family", "value": "\"Bitstream Vera Serif Bold\", serif", "position": { "start": { "line": 9, "column": 3 }, "end": { "line": 9, "column": 50 }, "source": "input.css" } } ], "position": { "start": { "line": 8, "column": 1 }, "end": { "line": 10, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/font-face-linebreak/compressed.css000066400000000000000000000002651367726301600230470ustar00rootroot00000000000000@font-face{font-family:"Bitstream Vera Serif Bold";src:url("http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf");}body{font-family:"Bitstream Vera Serif Bold", serif;} css-3.0.0/test/cases/font-face-linebreak/input.css000066400000000000000000000003211367726301600220330ustar00rootroot00000000000000@font-face { font-family: "Bitstream Vera Serif Bold"; src: url("http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf"); } body { font-family: "Bitstream Vera Serif Bold", serif; } css-3.0.0/test/cases/font-face-linebreak/output.css000066400000000000000000000003071367726301600222400ustar00rootroot00000000000000@font-face { font-family: "Bitstream Vera Serif Bold"; src: url("http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf"); } body { font-family: "Bitstream Vera Serif Bold", serif; } css-3.0.0/test/cases/font-face/000077500000000000000000000000001367726301600162345ustar00rootroot00000000000000css-3.0.0/test/cases/font-face/ast.json000066400000000000000000000037641367726301600177300ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "font-face", "declarations": [ { "type": "declaration", "property": "font-family", "value": "\"Bitstream Vera Serif Bold\"", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 43 }, "source": "input.css" } }, { "type": "declaration", "property": "src", "value": "url(\"http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf\")", "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 78 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 4, "column": 2 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "font-family", "value": "\"Bitstream Vera Serif Bold\", serif", "position": { "start": { "line": 7, "column": 3 }, "end": { "line": 7, "column": 50 }, "source": "input.css" } } ], "position": { "start": { "line": 6, "column": 1 }, "end": { "line": 8, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/font-face/compressed.css000066400000000000000000000002651367726301600211150ustar00rootroot00000000000000@font-face{font-family:"Bitstream Vera Serif Bold";src:url("http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf");}body{font-family:"Bitstream Vera Serif Bold", serif;} css-3.0.0/test/cases/font-face/input.css000066400000000000000000000003071367726301600201050ustar00rootroot00000000000000@font-face { font-family: "Bitstream Vera Serif Bold"; src: url("http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf"); } body { font-family: "Bitstream Vera Serif Bold", serif; } css-3.0.0/test/cases/font-face/output.css000066400000000000000000000003071367726301600203060ustar00rootroot00000000000000@font-face { font-family: "Bitstream Vera Serif Bold"; src: url("http://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf"); } body { font-family: "Bitstream Vera Serif Bold", serif; } css-3.0.0/test/cases/hose-linebreak/000077500000000000000000000000001367726301600172625ustar00rootroot00000000000000css-3.0.0/test/cases/hose-linebreak/ast.json000066400000000000000000000023431367726301600207460ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "host", "rules": [ { "type": "rule", "selectors": [ ":scope" ], "declarations": [ { "type": "declaration", "property": "color", "value": "white", "position": { "start": { "line": 3, "column": 18 }, "end": { "line": 3, "column": 30 }, "source": "input.css" } } ], "position": { "start": { "line": 3, "column": 9 }, "end": { "line": 3, "column": 33 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 4, "column": 6 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/hose-linebreak/compressed.css000066400000000000000000000000331367726301600221340ustar00rootroot00000000000000@host{:scope{color:white;}}css-3.0.0/test/cases/hose-linebreak/input.css000066400000000000000000000000631367726301600211320ustar00rootroot00000000000000@host { :scope { color: white; } } css-3.0.0/test/cases/hose-linebreak/output.css000066400000000000000000000000521367726301600213310ustar00rootroot00000000000000@host { :scope { color: white; } }css-3.0.0/test/cases/host/000077500000000000000000000000001367726301600153475ustar00rootroot00000000000000css-3.0.0/test/cases/host/ast.json000066400000000000000000000023441367726301600170340ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "host", "rules": [ { "type": "rule", "selectors": [ ":scope" ], "declarations": [ { "type": "declaration", "property": "display", "value": "block", "position": { "start": { "line": 3, "column": 5 }, "end": { "line": 3, "column": 19 }, "source": "input.css" } } ], "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 4, "column": 4 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 5, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/host/compressed.css000066400000000000000000000000361367726301600202240ustar00rootroot00000000000000@host{:scope{display:block;}} css-3.0.0/test/cases/host/input.css000066400000000000000000000000551367726301600172200ustar00rootroot00000000000000@host { :scope { display: block; } } css-3.0.0/test/cases/host/output.css000066400000000000000000000000551367726301600174210ustar00rootroot00000000000000@host { :scope { display: block; } } css-3.0.0/test/cases/import-linebreak/000077500000000000000000000000001367726301600176365ustar00rootroot00000000000000css-3.0.0/test/cases/import-linebreak/ast.json000066400000000000000000000005771367726301600213310ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "import", "import": "url(test.css)\n screen", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 4, "column": 6 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/import-linebreak/compressed.css000066400000000000000000000000411367726301600225070ustar00rootroot00000000000000@import url(test.css) screen;css-3.0.0/test/cases/import-linebreak/input.css000066400000000000000000000000531367726301600215050ustar00rootroot00000000000000@import url(test.css) screen ; css-3.0.0/test/cases/import-linebreak/output.css000066400000000000000000000000411367726301600217030ustar00rootroot00000000000000@import url(test.css) screen;css-3.0.0/test/cases/import-messed/000077500000000000000000000000001367726301600171625ustar00rootroot00000000000000css-3.0.0/test/cases/import-messed/ast.json000066400000000000000000000032221367726301600206430ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "import", "import": "url(\"fineprint.css\") print", "position": { "start": { "line": 2, "column": 4 }, "end": { "line": 2, "column": 39 }, "source": "input.css" } }, { "type": "import", "import": "url(\"bluish.css\") projection, tv", "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 44 }, "source": "input.css" } }, { "type": "import", "import": "'custom.css'", "position": { "start": { "line": 4, "column": 7 }, "end": { "line": 4, "column": 28 }, "source": "input.css" } }, { "type": "import", "import": "\"common.css\" screen, projection", "position": { "start": { "line": 5, "column": 3 }, "end": { "line": 5, "column": 45 }, "source": "input.css" } }, { "type": "import", "import": "url('landscape.css') screen and (orientation:landscape)", "position": { "start": { "line": 7, "column": 3 }, "end": { "line": 7, "column": 67 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/import-messed/compressed.css000066400000000000000000000003121367726301600220340ustar00rootroot00000000000000@import url("fineprint.css") print;@import url("bluish.css") projection, tv;@import 'custom.css';@import "common.css" screen, projection;@import url('landscape.css') screen and (orientation:landscape); css-3.0.0/test/cases/import-messed/input.css000066400000000000000000000003411367726301600210310ustar00rootroot00000000000000 @import url("fineprint.css") print; @import url("bluish.css") projection, tv; @import 'custom.css'; @import "common.css" screen, projection ; @import url('landscape.css') screen and (orientation:landscape); css-3.0.0/test/cases/import-messed/output.css000066400000000000000000000003221367726301600212310ustar00rootroot00000000000000@import url("fineprint.css") print; @import url("bluish.css") projection, tv; @import 'custom.css'; @import "common.css" screen, projection; @import url('landscape.css') screen and (orientation:landscape); css-3.0.0/test/cases/import/000077500000000000000000000000001367726301600157045ustar00rootroot00000000000000css-3.0.0/test/cases/import/ast.json000066400000000000000000000032221367726301600173650ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "import", "import": "url(\"fineprint.css\") print", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 36 }, "source": "input.css" } }, { "type": "import", "import": "url(\"bluish.css\") projection, tv", "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 2, "column": 42 }, "source": "input.css" } }, { "type": "import", "import": "'custom.css'", "position": { "start": { "line": 3, "column": 1 }, "end": { "line": 3, "column": 22 }, "source": "input.css" } }, { "type": "import", "import": "\"common.css\" screen, projection", "position": { "start": { "line": 4, "column": 1 }, "end": { "line": 4, "column": 41 }, "source": "input.css" } }, { "type": "import", "import": "url('landscape.css') screen and (orientation:landscape)", "position": { "start": { "line": 5, "column": 1 }, "end": { "line": 5, "column": 65 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/import/compressed.css000066400000000000000000000003121367726301600205560ustar00rootroot00000000000000@import url("fineprint.css") print;@import url("bluish.css") projection, tv;@import 'custom.css';@import "common.css" screen, projection;@import url('landscape.css') screen and (orientation:landscape); css-3.0.0/test/cases/import/input.css000066400000000000000000000003161367726301600175550ustar00rootroot00000000000000@import url("fineprint.css") print; @import url("bluish.css") projection, tv; @import 'custom.css'; @import "common.css" screen, projection; @import url('landscape.css') screen and (orientation:landscape); css-3.0.0/test/cases/import/output.css000066400000000000000000000003221367726301600177530ustar00rootroot00000000000000@import url("fineprint.css") print; @import url("bluish.css") projection, tv; @import 'custom.css'; @import "common.css" screen, projection; @import url('landscape.css') screen and (orientation:landscape); css-3.0.0/test/cases/keyframes-advanced/000077500000000000000000000000001367726301600201235ustar00rootroot00000000000000css-3.0.0/test/cases/keyframes-advanced/ast.json000066400000000000000000000057671367726301600216240ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "keyframes", "name": "advanced", "keyframes": [ { "type": "keyframe", "values": [ "top" ], "declarations": [ { "type": "declaration", "property": "opacity[sqrt]", "value": "0", "position": { "start": { "line": 3, "column": 5 }, "end": { "line": 3, "column": 21 }, "source": "input.css" } } ], "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 4, "column": 4 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "100" ], "declarations": [ { "type": "declaration", "property": "opacity", "value": "0.5", "position": { "start": { "line": 7, "column": 5 }, "end": { "line": 7, "column": 17 }, "source": "input.css" } } ], "position": { "start": { "line": 6, "column": 3 }, "end": { "line": 8, "column": 4 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "bottom" ], "declarations": [ { "type": "declaration", "property": "opacity", "value": "1", "position": { "start": { "line": 11, "column": 5 }, "end": { "line": 11, "column": 15 }, "source": "input.css" } } ], "position": { "start": { "line": 10, "column": 3 }, "end": { "line": 12, "column": 4 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 13, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/keyframes-advanced/compressed.css000066400000000000000000000001161367726301600227770ustar00rootroot00000000000000@keyframes advanced{top{opacity[sqrt]:0;}100{opacity:0.5;}bottom{opacity:1;}} css-3.0.0/test/cases/keyframes-advanced/input.css000066400000000000000000000001711367726301600217730ustar00rootroot00000000000000@keyframes advanced { top { opacity[sqrt]: 0; } 100 { opacity: 0.5; } bottom { opacity: 1; } } css-3.0.0/test/cases/keyframes-advanced/output.css000066400000000000000000000001711367726301600221740ustar00rootroot00000000000000@keyframes advanced { top { opacity[sqrt]: 0; } 100 { opacity: 0.5; } bottom { opacity: 1; } } css-3.0.0/test/cases/keyframes-complex/000077500000000000000000000000001367726301600200255ustar00rootroot00000000000000css-3.0.0/test/cases/keyframes-complex/ast.json000066400000000000000000000114171367726301600215130ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "keyframes", "name": "foo", "keyframes": [ { "type": "keyframe", "values": [ "0%" ], "declarations": [ { "type": "declaration", "property": "top", "value": "0", "position": { "start": { "line": 2, "column": 8 }, "end": { "line": 2, "column": 14 }, "source": "input.css" } }, { "type": "declaration", "property": "left", "value": "0", "position": { "start": { "line": 2, "column": 16 }, "end": { "line": 2, "column": 24 }, "source": "input.css" } } ], "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 25 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "30.50%" ], "declarations": [ { "type": "declaration", "property": "top", "value": "50px", "position": { "start": { "line": 3, "column": 12 }, "end": { "line": 3, "column": 22 }, "source": "input.css" } } ], "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 23 }, "source": "input.css" } }, { "type": "keyframe", "values": [ ".68%", "72%", "85%" ], "declarations": [ { "type": "declaration", "property": "left", "value": "50px", "position": { "start": { "line": 6, "column": 15 }, "end": { "line": 6, "column": 26 }, "source": "input.css" } } ], "position": { "start": { "line": 4, "column": 3 }, "end": { "line": 6, "column": 27 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "100%" ], "declarations": [ { "type": "declaration", "property": "top", "value": "100px", "position": { "start": { "line": 7, "column": 10 }, "end": { "line": 7, "column": 20 }, "source": "input.css" } }, { "type": "declaration", "property": "left", "value": "100%", "position": { "start": { "line": 7, "column": 22 }, "end": { "line": 7, "column": 33 }, "source": "input.css" } } ], "position": { "start": { "line": 7, "column": 3 }, "end": { "line": 7, "column": 34 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 8, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/keyframes-complex/compressed.css000066400000000000000000000001451367726301600227030ustar00rootroot00000000000000@keyframes foo{0%{top:0;left:0;}30.50%{top:50px;}.68%,72%,85%{left:50px;}100%{top:100px;left:100%;}} css-3.0.0/test/cases/keyframes-complex/input.css000066400000000000000000000002171367726301600216760ustar00rootroot00000000000000@keyframes foo { 0% { top: 0; left: 0 } 30.50% { top: 50px } .68% , 72% , 85% { left: 50px } 100% { top: 100px; left: 100% } } css-3.0.0/test/cases/keyframes-complex/output.css000066400000000000000000000002541367726301600221000ustar00rootroot00000000000000@keyframes foo { 0% { top: 0; left: 0; } 30.50% { top: 50px; } .68%, 72%, 85% { left: 50px; } 100% { top: 100px; left: 100%; } } css-3.0.0/test/cases/keyframes-linebreak/000077500000000000000000000000001367726301600203125ustar00rootroot00000000000000css-3.0.0/test/cases/keyframes-linebreak/ast.json000066400000000000000000000041641367726301600220010ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "keyframes", "name": "test", "keyframes": [ { "type": "keyframe", "values": [ "from" ], "declarations": [ { "type": "declaration", "property": "opacity", "value": "1", "position": { "start": { "line": 4, "column": 16 }, "end": { "line": 4, "column": 26 }, "source": "input.css" } } ], "position": { "start": { "line": 4, "column": 9 }, "end": { "line": 4, "column": 29 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "to" ], "declarations": [ { "type": "declaration", "property": "opacity", "value": "0", "position": { "start": { "line": 5, "column": 14 }, "end": { "line": 5, "column": 24 }, "source": "input.css" } } ], "position": { "start": { "line": 5, "column": 9 }, "end": { "line": 5, "column": 27 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 6, "column": 6 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/keyframes-linebreak/compressed.css000066400000000000000000000000571367726301600231720ustar00rootroot00000000000000@keyframes test{from{opacity:1;}to{opacity:0;}}css-3.0.0/test/cases/keyframes-linebreak/input.css000066400000000000000000000001301367726301600221550ustar00rootroot00000000000000@keyframes test { from { opacity: 1; } to { opacity: 0; } } css-3.0.0/test/cases/keyframes-linebreak/output.css000066400000000000000000000001141367726301600223600ustar00rootroot00000000000000@keyframes test { from { opacity: 1; } to { opacity: 0; } }css-3.0.0/test/cases/keyframes-messed/000077500000000000000000000000001367726301600176365ustar00rootroot00000000000000css-3.0.0/test/cases/keyframes-messed/ast.json000066400000000000000000000041641367726301600213250ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "keyframes", "name": "fade", "keyframes": [ { "type": "keyframe", "values": [ "from" ], "declarations": [ { "type": "declaration", "property": "opacity", "value": "0", "position": { "start": { "line": 2, "column": 4 }, "end": { "line": 2, "column": 14 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 18 }, "end": { "line": 3, "column": 7 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "to" ], "declarations": [ { "type": "declaration", "property": "opacity", "value": "1", "position": { "start": { "line": 6, "column": 6 }, "end": { "line": 6, "column": 16 }, "source": "input.css" } } ], "position": { "start": { "line": 4, "column": 1 }, "end": { "line": 6, "column": 18 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 6, "column": 19 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/keyframes-messed/compressed.css000066400000000000000000000000601367726301600225100ustar00rootroot00000000000000@keyframes fade{from{opacity:0;}to{opacity:1;}} css-3.0.0/test/cases/keyframes-messed/input.css000066400000000000000000000001061367726301600215040ustar00rootroot00000000000000@keyframes fade {from {opacity: 0; } to { opacity: 1;}} css-3.0.0/test/cases/keyframes-messed/output.css000066400000000000000000000001151367726301600217050ustar00rootroot00000000000000@keyframes fade { from { opacity: 0; } to { opacity: 1; } } css-3.0.0/test/cases/keyframes-vendor/000077500000000000000000000000001367726301600176535ustar00rootroot00000000000000css-3.0.0/test/cases/keyframes-vendor/ast.json000066400000000000000000000042221367726301600213350ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "keyframes", "name": "fade", "vendor": "-webkit-", "keyframes": [ { "type": "keyframe", "values": [ "from" ], "declarations": [ { "type": "declaration", "property": "opacity", "value": "0", "position": { "start": { "line": 2, "column": 10 }, "end": { "line": 2, "column": 21 }, "source": "input.css" } } ], "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 22 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "to" ], "declarations": [ { "type": "declaration", "property": "opacity", "value": "1", "position": { "start": { "line": 3, "column": 8 }, "end": { "line": 3, "column": 19 }, "source": "input.css" } } ], "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 4, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/keyframes-vendor/compressed.css000066400000000000000000000000701367726301600225260ustar00rootroot00000000000000@-webkit-keyframes fade{from{opacity:0;}to{opacity:1;}} css-3.0.0/test/cases/keyframes-vendor/input.css000066400000000000000000000001061367726301600215210ustar00rootroot00000000000000@-webkit-keyframes fade { from { opacity: 0 } to { opacity: 1 } } css-3.0.0/test/cases/keyframes-vendor/output.css000066400000000000000000000001251367726301600217230ustar00rootroot00000000000000@-webkit-keyframes fade { from { opacity: 0; } to { opacity: 1; } } css-3.0.0/test/cases/keyframes/000077500000000000000000000000001367726301600163605ustar00rootroot00000000000000css-3.0.0/test/cases/keyframes/ast.json000066400000000000000000000072351367726301600200510ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "keyframes", "name": "fade", "keyframes": [ { "type": "comment", "comment": " from above ", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 19 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "from" ], "declarations": [ { "type": "comment", "comment": " from inside ", "position": { "start": { "line": 4, "column": 5 }, "end": { "line": 4, "column": 22 }, "source": "input.css" } }, { "type": "declaration", "property": "opacity", "value": "0", "position": { "start": { "line": 5, "column": 5 }, "end": { "line": 5, "column": 15 }, "source": "input.css" } } ], "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 6, "column": 4 }, "source": "input.css" } }, { "type": "comment", "comment": " to above ", "position": { "start": { "line": 8, "column": 3 }, "end": { "line": 8, "column": 17 }, "source": "input.css" } }, { "type": "keyframe", "values": [ "to" ], "declarations": [ { "type": "comment", "comment": " to inside ", "position": { "start": { "line": 10, "column": 5 }, "end": { "line": 10, "column": 20 }, "source": "input.css" } }, { "type": "declaration", "property": "opacity", "value": "1", "position": { "start": { "line": 11, "column": 5 }, "end": { "line": 11, "column": 15 }, "source": "input.css" } } ], "position": { "start": { "line": 9, "column": 3 }, "end": { "line": 12, "column": 4 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 13, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/keyframes/compressed.css000066400000000000000000000000601367726301600212320ustar00rootroot00000000000000@keyframes fade{from{opacity:0;}to{opacity:1;}} css-3.0.0/test/cases/keyframes/input.css000066400000000000000000000002331367726301600202270ustar00rootroot00000000000000@keyframes fade { /* from above */ from { /* from inside */ opacity: 0; } /* to above */ to { /* to inside */ opacity: 1; } } css-3.0.0/test/cases/keyframes/output.css000066400000000000000000000002331367726301600204300ustar00rootroot00000000000000@keyframes fade { /* from above */ from { /* from inside */ opacity: 0; } /* to above */ to { /* to inside */ opacity: 1; } } css-3.0.0/test/cases/media-linebreak/000077500000000000000000000000001367726301600174035ustar00rootroot00000000000000css-3.0.0/test/cases/media-linebreak/ast.json000066400000000000000000000024221367726301600210650ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "media", "media": "(\n min-width: 300px\n)", "rules": [ { "type": "rule", "selectors": [ ".test" ], "declarations": [ { "type": "declaration", "property": "width", "value": "100px", "position": { "start": { "line": 7, "column": 13 }, "end": { "line": 7, "column": 25 }, "source": "input.css" } } ], "position": { "start": { "line": 7, "column": 5 }, "end": { "line": 7, "column": 28 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 8, "column": 2 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/media-linebreak/compressed.css000066400000000000000000000000641367726301600222610ustar00rootroot00000000000000@media ( min-width: 300px ){.test{width:100px;}}css-3.0.0/test/cases/media-linebreak/input.css000066400000000000000000000001011367726301600212440ustar00rootroot00000000000000@media ( min-width: 300px ) { .test { width: 100px; } } css-3.0.0/test/cases/media-linebreak/output.css000066400000000000000000000001031367726301600214470ustar00rootroot00000000000000@media ( min-width: 300px ) { .test { width: 100px; } }css-3.0.0/test/cases/media-messed/000077500000000000000000000000001367726301600167275ustar00rootroot00000000000000css-3.0.0/test/cases/media-messed/ast.json000066400000000000000000000137741367726301600204250ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "media", "media": "screen, projection", "rules": [ { "type": "rule", "selectors": [ "html" ], "declarations": [ { "type": "declaration", "property": "background", "value": "#fffef0", "position": { "start": { "line": 4, "column": 1 }, "end": { "line": 4, "column": 20 }, "source": "input.css" } }, { "type": "declaration", "property": "color", "value": "#300", "position": { "start": { "line": 5, "column": 5 }, "end": { "line": 5, "column": 15 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 28 }, "end": { "line": 6, "column": 4 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "max-width", "value": "35em", "position": { "start": { "line": 10, "column": 5 }, "end": { "line": 10, "column": 20 }, "source": "input.css" } }, { "type": "declaration", "property": "margin", "value": "0 auto", "position": { "start": { "line": 11, "column": 5 }, "end": { "line": 11, "column": 19 }, "source": "input.css" } } ], "position": { "start": { "line": 7, "column": 3 }, "end": { "line": 14, "column": 2 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 15, "column": 4 }, "source": "input.css" } }, { "type": "media", "media": "print", "rules": [ { "type": "rule", "selectors": [ "html" ], "declarations": [ { "type": "declaration", "property": "background", "value": "#fff", "position": { "start": { "line": 20, "column": 15 }, "end": { "line": 20, "column": 31 }, "source": "input.css" } }, { "type": "declaration", "property": "color", "value": "#000", "position": { "start": { "line": 21, "column": 15 }, "end": { "line": 21, "column": 26 }, "source": "input.css" } } ], "position": { "start": { "line": 19, "column": 15 }, "end": { "line": 22, "column": 16 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "padding", "value": "1in", "position": { "start": { "line": 24, "column": 15 }, "end": { "line": 24, "column": 27 }, "source": "input.css" } }, { "type": "declaration", "property": "border", "value": "0.5pt solid #666", "position": { "start": { "line": 25, "column": 15 }, "end": { "line": 25, "column": 39 }, "source": "input.css" } } ], "position": { "start": { "line": 23, "column": 15 }, "end": { "line": 26, "column": 16 }, "source": "input.css" } } ], "position": { "start": { "line": 17, "column": 1 }, "end": { "line": 27, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/media-messed/compressed.css000066400000000000000000000002741367726301600216100ustar00rootroot00000000000000@media screen, projection{html{background:#fffef0;color:#300;}body{max-width:35em;margin:0 auto;}}@media print{html{background:#fff;color:#000;}body{padding:1in;border:0.5pt solid #666;}} css-3.0.0/test/cases/media-messed/input.css000066400000000000000000000005461367726301600206050ustar00rootroot00000000000000@media screen, projection{ html { background: #fffef0; color:#300; } body { max-width: 35em; margin: 0 auto; } } @media print { html { background: #fff; color: #000; } body { padding: 1in; border: 0.5pt solid #666; } } css-3.0.0/test/cases/media-messed/output.css000066400000000000000000000004201367726301600207750ustar00rootroot00000000000000@media screen, projection { html { background: #fffef0; color: #300; } body { max-width: 35em; margin: 0 auto; } } @media print { html { background: #fff; color: #000; } body { padding: 1in; border: 0.5pt solid #666; } } css-3.0.0/test/cases/media/000077500000000000000000000000001367726301600154515ustar00rootroot00000000000000css-3.0.0/test/cases/media/ast.json000066400000000000000000000170401367726301600171350ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "media", "media": "screen, projection", "rules": [ { "type": "comment", "comment": " html above ", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 19 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "html" ], "declarations": [ { "type": "comment", "comment": " html inside ", "position": { "start": { "line": 4, "column": 5 }, "end": { "line": 4, "column": 22 }, "source": "input.css" } }, { "type": "declaration", "property": "background", "value": "#fffef0", "position": { "start": { "line": 5, "column": 5 }, "end": { "line": 5, "column": 24 }, "source": "input.css" } }, { "type": "declaration", "property": "color", "value": "#300", "position": { "start": { "line": 6, "column": 5 }, "end": { "line": 6, "column": 16 }, "source": "input.css" } } ], "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 7, "column": 4 }, "source": "input.css" } }, { "type": "comment", "comment": " body above ", "position": { "start": { "line": 9, "column": 3 }, "end": { "line": 9, "column": 19 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "comment", "comment": " body inside ", "position": { "start": { "line": 11, "column": 5 }, "end": { "line": 11, "column": 22 }, "source": "input.css" } }, { "type": "declaration", "property": "max-width", "value": "35em", "position": { "start": { "line": 12, "column": 5 }, "end": { "line": 12, "column": 20 }, "source": "input.css" } }, { "type": "declaration", "property": "margin", "value": "0 auto", "position": { "start": { "line": 13, "column": 5 }, "end": { "line": 13, "column": 19 }, "source": "input.css" } } ], "position": { "start": { "line": 10, "column": 3 }, "end": { "line": 14, "column": 4 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 15, "column": 2 }, "source": "input.css" } }, { "type": "media", "media": "print", "rules": [ { "type": "rule", "selectors": [ "html" ], "declarations": [ { "type": "declaration", "property": "background", "value": "#fff", "position": { "start": { "line": 19, "column": 5 }, "end": { "line": 19, "column": 21 }, "source": "input.css" } }, { "type": "declaration", "property": "color", "value": "#000", "position": { "start": { "line": 20, "column": 5 }, "end": { "line": 20, "column": 16 }, "source": "input.css" } } ], "position": { "start": { "line": 18, "column": 3 }, "end": { "line": 21, "column": 4 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "padding", "value": "1in", "position": { "start": { "line": 23, "column": 5 }, "end": { "line": 23, "column": 17 }, "source": "input.css" } }, { "type": "declaration", "property": "border", "value": "0.5pt solid #666", "position": { "start": { "line": 24, "column": 5 }, "end": { "line": 24, "column": 29 }, "source": "input.css" } } ], "position": { "start": { "line": 22, "column": 3 }, "end": { "line": 25, "column": 4 }, "source": "input.css" } } ], "position": { "start": { "line": 17, "column": 1 }, "end": { "line": 26, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/media/compressed.css000066400000000000000000000002741367726301600203320ustar00rootroot00000000000000@media screen, projection{html{background:#fffef0;color:#300;}body{max-width:35em;margin:0 auto;}}@media print{html{background:#fff;color:#000;}body{padding:1in;border:0.5pt solid #666;}} css-3.0.0/test/cases/media/input.css000066400000000000000000000005411367726301600173220ustar00rootroot00000000000000@media screen, projection { /* html above */ html { /* html inside */ background: #fffef0; color: #300; } /* body above */ body { /* body inside */ max-width: 35em; margin: 0 auto; } } @media print { html { background: #fff; color: #000; } body { padding: 1in; border: 0.5pt solid #666; } } css-3.0.0/test/cases/media/output.css000066400000000000000000000005441367726301600175260ustar00rootroot00000000000000@media screen, projection { /* html above */ html { /* html inside */ background: #fffef0; color: #300; } /* body above */ body { /* body inside */ max-width: 35em; margin: 0 auto; } } @media print { html { background: #fff; color: #000; } body { padding: 1in; border: 0.5pt solid #666; } } css-3.0.0/test/cases/messed-up/000077500000000000000000000000001367726301600162745ustar00rootroot00000000000000css-3.0.0/test/cases/messed-up/ast.json000066400000000000000000000060001367726301600177520ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "foo", "value": "'bar'", "position": { "start": { "line": 1, "column": 8 }, "end": { "line": 3, "column": 9 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 3, "column": 10 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "foo", "value": "bar", "position": { "start": { "line": 5, "column": 9 }, "end": { "line": 5, "column": 16 }, "source": "input.css" } }, { "type": "declaration", "property": "bar", "value": "baz", "position": { "start": { "line": 5, "column": 17 }, "end": { "line": 5, "column": 24 }, "source": "input.css" } } ], "position": { "start": { "line": 5, "column": 4 }, "end": { "line": 5, "column": 25 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "foo", "value": "bar", "position": { "start": { "line": 8, "column": 6 }, "end": { "line": 11, "column": 6 }, "source": "input.css" } }, { "type": "declaration", "property": "bar", "value": "baz", "position": { "start": { "line": 12, "column": 6 }, "end": { "line": 15, "column": 6 }, "source": "input.css" } } ], "position": { "start": { "line": 6, "column": 4 }, "end": { "line": 15, "column": 7 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/messed-up/compressed.css000066400000000000000000000000751367726301600211540ustar00rootroot00000000000000body{foo:'bar';}body{foo:bar;bar:baz;}body{foo:bar;bar:baz;} css-3.0.0/test/cases/messed-up/input.css000066400000000000000000000002001367726301600201350ustar00rootroot00000000000000body { foo : 'bar' } body{foo:bar;bar:baz} body { foo : bar ; bar : baz } css-3.0.0/test/cases/messed-up/output.css000066400000000000000000000001331367726301600203430ustar00rootroot00000000000000body { foo: 'bar'; } body { foo: bar; bar: baz; } body { foo: bar; bar: baz; } css-3.0.0/test/cases/namespace-linebreak/000077500000000000000000000000001367726301600202605ustar00rootroot00000000000000css-3.0.0/test/cases/namespace-linebreak/ast.json000066400000000000000000000006141367726301600217430ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "namespace", "namespace": "\"http://www.w3.org/1999/xhtml\"", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 3, "column": 6 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/namespace-linebreak/compressed.css000066400000000000000000000000521367726301600231330ustar00rootroot00000000000000@namespace "http://www.w3.org/1999/xhtml";css-3.0.0/test/cases/namespace-linebreak/input.css000066400000000000000000000000641367726301600221310ustar00rootroot00000000000000@namespace "http://www.w3.org/1999/xhtml" ; css-3.0.0/test/cases/namespace-linebreak/output.css000066400000000000000000000000521367726301600223270ustar00rootroot00000000000000@namespace "http://www.w3.org/1999/xhtml";css-3.0.0/test/cases/namespace/000077500000000000000000000000001367726301600163265ustar00rootroot00000000000000css-3.0.0/test/cases/namespace/ast.json000066400000000000000000000013301367726301600200050ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "namespace", "namespace": "\"http://www.w3.org/1999/xhtml\"", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 43 }, "source": "input.css" } }, { "type": "namespace", "namespace": "svg \"http://www.w3.org/2000/svg\"", "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 2, "column": 45 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/namespace/compressed.css000066400000000000000000000001271367726301600212040ustar00rootroot00000000000000@namespace "http://www.w3.org/1999/xhtml";@namespace svg "http://www.w3.org/2000/svg"; css-3.0.0/test/cases/namespace/input.css000066400000000000000000000001301367726301600201710ustar00rootroot00000000000000@namespace "http://www.w3.org/1999/xhtml"; @namespace svg "http://www.w3.org/2000/svg"; css-3.0.0/test/cases/namespace/output.css000066400000000000000000000001311367726301600203730ustar00rootroot00000000000000@namespace "http://www.w3.org/1999/xhtml"; @namespace svg "http://www.w3.org/2000/svg"; css-3.0.0/test/cases/no-semi/000077500000000000000000000000001367726301600157415ustar00rootroot00000000000000css-3.0.0/test/cases/no-semi/ast.json000066400000000000000000000023201367726301600174200ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "tobi loki jane" ], "declarations": [ { "type": "declaration", "property": "are", "value": "'all'", "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 13 }, "source": "input.css" } }, { "type": "declaration", "property": "the-species", "value": "called \"ferrets\"", "position": { "start": { "line": 4, "column": 3 }, "end": { "line": 5, "column": 1 }, "source": "input.css" } } ], "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 5, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/no-semi/compressed.css000066400000000000000000000000701367726301600206140ustar00rootroot00000000000000tobi loki jane{are:'all';the-species:called "ferrets";} css-3.0.0/test/cases/no-semi/input.css000066400000000000000000000001021367726301600176030ustar00rootroot00000000000000 tobi loki jane { are: 'all'; the-species: called "ferrets" } css-3.0.0/test/cases/no-semi/output.css000066400000000000000000000001021367726301600200040ustar00rootroot00000000000000tobi loki jane { are: 'all'; the-species: called "ferrets"; } css-3.0.0/test/cases/page-linebreak/000077500000000000000000000000001367726301600172405ustar00rootroot00000000000000css-3.0.0/test/cases/page-linebreak/ast.json000066400000000000000000000014541367726301600207260ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "page", "selectors": [ "toc" ], "declarations": [ { "type": "declaration", "property": "color", "value": "black", "position": { "start": { "line": 4, "column": 9 }, "end": { "line": 4, "column": 21 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 5, "column": 6 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/page-linebreak/compressed.css000066400000000000000000000000271367726301600221150ustar00rootroot00000000000000@page toc{color:black;}css-3.0.0/test/cases/page-linebreak/input.css000066400000000000000000000000601367726301600211050ustar00rootroot00000000000000@page toc { color: black; } css-3.0.0/test/cases/page-linebreak/output.css000066400000000000000000000000351367726301600213100ustar00rootroot00000000000000@page toc { color: black; }css-3.0.0/test/cases/paged-media/000077500000000000000000000000001367726301600165275ustar00rootroot00000000000000css-3.0.0/test/cases/paged-media/ast.json000066400000000000000000000056431367726301600202210ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "comment", "comment": " toc above ", "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 16 }, "source": "input.css" } }, { "type": "page", "selectors": [ "toc", "index:blank" ], "declarations": [ { "type": "comment", "comment": " toc inside ", "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 19 }, "source": "input.css" } }, { "type": "declaration", "property": "color", "value": "green", "position": { "start": { "line": 4, "column": 3 }, "end": { "line": 4, "column": 15 }, "source": "input.css" } } ], "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 5, "column": 2 }, "source": "input.css" } }, { "type": "page", "selectors": [], "declarations": [ { "type": "declaration", "property": "font-size", "value": "16pt", "position": { "start": { "line": 8, "column": 3 }, "end": { "line": 8, "column": 18 }, "source": "input.css" } } ], "position": { "start": { "line": 7, "column": 1 }, "end": { "line": 9, "column": 2 }, "source": "input.css" } }, { "type": "page", "selectors": [ ":left" ], "declarations": [ { "type": "declaration", "property": "margin-left", "value": "5cm", "position": { "start": { "line": 12, "column": 3 }, "end": { "line": 12, "column": 19 }, "source": "input.css" } } ], "position": { "start": { "line": 11, "column": 1 }, "end": { "line": 13, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/paged-media/compressed.css000066400000000000000000000001311367726301600214000ustar00rootroot00000000000000@page toc, index:blank{color:green;}@page {font-size:16pt;}@page :left{margin-left:5cm;} css-3.0.0/test/cases/paged-media/input.css000066400000000000000000000002211367726301600203730ustar00rootroot00000000000000/* toc above */ @page toc, index:blank { /* toc inside */ color: green; } @page { font-size: 16pt; } @page :left { margin-left: 5cm; } css-3.0.0/test/cases/paged-media/output.css000066400000000000000000000002221367726301600205750ustar00rootroot00000000000000/* toc above */ @page toc, index:blank { /* toc inside */ color: green; } @page { font-size: 16pt; } @page :left { margin-left: 5cm; } css-3.0.0/test/cases/props/000077500000000000000000000000001367726301600155355ustar00rootroot00000000000000css-3.0.0/test/cases/props/ast.json000066400000000000000000000031351367726301600172210ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "tobi loki jane" ], "declarations": [ { "type": "declaration", "property": "are", "value": "'all'", "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 13 }, "source": "input.css" } }, { "type": "declaration", "property": "the-species", "value": "called \"ferrets\"", "position": { "start": { "line": 4, "column": 3 }, "end": { "line": 4, "column": 32 }, "source": "input.css" } }, { "type": "declaration", "property": "*even", "value": "'ie crap'", "position": { "start": { "line": 5, "column": 3 }, "end": { "line": 5, "column": 19 }, "source": "input.css" } } ], "position": { "start": { "line": 2, "column": 1 }, "end": { "line": 6, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/props/compressed.css000066400000000000000000000001101367726301600204030ustar00rootroot00000000000000tobi loki jane{are:'all';the-species:called "ferrets";*even:'ie crap';} css-3.0.0/test/cases/props/input.css000066400000000000000000000001271367726301600174060ustar00rootroot00000000000000 tobi loki jane { are: 'all'; the-species: called "ferrets"; *even: 'ie crap'; } css-3.0.0/test/cases/props/output.css000066400000000000000000000001261367726301600176060ustar00rootroot00000000000000tobi loki jane { are: 'all'; the-species: called "ferrets"; *even: 'ie crap'; } css-3.0.0/test/cases/quote-escape/000077500000000000000000000000001367726301600167655ustar00rootroot00000000000000css-3.0.0/test/cases/quote-escape/ast.json000066400000000000000000000015241367726301600204510ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "p[qwe=\"a\\\",b\"]" ], "declarations": [ { "type": "declaration", "property": "color", "value": "red", "position": { "start": { "line": 1, "column": 18 }, "end": { "line": 1, "column": 29 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 1, "column": 30 }, "source": "input.css" } } ], "parsingErrors": [] } }css-3.0.0/test/cases/quote-escape/compressed.css000066400000000000000000000000321367726301600216360ustar00rootroot00000000000000p[qwe="a\",b"]{color:red;}css-3.0.0/test/cases/quote-escape/input.css000066400000000000000000000000361367726301600206350ustar00rootroot00000000000000p[qwe="a\",b"] { color: red } css-3.0.0/test/cases/quote-escape/output.css000066400000000000000000000000401367726301600210310ustar00rootroot00000000000000p[qwe="a\",b"] { color: red; }css-3.0.0/test/cases/quoted/000077500000000000000000000000001367726301600156735ustar00rootroot00000000000000css-3.0.0/test/cases/quoted/ast.json000066400000000000000000000015261367726301600173610ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "body" ], "declarations": [ { "type": "declaration", "property": "background", "value": "url('some;stuff;here') 50% 50% no-repeat", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 55 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 3, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/quoted/compressed.css000066400000000000000000000000731367726301600205510ustar00rootroot00000000000000body{background:url('some;stuff;here') 50% 50% no-repeat;} css-3.0.0/test/cases/quoted/input.css000066400000000000000000000001011367726301600175340ustar00rootroot00000000000000body { background: url('some;stuff;here') 50% 50% no-repeat; } css-3.0.0/test/cases/quoted/output.css000066400000000000000000000001011367726301600177350ustar00rootroot00000000000000body { background: url('some;stuff;here') 50% 50% no-repeat; } css-3.0.0/test/cases/rule/000077500000000000000000000000001367726301600153415ustar00rootroot00000000000000css-3.0.0/test/cases/rule/ast.json000066400000000000000000000014531367726301600170260ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "foo" ], "declarations": [ { "type": "declaration", "property": "bar", "value": "'baz'", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 13 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 3, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/rule/compressed.css000066400000000000000000000000201367726301600202070ustar00rootroot00000000000000foo{bar:'baz';} css-3.0.0/test/cases/rule/input.css000066400000000000000000000000261367726301600172100ustar00rootroot00000000000000foo { bar: 'baz'; } css-3.0.0/test/cases/rule/output.css000066400000000000000000000000261367726301600174110ustar00rootroot00000000000000foo { bar: 'baz'; } css-3.0.0/test/cases/rules/000077500000000000000000000000001367726301600155245ustar00rootroot00000000000000css-3.0.0/test/cases/rules/ast.json000066400000000000000000000044301367726301600172070ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "tobi" ], "declarations": [ { "type": "declaration", "property": "name", "value": "'tobi'", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 15 }, "source": "input.css" } }, { "type": "declaration", "property": "age", "value": "2", "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 9 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 4, "column": 2 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "loki" ], "declarations": [ { "type": "declaration", "property": "name", "value": "'loki'", "position": { "start": { "line": 7, "column": 3 }, "end": { "line": 7, "column": 15 }, "source": "input.css" } }, { "type": "declaration", "property": "age", "value": "1", "position": { "start": { "line": 8, "column": 3 }, "end": { "line": 8, "column": 9 }, "source": "input.css" } } ], "position": { "start": { "line": 6, "column": 1 }, "end": { "line": 9, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/rules/compressed.css000066400000000000000000000000611367726301600203770ustar00rootroot00000000000000tobi{name:'tobi';age:2;}loki{name:'loki';age:1;} css-3.0.0/test/cases/rules/input.css000066400000000000000000000001071367726301600173730ustar00rootroot00000000000000tobi { name: 'tobi'; age: 2; } loki { name: 'loki'; age: 1; } css-3.0.0/test/cases/rules/output.css000066400000000000000000000001071367726301600175740ustar00rootroot00000000000000tobi { name: 'tobi'; age: 2; } loki { name: 'loki'; age: 1; } css-3.0.0/test/cases/selectors/000077500000000000000000000000001367726301600163755ustar00rootroot00000000000000css-3.0.0/test/cases/selectors/ast.json000066400000000000000000000015211367726301600200560ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ "foo", "bar", "baz" ], "declarations": [ { "type": "declaration", "property": "color", "value": "'black'", "position": { "start": { "line": 4, "column": 3 }, "end": { "line": 4, "column": 17 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 5, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/selectors/compressed.css000066400000000000000000000000341367726301600212500ustar00rootroot00000000000000foo,bar,baz{color:'black';} css-3.0.0/test/cases/selectors/input.css000066400000000000000000000000441367726301600202440ustar00rootroot00000000000000foo, bar, baz { color: 'black'; } css-3.0.0/test/cases/selectors/output.css000066400000000000000000000000441367726301600204450ustar00rootroot00000000000000foo, bar, baz { color: 'black'; } css-3.0.0/test/cases/supports-linebreak/000077500000000000000000000000001367726301600202235ustar00rootroot00000000000000css-3.0.0/test/cases/supports-linebreak/ast.json000066400000000000000000000024161367726301600217100ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "supports", "supports": "(display: flex)", "rules": [ { "type": "rule", "selectors": [ ".test" ], "declarations": [ { "type": "declaration", "property": "display", "value": "flex", "position": { "start": { "line": 4, "column": 17 }, "end": { "line": 4, "column": 30 }, "source": "input.css" } } ], "position": { "start": { "line": 4, "column": 9 }, "end": { "line": 4, "column": 33 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 5, "column": 6 }, "source": "input.css" } } ] } }css-3.0.0/test/cases/supports-linebreak/compressed.css000066400000000000000000000000571367726301600231030ustar00rootroot00000000000000@supports (display: flex){.test{display:flex;}}css-3.0.0/test/cases/supports-linebreak/input.css000066400000000000000000000001131367726301600220670ustar00rootroot00000000000000@supports (display: flex) { .test { display: flex; } } css-3.0.0/test/cases/supports-linebreak/output.css000066400000000000000000000000761367726301600223000ustar00rootroot00000000000000@supports (display: flex) { .test { display: flex; } }css-3.0.0/test/cases/supports/000077500000000000000000000000001367726301600162715ustar00rootroot00000000000000css-3.0.0/test/cases/supports/ast.json000066400000000000000000000065661367726301600177700ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "supports", "supports": "(display: flex) or (display: box)", "rules": [ { "type": "comment", "comment": " flex above ", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 19 }, "source": "input.css" } }, { "type": "rule", "selectors": [ ".flex" ], "declarations": [ { "type": "comment", "comment": " flex inside ", "position": { "start": { "line": 4, "column": 5 }, "end": { "line": 4, "column": 22 }, "source": "input.css" } }, { "type": "declaration", "property": "display", "value": "box", "position": { "start": { "line": 5, "column": 5 }, "end": { "line": 5, "column": 17 }, "source": "input.css" } }, { "type": "declaration", "property": "display", "value": "flex", "position": { "start": { "line": 6, "column": 5 }, "end": { "line": 6, "column": 18 }, "source": "input.css" } } ], "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 7, "column": 4 }, "source": "input.css" } }, { "type": "rule", "selectors": [ "div" ], "declarations": [ { "type": "declaration", "property": "something", "value": "else", "position": { "start": { "line": 10, "column": 5 }, "end": { "line": 10, "column": 20 }, "source": "input.css" } } ], "position": { "start": { "line": 9, "column": 3 }, "end": { "line": 11, "column": 4 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 12, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/supports/compressed.css000066400000000000000000000001421367726301600211440ustar00rootroot00000000000000@supports (display: flex) or (display: box){.flex{display:box;display:flex;}div{something:else;}} css-3.0.0/test/cases/supports/input.css000066400000000000000000000002561367726301600201450ustar00rootroot00000000000000@supports (display: flex) or (display: box) { /* flex above */ .flex { /* flex inside */ display: box; display: flex; } div { something: else; } } css-3.0.0/test/cases/supports/output.css000066400000000000000000000002571367726301600203470ustar00rootroot00000000000000@supports (display: flex) or (display: box) { /* flex above */ .flex { /* flex inside */ display: box; display: flex; } div { something: else; } } css-3.0.0/test/cases/wtf/000077500000000000000000000000001367726301600151725ustar00rootroot00000000000000css-3.0.0/test/cases/wtf/ast.json000066400000000000000000000031151367726301600166540ustar00rootroot00000000000000{ "type": "stylesheet", "stylesheet": { "rules": [ { "type": "rule", "selectors": [ ".wtf" ], "declarations": [ { "type": "declaration", "property": "*overflow-x", "value": "hidden", "position": { "start": { "line": 2, "column": 3 }, "end": { "line": 2, "column": 22 }, "source": "input.css" } }, { "type": "declaration", "property": "//max-height", "value": "110px", "position": { "start": { "line": 3, "column": 3 }, "end": { "line": 3, "column": 22 }, "source": "input.css" } }, { "type": "declaration", "property": "#height", "value": "18px", "position": { "start": { "line": 4, "column": 3 }, "end": { "line": 4, "column": 16 }, "source": "input.css" } } ], "position": { "start": { "line": 1, "column": 1 }, "end": { "line": 5, "column": 2 }, "source": "input.css" } } ] } } css-3.0.0/test/cases/wtf/compressed.css000066400000000000000000000000721367726301600200470ustar00rootroot00000000000000.wtf{*overflow-x:hidden;//max-height:110px;#height:18px;} css-3.0.0/test/cases/wtf/input.css000066400000000000000000000001101367726301600170330ustar00rootroot00000000000000.wtf { *overflow-x: hidden; //max-height: 110px; #height: 18px; } css-3.0.0/test/cases/wtf/output.css000066400000000000000000000001101367726301600172340ustar00rootroot00000000000000.wtf { *overflow-x: hidden; //max-height: 110px; #height: 18px; } css-3.0.0/test/parse.js000066400000000000000000000056121367726301600147500ustar00rootroot00000000000000var parse = require('../').parse; var should = require('should'); describe('parse(str)', function() { it('should save the filename and source', function() { var css = 'booty {\n size: large;\n}\n'; var ast = parse(css, { source: 'booty.css' }); ast.stylesheet.source.should.equal('booty.css'); var position = ast.stylesheet.rules[0].position; position.start.should.be.ok; position.end.should.be.ok; position.source.should.equal('booty.css'); position.content.should.equal(css); }); it('should throw when a selector is missing', function() { should(function() { parse('{size: large}'); }).throw(); should(function() { parse('b { color: red; }\n{ color: green; }\na { color: blue; }'); }).throw(); }); it('should throw when a broken comment is found', function () { should(function() { parse('thing { color: red; } /* b { color: blue; }'); }).throw(); should(function() { parse('/*'); }).throw(); /* Nested comments should be fine */ should(function() { parse('/* /* */'); }).not.throw(); }); it('should allow empty property value', function() { should(function() { parse('p { color:; }'); }).not.throw(); }); it('should not throw with silent option', function () { should(function() { parse('thing { color: red; } /* b { color: blue; }', { silent: true }); }).not.throw(); }); it('should list the parsing errors and continue parsing', function() { var result = parse('foo { color= red; } bar { color: blue; } baz {}} boo { display: none}', { silent: true, source: 'foo.css' }); var rules = result.stylesheet.rules; rules.length.should.be.above(2); var errors = result.stylesheet.parsingErrors; errors.length.should.equal(2); errors[0].should.have.a.property('message'); errors[0].should.have.a.property('reason'); errors[0].should.have.a.property('filename'); errors[0].filename.should.equal('foo.css'); errors[0].should.have.a.property('line'); errors[0].should.have.a.property('column'); errors[0].should.have.a.property('source'); }); it('should set parent property', function() { var result = parse( 'thing { test: value; }\n' + '@media (min-width: 100px) { thing { test: value; } }'); should(result.parent).equal(null); var rules = result.stylesheet.rules; rules.length.should.equal(2); var rule = rules[0]; rule.parent.should.equal(result); rule.declarations.length.should.equal(1); var decl = rule.declarations[0]; decl.parent.should.equal(rule); var media = rules[1]; media.parent.should.equal(result); media.rules.length.should.equal(1); rule = media.rules[0]; rule.parent.should.equal(media); rule.declarations.length.should.equal(1); decl = rule.declarations[0]; decl.parent.should.equal(rule); }); }); css-3.0.0/test/source-map/000077500000000000000000000000001367726301600153475ustar00rootroot00000000000000css-3.0.0/test/source-map/apply.css000066400000000000000000000000771367726301600172120ustar00rootroot00000000000000tobi { name: 'tobi'; } /*# sourceMappingURL=apply.css.map */css-3.0.0/test/source-map/apply.css.map000066400000000000000000000001541367726301600177620ustar00rootroot00000000000000{ "version": 3, "file": "", "sources": ["apply.scss"], "names": [], "mappings": "AAAA;EAAO,MAAM" }css-3.0.0/test/source-map/apply.scss000066400000000000000000000000271367726301600173700ustar00rootroot00000000000000tobi { name: 'tobi'; } css-3.0.0/test/source-map/test.css000066400000000000000000000002211367726301600170330ustar00rootroot00000000000000tobi { name: 'tobi'; age: 2; } loki { name: 'loki'; age: 1; } @media screen { screen-only { display: block; } } /* comment */ css-3.0.0/test/stringify.js000066400000000000000000000103531367726301600156520ustar00rootroot00000000000000var stringify = require('../').stringify; var parse = require('../').parse; var path = require('path'); var read = require('fs').readFileSync; var SourceMapConsumer = require('source-map').SourceMapConsumer; var SourceMapGenerator = require('source-map').SourceMapGenerator; describe('stringify(obj, {sourcemap: true})', function() { var file = 'test/source-map/test.css'; var src = read(file, 'utf8'); var stylesheet = parse(src, { source: file }); function loc(line, column) { return { line: line, column: column, source: file, name: null }; } var locs = { tobiSelector: loc(1, 0), tobiNameName: loc(2, 2), tobiNameValue: loc(2, 2), mediaBlock: loc(11, 0), mediaOnly: loc(12, 2), comment: loc(17, 0), }; it('should generate source maps alongside when using identity compiler', function() { var result = stringify(stylesheet, { sourcemap: true }); result.should.have.property('code'); result.should.have.property('map'); var map = new SourceMapConsumer(result.map); map.originalPositionFor({ line: 1, column: 0 }).should.eql(locs.tobiSelector); map.originalPositionFor({ line: 2, column: 2 }).should.eql(locs.tobiNameName); map.originalPositionFor({ line: 2, column: 8 }).should.eql(locs.tobiNameValue); map.originalPositionFor({ line: 11, column: 0 }).should.eql(locs.mediaBlock); map.originalPositionFor({ line: 12, column: 2 }).should.eql(locs.mediaOnly); map.originalPositionFor({ line: 17, column: 0 }).should.eql(locs.comment); map.sourceContentFor(file).should.eql(src); }); it('should generate source maps alongside when using compress compiler', function() { var result = stringify(stylesheet, { compress: true, sourcemap: true }); result.should.have.property('code'); result.should.have.property('map'); var map = new SourceMapConsumer(result.map); map.originalPositionFor({ line: 1, column: 0 }).should.eql(locs.tobiSelector); map.originalPositionFor({ line: 1, column: 5 }).should.eql(locs.tobiNameName); map.originalPositionFor({ line: 1, column: 10 }).should.eql(locs.tobiNameValue); map.originalPositionFor({ line: 1, column: 50 }).should.eql(locs.mediaBlock); map.originalPositionFor({ line: 1, column: 64 }).should.eql(locs.mediaOnly); map.sourceContentFor(file).should.eql(src); }); it('should apply included source maps, with paths adjusted to CWD', function() { var file = 'test/source-map/apply.css'; var src = read(file, 'utf8'); var stylesheet = parse(src, { source: file }); var result = stringify(stylesheet, { sourcemap: true }); result.should.have.property('code'); result.should.have.property('map'); var map = new SourceMapConsumer(result.map); map.originalPositionFor({ line: 1, column: 0 }).should.eql({ column: 0, line: 1, name: null, source: 'test/source-map/apply.scss' }); map.originalPositionFor({ line: 2, column: 2 }).should.eql({ column: 7, line: 1, name: null, source: 'test/source-map/apply.scss' }); }); it('should not apply included source maps when inputSourcemap is false', function() { var file = 'test/source-map/apply.css'; var src = read(file, 'utf8'); var stylesheet = parse(src, { source: file }); var result = stringify(stylesheet, { sourcemap: true, inputSourcemaps: false }); var map = new SourceMapConsumer(result.map); map.originalPositionFor({ line: 1, column: 0 }).should.eql({ column: 0, line: 1, name: null, source: file }); }); it('should convert Windows-style paths to URLs', function() { var originalSep = path.sep; path.sep = '\\'; // Pretend we’re on Windows (if we aren’t already). var src = 'C:\\test\\source.css'; var css = 'a { color: black; }' var stylesheet = parse(css, { source: src }); var result = stringify(stylesheet, { sourcemap: true }); result.map.sources.should.eql(['/test/source.css']); path.sep = originalSep; }); it('should return source map generator when sourcemap: "generator"', function(){ var css = 'a { color: black; }'; var stylesheet = parse(css); var result = stringify(stylesheet, { sourcemap: 'generator' }); result.map.should.be.an.instanceOf(SourceMapGenerator); }); });