42870 lines
1.2 MiB
42870 lines
1.2 MiB
/* Import all components */
|
|
/*
|
|
|
|
███████╗███████╗███╗ ███╗ █████╗ ███╗ ██╗████████╗██╗ ██████╗ ██╗ ██╗██╗
|
|
██╔════╝██╔════╝████╗ ████║██╔══██╗████╗ ██║╚══██╔══╝██║██╔════╝ ██║ ██║██║
|
|
███████╗█████╗ ██╔████╔██║███████║██╔██╗ ██║ ██║ ██║██║ ██║ ██║██║
|
|
╚════██║██╔══╝ ██║╚██╔╝██║██╔══██║██║╚██╗██║ ██║ ██║██║ ██║ ██║██║
|
|
███████║███████╗██║ ╚═╝ ██║██║ ██║██║ ╚████║ ██║ ██║╚██████╗ ╚██████╔╝██║
|
|
╚══════╝╚══════╝╚═╝ ╚═╝╚═╝ ╚═╝╚═╝ ╚═══╝ ╚═╝ ╚═╝ ╚═════╝ ╚═════╝ ╚═╝
|
|
|
|
Import this file into your LESS project to use Semantic UI without build tools
|
|
*/
|
|
/* Global */
|
|
/*!
|
|
* # Semantic UI - Reset
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Reset
|
|
*******************************/
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Reset
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Reset
|
|
*******************************/
|
|
/* Border-Box */
|
|
*,
|
|
*:before,
|
|
*:after {
|
|
-webkit-box-sizing: inherit;
|
|
box-sizing: inherit;
|
|
}
|
|
html {
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
/* iPad Input Shadows */
|
|
input[type="text"],
|
|
input[type="email"],
|
|
input[type="search"],
|
|
input[type="password"] {
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
/* mobile firefox too! */
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
|
|
/**
|
|
* Correct `block` display not defined in IE 8/9.
|
|
*/
|
|
/*! 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 {
|
|
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"],
|
|
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"] {
|
|
-webkit-box-sizing: border-box;
|
|
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 */
|
|
}
|
|
/**
|
|
* 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;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Site
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Page
|
|
*******************************/
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
}
|
|
html {
|
|
font-size: 14px;
|
|
}
|
|
body {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
overflow-x: hidden;
|
|
min-width: 320px;
|
|
background: #fff;
|
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-size: 13px;
|
|
line-height: 1.4285em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
font-smoothing: antialiased;
|
|
}
|
|
/*******************************
|
|
Headers
|
|
*******************************/
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5 {
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
line-height: 1.2857em;
|
|
margin: calc(2rem - 0.14285em ) 0em 1rem;
|
|
font-weight: bold;
|
|
padding: 0em;
|
|
}
|
|
h1 {
|
|
min-height: 1rem;
|
|
font-size: 2rem;
|
|
}
|
|
h2 {
|
|
font-size: 1.714rem;
|
|
}
|
|
h3 {
|
|
font-size: 1.28rem;
|
|
}
|
|
h4 {
|
|
font-size: 1.071rem;
|
|
}
|
|
h5 {
|
|
font-size: 1rem;
|
|
}
|
|
h1:first-child,
|
|
h2:first-child,
|
|
h3:first-child,
|
|
h4:first-child,
|
|
h5:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
h1:last-child,
|
|
h2:last-child,
|
|
h3:last-child,
|
|
h4:last-child,
|
|
h5:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*******************************
|
|
Text
|
|
*******************************/
|
|
p {
|
|
margin: 0em 0em 1em;
|
|
line-height: 1.4285em;
|
|
}
|
|
p:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
p:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
a {
|
|
color: #4183C4;
|
|
text-decoration: none;
|
|
}
|
|
a:hover {
|
|
color: #1e70bf;
|
|
text-decoration: none;
|
|
}
|
|
/*******************************
|
|
Highlighting
|
|
*******************************/
|
|
/* Site */
|
|
::-webkit-selection {
|
|
background-color: #CCE2FF;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
::-moz-selection {
|
|
background-color: #CCE2FF;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
::selection {
|
|
background-color: #CCE2FF;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/* Form */
|
|
textarea::-webkit-selection,
|
|
input::-webkit-selection {
|
|
background-color: rgba(100, 100, 100, 0.4);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
textarea::-moz-selection,
|
|
input::-moz-selection {
|
|
background-color: rgba(100, 100, 100, 0.4);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
textarea::selection,
|
|
input::selection {
|
|
background-color: rgba(100, 100, 100, 0.4);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/* Elements */
|
|
/*!
|
|
* # Semantic UI - Button
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Button
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/* Button */
|
|
/* Button defaults to using same height as input globally */
|
|
/* Text */
|
|
/* Internal Shadow */
|
|
/* Box Shadow */
|
|
/* Icon */
|
|
/* Loader */
|
|
/*
|
|
@willChange: box-shadow, transform, opacity, color, background;
|
|
*/
|
|
/*-------------------
|
|
Group
|
|
--------------------*/
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Hovered */
|
|
/* Focused */
|
|
/* Disabled */
|
|
/* Pressed Down */
|
|
/* Active */
|
|
/* Active + Hovered */
|
|
/* Loading */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Or */
|
|
/* Icon */
|
|
/* Labeled */
|
|
/* hypotenuse of triangle */
|
|
/* Labeled Icon */
|
|
/* Inverted */
|
|
/* Basic */
|
|
/* Basic Hover */
|
|
/* Basic Focus */
|
|
/* Basic Down */
|
|
/* Basic Active */
|
|
/* Basic Inverted */
|
|
/* Basic Group */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Colors */
|
|
/* Colored */
|
|
/* Inverted */
|
|
/* Ordinality */
|
|
/* Compact */
|
|
/* Attached */
|
|
/* Floated */
|
|
/* Animated */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Button
|
|
*******************************/
|
|
.ui.button {
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
min-height: 1em;
|
|
outline: none;
|
|
border: none;
|
|
vertical-align: baseline;
|
|
background: #E0E1E2 none;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
margin: 0em 0.25em 0em 0em;
|
|
padding: 0.78571429em 1.5em 0.78571429em;
|
|
text-transform: none;
|
|
text-shadow: none;
|
|
font-weight: bold;
|
|
line-height: 1em;
|
|
font-style: normal;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
-webkit-transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease;
|
|
transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
will-change: '';
|
|
-webkit-tap-highlight-color: transparent;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Hover
|
|
---------------*/
|
|
.ui.button:hover {
|
|
background-color: #CACBCD;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
.ui.button:hover .icon {
|
|
opacity: 0.85;
|
|
}
|
|
/*--------------
|
|
Focus
|
|
---------------*/
|
|
.ui.button:focus {
|
|
background-color: #CACBCD;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
background-image: '' !important;
|
|
-webkit-box-shadow: '' !important;
|
|
box-shadow: '' !important;
|
|
}
|
|
.ui.button:focus .icon {
|
|
opacity: 0.85;
|
|
}
|
|
/*--------------
|
|
Down
|
|
---------------*/
|
|
.ui.button:active,
|
|
.ui.active.button:active {
|
|
background-color: #BABBBC;
|
|
background-image: '';
|
|
color: rgba(0, 0, 0, 0.9);
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent inset, none;
|
|
box-shadow: 0px 0px 0px 1px transparent inset, none;
|
|
}
|
|
/*--------------
|
|
Active
|
|
---------------*/
|
|
.ui.active.button {
|
|
background-color: #C0C1C2;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent inset;
|
|
box-shadow: 0px 0px 0px 1px transparent inset;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
.ui.active.button:hover {
|
|
background-color: #C0C1C2;
|
|
background-image: none;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
.ui.active.button:active {
|
|
background-color: #C0C1C2;
|
|
background-image: none;
|
|
}
|
|
/*--------------
|
|
Loading
|
|
---------------*/
|
|
/* Specificity hack */
|
|
.ui.loading.loading.loading.loading.loading.loading.button {
|
|
position: relative;
|
|
cursor: default;
|
|
text-shadow: none !important;
|
|
color: transparent !important;
|
|
opacity: 1;
|
|
pointer-events: auto;
|
|
-webkit-transition: all 0s linear, opacity 0.1s ease;
|
|
transition: all 0s linear, opacity 0.1s ease;
|
|
}
|
|
.ui.loading.button:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -0.64285714em 0em 0em -0.64285714em;
|
|
width: 1.28571429em;
|
|
height: 1.28571429em;
|
|
border-radius: 500rem;
|
|
border: 0.2em solid rgba(0, 0, 0, 0.15);
|
|
}
|
|
.ui.loading.button:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -0.64285714em 0em 0em -0.64285714em;
|
|
width: 1.28571429em;
|
|
height: 1.28571429em;
|
|
-webkit-animation: button-spin 0.6s linear;
|
|
animation: button-spin 0.6s linear;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
border-radius: 500rem;
|
|
border-color: #FFFFFF transparent transparent;
|
|
border-style: solid;
|
|
border-width: 0.2em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent;
|
|
box-shadow: 0px 0px 0px 1px transparent;
|
|
}
|
|
.ui.labeled.icon.loading.button .icon {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
@-webkit-keyframes button-spin {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes button-spin {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
.ui.basic.loading.button:not(.inverted):before {
|
|
border-color: rgba(0, 0, 0, 0.1);
|
|
}
|
|
.ui.basic.loading.button:not(.inverted):after {
|
|
border-top-color: #95a5a6;
|
|
}
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
.ui.buttons .disabled.button,
|
|
.ui.disabled.button,
|
|
.ui.button:disabled,
|
|
.ui.disabled.button:hover,
|
|
.ui.disabled.active.button {
|
|
cursor: default;
|
|
opacity: 0.45 !important;
|
|
background-image: none !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
pointer-events: none !important;
|
|
}
|
|
/* Basic Group With Disabled */
|
|
.ui.basic.buttons .ui.disabled.button {
|
|
border-color: rgba(34, 36, 38, 0.5);
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*-------------------
|
|
Animated
|
|
--------------------*/
|
|
.ui.animated.button {
|
|
position: relative;
|
|
overflow: hidden;
|
|
padding-right: 0em !important;
|
|
vertical-align: middle;
|
|
z-index: 1;
|
|
}
|
|
.ui.animated.button .content {
|
|
will-change: transform, opacity;
|
|
}
|
|
.ui.animated.button .visible.content {
|
|
position: relative;
|
|
margin-right: 1.5em;
|
|
}
|
|
.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;
|
|
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.5em;
|
|
}
|
|
.ui.animated.button:focus .visible.content,
|
|
.ui.animated.button:hover .visible.content {
|
|
left: auto;
|
|
right: 200%;
|
|
}
|
|
.ui.animated.button:focus .hidden.content,
|
|
.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, -webkit-transform 0.3s ease;
|
|
transition: top 0.3s ease, -webkit-transform 0.3s ease;
|
|
transition: top 0.3s ease, transform 0.3s ease;
|
|
transition: top 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease;
|
|
}
|
|
.ui.vertical.animated.button .visible.content {
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
right: auto;
|
|
}
|
|
.ui.vertical.animated.button .hidden.content {
|
|
top: -50%;
|
|
left: 0%;
|
|
right: auto;
|
|
}
|
|
.ui.vertical.animated.button:focus .visible.content,
|
|
.ui.vertical.animated.button:hover .visible.content {
|
|
-webkit-transform: translateY(200%);
|
|
transform: translateY(200%);
|
|
right: auto;
|
|
}
|
|
.ui.vertical.animated.button:focus .hidden.content,
|
|
.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, -webkit-transform 0.3s ease;
|
|
transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
|
|
transition: opacity 0.3s ease, transform 0.3s ease;
|
|
transition: opacity 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease;
|
|
}
|
|
.ui.fade.animated.button .visible.content {
|
|
left: auto;
|
|
right: auto;
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
.ui.fade.animated.button .hidden.content {
|
|
opacity: 0;
|
|
left: 0%;
|
|
right: auto;
|
|
-webkit-transform: scale(1.5);
|
|
transform: scale(1.5);
|
|
}
|
|
.ui.fade.animated.button:focus .visible.content,
|
|
.ui.fade.animated.button:hover .visible.content {
|
|
left: auto;
|
|
right: auto;
|
|
opacity: 0;
|
|
-webkit-transform: scale(0.75);
|
|
transform: scale(0.75);
|
|
}
|
|
.ui.fade.animated.button:focus .hidden.content,
|
|
.ui.fade.animated.button:hover .hidden.content {
|
|
left: 0%;
|
|
right: auto;
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
/*-------------------
|
|
Inverted
|
|
--------------------*/
|
|
.ui.inverted.button,
|
|
.ui.button.play-button.play-button-full {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #FFFFFF inset !important;
|
|
box-shadow: 0px 0px 0px 2px #FFFFFF inset !important;
|
|
background: transparent none;
|
|
color: #FFFFFF;
|
|
text-shadow: none !important;
|
|
}
|
|
/* Group */
|
|
.ui.inverted.buttons .button {
|
|
margin: 0px 0px 0px -2px;
|
|
}
|
|
.ui.inverted.buttons .button:first-child {
|
|
margin-left: 0em;
|
|
}
|
|
.ui.inverted.vertical.buttons .button {
|
|
margin: 0px 0px -2px 0px;
|
|
}
|
|
.ui.inverted.vertical.buttons .button:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
/* States */
|
|
/* Hover */
|
|
.ui.inverted.button:hover,
|
|
.ui.button.play-button.play-button-full:hover {
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #FFFFFF inset !important;
|
|
box-shadow: 0px 0px 0px 2px #FFFFFF inset !important;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
/* Active / Focus */
|
|
.ui.inverted.button:focus,
|
|
.ui.inverted.button.active,
|
|
.ui.button.play-button.play-button-full:focus,
|
|
.ui.button.play-button.play-button-full.active {
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #FFFFFF inset !important;
|
|
box-shadow: 0px 0px 0px 2px #FFFFFF inset !important;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
/* Active Focus */
|
|
.ui.inverted.button.active:focus,
|
|
.ui.button.play-button.play-button-full.active:focus {
|
|
background: #DCDDDE;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #DCDDDE inset !important;
|
|
box-shadow: 0px 0px 0px 2px #DCDDDE inset !important;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
/*-------------------
|
|
Labeled Button
|
|
--------------------*/
|
|
.ui.labeled.button:not(.icon) {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
background: none !important;
|
|
padding: 0px !important;
|
|
border: none !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.ui.labeled.button > .button {
|
|
margin: 0px;
|
|
}
|
|
.ui.labeled.button > .label {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
margin: 0px 0px 0px -1px !important;
|
|
padding: '';
|
|
font-size: 1em;
|
|
border-color: rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Tag */
|
|
.ui.labeled.button > .tag.label:before {
|
|
width: 1.85em;
|
|
height: 1.85em;
|
|
}
|
|
/* Right */
|
|
.ui.labeled.button:not([class*="left labeled"]) > .button {
|
|
border-top-right-radius: 0px;
|
|
border-bottom-right-radius: 0px;
|
|
}
|
|
.ui.labeled.button:not([class*="left labeled"]) > .label {
|
|
border-top-left-radius: 0px;
|
|
border-bottom-left-radius: 0px;
|
|
}
|
|
/* Left Side */
|
|
.ui[class*="left labeled"].button > .button {
|
|
border-top-left-radius: 0px;
|
|
border-bottom-left-radius: 0px;
|
|
}
|
|
.ui[class*="left labeled"].button > .label {
|
|
border-top-right-radius: 0px;
|
|
border-bottom-right-radius: 0px;
|
|
}
|
|
/*-------------------
|
|
Social
|
|
--------------------*/
|
|
/* Facebook */
|
|
.ui.facebook.button {
|
|
background-color: #3B5998;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.facebook.button:hover {
|
|
background-color: #304d8a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.facebook.button:active {
|
|
background-color: #2d4373;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Twitter */
|
|
.ui.twitter.button {
|
|
background-color: #55ACEE;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.twitter.button:hover {
|
|
background-color: #35a2f4;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.twitter.button:active {
|
|
background-color: #2795e9;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Google Plus */
|
|
.ui.google.plus.button {
|
|
background-color: #DD4B39;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.google.plus.button:hover {
|
|
background-color: #e0321c;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.google.plus.button:active {
|
|
background-color: #c23321;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Linked In */
|
|
.ui.linkedin.button {
|
|
background-color: #1F88BE;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.linkedin.button:hover {
|
|
background-color: #147baf;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.linkedin.button:active {
|
|
background-color: #186992;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* YouTube */
|
|
.ui.youtube.button {
|
|
background-color: #CC181E;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.youtube.button:hover {
|
|
background-color: #bd0d13;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.youtube.button:active {
|
|
background-color: #9e1317;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Instagram */
|
|
.ui.instagram.button {
|
|
background-color: #49769C;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.instagram.button:hover {
|
|
background-color: #3d698e;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.instagram.button:active {
|
|
background-color: #395c79;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Pinterest */
|
|
.ui.pinterest.button {
|
|
background-color: #BD081C;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.pinterest.button:hover {
|
|
background-color: #ac0013;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.pinterest.button:active {
|
|
background-color: #8c0615;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* VK */
|
|
.ui.vk.button {
|
|
background-color: #4D7198;
|
|
color: #FFFFFF;
|
|
background-image: none;
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.vk.button:hover {
|
|
background-color: #41648a;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.vk.button:active {
|
|
background-color: #3c5876;
|
|
color: #FFFFFF;
|
|
}
|
|
/*--------------
|
|
Icon
|
|
---------------*/
|
|
.ui.button > .icon:not(.button) {
|
|
height: 0.85714286em;
|
|
opacity: 0.8;
|
|
margin: 0em 0.42857143em 0em -0.21428571em;
|
|
-webkit-transition: opacity 0.1s ease;
|
|
transition: opacity 0.1s ease;
|
|
vertical-align: '';
|
|
color: '';
|
|
}
|
|
.ui.button:not(.icon) > .icon:not(.button):not(.dropdown) {
|
|
margin: 0em 0.42857143em 0em -0.21428571em;
|
|
}
|
|
.ui.button:not(.icon) > .right.icon:not(.button):not(.dropdown) {
|
|
margin: 0em -0.21428571em 0em 0.42857143em;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Floated
|
|
--------------------*/
|
|
.ui[class*="left floated"].buttons,
|
|
.ui[class*="left floated"].button {
|
|
float: left;
|
|
margin-left: 0em;
|
|
margin-right: 0.25em;
|
|
}
|
|
.ui[class*="right floated"].buttons,
|
|
.ui[class*="right floated"].button {
|
|
float: right;
|
|
margin-right: 0em;
|
|
margin-left: 0.25em;
|
|
}
|
|
/*-------------------
|
|
Compact
|
|
--------------------*/
|
|
.ui.compact.buttons .button,
|
|
.ui.compact.button {
|
|
padding: 0.58928571em 1.125em 0.58928571em;
|
|
}
|
|
.ui.compact.icon.buttons .button,
|
|
.ui.compact.icon.button {
|
|
padding: 0.58928571em 0.58928571em 0.58928571em;
|
|
}
|
|
.ui.compact.labeled.icon.buttons .button,
|
|
.ui.compact.labeled.icon.button {
|
|
padding: 0.58928571em 3.69642857em 0.58928571em;
|
|
}
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
.ui.mini.buttons .button,
|
|
.ui.mini.buttons .or,
|
|
.ui.mini.button {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.tiny.buttons .button,
|
|
.ui.tiny.buttons .or,
|
|
.ui.tiny.button {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.buttons .button,
|
|
.ui.small.buttons .or,
|
|
.ui.small.button {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.buttons .button,
|
|
.ui.buttons .or,
|
|
.ui.button {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.buttons .button,
|
|
.ui.large.buttons .or,
|
|
.ui.large.button {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.big.buttons .button,
|
|
.ui.big.buttons .or,
|
|
.ui.big.button {
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.huge.buttons .button,
|
|
.ui.huge.buttons .or,
|
|
.ui.huge.button {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
.ui.massive.buttons .button,
|
|
.ui.massive.buttons .or,
|
|
.ui.massive.button {
|
|
font-size: 1.71428571rem;
|
|
}
|
|
/*--------------
|
|
Icon Only
|
|
---------------*/
|
|
.ui.icon.buttons .button,
|
|
.ui.icon.button {
|
|
padding: 0.78571429em 0.78571429em 0.78571429em;
|
|
}
|
|
.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: transparent none !important;
|
|
color: rgba(0, 0, 0, 0.6) !important;
|
|
font-weight: normal;
|
|
border-radius: 0.28571429rem;
|
|
text-transform: none;
|
|
text-shadow: none !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.basic.buttons {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
.ui.basic.buttons .button {
|
|
border-radius: 0em;
|
|
}
|
|
.ui.basic.buttons .button:hover,
|
|
.ui.basic.button:hover {
|
|
background: #FFFFFF !important;
|
|
color: rgba(0, 0, 0, 0.8) !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.basic.buttons .button:focus,
|
|
.ui.basic.button:focus {
|
|
background: #FFFFFF !important;
|
|
color: rgba(0, 0, 0, 0.8) !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.basic.buttons .button:active,
|
|
.ui.basic.button:active {
|
|
background: #F8F8F8 !important;
|
|
color: rgba(0, 0, 0, 0.9) !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.basic.buttons .active.button,
|
|
.ui.basic.active.button {
|
|
background: rgba(0, 0, 0, 0.05) !important;
|
|
-webkit-box-shadow: '' !important;
|
|
box-shadow: '' !important;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
-webkit-box-shadow: rgba(34, 36, 38, 0.35);
|
|
box-shadow: rgba(34, 36, 38, 0.35);
|
|
}
|
|
.ui.basic.buttons .active.button:hover,
|
|
.ui.basic.active.button:hover {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
}
|
|
/* Vertical */
|
|
.ui.basic.buttons .button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset inset;
|
|
box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset inset;
|
|
}
|
|
.ui.basic.buttons .button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(34, 36, 38, 0.15) inset inset;
|
|
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(34, 36, 38, 0.15) inset inset;
|
|
}
|
|
.ui.basic.buttons .active.button {
|
|
-webkit-box-shadow: rgba(34, 36, 38, 0.35) inset;
|
|
box-shadow: rgba(34, 36, 38, 0.35) inset;
|
|
}
|
|
/* Standard Basic Inverted */
|
|
.ui.basic.inverted.buttons .button,
|
|
.ui.basic.inverted.button {
|
|
background-color: transparent !important;
|
|
color: #F9FAFB !important;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
}
|
|
.ui.basic.inverted.buttons .button:hover,
|
|
.ui.basic.inverted.button:hover {
|
|
color: #FFFFFF !important;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ffffff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ffffff inset !important;
|
|
}
|
|
.ui.basic.inverted.buttons .button:focus,
|
|
.ui.basic.inverted.button:focus {
|
|
color: #FFFFFF !important;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ffffff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ffffff inset !important;
|
|
}
|
|
.ui.basic.inverted.buttons .button:active,
|
|
.ui.basic.inverted.button:active {
|
|
background-color: rgba(255, 255, 255, 0.08) !important;
|
|
color: #FFFFFF !important;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.9) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.9) inset !important;
|
|
}
|
|
.ui.basic.inverted.buttons .active.button,
|
|
.ui.basic.inverted.active.button {
|
|
background-color: rgba(255, 255, 255, 0.08);
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.7) inset;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.7) inset;
|
|
}
|
|
.ui.basic.inverted.buttons .active.button:hover,
|
|
.ui.basic.inverted.active.button:hover {
|
|
background-color: rgba(255, 255, 255, 0.15);
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ffffff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ffffff inset !important;
|
|
}
|
|
/* Basic Group */
|
|
.ui.basic.buttons .button {
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.basic.vertical.buttons .button {
|
|
border-left: none;
|
|
}
|
|
.ui.basic.vertical.buttons .button {
|
|
border-left-width: 0px;
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.basic.vertical.buttons .button:first-child {
|
|
border-top-width: 0px;
|
|
}
|
|
/*--------------
|
|
Labeled Icon
|
|
---------------*/
|
|
.ui.labeled.icon.buttons .button,
|
|
.ui.labeled.icon.button {
|
|
position: relative;
|
|
padding-left: 4.07142857em !important;
|
|
padding-right: 1.5em !important;
|
|
}
|
|
/* Left Labeled */
|
|
.ui.labeled.icon.buttons > .button > .icon,
|
|
.ui.labeled.icon.button > .icon {
|
|
position: absolute;
|
|
height: 100%;
|
|
line-height: 1;
|
|
border-radius: 0px;
|
|
border-top-left-radius: inherit;
|
|
border-bottom-left-radius: inherit;
|
|
text-align: center;
|
|
margin: 0em;
|
|
width: 2.57142857em;
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
color: '';
|
|
-webkit-box-shadow: -1px 0px 0px 0px transparent inset;
|
|
box-shadow: -1px 0px 0px 0px transparent inset;
|
|
}
|
|
/* Left Labeled */
|
|
.ui.labeled.icon.buttons > .button > .icon,
|
|
.ui.labeled.icon.button > .icon {
|
|
top: 0em;
|
|
left: 0em;
|
|
}
|
|
/* Right Labeled */
|
|
.ui[class*="right labeled"].icon.button {
|
|
padding-right: 4.07142857em !important;
|
|
padding-left: 1.5em !important;
|
|
}
|
|
.ui[class*="right labeled"].icon.button > .icon {
|
|
left: auto;
|
|
right: 0em;
|
|
border-radius: 0px;
|
|
border-top-right-radius: inherit;
|
|
border-bottom-right-radius: inherit;
|
|
-webkit-box-shadow: 1px 0px 0px 0px transparent inset;
|
|
box-shadow: 1px 0px 0px 0px transparent inset;
|
|
}
|
|
.ui.labeled.icon.buttons > .button > .icon:before,
|
|
.ui.labeled.icon.button > .icon:before,
|
|
.ui.labeled.icon.buttons > .button > .icon:after,
|
|
.ui.labeled.icon.button > .icon:after {
|
|
display: block;
|
|
position: absolute;
|
|
width: 100%;
|
|
top: 50%;
|
|
text-align: center;
|
|
-webkit-transform: translateY(-50%);
|
|
transform: translateY(-50%);
|
|
}
|
|
.ui.labeled.icon.buttons .button > .icon {
|
|
border-radius: 0em;
|
|
}
|
|
.ui.labeled.icon.buttons .button:first-child > .icon {
|
|
border-top-left-radius: 0.28571429rem;
|
|
border-bottom-left-radius: 0.28571429rem;
|
|
}
|
|
.ui.labeled.icon.buttons .button:last-child > .icon {
|
|
border-top-right-radius: 0.28571429rem;
|
|
border-bottom-right-radius: 0.28571429rem;
|
|
}
|
|
.ui.vertical.labeled.icon.buttons .button:first-child > .icon {
|
|
border-radius: 0em;
|
|
border-top-left-radius: 0.28571429rem;
|
|
}
|
|
.ui.vertical.labeled.icon.buttons .button:last-child > .icon {
|
|
border-radius: 0em;
|
|
border-bottom-left-radius: 0.28571429rem;
|
|
}
|
|
/* Fluid Labeled */
|
|
.ui.fluid[class*="left labeled"].icon.button,
|
|
.ui.fluid[class*="right labeled"].icon.button {
|
|
padding-left: 1.5em !important;
|
|
padding-right: 1.5em !important;
|
|
}
|
|
/*--------------
|
|
Toggle
|
|
---------------*/
|
|
/* Toggle (Modifies active state to give affordances) */
|
|
.ui.toggle.buttons .active.button,
|
|
.ui.buttons .button.toggle.active,
|
|
.ui.button.toggle.active {
|
|
background-color: #00ED00 !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
text-shadow: none;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.button.toggle.active:hover {
|
|
background-color: #00d400 !important;
|
|
text-shadow: none;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/*--------------
|
|
Circular
|
|
---------------*/
|
|
.ui.circular.button {
|
|
border-radius: 10em;
|
|
}
|
|
.ui.circular.button > .icon {
|
|
width: 1em;
|
|
vertical-align: baseline;
|
|
}
|
|
/*-------------------
|
|
Or Buttons
|
|
--------------------*/
|
|
.ui.buttons .or {
|
|
position: relative;
|
|
width: 0.3em;
|
|
height: 2.57142857em;
|
|
z-index: 3;
|
|
}
|
|
.ui.buttons .or:before {
|
|
position: absolute;
|
|
text-align: center;
|
|
border-radius: 500rem;
|
|
content: 'or';
|
|
top: 50%;
|
|
left: 50%;
|
|
background-color: #FFFFFF;
|
|
text-shadow: none;
|
|
margin-top: -0.89285714em;
|
|
margin-left: -0.89285714em;
|
|
width: 1.78571429em;
|
|
height: 1.78571429em;
|
|
line-height: 1.78571429em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
font-style: normal;
|
|
font-weight: bold;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent inset;
|
|
box-shadow: 0px 0px 0px 1px transparent inset;
|
|
}
|
|
.ui.buttons .or[data-text]:before {
|
|
content: attr(data-text);
|
|
}
|
|
/* Fluid Or */
|
|
.ui.fluid.buttons .or {
|
|
width: 0em !important;
|
|
}
|
|
.ui.fluid.buttons .or:after {
|
|
display: none;
|
|
}
|
|
/*-------------------
|
|
Attached
|
|
--------------------*/
|
|
/* Singular */
|
|
.ui.attached.button {
|
|
position: relative;
|
|
display: block;
|
|
margin: 0em;
|
|
border-radius: 0em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) !important;
|
|
box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) !important;
|
|
}
|
|
/* Top / Bottom */
|
|
.ui.attached.top.button {
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.attached.bottom.button {
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
/* Left / Right */
|
|
.ui.left.attached.button {
|
|
display: inline-block;
|
|
border-left: none;
|
|
text-align: right;
|
|
padding-right: 0.75em;
|
|
border-radius: 0.28571429rem 0em 0em 0.28571429rem;
|
|
}
|
|
.ui.right.attached.button {
|
|
display: inline-block;
|
|
text-align: left;
|
|
padding-left: 0.75em;
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
}
|
|
/* Plural */
|
|
.ui.attached.buttons {
|
|
position: relative;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
border-radius: 0em;
|
|
width: auto !important;
|
|
z-index: 2;
|
|
margin-left: -1px;
|
|
margin-right: -1px;
|
|
}
|
|
.ui.attached.buttons .button {
|
|
margin: 0em;
|
|
}
|
|
.ui.attached.buttons .button:first-child {
|
|
border-radius: 0em;
|
|
}
|
|
.ui.attached.buttons .button:last-child {
|
|
border-radius: 0em;
|
|
}
|
|
/* Top / Bottom */
|
|
.ui[class*="top attached"].buttons {
|
|
margin-bottom: -1px;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui[class*="top attached"].buttons .button:first-child {
|
|
border-radius: 0.28571429rem 0em 0em 0em;
|
|
}
|
|
.ui[class*="top attached"].buttons .button:last-child {
|
|
border-radius: 0em 0.28571429rem 0em 0em;
|
|
}
|
|
.ui[class*="bottom attached"].buttons {
|
|
margin-top: -1px;
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
.ui[class*="bottom attached"].buttons .button:first-child {
|
|
border-radius: 0em 0em 0em 0.28571429rem;
|
|
}
|
|
.ui[class*="bottom attached"].buttons .button:last-child {
|
|
border-radius: 0em 0em 0.28571429rem 0em;
|
|
}
|
|
/* Left / Right */
|
|
.ui[class*="left attached"].buttons {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
margin-right: 0em;
|
|
margin-left: -1px;
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
}
|
|
.ui[class*="left attached"].buttons .button:first-child {
|
|
margin-left: -1px;
|
|
border-radius: 0em 0.28571429rem 0em 0em;
|
|
}
|
|
.ui[class*="left attached"].buttons .button:last-child {
|
|
margin-left: -1px;
|
|
border-radius: 0em 0em 0.28571429rem 0em;
|
|
}
|
|
.ui[class*="right attached"].buttons {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
margin-left: 0em;
|
|
margin-right: -1px;
|
|
border-radius: 0.28571429rem 0em 0em 0.28571429rem;
|
|
}
|
|
.ui[class*="right attached"].buttons .button:first-child {
|
|
margin-left: -1px;
|
|
border-radius: 0.28571429rem 0em 0em 0em;
|
|
}
|
|
.ui[class*="right attached"].buttons .button:last-child {
|
|
margin-left: -1px;
|
|
border-radius: 0em 0em 0em 0.28571429rem;
|
|
}
|
|
/*-------------------
|
|
Fluid
|
|
--------------------*/
|
|
.ui.fluid.buttons,
|
|
.ui.fluid.button {
|
|
width: 100%;
|
|
}
|
|
.ui.fluid.button {
|
|
display: block;
|
|
}
|
|
.ui.two.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.two.buttons > .button {
|
|
width: 50%;
|
|
}
|
|
.ui.three.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.three.buttons > .button {
|
|
width: 33.333%;
|
|
}
|
|
.ui.four.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.four.buttons > .button {
|
|
width: 25%;
|
|
}
|
|
.ui.five.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.five.buttons > .button {
|
|
width: 20%;
|
|
}
|
|
.ui.six.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.six.buttons > .button {
|
|
width: 16.666%;
|
|
}
|
|
.ui.seven.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.seven.buttons > .button {
|
|
width: 14.285%;
|
|
}
|
|
.ui.eight.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.eight.buttons > .button {
|
|
width: 12.500%;
|
|
}
|
|
.ui.nine.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.nine.buttons > .button {
|
|
width: 11.11%;
|
|
}
|
|
.ui.ten.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.ten.buttons > .button {
|
|
width: 10%;
|
|
}
|
|
.ui.eleven.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.eleven.buttons > .button {
|
|
width: 9.09%;
|
|
}
|
|
.ui.twelve.buttons {
|
|
width: 100%;
|
|
}
|
|
.ui.twelve.buttons > .button {
|
|
width: 8.3333%;
|
|
}
|
|
/* Fluid Vertical Buttons */
|
|
.ui.fluid.vertical.buttons,
|
|
.ui.fluid.vertical.buttons > .button {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
width: auto;
|
|
}
|
|
.ui.two.vertical.buttons > .button {
|
|
height: 50%;
|
|
}
|
|
.ui.three.vertical.buttons > .button {
|
|
height: 33.333%;
|
|
}
|
|
.ui.four.vertical.buttons > .button {
|
|
height: 25%;
|
|
}
|
|
.ui.five.vertical.buttons > .button {
|
|
height: 20%;
|
|
}
|
|
.ui.six.vertical.buttons > .button {
|
|
height: 16.666%;
|
|
}
|
|
.ui.seven.vertical.buttons > .button {
|
|
height: 14.285%;
|
|
}
|
|
.ui.eight.vertical.buttons > .button {
|
|
height: 12.500%;
|
|
}
|
|
.ui.nine.vertical.buttons > .button {
|
|
height: 11.11%;
|
|
}
|
|
.ui.ten.vertical.buttons > .button {
|
|
height: 10%;
|
|
}
|
|
.ui.eleven.vertical.buttons > .button {
|
|
height: 9.09%;
|
|
}
|
|
.ui.twelve.vertical.buttons > .button {
|
|
height: 8.3333%;
|
|
}
|
|
/*-------------------
|
|
Colors
|
|
--------------------*/
|
|
/*--- Black ---*/
|
|
.ui.black.buttons .button,
|
|
.ui.black.button {
|
|
background-color: #1B1C1D;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.black.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.black.buttons .button:hover,
|
|
.ui.black.button:hover {
|
|
background-color: #27292a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.black.buttons .button:focus,
|
|
.ui.black.button:focus {
|
|
background-color: #2f3032;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.black.buttons .button:active,
|
|
.ui.black.button:active {
|
|
background-color: #343637;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.black.buttons .active.button,
|
|
.ui.black.buttons .active.button:active,
|
|
.ui.black.active.button,
|
|
.ui.black.button .active.button:active {
|
|
background-color: #0f0f10;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.black.buttons .button,
|
|
.ui.basic.black.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #1B1C1D inset !important;
|
|
box-shadow: 0px 0px 0px 1px #1B1C1D inset !important;
|
|
color: #1B1C1D !important;
|
|
}
|
|
.ui.basic.black.buttons .button:hover,
|
|
.ui.basic.black.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #27292a inset !important;
|
|
box-shadow: 0px 0px 0px 1px #27292a inset !important;
|
|
color: #27292a !important;
|
|
}
|
|
.ui.basic.black.buttons .button:focus,
|
|
.ui.basic.black.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #2f3032 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #2f3032 inset !important;
|
|
color: #27292a !important;
|
|
}
|
|
.ui.basic.black.buttons .active.button,
|
|
.ui.basic.black.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #0f0f10 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #0f0f10 inset !important;
|
|
color: #343637 !important;
|
|
}
|
|
.ui.basic.black.buttons .button:active,
|
|
.ui.basic.black.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #343637 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #343637 inset !important;
|
|
color: #343637 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.black.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.black.buttons .button,
|
|
.ui.inverted.black.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #D4D4D5 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #D4D4D5 inset !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.black.buttons .button:hover,
|
|
.ui.inverted.black.button:hover,
|
|
.ui.inverted.black.buttons .button:focus,
|
|
.ui.inverted.black.button:focus,
|
|
.ui.inverted.black.buttons .button.active,
|
|
.ui.inverted.black.button.active,
|
|
.ui.inverted.black.buttons .button:active,
|
|
.ui.inverted.black.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.black.buttons .button:hover,
|
|
.ui.inverted.black.button:hover {
|
|
background-color: #000000;
|
|
}
|
|
.ui.inverted.black.buttons .button:focus,
|
|
.ui.inverted.black.button:focus {
|
|
background-color: #000000;
|
|
}
|
|
.ui.inverted.black.buttons .active.button,
|
|
.ui.inverted.black.active.button {
|
|
background-color: #000000;
|
|
}
|
|
.ui.inverted.black.buttons .button:active,
|
|
.ui.inverted.black.button:active {
|
|
background-color: #000000;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.black.basic.buttons .button,
|
|
.ui.inverted.black.buttons .basic.button,
|
|
.ui.inverted.black.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.black.basic.buttons .button:hover,
|
|
.ui.inverted.black.buttons .basic.button:hover,
|
|
.ui.inverted.black.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #000000 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #000000 inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.black.basic.buttons .button:focus,
|
|
.ui.inverted.black.basic.buttons .button:focus,
|
|
.ui.inverted.black.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #000000 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #000000 inset !important;
|
|
color: #545454 !important;
|
|
}
|
|
.ui.inverted.black.basic.buttons .active.button,
|
|
.ui.inverted.black.buttons .basic.active.button,
|
|
.ui.inverted.black.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #000000 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #000000 inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.black.basic.buttons .button:active,
|
|
.ui.inverted.black.buttons .basic.button:active,
|
|
.ui.inverted.black.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #000000 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #000000 inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/*--- Grey ---*/
|
|
.ui.grey.buttons .button,
|
|
.ui.grey.button,
|
|
.ui.button.editortools-btn {
|
|
background-color: #95a5a6;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.grey.button,
|
|
.ui.button.editortools-btn {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.grey.buttons .button:hover,
|
|
.ui.grey.button:hover,
|
|
.ui.button.editortools-btn:hover {
|
|
background-color: #a3b1b2;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.grey.buttons .button:focus,
|
|
.ui.grey.button:focus,
|
|
.ui.button.editortools-btn:focus {
|
|
background-color: #abb8b9;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.grey.buttons .button:active,
|
|
.ui.grey.button:active,
|
|
.ui.button.editortools-btn:active {
|
|
background-color: #b1bdbd;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.grey.buttons .active.button,
|
|
.ui.grey.buttons .active.button:active,
|
|
.ui.grey.active.button,
|
|
.ui.grey.button .active.button:active,
|
|
.ui.button.editortools-btn .active.button:active {
|
|
background-color: #87999a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.grey.buttons .button,
|
|
.ui.basic.grey.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #95a5a6 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #95a5a6 inset !important;
|
|
color: #95a5a6 !important;
|
|
}
|
|
.ui.basic.grey.buttons .button:hover,
|
|
.ui.basic.grey.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #a3b1b2 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #a3b1b2 inset !important;
|
|
color: #a3b1b2 !important;
|
|
}
|
|
.ui.basic.grey.buttons .button:focus,
|
|
.ui.basic.grey.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #abb8b9 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #abb8b9 inset !important;
|
|
color: #a3b1b2 !important;
|
|
}
|
|
.ui.basic.grey.buttons .active.button,
|
|
.ui.basic.grey.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #87999a inset !important;
|
|
box-shadow: 0px 0px 0px 1px #87999a inset !important;
|
|
color: #b1bdbd !important;
|
|
}
|
|
.ui.basic.grey.buttons .button:active,
|
|
.ui.basic.grey.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #b1bdbd inset !important;
|
|
box-shadow: 0px 0px 0px 1px #b1bdbd inset !important;
|
|
color: #b1bdbd !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.grey.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.grey.buttons .button,
|
|
.ui.inverted.grey.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #D4D4D5 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #D4D4D5 inset !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.grey.buttons .button:hover,
|
|
.ui.inverted.grey.button:hover,
|
|
.ui.inverted.grey.buttons .button:focus,
|
|
.ui.inverted.grey.button:focus,
|
|
.ui.inverted.grey.buttons .button.active,
|
|
.ui.inverted.grey.button.active,
|
|
.ui.inverted.grey.buttons .button:active,
|
|
.ui.inverted.grey.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
.ui.inverted.grey.buttons .button:hover,
|
|
.ui.inverted.grey.button:hover {
|
|
background-color: #cfd0d2;
|
|
}
|
|
.ui.inverted.grey.buttons .button:focus,
|
|
.ui.inverted.grey.button:focus {
|
|
background-color: #c7c9cb;
|
|
}
|
|
.ui.inverted.grey.buttons .active.button,
|
|
.ui.inverted.grey.active.button {
|
|
background-color: #cfd0d2;
|
|
}
|
|
.ui.inverted.grey.buttons .button:active,
|
|
.ui.inverted.grey.button:active {
|
|
background-color: #c2c4c5;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.grey.basic.buttons .button,
|
|
.ui.inverted.grey.buttons .basic.button,
|
|
.ui.inverted.grey.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.grey.basic.buttons .button:hover,
|
|
.ui.inverted.grey.buttons .basic.button:hover,
|
|
.ui.inverted.grey.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #cfd0d2 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #cfd0d2 inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.grey.basic.buttons .button:focus,
|
|
.ui.inverted.grey.basic.buttons .button:focus,
|
|
.ui.inverted.grey.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #c7c9cb inset !important;
|
|
box-shadow: 0px 0px 0px 2px #c7c9cb inset !important;
|
|
color: #DCDDDE !important;
|
|
}
|
|
.ui.inverted.grey.basic.buttons .active.button,
|
|
.ui.inverted.grey.buttons .basic.active.button,
|
|
.ui.inverted.grey.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #cfd0d2 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #cfd0d2 inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.grey.basic.buttons .button:active,
|
|
.ui.inverted.grey.buttons .basic.button:active,
|
|
.ui.inverted.grey.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #c2c4c5 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #c2c4c5 inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/*--- Brown ---*/
|
|
.ui.brown.buttons .button,
|
|
.ui.brown.button {
|
|
background-color: #00BCF2;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.brown.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.brown.buttons .button:hover,
|
|
.ui.brown.button:hover {
|
|
background-color: #00a8d9;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.brown.buttons .button:focus,
|
|
.ui.brown.button:focus {
|
|
background-color: #009cc9;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.brown.buttons .button:active,
|
|
.ui.brown.button:active {
|
|
background-color: #0094bf;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.brown.buttons .active.button,
|
|
.ui.brown.buttons .active.button:active,
|
|
.ui.brown.active.button,
|
|
.ui.brown.button .active.button:active {
|
|
background-color: #00a8d9;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.brown.buttons .button,
|
|
.ui.basic.brown.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00BCF2 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00BCF2 inset !important;
|
|
color: #00BCF2 !important;
|
|
}
|
|
.ui.basic.brown.buttons .button:hover,
|
|
.ui.basic.brown.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00a8d9 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00a8d9 inset !important;
|
|
color: #00a8d9 !important;
|
|
}
|
|
.ui.basic.brown.buttons .button:focus,
|
|
.ui.basic.brown.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #009cc9 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #009cc9 inset !important;
|
|
color: #00a8d9 !important;
|
|
}
|
|
.ui.basic.brown.buttons .active.button,
|
|
.ui.basic.brown.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00a8d9 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00a8d9 inset !important;
|
|
color: #0094bf !important;
|
|
}
|
|
.ui.basic.brown.buttons .button:active,
|
|
.ui.basic.brown.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #0094bf inset !important;
|
|
box-shadow: 0px 0px 0px 1px #0094bf inset !important;
|
|
color: #0094bf !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.brown.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.brown.buttons .button,
|
|
.ui.inverted.brown.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #D67C1C inset !important;
|
|
box-shadow: 0px 0px 0px 2px #D67C1C inset !important;
|
|
color: #D67C1C;
|
|
}
|
|
.ui.inverted.brown.buttons .button:hover,
|
|
.ui.inverted.brown.button:hover,
|
|
.ui.inverted.brown.buttons .button:focus,
|
|
.ui.inverted.brown.button:focus,
|
|
.ui.inverted.brown.buttons .button.active,
|
|
.ui.inverted.brown.button.active,
|
|
.ui.inverted.brown.buttons .button:active,
|
|
.ui.inverted.brown.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.brown.buttons .button:hover,
|
|
.ui.inverted.brown.button:hover {
|
|
background-color: #c86f11;
|
|
}
|
|
.ui.inverted.brown.buttons .button:focus,
|
|
.ui.inverted.brown.button:focus {
|
|
background-color: #c16808;
|
|
}
|
|
.ui.inverted.brown.buttons .active.button,
|
|
.ui.inverted.brown.active.button {
|
|
background-color: #cc6f0d;
|
|
}
|
|
.ui.inverted.brown.buttons .button:active,
|
|
.ui.inverted.brown.button:active {
|
|
background-color: #a96216;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.brown.basic.buttons .button,
|
|
.ui.inverted.brown.buttons .basic.button,
|
|
.ui.inverted.brown.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.brown.basic.buttons .button:hover,
|
|
.ui.inverted.brown.buttons .basic.button:hover,
|
|
.ui.inverted.brown.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #c86f11 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #c86f11 inset !important;
|
|
color: #D67C1C !important;
|
|
}
|
|
.ui.inverted.brown.basic.buttons .button:focus,
|
|
.ui.inverted.brown.basic.buttons .button:focus,
|
|
.ui.inverted.brown.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #c16808 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #c16808 inset !important;
|
|
color: #D67C1C !important;
|
|
}
|
|
.ui.inverted.brown.basic.buttons .active.button,
|
|
.ui.inverted.brown.buttons .basic.active.button,
|
|
.ui.inverted.brown.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #cc6f0d inset !important;
|
|
box-shadow: 0px 0px 0px 2px #cc6f0d inset !important;
|
|
color: #D67C1C !important;
|
|
}
|
|
.ui.inverted.brown.basic.buttons .button:active,
|
|
.ui.inverted.brown.buttons .basic.button:active,
|
|
.ui.inverted.brown.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #a96216 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #a96216 inset !important;
|
|
color: #D67C1C !important;
|
|
}
|
|
/*--- Blue ---*/
|
|
.ui.blue.buttons .button,
|
|
.ui.blue.button,
|
|
.ui.button.editortools-btn,
|
|
.ui.button.exit-tutorial-btn {
|
|
background-color: #3454D1;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.blue.button,
|
|
.ui.button.editortools-btn,
|
|
.ui.button.exit-tutorial-btn {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.blue.buttons .button:hover,
|
|
.ui.blue.button:hover,
|
|
.ui.button.editortools-btn:hover,
|
|
.ui.button.exit-tutorial-btn:hover {
|
|
background-color: #2445c7;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.blue.buttons .button:focus,
|
|
.ui.blue.button:focus,
|
|
.ui.button.editortools-btn:focus,
|
|
.ui.button.exit-tutorial-btn:focus {
|
|
background-color: #1b3dc1;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.blue.buttons .button:active,
|
|
.ui.blue.button:active,
|
|
.ui.button.editortools-btn:active,
|
|
.ui.button.exit-tutorial-btn:active {
|
|
background-color: #2742ab;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.blue.buttons .active.button,
|
|
.ui.blue.buttons .active.button:active,
|
|
.ui.blue.active.button,
|
|
.ui.blue.button .active.button:active,
|
|
.ui.button.editortools-btn .active.button:active,
|
|
.ui.button.exit-tutorial-btn .active.button:active {
|
|
background-color: #2043cb;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.blue.buttons .button,
|
|
.ui.basic.blue.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #3454D1 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #3454D1 inset !important;
|
|
color: #3454D1 !important;
|
|
}
|
|
.ui.basic.blue.buttons .button:hover,
|
|
.ui.basic.blue.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #2445c7 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #2445c7 inset !important;
|
|
color: #2445c7 !important;
|
|
}
|
|
.ui.basic.blue.buttons .button:focus,
|
|
.ui.basic.blue.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #1b3dc1 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #1b3dc1 inset !important;
|
|
color: #2445c7 !important;
|
|
}
|
|
.ui.basic.blue.buttons .active.button,
|
|
.ui.basic.blue.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #2043cb inset !important;
|
|
box-shadow: 0px 0px 0px 1px #2043cb inset !important;
|
|
color: #2742ab !important;
|
|
}
|
|
.ui.basic.blue.buttons .button:active,
|
|
.ui.basic.blue.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #2742ab inset !important;
|
|
box-shadow: 0px 0px 0px 1px #2742ab inset !important;
|
|
color: #2742ab !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.blue.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.blue.buttons .button,
|
|
.ui.inverted.blue.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #54C8FF inset !important;
|
|
box-shadow: 0px 0px 0px 2px #54C8FF inset !important;
|
|
color: #54C8FF;
|
|
}
|
|
.ui.inverted.blue.buttons .button:hover,
|
|
.ui.inverted.blue.button:hover,
|
|
.ui.inverted.blue.buttons .button:focus,
|
|
.ui.inverted.blue.button:focus,
|
|
.ui.inverted.blue.buttons .button.active,
|
|
.ui.inverted.blue.button.active,
|
|
.ui.inverted.blue.buttons .button:active,
|
|
.ui.inverted.blue.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.blue.buttons .button:hover,
|
|
.ui.inverted.blue.button:hover {
|
|
background-color: #3ac0ff;
|
|
}
|
|
.ui.inverted.blue.buttons .button:focus,
|
|
.ui.inverted.blue.button:focus {
|
|
background-color: #2bbbff;
|
|
}
|
|
.ui.inverted.blue.buttons .active.button,
|
|
.ui.inverted.blue.active.button {
|
|
background-color: #3ac0ff;
|
|
}
|
|
.ui.inverted.blue.buttons .button:active,
|
|
.ui.inverted.blue.button:active {
|
|
background-color: #21b8ff;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.blue.basic.buttons .button,
|
|
.ui.inverted.blue.buttons .basic.button,
|
|
.ui.inverted.blue.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.blue.basic.buttons .button:hover,
|
|
.ui.inverted.blue.buttons .basic.button:hover,
|
|
.ui.inverted.blue.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #3ac0ff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #3ac0ff inset !important;
|
|
color: #54C8FF !important;
|
|
}
|
|
.ui.inverted.blue.basic.buttons .button:focus,
|
|
.ui.inverted.blue.basic.buttons .button:focus,
|
|
.ui.inverted.blue.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #2bbbff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #2bbbff inset !important;
|
|
color: #54C8FF !important;
|
|
}
|
|
.ui.inverted.blue.basic.buttons .active.button,
|
|
.ui.inverted.blue.buttons .basic.active.button,
|
|
.ui.inverted.blue.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #3ac0ff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #3ac0ff inset !important;
|
|
color: #54C8FF !important;
|
|
}
|
|
.ui.inverted.blue.basic.buttons .button:active,
|
|
.ui.inverted.blue.buttons .basic.button:active,
|
|
.ui.inverted.blue.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #21b8ff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #21b8ff inset !important;
|
|
color: #54C8FF !important;
|
|
}
|
|
/*--- Green ---*/
|
|
.ui.green.buttons .button,
|
|
.ui.green.button,
|
|
.ui.button.getting-started-btn,
|
|
.ui.button.download-button:hover {
|
|
background-color: #00ED00;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.green.button,
|
|
.ui.button.getting-started-btn,
|
|
.ui.button.download-button:hover {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.green.buttons .button:hover,
|
|
.ui.green.button:hover,
|
|
.ui.button.getting-started-btn:hover,
|
|
.ui.button.download-button:hover:hover {
|
|
background-color: #00d400;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.green.buttons .button:focus,
|
|
.ui.green.button:focus,
|
|
.ui.button.getting-started-btn:focus,
|
|
.ui.button.download-button:hover:focus {
|
|
background-color: #00c400;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.green.buttons .button:active,
|
|
.ui.green.button:active,
|
|
.ui.button.getting-started-btn:active,
|
|
.ui.button.download-button:hover:active {
|
|
background-color: #00ba00;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.green.buttons .active.button,
|
|
.ui.green.buttons .active.button:active,
|
|
.ui.green.active.button,
|
|
.ui.green.button .active.button:active,
|
|
.ui.button.getting-started-btn .active.button:active,
|
|
.ui.button.download-button:hover .active.button:active {
|
|
background-color: #00d400;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.green.buttons .button,
|
|
.ui.basic.green.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00ED00 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00ED00 inset !important;
|
|
color: #00ED00 !important;
|
|
}
|
|
.ui.basic.green.buttons .button:hover,
|
|
.ui.basic.green.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00d400 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00d400 inset !important;
|
|
color: #00d400 !important;
|
|
}
|
|
.ui.basic.green.buttons .button:focus,
|
|
.ui.basic.green.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00c400 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00c400 inset !important;
|
|
color: #00d400 !important;
|
|
}
|
|
.ui.basic.green.buttons .active.button,
|
|
.ui.basic.green.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00d400 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00d400 inset !important;
|
|
color: #00ba00 !important;
|
|
}
|
|
.ui.basic.green.buttons .button:active,
|
|
.ui.basic.green.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00ba00 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00ba00 inset !important;
|
|
color: #00ba00 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.green.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.green.buttons .button,
|
|
.ui.inverted.green.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #2ECC40 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #2ECC40 inset !important;
|
|
color: #2ECC40;
|
|
}
|
|
.ui.inverted.green.buttons .button:hover,
|
|
.ui.inverted.green.button:hover,
|
|
.ui.inverted.green.buttons .button:focus,
|
|
.ui.inverted.green.button:focus,
|
|
.ui.inverted.green.buttons .button.active,
|
|
.ui.inverted.green.button.active,
|
|
.ui.inverted.green.buttons .button:active,
|
|
.ui.inverted.green.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.green.buttons .button:hover,
|
|
.ui.inverted.green.button:hover {
|
|
background-color: #22be34;
|
|
}
|
|
.ui.inverted.green.buttons .button:focus,
|
|
.ui.inverted.green.button:focus {
|
|
background-color: #19b82b;
|
|
}
|
|
.ui.inverted.green.buttons .active.button,
|
|
.ui.inverted.green.active.button {
|
|
background-color: #1fc231;
|
|
}
|
|
.ui.inverted.green.buttons .button:active,
|
|
.ui.inverted.green.button:active {
|
|
background-color: #25a233;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.green.basic.buttons .button,
|
|
.ui.inverted.green.buttons .basic.button,
|
|
.ui.inverted.green.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.green.basic.buttons .button:hover,
|
|
.ui.inverted.green.buttons .basic.button:hover,
|
|
.ui.inverted.green.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #22be34 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #22be34 inset !important;
|
|
color: #2ECC40 !important;
|
|
}
|
|
.ui.inverted.green.basic.buttons .button:focus,
|
|
.ui.inverted.green.basic.buttons .button:focus,
|
|
.ui.inverted.green.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #19b82b inset !important;
|
|
box-shadow: 0px 0px 0px 2px #19b82b inset !important;
|
|
color: #2ECC40 !important;
|
|
}
|
|
.ui.inverted.green.basic.buttons .active.button,
|
|
.ui.inverted.green.buttons .basic.active.button,
|
|
.ui.inverted.green.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #1fc231 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #1fc231 inset !important;
|
|
color: #2ECC40 !important;
|
|
}
|
|
.ui.inverted.green.basic.buttons .button:active,
|
|
.ui.inverted.green.buttons .basic.button:active,
|
|
.ui.inverted.green.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #25a233 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #25a233 inset !important;
|
|
color: #2ECC40 !important;
|
|
}
|
|
/*--- Orange ---*/
|
|
.ui.orange.buttons .button,
|
|
.ui.orange.button,
|
|
.ui.button.getting-started-btn {
|
|
background-color: #ff8b27;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.orange.button,
|
|
.ui.button.getting-started-btn {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.orange.buttons .button:hover,
|
|
.ui.orange.button:hover,
|
|
.ui.button.getting-started-btn:hover {
|
|
background-color: #ff7d0d;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.orange.buttons .button:focus,
|
|
.ui.orange.button:focus,
|
|
.ui.button.getting-started-btn:focus {
|
|
background-color: #fd7500;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.orange.buttons .button:active,
|
|
.ui.orange.button:active,
|
|
.ui.button.getting-started-btn:active {
|
|
background-color: #f37000;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.orange.buttons .active.button,
|
|
.ui.orange.buttons .active.button:active,
|
|
.ui.orange.active.button,
|
|
.ui.orange.button .active.button:active,
|
|
.ui.button.getting-started-btn .active.button:active {
|
|
background-color: #ff7d0d;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.orange.buttons .button,
|
|
.ui.basic.orange.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ff8b27 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ff8b27 inset !important;
|
|
color: #ff8b27 !important;
|
|
}
|
|
.ui.basic.orange.buttons .button:hover,
|
|
.ui.basic.orange.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ff7d0d inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ff7d0d inset !important;
|
|
color: #ff7d0d !important;
|
|
}
|
|
.ui.basic.orange.buttons .button:focus,
|
|
.ui.basic.orange.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #fd7500 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #fd7500 inset !important;
|
|
color: #ff7d0d !important;
|
|
}
|
|
.ui.basic.orange.buttons .active.button,
|
|
.ui.basic.orange.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ff7d0d inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ff7d0d inset !important;
|
|
color: #f37000 !important;
|
|
}
|
|
.ui.basic.orange.buttons .button:active,
|
|
.ui.basic.orange.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #f37000 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #f37000 inset !important;
|
|
color: #f37000 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.orange.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.orange.buttons .button,
|
|
.ui.inverted.orange.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #FF851B inset !important;
|
|
box-shadow: 0px 0px 0px 2px #FF851B inset !important;
|
|
color: #FF851B;
|
|
}
|
|
.ui.inverted.orange.buttons .button:hover,
|
|
.ui.inverted.orange.button:hover,
|
|
.ui.inverted.orange.buttons .button:focus,
|
|
.ui.inverted.orange.button:focus,
|
|
.ui.inverted.orange.buttons .button.active,
|
|
.ui.inverted.orange.button.active,
|
|
.ui.inverted.orange.buttons .button:active,
|
|
.ui.inverted.orange.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.orange.buttons .button:hover,
|
|
.ui.inverted.orange.button:hover {
|
|
background-color: #ff7701;
|
|
}
|
|
.ui.inverted.orange.buttons .button:focus,
|
|
.ui.inverted.orange.button:focus {
|
|
background-color: #f17000;
|
|
}
|
|
.ui.inverted.orange.buttons .active.button,
|
|
.ui.inverted.orange.active.button {
|
|
background-color: #ff7701;
|
|
}
|
|
.ui.inverted.orange.buttons .button:active,
|
|
.ui.inverted.orange.button:active {
|
|
background-color: #e76b00;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.orange.basic.buttons .button,
|
|
.ui.inverted.orange.buttons .basic.button,
|
|
.ui.inverted.orange.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.orange.basic.buttons .button:hover,
|
|
.ui.inverted.orange.buttons .basic.button:hover,
|
|
.ui.inverted.orange.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff7701 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff7701 inset !important;
|
|
color: #FF851B !important;
|
|
}
|
|
.ui.inverted.orange.basic.buttons .button:focus,
|
|
.ui.inverted.orange.basic.buttons .button:focus,
|
|
.ui.inverted.orange.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #f17000 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #f17000 inset !important;
|
|
color: #FF851B !important;
|
|
}
|
|
.ui.inverted.orange.basic.buttons .active.button,
|
|
.ui.inverted.orange.buttons .basic.active.button,
|
|
.ui.inverted.orange.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff7701 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff7701 inset !important;
|
|
color: #FF851B !important;
|
|
}
|
|
.ui.inverted.orange.basic.buttons .button:active,
|
|
.ui.inverted.orange.buttons .basic.button:active,
|
|
.ui.inverted.orange.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e76b00 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #e76b00 inset !important;
|
|
color: #FF851B !important;
|
|
}
|
|
/*--- Pink ---*/
|
|
.ui.pink.buttons .button,
|
|
.ui.pink.button {
|
|
background-color: #F46197;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.pink.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.pink.buttons .button:hover,
|
|
.ui.pink.button:hover {
|
|
background-color: #fb4185;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.pink.buttons .button:focus,
|
|
.ui.pink.button:focus {
|
|
background-color: #ff2d7a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.pink.buttons .button:active,
|
|
.ui.pink.button:active {
|
|
background-color: #f13178;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.pink.buttons .active.button,
|
|
.ui.pink.buttons .active.button:active,
|
|
.ui.pink.active.button,
|
|
.ui.pink.button .active.button:active {
|
|
background-color: #ff3d84;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.pink.buttons .button,
|
|
.ui.basic.pink.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #F46197 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #F46197 inset !important;
|
|
color: #F46197 !important;
|
|
}
|
|
.ui.basic.pink.buttons .button:hover,
|
|
.ui.basic.pink.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #fb4185 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #fb4185 inset !important;
|
|
color: #fb4185 !important;
|
|
}
|
|
.ui.basic.pink.buttons .button:focus,
|
|
.ui.basic.pink.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ff2d7a inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ff2d7a inset !important;
|
|
color: #fb4185 !important;
|
|
}
|
|
.ui.basic.pink.buttons .active.button,
|
|
.ui.basic.pink.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ff3d84 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ff3d84 inset !important;
|
|
color: #f13178 !important;
|
|
}
|
|
.ui.basic.pink.buttons .button:active,
|
|
.ui.basic.pink.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #f13178 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #f13178 inset !important;
|
|
color: #f13178 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.pink.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.pink.buttons .button,
|
|
.ui.inverted.pink.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #FF8EDF inset !important;
|
|
box-shadow: 0px 0px 0px 2px #FF8EDF inset !important;
|
|
color: #FF8EDF;
|
|
}
|
|
.ui.inverted.pink.buttons .button:hover,
|
|
.ui.inverted.pink.button:hover,
|
|
.ui.inverted.pink.buttons .button:focus,
|
|
.ui.inverted.pink.button:focus,
|
|
.ui.inverted.pink.buttons .button.active,
|
|
.ui.inverted.pink.button.active,
|
|
.ui.inverted.pink.buttons .button:active,
|
|
.ui.inverted.pink.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.pink.buttons .button:hover,
|
|
.ui.inverted.pink.button:hover {
|
|
background-color: #ff74d8;
|
|
}
|
|
.ui.inverted.pink.buttons .button:focus,
|
|
.ui.inverted.pink.button:focus {
|
|
background-color: #ff65d3;
|
|
}
|
|
.ui.inverted.pink.buttons .active.button,
|
|
.ui.inverted.pink.active.button {
|
|
background-color: #ff74d8;
|
|
}
|
|
.ui.inverted.pink.buttons .button:active,
|
|
.ui.inverted.pink.button:active {
|
|
background-color: #ff5bd1;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.pink.basic.buttons .button,
|
|
.ui.inverted.pink.buttons .basic.button,
|
|
.ui.inverted.pink.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.pink.basic.buttons .button:hover,
|
|
.ui.inverted.pink.buttons .basic.button:hover,
|
|
.ui.inverted.pink.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff74d8 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff74d8 inset !important;
|
|
color: #FF8EDF !important;
|
|
}
|
|
.ui.inverted.pink.basic.buttons .button:focus,
|
|
.ui.inverted.pink.basic.buttons .button:focus,
|
|
.ui.inverted.pink.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff65d3 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff65d3 inset !important;
|
|
color: #FF8EDF !important;
|
|
}
|
|
.ui.inverted.pink.basic.buttons .active.button,
|
|
.ui.inverted.pink.buttons .basic.active.button,
|
|
.ui.inverted.pink.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff74d8 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff74d8 inset !important;
|
|
color: #FF8EDF !important;
|
|
}
|
|
.ui.inverted.pink.basic.buttons .button:active,
|
|
.ui.inverted.pink.buttons .basic.button:active,
|
|
.ui.inverted.pink.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff5bd1 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff5bd1 inset !important;
|
|
color: #FF8EDF !important;
|
|
}
|
|
/*--- Violet ---*/
|
|
.ui.violet.buttons .button,
|
|
.ui.violet.button {
|
|
background-color: #B4009E;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.violet.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.violet.buttons .button:hover,
|
|
.ui.violet.button:hover {
|
|
background-color: #9b0088;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.violet.buttons .button:focus,
|
|
.ui.violet.button:focus {
|
|
background-color: #8b007a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.violet.buttons .button:active,
|
|
.ui.violet.button:active {
|
|
background-color: #810071;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.violet.buttons .active.button,
|
|
.ui.violet.buttons .active.button:active,
|
|
.ui.violet.active.button,
|
|
.ui.violet.button .active.button:active {
|
|
background-color: #9b0088;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.violet.buttons .button,
|
|
.ui.basic.violet.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #B4009E inset !important;
|
|
box-shadow: 0px 0px 0px 1px #B4009E inset !important;
|
|
color: #B4009E !important;
|
|
}
|
|
.ui.basic.violet.buttons .button:hover,
|
|
.ui.basic.violet.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #9b0088 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #9b0088 inset !important;
|
|
color: #9b0088 !important;
|
|
}
|
|
.ui.basic.violet.buttons .button:focus,
|
|
.ui.basic.violet.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #8b007a inset !important;
|
|
box-shadow: 0px 0px 0px 1px #8b007a inset !important;
|
|
color: #9b0088 !important;
|
|
}
|
|
.ui.basic.violet.buttons .active.button,
|
|
.ui.basic.violet.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #9b0088 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #9b0088 inset !important;
|
|
color: #810071 !important;
|
|
}
|
|
.ui.basic.violet.buttons .button:active,
|
|
.ui.basic.violet.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #810071 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #810071 inset !important;
|
|
color: #810071 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.violet.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.violet.buttons .button,
|
|
.ui.inverted.violet.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #A291FB inset !important;
|
|
box-shadow: 0px 0px 0px 2px #A291FB inset !important;
|
|
color: #A291FB;
|
|
}
|
|
.ui.inverted.violet.buttons .button:hover,
|
|
.ui.inverted.violet.button:hover,
|
|
.ui.inverted.violet.buttons .button:focus,
|
|
.ui.inverted.violet.button:focus,
|
|
.ui.inverted.violet.buttons .button.active,
|
|
.ui.inverted.violet.button.active,
|
|
.ui.inverted.violet.buttons .button:active,
|
|
.ui.inverted.violet.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.violet.buttons .button:hover,
|
|
.ui.inverted.violet.button:hover {
|
|
background-color: #8a73ff;
|
|
}
|
|
.ui.inverted.violet.buttons .button:focus,
|
|
.ui.inverted.violet.button:focus {
|
|
background-color: #7d64ff;
|
|
}
|
|
.ui.inverted.violet.buttons .active.button,
|
|
.ui.inverted.violet.active.button {
|
|
background-color: #8a73ff;
|
|
}
|
|
.ui.inverted.violet.buttons .button:active,
|
|
.ui.inverted.violet.button:active {
|
|
background-color: #7860f9;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.violet.basic.buttons .button,
|
|
.ui.inverted.violet.buttons .basic.button,
|
|
.ui.inverted.violet.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.violet.basic.buttons .button:hover,
|
|
.ui.inverted.violet.buttons .basic.button:hover,
|
|
.ui.inverted.violet.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #8a73ff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #8a73ff inset !important;
|
|
color: #A291FB !important;
|
|
}
|
|
.ui.inverted.violet.basic.buttons .button:focus,
|
|
.ui.inverted.violet.basic.buttons .button:focus,
|
|
.ui.inverted.violet.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #7d64ff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #7d64ff inset !important;
|
|
color: #A291FB !important;
|
|
}
|
|
.ui.inverted.violet.basic.buttons .active.button,
|
|
.ui.inverted.violet.buttons .basic.active.button,
|
|
.ui.inverted.violet.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #8a73ff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #8a73ff inset !important;
|
|
color: #A291FB !important;
|
|
}
|
|
.ui.inverted.violet.basic.buttons .button:active,
|
|
.ui.inverted.violet.buttons .basic.button:active,
|
|
.ui.inverted.violet.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #7860f9 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #7860f9 inset !important;
|
|
color: #A291FB !important;
|
|
}
|
|
/*--- Purple ---*/
|
|
.ui.purple.buttons .button,
|
|
.ui.purple.button,
|
|
.ui.button.download-button {
|
|
background-color: #6633cc;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.purple.button,
|
|
.ui.button.download-button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.purple.buttons .button:hover,
|
|
.ui.purple.button:hover,
|
|
.ui.button.download-button:hover {
|
|
background-color: #5a27be;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.purple.buttons .button:focus,
|
|
.ui.purple.button:focus,
|
|
.ui.button.download-button:focus {
|
|
background-color: #511eb8;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.purple.buttons .button:active,
|
|
.ui.purple.button:active,
|
|
.ui.button.download-button:active {
|
|
background-color: #5229a3;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.purple.buttons .active.button,
|
|
.ui.purple.buttons .active.button:active,
|
|
.ui.purple.active.button,
|
|
.ui.purple.button .active.button:active,
|
|
.ui.button.download-button .active.button:active {
|
|
background-color: #5824c2;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.purple.buttons .button,
|
|
.ui.basic.purple.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #6633cc inset !important;
|
|
box-shadow: 0px 0px 0px 1px #6633cc inset !important;
|
|
color: #6633cc !important;
|
|
}
|
|
.ui.basic.purple.buttons .button:hover,
|
|
.ui.basic.purple.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #5a27be inset !important;
|
|
box-shadow: 0px 0px 0px 1px #5a27be inset !important;
|
|
color: #5a27be !important;
|
|
}
|
|
.ui.basic.purple.buttons .button:focus,
|
|
.ui.basic.purple.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #511eb8 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #511eb8 inset !important;
|
|
color: #5a27be !important;
|
|
}
|
|
.ui.basic.purple.buttons .active.button,
|
|
.ui.basic.purple.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #5824c2 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #5824c2 inset !important;
|
|
color: #5229a3 !important;
|
|
}
|
|
.ui.basic.purple.buttons .button:active,
|
|
.ui.basic.purple.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #5229a3 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #5229a3 inset !important;
|
|
color: #5229a3 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.purple.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.purple.buttons .button,
|
|
.ui.inverted.purple.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #DC73FF inset !important;
|
|
box-shadow: 0px 0px 0px 2px #DC73FF inset !important;
|
|
color: #DC73FF;
|
|
}
|
|
.ui.inverted.purple.buttons .button:hover,
|
|
.ui.inverted.purple.button:hover,
|
|
.ui.inverted.purple.buttons .button:focus,
|
|
.ui.inverted.purple.button:focus,
|
|
.ui.inverted.purple.buttons .button.active,
|
|
.ui.inverted.purple.button.active,
|
|
.ui.inverted.purple.buttons .button:active,
|
|
.ui.inverted.purple.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.purple.buttons .button:hover,
|
|
.ui.inverted.purple.button:hover {
|
|
background-color: #d65aff;
|
|
}
|
|
.ui.inverted.purple.buttons .button:focus,
|
|
.ui.inverted.purple.button:focus {
|
|
background-color: #d24aff;
|
|
}
|
|
.ui.inverted.purple.buttons .active.button,
|
|
.ui.inverted.purple.active.button {
|
|
background-color: #d65aff;
|
|
}
|
|
.ui.inverted.purple.buttons .button:active,
|
|
.ui.inverted.purple.button:active {
|
|
background-color: #cf40ff;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.purple.basic.buttons .button,
|
|
.ui.inverted.purple.buttons .basic.button,
|
|
.ui.inverted.purple.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.purple.basic.buttons .button:hover,
|
|
.ui.inverted.purple.buttons .basic.button:hover,
|
|
.ui.inverted.purple.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #d65aff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #d65aff inset !important;
|
|
color: #DC73FF !important;
|
|
}
|
|
.ui.inverted.purple.basic.buttons .button:focus,
|
|
.ui.inverted.purple.basic.buttons .button:focus,
|
|
.ui.inverted.purple.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #d24aff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #d24aff inset !important;
|
|
color: #DC73FF !important;
|
|
}
|
|
.ui.inverted.purple.basic.buttons .active.button,
|
|
.ui.inverted.purple.buttons .basic.active.button,
|
|
.ui.inverted.purple.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #d65aff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #d65aff inset !important;
|
|
color: #DC73FF !important;
|
|
}
|
|
.ui.inverted.purple.basic.buttons .button:active,
|
|
.ui.inverted.purple.buttons .basic.button:active,
|
|
.ui.inverted.purple.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #cf40ff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #cf40ff inset !important;
|
|
color: #DC73FF !important;
|
|
}
|
|
/*--- Red ---*/
|
|
.ui.red.buttons .button,
|
|
.ui.red.button {
|
|
background-color: #EF767A;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.red.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.red.buttons .button:hover,
|
|
.ui.red.button:hover {
|
|
background-color: #f3585d;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.red.buttons .button:focus,
|
|
.ui.red.button:focus {
|
|
background-color: #fa4248;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.red.buttons .button:active,
|
|
.ui.red.button:active {
|
|
background-color: #ea484e;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.red.buttons .active.button,
|
|
.ui.red.buttons .active.button:active,
|
|
.ui.red.active.button,
|
|
.ui.red.button .active.button:active {
|
|
background-color: #f7555a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.red.buttons .button,
|
|
.ui.basic.red.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #EF767A inset !important;
|
|
box-shadow: 0px 0px 0px 1px #EF767A inset !important;
|
|
color: #EF767A !important;
|
|
}
|
|
.ui.basic.red.buttons .button:hover,
|
|
.ui.basic.red.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #f3585d inset !important;
|
|
box-shadow: 0px 0px 0px 1px #f3585d inset !important;
|
|
color: #f3585d !important;
|
|
}
|
|
.ui.basic.red.buttons .button:focus,
|
|
.ui.basic.red.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #fa4248 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #fa4248 inset !important;
|
|
color: #f3585d !important;
|
|
}
|
|
.ui.basic.red.buttons .active.button,
|
|
.ui.basic.red.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #f7555a inset !important;
|
|
box-shadow: 0px 0px 0px 1px #f7555a inset !important;
|
|
color: #ea484e !important;
|
|
}
|
|
.ui.basic.red.buttons .button:active,
|
|
.ui.basic.red.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ea484e inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ea484e inset !important;
|
|
color: #ea484e !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.red.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.red.buttons .button,
|
|
.ui.inverted.red.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #FF695E inset !important;
|
|
box-shadow: 0px 0px 0px 2px #FF695E inset !important;
|
|
color: #FF695E;
|
|
}
|
|
.ui.inverted.red.buttons .button:hover,
|
|
.ui.inverted.red.button:hover,
|
|
.ui.inverted.red.buttons .button:focus,
|
|
.ui.inverted.red.button:focus,
|
|
.ui.inverted.red.buttons .button.active,
|
|
.ui.inverted.red.button.active,
|
|
.ui.inverted.red.buttons .button:active,
|
|
.ui.inverted.red.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.red.buttons .button:hover,
|
|
.ui.inverted.red.button:hover {
|
|
background-color: #ff5144;
|
|
}
|
|
.ui.inverted.red.buttons .button:focus,
|
|
.ui.inverted.red.button:focus {
|
|
background-color: #ff4335;
|
|
}
|
|
.ui.inverted.red.buttons .active.button,
|
|
.ui.inverted.red.active.button {
|
|
background-color: #ff5144;
|
|
}
|
|
.ui.inverted.red.buttons .button:active,
|
|
.ui.inverted.red.button:active {
|
|
background-color: #ff392b;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.red.basic.buttons .button,
|
|
.ui.inverted.red.buttons .basic.button,
|
|
.ui.inverted.red.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.red.basic.buttons .button:hover,
|
|
.ui.inverted.red.buttons .basic.button:hover,
|
|
.ui.inverted.red.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff5144 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff5144 inset !important;
|
|
color: #FF695E !important;
|
|
}
|
|
.ui.inverted.red.basic.buttons .button:focus,
|
|
.ui.inverted.red.basic.buttons .button:focus,
|
|
.ui.inverted.red.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff4335 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff4335 inset !important;
|
|
color: #FF695E !important;
|
|
}
|
|
.ui.inverted.red.basic.buttons .active.button,
|
|
.ui.inverted.red.buttons .basic.active.button,
|
|
.ui.inverted.red.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff5144 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff5144 inset !important;
|
|
color: #FF695E !important;
|
|
}
|
|
.ui.inverted.red.basic.buttons .button:active,
|
|
.ui.inverted.red.buttons .basic.button:active,
|
|
.ui.inverted.red.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ff392b inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ff392b inset !important;
|
|
color: #FF695E !important;
|
|
}
|
|
/*--- Teal ---*/
|
|
.ui.teal.buttons .button,
|
|
.ui.teal.button {
|
|
background-color: #3891A6;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.teal.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.teal.buttons .button:hover,
|
|
.ui.teal.button:hover {
|
|
background-color: #2d8398;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.teal.buttons .button:focus,
|
|
.ui.teal.button:focus {
|
|
background-color: #257c90;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.teal.buttons .button:active,
|
|
.ui.teal.button:active {
|
|
background-color: #2b7080;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.teal.buttons .active.button,
|
|
.ui.teal.buttons .active.button:active,
|
|
.ui.teal.active.button,
|
|
.ui.teal.button .active.button:active {
|
|
background-color: #2a859a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.teal.buttons .button,
|
|
.ui.basic.teal.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #3891A6 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #3891A6 inset !important;
|
|
color: #3891A6 !important;
|
|
}
|
|
.ui.basic.teal.buttons .button:hover,
|
|
.ui.basic.teal.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #2d8398 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #2d8398 inset !important;
|
|
color: #2d8398 !important;
|
|
}
|
|
.ui.basic.teal.buttons .button:focus,
|
|
.ui.basic.teal.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #257c90 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #257c90 inset !important;
|
|
color: #2d8398 !important;
|
|
}
|
|
.ui.basic.teal.buttons .active.button,
|
|
.ui.basic.teal.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #2a859a inset !important;
|
|
box-shadow: 0px 0px 0px 1px #2a859a inset !important;
|
|
color: #2b7080 !important;
|
|
}
|
|
.ui.basic.teal.buttons .button:active,
|
|
.ui.basic.teal.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #2b7080 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #2b7080 inset !important;
|
|
color: #2b7080 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.teal.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.teal.buttons .button,
|
|
.ui.inverted.teal.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #6DFFFF inset !important;
|
|
box-shadow: 0px 0px 0px 2px #6DFFFF inset !important;
|
|
color: #6DFFFF;
|
|
}
|
|
.ui.inverted.teal.buttons .button:hover,
|
|
.ui.inverted.teal.button:hover,
|
|
.ui.inverted.teal.buttons .button:focus,
|
|
.ui.inverted.teal.button:focus,
|
|
.ui.inverted.teal.buttons .button.active,
|
|
.ui.inverted.teal.button.active,
|
|
.ui.inverted.teal.buttons .button:active,
|
|
.ui.inverted.teal.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
.ui.inverted.teal.buttons .button:hover,
|
|
.ui.inverted.teal.button:hover {
|
|
background-color: #54ffff;
|
|
}
|
|
.ui.inverted.teal.buttons .button:focus,
|
|
.ui.inverted.teal.button:focus {
|
|
background-color: #44ffff;
|
|
}
|
|
.ui.inverted.teal.buttons .active.button,
|
|
.ui.inverted.teal.active.button {
|
|
background-color: #54ffff;
|
|
}
|
|
.ui.inverted.teal.buttons .button:active,
|
|
.ui.inverted.teal.button:active {
|
|
background-color: #3affff;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.teal.basic.buttons .button,
|
|
.ui.inverted.teal.buttons .basic.button,
|
|
.ui.inverted.teal.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.teal.basic.buttons .button:hover,
|
|
.ui.inverted.teal.buttons .basic.button:hover,
|
|
.ui.inverted.teal.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #54ffff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #54ffff inset !important;
|
|
color: #6DFFFF !important;
|
|
}
|
|
.ui.inverted.teal.basic.buttons .button:focus,
|
|
.ui.inverted.teal.basic.buttons .button:focus,
|
|
.ui.inverted.teal.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #44ffff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #44ffff inset !important;
|
|
color: #6DFFFF !important;
|
|
}
|
|
.ui.inverted.teal.basic.buttons .active.button,
|
|
.ui.inverted.teal.buttons .basic.active.button,
|
|
.ui.inverted.teal.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #54ffff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #54ffff inset !important;
|
|
color: #6DFFFF !important;
|
|
}
|
|
.ui.inverted.teal.basic.buttons .button:active,
|
|
.ui.inverted.teal.buttons .basic.button:active,
|
|
.ui.inverted.teal.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #3affff inset !important;
|
|
box-shadow: 0px 0px 0px 2px #3affff inset !important;
|
|
color: #6DFFFF !important;
|
|
}
|
|
/*--- Olive ---*/
|
|
.ui.olive.buttons .button,
|
|
.ui.olive.button {
|
|
background-color: #B5CC18;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.olive.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.olive.buttons .button:hover,
|
|
.ui.olive.button:hover {
|
|
background-color: #a7bd0d;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.olive.buttons .button:focus,
|
|
.ui.olive.button:focus {
|
|
background-color: #a0b605;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.olive.buttons .button:active,
|
|
.ui.olive.button:active {
|
|
background-color: #8d9e13;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.olive.buttons .active.button,
|
|
.ui.olive.buttons .active.button:active,
|
|
.ui.olive.active.button,
|
|
.ui.olive.button .active.button:active {
|
|
background-color: #aac109;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.olive.buttons .button,
|
|
.ui.basic.olive.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #B5CC18 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #B5CC18 inset !important;
|
|
color: #B5CC18 !important;
|
|
}
|
|
.ui.basic.olive.buttons .button:hover,
|
|
.ui.basic.olive.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #a7bd0d inset !important;
|
|
box-shadow: 0px 0px 0px 1px #a7bd0d inset !important;
|
|
color: #a7bd0d !important;
|
|
}
|
|
.ui.basic.olive.buttons .button:focus,
|
|
.ui.basic.olive.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #a0b605 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #a0b605 inset !important;
|
|
color: #a7bd0d !important;
|
|
}
|
|
.ui.basic.olive.buttons .active.button,
|
|
.ui.basic.olive.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #aac109 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #aac109 inset !important;
|
|
color: #8d9e13 !important;
|
|
}
|
|
.ui.basic.olive.buttons .button:active,
|
|
.ui.basic.olive.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #8d9e13 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #8d9e13 inset !important;
|
|
color: #8d9e13 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.olive.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.olive.buttons .button,
|
|
.ui.inverted.olive.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #D9E778 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #D9E778 inset !important;
|
|
color: #D9E778;
|
|
}
|
|
.ui.inverted.olive.buttons .button:hover,
|
|
.ui.inverted.olive.button:hover,
|
|
.ui.inverted.olive.buttons .button:focus,
|
|
.ui.inverted.olive.button:focus,
|
|
.ui.inverted.olive.buttons .button.active,
|
|
.ui.inverted.olive.button.active,
|
|
.ui.inverted.olive.buttons .button:active,
|
|
.ui.inverted.olive.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
.ui.inverted.olive.buttons .button:hover,
|
|
.ui.inverted.olive.button:hover {
|
|
background-color: #d8ea5c;
|
|
}
|
|
.ui.inverted.olive.buttons .button:focus,
|
|
.ui.inverted.olive.button:focus {
|
|
background-color: #daef47;
|
|
}
|
|
.ui.inverted.olive.buttons .active.button,
|
|
.ui.inverted.olive.active.button {
|
|
background-color: #daed59;
|
|
}
|
|
.ui.inverted.olive.buttons .button:active,
|
|
.ui.inverted.olive.button:active {
|
|
background-color: #cddf4d;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.olive.basic.buttons .button,
|
|
.ui.inverted.olive.buttons .basic.button,
|
|
.ui.inverted.olive.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.olive.basic.buttons .button:hover,
|
|
.ui.inverted.olive.buttons .basic.button:hover,
|
|
.ui.inverted.olive.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #d8ea5c inset !important;
|
|
box-shadow: 0px 0px 0px 2px #d8ea5c inset !important;
|
|
color: #D9E778 !important;
|
|
}
|
|
.ui.inverted.olive.basic.buttons .button:focus,
|
|
.ui.inverted.olive.basic.buttons .button:focus,
|
|
.ui.inverted.olive.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #daef47 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #daef47 inset !important;
|
|
color: #D9E778 !important;
|
|
}
|
|
.ui.inverted.olive.basic.buttons .active.button,
|
|
.ui.inverted.olive.buttons .basic.active.button,
|
|
.ui.inverted.olive.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #daed59 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #daed59 inset !important;
|
|
color: #D9E778 !important;
|
|
}
|
|
.ui.inverted.olive.basic.buttons .button:active,
|
|
.ui.inverted.olive.buttons .basic.button:active,
|
|
.ui.inverted.olive.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #cddf4d inset !important;
|
|
box-shadow: 0px 0px 0px 2px #cddf4d inset !important;
|
|
color: #D9E778 !important;
|
|
}
|
|
/*--- Yellow ---*/
|
|
.ui.yellow.buttons .button,
|
|
.ui.yellow.button {
|
|
background-color: #FDE74C;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.yellow.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.yellow.buttons .button:hover,
|
|
.ui.yellow.button:hover {
|
|
background-color: #ffe531;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.yellow.buttons .button:focus,
|
|
.ui.yellow.button:focus {
|
|
background-color: #ffe321;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.yellow.buttons .button:active,
|
|
.ui.yellow.button:active {
|
|
background-color: #fce01a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.yellow.buttons .active.button,
|
|
.ui.yellow.buttons .active.button:active,
|
|
.ui.yellow.active.button,
|
|
.ui.yellow.button .active.button:active {
|
|
background-color: #ffe531;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.yellow.buttons .button,
|
|
.ui.basic.yellow.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #FDE74C inset !important;
|
|
box-shadow: 0px 0px 0px 1px #FDE74C inset !important;
|
|
color: #FDE74C !important;
|
|
}
|
|
.ui.basic.yellow.buttons .button:hover,
|
|
.ui.basic.yellow.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ffe531 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ffe531 inset !important;
|
|
color: #ffe531 !important;
|
|
}
|
|
.ui.basic.yellow.buttons .button:focus,
|
|
.ui.basic.yellow.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ffe321 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ffe321 inset !important;
|
|
color: #ffe531 !important;
|
|
}
|
|
.ui.basic.yellow.buttons .active.button,
|
|
.ui.basic.yellow.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ffe531 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ffe531 inset !important;
|
|
color: #fce01a !important;
|
|
}
|
|
.ui.basic.yellow.buttons .button:active,
|
|
.ui.basic.yellow.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #fce01a inset !important;
|
|
box-shadow: 0px 0px 0px 1px #fce01a inset !important;
|
|
color: #fce01a !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.yellow.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.yellow.buttons .button,
|
|
.ui.inverted.yellow.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px #FFE21F inset !important;
|
|
box-shadow: 0px 0px 0px 2px #FFE21F inset !important;
|
|
color: #FFE21F;
|
|
}
|
|
.ui.inverted.yellow.buttons .button:hover,
|
|
.ui.inverted.yellow.button:hover,
|
|
.ui.inverted.yellow.buttons .button:focus,
|
|
.ui.inverted.yellow.button:focus,
|
|
.ui.inverted.yellow.buttons .button.active,
|
|
.ui.inverted.yellow.button.active,
|
|
.ui.inverted.yellow.buttons .button:active,
|
|
.ui.inverted.yellow.button:active {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
.ui.inverted.yellow.buttons .button:hover,
|
|
.ui.inverted.yellow.button:hover {
|
|
background-color: #ffdf05;
|
|
}
|
|
.ui.inverted.yellow.buttons .button:focus,
|
|
.ui.inverted.yellow.button:focus {
|
|
background-color: #f5d500;
|
|
}
|
|
.ui.inverted.yellow.buttons .active.button,
|
|
.ui.inverted.yellow.active.button {
|
|
background-color: #ffdf05;
|
|
}
|
|
.ui.inverted.yellow.buttons .button:active,
|
|
.ui.inverted.yellow.button:active {
|
|
background-color: #ebcd00;
|
|
}
|
|
/* Inverted Basic */
|
|
.ui.inverted.yellow.basic.buttons .button,
|
|
.ui.inverted.yellow.buttons .basic.button,
|
|
.ui.inverted.yellow.basic.button {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.yellow.basic.buttons .button:hover,
|
|
.ui.inverted.yellow.buttons .basic.button:hover,
|
|
.ui.inverted.yellow.basic.button:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ffdf05 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ffdf05 inset !important;
|
|
color: #FFE21F !important;
|
|
}
|
|
.ui.inverted.yellow.basic.buttons .button:focus,
|
|
.ui.inverted.yellow.basic.buttons .button:focus,
|
|
.ui.inverted.yellow.basic.button:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #f5d500 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #f5d500 inset !important;
|
|
color: #FFE21F !important;
|
|
}
|
|
.ui.inverted.yellow.basic.buttons .active.button,
|
|
.ui.inverted.yellow.buttons .basic.active.button,
|
|
.ui.inverted.yellow.basic.active.button {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ffdf05 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ffdf05 inset !important;
|
|
color: #FFE21F !important;
|
|
}
|
|
.ui.inverted.yellow.basic.buttons .button:active,
|
|
.ui.inverted.yellow.buttons .basic.button:active,
|
|
.ui.inverted.yellow.basic.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #ebcd00 inset !important;
|
|
box-shadow: 0px 0px 0px 2px #ebcd00 inset !important;
|
|
color: #FFE21F !important;
|
|
}
|
|
/*-------------------
|
|
Primary
|
|
--------------------*/
|
|
/*--- Standard ---*/
|
|
.ui.primary.buttons .button,
|
|
.ui.primary.button {
|
|
background-color: #6633cc;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.primary.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.primary.buttons .button:hover,
|
|
.ui.primary.button:hover {
|
|
background-color: #5a27be;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.primary.buttons .button:focus,
|
|
.ui.primary.button:focus {
|
|
background-color: #511eb8;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.primary.buttons .button:active,
|
|
.ui.primary.button:active {
|
|
background-color: #5229a3;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.primary.buttons .active.button,
|
|
.ui.primary.buttons .active.button:active,
|
|
.ui.primary.active.button,
|
|
.ui.primary.button .active.button:active {
|
|
background-color: #5824c2;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.primary.buttons .button,
|
|
.ui.basic.primary.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #6633cc inset !important;
|
|
box-shadow: 0px 0px 0px 1px #6633cc inset !important;
|
|
color: #6633cc !important;
|
|
}
|
|
.ui.basic.primary.buttons .button:hover,
|
|
.ui.basic.primary.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #5a27be inset !important;
|
|
box-shadow: 0px 0px 0px 1px #5a27be inset !important;
|
|
color: #5a27be !important;
|
|
}
|
|
.ui.basic.primary.buttons .button:focus,
|
|
.ui.basic.primary.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #511eb8 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #511eb8 inset !important;
|
|
color: #5a27be !important;
|
|
}
|
|
.ui.basic.primary.buttons .active.button,
|
|
.ui.basic.primary.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #5824c2 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #5824c2 inset !important;
|
|
color: #5229a3 !important;
|
|
}
|
|
.ui.basic.primary.buttons .button:active,
|
|
.ui.basic.primary.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #5229a3 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #5229a3 inset !important;
|
|
color: #5229a3 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.primary.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/*-------------------
|
|
Secondary
|
|
--------------------*/
|
|
/* Standard */
|
|
.ui.secondary.buttons .button,
|
|
.ui.secondary.button {
|
|
background-color: #95a5a6;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.secondary.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.secondary.buttons .button:hover,
|
|
.ui.secondary.button:hover {
|
|
background-color: #a2b1b2;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.secondary.buttons .button:focus,
|
|
.ui.secondary.button:focus {
|
|
background-color: #aab9ba;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.secondary.buttons .button:active,
|
|
.ui.secondary.button:active {
|
|
background-color: #b1bdbd;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.secondary.buttons .active.button,
|
|
.ui.secondary.buttons .active.button:active,
|
|
.ui.secondary.active.button,
|
|
.ui.secondary.button .active.button:active {
|
|
background-color: #a2b2b3;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.secondary.buttons .button,
|
|
.ui.basic.secondary.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #95a5a6 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #95a5a6 inset !important;
|
|
color: #95a5a6 !important;
|
|
}
|
|
.ui.basic.secondary.buttons .button:hover,
|
|
.ui.basic.secondary.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #a2b1b2 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #a2b1b2 inset !important;
|
|
color: #a2b1b2 !important;
|
|
}
|
|
.ui.basic.secondary.buttons .button:focus,
|
|
.ui.basic.secondary.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #aab9ba inset !important;
|
|
box-shadow: 0px 0px 0px 1px #aab9ba inset !important;
|
|
color: #a2b1b2 !important;
|
|
}
|
|
.ui.basic.secondary.buttons .active.button,
|
|
.ui.basic.secondary.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #a2b2b3 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #a2b2b3 inset !important;
|
|
color: #b1bdbd !important;
|
|
}
|
|
.ui.basic.secondary.buttons .button:active,
|
|
.ui.basic.secondary.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #b1bdbd inset !important;
|
|
box-shadow: 0px 0px 0px 1px #b1bdbd inset !important;
|
|
color: #b1bdbd !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.primary.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/*---------------
|
|
Positive
|
|
----------------*/
|
|
/* Standard */
|
|
.ui.positive.buttons .button,
|
|
.ui.positive.button {
|
|
background-color: #00ED00;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.positive.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.positive.buttons .button:hover,
|
|
.ui.positive.button:hover {
|
|
background-color: #00d400;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.positive.buttons .button:focus,
|
|
.ui.positive.button:focus {
|
|
background-color: #00c400;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.positive.buttons .button:active,
|
|
.ui.positive.button:active {
|
|
background-color: #00ba00;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.positive.buttons .active.button,
|
|
.ui.positive.buttons .active.button:active,
|
|
.ui.positive.active.button,
|
|
.ui.positive.button .active.button:active {
|
|
background-color: #00d400;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.positive.buttons .button,
|
|
.ui.basic.positive.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00ED00 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00ED00 inset !important;
|
|
color: #00ED00 !important;
|
|
}
|
|
.ui.basic.positive.buttons .button:hover,
|
|
.ui.basic.positive.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00d400 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00d400 inset !important;
|
|
color: #00d400 !important;
|
|
}
|
|
.ui.basic.positive.buttons .button:focus,
|
|
.ui.basic.positive.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00c400 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00c400 inset !important;
|
|
color: #00d400 !important;
|
|
}
|
|
.ui.basic.positive.buttons .active.button,
|
|
.ui.basic.positive.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00d400 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00d400 inset !important;
|
|
color: #00ba00 !important;
|
|
}
|
|
.ui.basic.positive.buttons .button:active,
|
|
.ui.basic.positive.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #00ba00 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #00ba00 inset !important;
|
|
color: #00ba00 !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.primary.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/*---------------
|
|
Negative
|
|
----------------*/
|
|
/* Standard */
|
|
.ui.negative.buttons .button,
|
|
.ui.negative.button {
|
|
background-color: #EF767A;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
background-image: none;
|
|
}
|
|
.ui.negative.button {
|
|
-webkit-box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.negative.buttons .button:hover,
|
|
.ui.negative.button:hover {
|
|
background-color: #f3585d;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.negative.buttons .button:focus,
|
|
.ui.negative.button:focus {
|
|
background-color: #fa4248;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.negative.buttons .button:active,
|
|
.ui.negative.button:active {
|
|
background-color: #ea484e;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
.ui.negative.buttons .active.button,
|
|
.ui.negative.buttons .active.button:active,
|
|
.ui.negative.active.button,
|
|
.ui.negative.button .active.button:active {
|
|
background-color: #f7555a;
|
|
color: #FFFFFF;
|
|
text-shadow: none;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.negative.buttons .button,
|
|
.ui.basic.negative.button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #EF767A inset !important;
|
|
box-shadow: 0px 0px 0px 1px #EF767A inset !important;
|
|
color: #EF767A !important;
|
|
}
|
|
.ui.basic.negative.buttons .button:hover,
|
|
.ui.basic.negative.button:hover {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #f3585d inset !important;
|
|
box-shadow: 0px 0px 0px 1px #f3585d inset !important;
|
|
color: #f3585d !important;
|
|
}
|
|
.ui.basic.negative.buttons .button:focus,
|
|
.ui.basic.negative.button:focus {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #fa4248 inset !important;
|
|
box-shadow: 0px 0px 0px 1px #fa4248 inset !important;
|
|
color: #f3585d !important;
|
|
}
|
|
.ui.basic.negative.buttons .active.button,
|
|
.ui.basic.negative.active.button {
|
|
background: transparent !important;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #f7555a inset !important;
|
|
box-shadow: 0px 0px 0px 1px #f7555a inset !important;
|
|
color: #ea484e !important;
|
|
}
|
|
.ui.basic.negative.buttons .button:active,
|
|
.ui.basic.negative.button:active {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ea484e inset !important;
|
|
box-shadow: 0px 0px 0px 1px #ea484e inset !important;
|
|
color: #ea484e !important;
|
|
}
|
|
.ui.buttons:not(.vertical) > .basic.primary.button:not(:first-child) {
|
|
margin-left: -1px;
|
|
}
|
|
/*******************************
|
|
Groups
|
|
*******************************/
|
|
.ui.buttons {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
font-size: 0em;
|
|
vertical-align: baseline;
|
|
margin: 0em 0.25em 0em 0em;
|
|
}
|
|
.ui.buttons:not(.basic):not(.inverted) {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Clearfix */
|
|
.ui.buttons:after {
|
|
content: ".";
|
|
display: block;
|
|
height: 0;
|
|
clear: both;
|
|
visibility: hidden;
|
|
}
|
|
/* Standard Group */
|
|
.ui.buttons .button {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1 0 auto;
|
|
flex: 1 0 auto;
|
|
margin: 0em;
|
|
border-radius: 0em;
|
|
margin: 0px 0px 0px 0px;
|
|
}
|
|
.ui.buttons > .ui.button:not(.basic):not(.inverted),
|
|
.ui.buttons:not(.basic):not(.inverted) > .button {
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
.ui.buttons .button:first-child {
|
|
border-left: none;
|
|
margin-left: 0em;
|
|
border-top-left-radius: 0.28571429rem;
|
|
border-bottom-left-radius: 0.28571429rem;
|
|
}
|
|
.ui.buttons .button:last-child {
|
|
border-top-right-radius: 0.28571429rem;
|
|
border-bottom-right-radius: 0.28571429rem;
|
|
}
|
|
/* Vertical Style */
|
|
.ui.vertical.buttons {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
.ui.vertical.buttons .button {
|
|
display: block;
|
|
float: none;
|
|
width: 100%;
|
|
margin: 0px 0px 0px 0px;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-radius: 0em;
|
|
}
|
|
.ui.vertical.buttons .button:first-child {
|
|
border-top-left-radius: 0.28571429rem;
|
|
border-top-right-radius: 0.28571429rem;
|
|
}
|
|
.ui.vertical.buttons .button:last-child {
|
|
margin-bottom: 0px;
|
|
border-bottom-left-radius: 0.28571429rem;
|
|
border-bottom-right-radius: 0.28571429rem;
|
|
}
|
|
.ui.vertical.buttons .button:only-child {
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Container
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Container
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/* Minimum Gutter is used to determine the maximum container width for a given device */
|
|
/* Devices */
|
|
/* Coupling (Add Negative Margin to container size) */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Text */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Container
|
|
*******************************/
|
|
/* All Sizes */
|
|
.ui.container {
|
|
display: block;
|
|
max-width: 100% !important;
|
|
}
|
|
/* Mobile */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.container {
|
|
width: auto !important;
|
|
margin-left: 1em !important;
|
|
margin-right: 1em !important;
|
|
}
|
|
.ui.grid.container {
|
|
width: auto !important;
|
|
}
|
|
.ui.relaxed.grid.container {
|
|
width: auto !important;
|
|
}
|
|
.ui.very.relaxed.grid.container {
|
|
width: auto !important;
|
|
}
|
|
}
|
|
/* Tablet */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui.container {
|
|
width: 723px;
|
|
margin-left: auto !important;
|
|
margin-right: auto !important;
|
|
}
|
|
.ui.grid.container {
|
|
width: calc( 723px + 2rem ) !important;
|
|
}
|
|
.ui.relaxed.grid.container {
|
|
width: calc( 723px + 3rem ) !important;
|
|
}
|
|
.ui.very.relaxed.grid.container {
|
|
width: calc( 723px + 5rem ) !important;
|
|
}
|
|
}
|
|
/* Small Monitor */
|
|
@media only screen and (min-width: 992px) and (max-width: 1199px) {
|
|
.ui.container {
|
|
width: 933px;
|
|
margin-left: auto !important;
|
|
margin-right: auto !important;
|
|
}
|
|
.ui.grid.container {
|
|
width: calc( 933px + 2rem ) !important;
|
|
}
|
|
.ui.relaxed.grid.container {
|
|
width: calc( 933px + 3rem ) !important;
|
|
}
|
|
.ui.very.relaxed.grid.container {
|
|
width: calc( 933px + 5rem ) !important;
|
|
}
|
|
}
|
|
/* Large Monitor */
|
|
@media only screen and (min-width: 1200px) {
|
|
.ui.container {
|
|
width: 1127px;
|
|
margin-left: auto !important;
|
|
margin-right: auto !important;
|
|
}
|
|
.ui.grid.container {
|
|
width: calc( 1127px + 2rem ) !important;
|
|
}
|
|
.ui.relaxed.grid.container {
|
|
width: calc( 1127px + 3rem ) !important;
|
|
}
|
|
.ui.very.relaxed.grid.container {
|
|
width: calc( 1127px + 5rem ) !important;
|
|
}
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/* Text Container */
|
|
.ui.text.container {
|
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
max-width: 700px !important;
|
|
line-height: 1.5;
|
|
}
|
|
.ui.text.container {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
/* Fluid */
|
|
.ui.fluid.container {
|
|
width: 100%;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
.ui[class*="left aligned"].container {
|
|
text-align: left;
|
|
}
|
|
.ui[class*="center aligned"].container {
|
|
text-align: center;
|
|
}
|
|
.ui[class*="right aligned"].container {
|
|
text-align: right;
|
|
}
|
|
.ui.justified.container {
|
|
text-align: justify;
|
|
-webkit-hyphens: auto;
|
|
-ms-hyphens: auto;
|
|
hyphens: auto;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Divider
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Divider
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/* Text */
|
|
/*-------------------
|
|
Coupling
|
|
--------------------*/
|
|
/* Icon */
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/* Horizontal / Vertical */
|
|
/* Inverted */
|
|
/* Section */
|
|
/* Sizes */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Divider
|
|
*******************************/
|
|
.ui.divider {
|
|
margin: 1rem 0rem;
|
|
line-height: 1;
|
|
height: 0em;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.05em;
|
|
color: rgba(0, 0, 0, 0.85);
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
}
|
|
/*--------------
|
|
Basic
|
|
---------------*/
|
|
.ui.divider:not(.vertical):not(.horizontal) {
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
|
}
|
|
/*--------------
|
|
Coupling
|
|
---------------*/
|
|
/* Allow divider between each column row */
|
|
.ui.grid > .column + .divider,
|
|
.ui.grid > .row > .column + .divider {
|
|
left: auto;
|
|
}
|
|
/*--------------
|
|
Horizontal
|
|
---------------*/
|
|
.ui.horizontal.divider {
|
|
display: table;
|
|
white-space: nowrap;
|
|
height: auto;
|
|
margin: '';
|
|
line-height: 1;
|
|
text-align: center;
|
|
}
|
|
.ui.horizontal.divider:before,
|
|
.ui.horizontal.divider:after {
|
|
content: '';
|
|
display: table-cell;
|
|
position: relative;
|
|
top: 50%;
|
|
width: 50%;
|
|
background-repeat: no-repeat;
|
|
}
|
|
.ui.horizontal.divider:before {
|
|
background-position: right 1em top 50%;
|
|
}
|
|
.ui.horizontal.divider:after {
|
|
background-position: left 1em top 50%;
|
|
}
|
|
/*--------------
|
|
Vertical
|
|
---------------*/
|
|
.ui.vertical.divider {
|
|
position: absolute;
|
|
z-index: 2;
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: 0rem;
|
|
padding: 0em;
|
|
width: auto;
|
|
height: 50%;
|
|
line-height: 0em;
|
|
text-align: center;
|
|
-webkit-transform: translateX(-50%);
|
|
transform: translateX(-50%);
|
|
}
|
|
.ui.vertical.divider:before,
|
|
.ui.vertical.divider:after {
|
|
position: absolute;
|
|
left: 50%;
|
|
content: '';
|
|
z-index: 3;
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
border-right: 1px solid rgba(255, 255, 255, 0.1);
|
|
width: 0%;
|
|
height: calc(100% - 1rem );
|
|
}
|
|
.ui.vertical.divider:before {
|
|
top: -100%;
|
|
}
|
|
.ui.vertical.divider:after {
|
|
top: auto;
|
|
bottom: 0px;
|
|
}
|
|
/* Inside grid */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.stackable.grid .ui.vertical.divider,
|
|
.ui.grid .stackable.row .ui.vertical.divider {
|
|
display: table;
|
|
white-space: nowrap;
|
|
height: auto;
|
|
margin: '';
|
|
overflow: hidden;
|
|
line-height: 1;
|
|
text-align: center;
|
|
position: static;
|
|
top: 0;
|
|
left: 0;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
.ui.stackable.grid .ui.vertical.divider:before,
|
|
.ui.grid .stackable.row .ui.vertical.divider:before,
|
|
.ui.stackable.grid .ui.vertical.divider:after,
|
|
.ui.grid .stackable.row .ui.vertical.divider:after {
|
|
position: static;
|
|
left: 0;
|
|
border-left: none;
|
|
border-right: none;
|
|
content: '';
|
|
display: table-cell;
|
|
position: relative;
|
|
top: 50%;
|
|
width: 50%;
|
|
background-repeat: no-repeat;
|
|
}
|
|
.ui.stackable.grid .ui.vertical.divider:before,
|
|
.ui.grid .stackable.row .ui.vertical.divider:before {
|
|
background-position: right 1em top 50%;
|
|
}
|
|
.ui.stackable.grid .ui.vertical.divider:after,
|
|
.ui.grid .stackable.row .ui.vertical.divider:after {
|
|
background-position: left 1em top 50%;
|
|
}
|
|
}
|
|
/*--------------
|
|
Icon
|
|
---------------*/
|
|
.ui.divider > .icon {
|
|
margin: 0rem;
|
|
font-size: 1rem;
|
|
height: 1em;
|
|
vertical-align: middle;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Hidden
|
|
---------------*/
|
|
.ui.hidden.divider {
|
|
border-color: transparent !important;
|
|
}
|
|
.ui.hidden.divider:before,
|
|
.ui.hidden.divider:after {
|
|
display: none;
|
|
}
|
|
/*--------------
|
|
Inverted
|
|
---------------*/
|
|
.ui.divider.inverted,
|
|
.ui.vertical.inverted.divider,
|
|
.ui.horizontal.inverted.divider {
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.divider.inverted,
|
|
.ui.divider.inverted:after,
|
|
.ui.divider.inverted:before {
|
|
border-top-color: rgba(34, 36, 38, 0.15) !important;
|
|
border-left-color: rgba(34, 36, 38, 0.15) !important;
|
|
border-bottom-color: rgba(255, 255, 255, 0.15) !important;
|
|
border-right-color: rgba(255, 255, 255, 0.15) !important;
|
|
}
|
|
/*--------------
|
|
Fitted
|
|
---------------*/
|
|
.ui.fitted.divider {
|
|
margin: 0em;
|
|
}
|
|
/*--------------
|
|
Clearing
|
|
---------------*/
|
|
.ui.clearing.divider {
|
|
clear: both;
|
|
}
|
|
/*--------------
|
|
Section
|
|
---------------*/
|
|
.ui.section.divider {
|
|
margin-top: 2rem;
|
|
margin-bottom: 2rem;
|
|
}
|
|
/*--------------
|
|
Sizes
|
|
---------------*/
|
|
.ui.divider {
|
|
font-size: 1rem;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Header
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Header
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/* Sub Heading */
|
|
/* Sub Header */
|
|
/* Icon */
|
|
/* Image */
|
|
/* Label */
|
|
/* Content */
|
|
/* Paragraph after Header */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Sizing */
|
|
/* Sub Header */
|
|
/* Icon Header */
|
|
/* No Line Height Offset */
|
|
/* Divided */
|
|
/* Block */
|
|
/* Attached */
|
|
/* Inverted */
|
|
/* Floated */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Header
|
|
*******************************/
|
|
/* Standard */
|
|
.ui.header {
|
|
border: none;
|
|
margin: calc(2rem - 0.14285em ) 0em 1rem;
|
|
padding: 0em 0em;
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-weight: bold;
|
|
line-height: 1.2857em;
|
|
text-transform: none;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.header:first-child {
|
|
margin-top: -0.14285em;
|
|
}
|
|
.ui.header:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*--------------
|
|
Sub Header
|
|
---------------*/
|
|
.ui.header .sub.header {
|
|
display: block;
|
|
font-weight: normal;
|
|
padding: 0em;
|
|
margin: 0em;
|
|
font-size: 1rem;
|
|
line-height: 1.2em;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
/*--------------
|
|
Icon
|
|
---------------*/
|
|
.ui.header > .icon {
|
|
display: table-cell;
|
|
opacity: 1;
|
|
font-size: 1.5em;
|
|
padding-top: 0.14285em;
|
|
vertical-align: middle;
|
|
}
|
|
/* With Text Node */
|
|
.ui.header .icon:only-child {
|
|
display: inline-block;
|
|
padding: 0em;
|
|
margin-right: 0.75rem;
|
|
}
|
|
/*-------------------
|
|
Image
|
|
--------------------*/
|
|
.ui.header > .image,
|
|
.ui.header > img {
|
|
display: inline-block;
|
|
margin-top: 0.14285em;
|
|
width: 2.5em;
|
|
height: auto;
|
|
vertical-align: middle;
|
|
}
|
|
.ui.header > .image:only-child,
|
|
.ui.header > img:only-child {
|
|
margin-right: 0.75rem;
|
|
}
|
|
/*--------------
|
|
Content
|
|
---------------*/
|
|
.ui.header .content {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
}
|
|
/* After Image */
|
|
.ui.header > img + .content,
|
|
.ui.header > .image + .content {
|
|
padding-left: 0.75rem;
|
|
vertical-align: middle;
|
|
}
|
|
/* After Icon */
|
|
.ui.header > .icon + .content {
|
|
padding-left: 0.75rem;
|
|
display: table-cell;
|
|
vertical-align: middle;
|
|
}
|
|
/*--------------
|
|
Loose Coupling
|
|
---------------*/
|
|
.ui.header .ui.label {
|
|
font-size: '';
|
|
margin-left: 0.5rem;
|
|
vertical-align: middle;
|
|
}
|
|
/* Positioning */
|
|
.ui.header + p {
|
|
margin-top: 0em;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Page
|
|
---------------*/
|
|
h1.ui.header {
|
|
font-size: 2rem;
|
|
}
|
|
h2.ui.header {
|
|
font-size: 1.714rem;
|
|
}
|
|
h3.ui.header {
|
|
font-size: 1.28rem;
|
|
}
|
|
h4.ui.header {
|
|
font-size: 1.071rem;
|
|
}
|
|
h5.ui.header {
|
|
font-size: 1rem;
|
|
}
|
|
/* Sub Header */
|
|
h1.ui.header .sub.header {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
h2.ui.header .sub.header {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
h3.ui.header .sub.header {
|
|
font-size: 1rem;
|
|
}
|
|
h4.ui.header .sub.header {
|
|
font-size: 1rem;
|
|
}
|
|
h5.ui.header .sub.header {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
/*--------------
|
|
Content Heading
|
|
---------------*/
|
|
.ui.huge.header {
|
|
min-height: 1em;
|
|
font-size: 2em;
|
|
}
|
|
.ui.large.header {
|
|
font-size: 1.714em;
|
|
}
|
|
.ui.medium.header {
|
|
font-size: 1.28em;
|
|
}
|
|
.ui.small.header {
|
|
font-size: 1.071em;
|
|
}
|
|
.ui.tiny.header {
|
|
font-size: 1em;
|
|
}
|
|
/* Sub Header */
|
|
.ui.huge.header .sub.header {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.large.header .sub.header {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.header .sub.header {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.small.header .sub.header {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.tiny.header .sub.header {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
/*--------------
|
|
Sub Heading
|
|
---------------*/
|
|
.ui.sub.header {
|
|
padding: 0em;
|
|
margin-bottom: 0.14285714rem;
|
|
font-weight: bold;
|
|
font-size: 0.85714286em;
|
|
text-transform: uppercase;
|
|
color: '';
|
|
}
|
|
.ui.small.sub.header {
|
|
font-size: 0.78571429em;
|
|
}
|
|
.ui.sub.header {
|
|
font-size: 0.85714286em;
|
|
}
|
|
.ui.large.sub.header {
|
|
font-size: 0.92857143em;
|
|
}
|
|
.ui.huge.sub.header {
|
|
font-size: 1em;
|
|
}
|
|
/*-------------------
|
|
Icon
|
|
--------------------*/
|
|
.ui.icon.header {
|
|
display: inline-block;
|
|
text-align: center;
|
|
margin: 2rem 0em 1rem;
|
|
}
|
|
.ui.icon.header:after {
|
|
content: '';
|
|
display: block;
|
|
height: 0px;
|
|
clear: both;
|
|
visibility: hidden;
|
|
}
|
|
.ui.icon.header:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.icon.header .icon {
|
|
float: none;
|
|
display: block;
|
|
width: auto;
|
|
height: auto;
|
|
line-height: 1;
|
|
padding: 0em;
|
|
font-size: 3em;
|
|
margin: 0em auto 0.5rem;
|
|
opacity: 1;
|
|
}
|
|
.ui.icon.header .content {
|
|
display: block;
|
|
padding: 0em;
|
|
}
|
|
.ui.icon.header .circular.icon {
|
|
font-size: 2em;
|
|
}
|
|
.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.45;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Inverted
|
|
--------------------*/
|
|
.ui.inverted.header {
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.header .sub.header {
|
|
color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
.ui.inverted.attached.header {
|
|
background: #545454 -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
|
|
background: #545454 linear-gradient(transparent, rgba(0, 0, 0, 0.05));
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-color: transparent;
|
|
}
|
|
.ui.inverted.block.header {
|
|
background: #545454 -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
|
|
background: #545454 linear-gradient(transparent, rgba(0, 0, 0, 0.05));
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.inverted.block.header {
|
|
border-bottom: none;
|
|
}
|
|
/*-------------------
|
|
Colors
|
|
--------------------*/
|
|
/*--- Red ---*/
|
|
.ui.red.header {
|
|
color: #EF767A !important;
|
|
}
|
|
a.ui.red.header:hover {
|
|
color: #f3585d !important;
|
|
}
|
|
.ui.red.dividing.header {
|
|
border-bottom: 2px solid #EF767A;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.red.header {
|
|
color: #FF695E !important;
|
|
}
|
|
a.ui.inverted.red.header:hover {
|
|
color: #ff5144 !important;
|
|
}
|
|
/*--- Orange ---*/
|
|
.ui.orange.header {
|
|
color: #ff8b27 !important;
|
|
}
|
|
a.ui.orange.header:hover {
|
|
color: #ff7d0d !important;
|
|
}
|
|
.ui.orange.dividing.header {
|
|
border-bottom: 2px solid #ff8b27;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.orange.header {
|
|
color: #FF851B !important;
|
|
}
|
|
a.ui.inverted.orange.header:hover {
|
|
color: #ff7701 !important;
|
|
}
|
|
/*--- Olive ---*/
|
|
.ui.olive.header {
|
|
color: #B5CC18 !important;
|
|
}
|
|
a.ui.olive.header:hover {
|
|
color: #a7bd0d !important;
|
|
}
|
|
.ui.olive.dividing.header {
|
|
border-bottom: 2px solid #B5CC18;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.olive.header {
|
|
color: #D9E778 !important;
|
|
}
|
|
a.ui.inverted.olive.header:hover {
|
|
color: #d8ea5c !important;
|
|
}
|
|
/*--- Yellow ---*/
|
|
.ui.yellow.header {
|
|
color: #FDE74C !important;
|
|
}
|
|
a.ui.yellow.header:hover {
|
|
color: #ffe531 !important;
|
|
}
|
|
.ui.yellow.dividing.header {
|
|
border-bottom: 2px solid #FDE74C;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.yellow.header {
|
|
color: #FFE21F !important;
|
|
}
|
|
a.ui.inverted.yellow.header:hover {
|
|
color: #ffdf05 !important;
|
|
}
|
|
/*--- Green ---*/
|
|
.ui.green.header {
|
|
color: #00ED00 !important;
|
|
}
|
|
a.ui.green.header:hover {
|
|
color: #00d400 !important;
|
|
}
|
|
.ui.green.dividing.header {
|
|
border-bottom: 2px solid #00ED00;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.green.header {
|
|
color: #2ECC40 !important;
|
|
}
|
|
a.ui.inverted.green.header:hover {
|
|
color: #22be34 !important;
|
|
}
|
|
/*--- Teal ---*/
|
|
.ui.teal.header {
|
|
color: #3891A6 !important;
|
|
}
|
|
a.ui.teal.header:hover {
|
|
color: #2d8398 !important;
|
|
}
|
|
.ui.teal.dividing.header {
|
|
border-bottom: 2px solid #3891A6;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.teal.header {
|
|
color: #6DFFFF !important;
|
|
}
|
|
a.ui.inverted.teal.header:hover {
|
|
color: #54ffff !important;
|
|
}
|
|
/*--- Blue ---*/
|
|
.ui.blue.header {
|
|
color: #3454D1 !important;
|
|
}
|
|
a.ui.blue.header:hover {
|
|
color: #2445c7 !important;
|
|
}
|
|
.ui.blue.dividing.header {
|
|
border-bottom: 2px solid #3454D1;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.blue.header {
|
|
color: #54C8FF !important;
|
|
}
|
|
a.ui.inverted.blue.header:hover {
|
|
color: #3ac0ff !important;
|
|
}
|
|
/*--- Violet ---*/
|
|
.ui.violet.header {
|
|
color: #B4009E !important;
|
|
}
|
|
a.ui.violet.header:hover {
|
|
color: #9b0088 !important;
|
|
}
|
|
.ui.violet.dividing.header {
|
|
border-bottom: 2px solid #B4009E;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.violet.header {
|
|
color: #A291FB !important;
|
|
}
|
|
a.ui.inverted.violet.header:hover {
|
|
color: #8a73ff !important;
|
|
}
|
|
/*--- Purple ---*/
|
|
.ui.purple.header {
|
|
color: #6633cc !important;
|
|
}
|
|
a.ui.purple.header:hover {
|
|
color: #5a27be !important;
|
|
}
|
|
.ui.purple.dividing.header {
|
|
border-bottom: 2px solid #6633cc;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.purple.header {
|
|
color: #DC73FF !important;
|
|
}
|
|
a.ui.inverted.purple.header:hover {
|
|
color: #d65aff !important;
|
|
}
|
|
/*--- Pink ---*/
|
|
.ui.pink.header {
|
|
color: #F46197 !important;
|
|
}
|
|
a.ui.pink.header:hover {
|
|
color: #fb4185 !important;
|
|
}
|
|
.ui.pink.dividing.header {
|
|
border-bottom: 2px solid #F46197;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.pink.header {
|
|
color: #FF8EDF !important;
|
|
}
|
|
a.ui.inverted.pink.header:hover {
|
|
color: #ff74d8 !important;
|
|
}
|
|
/*--- Brown ---*/
|
|
.ui.brown.header {
|
|
color: #00BCF2 !important;
|
|
}
|
|
a.ui.brown.header:hover {
|
|
color: #00a8d9 !important;
|
|
}
|
|
.ui.brown.dividing.header {
|
|
border-bottom: 2px solid #00BCF2;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.brown.header {
|
|
color: #D67C1C !important;
|
|
}
|
|
a.ui.inverted.brown.header:hover {
|
|
color: #c86f11 !important;
|
|
}
|
|
/*--- Grey ---*/
|
|
.ui.grey.header {
|
|
color: #95a5a6 !important;
|
|
}
|
|
a.ui.grey.header:hover {
|
|
color: #a3b1b2 !important;
|
|
}
|
|
.ui.grey.dividing.header {
|
|
border-bottom: 2px solid #95a5a6;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.grey.header {
|
|
color: #DCDDDE !important;
|
|
}
|
|
a.ui.inverted.grey.header:hover {
|
|
color: #cfd0d2 !important;
|
|
}
|
|
/*-------------------
|
|
Aligned
|
|
--------------------*/
|
|
.ui.left.aligned.header {
|
|
text-align: left;
|
|
}
|
|
.ui.right.aligned.header {
|
|
text-align: right;
|
|
}
|
|
.ui.centered.header,
|
|
.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[class*="left floated"].header {
|
|
float: left;
|
|
margin-top: 0em;
|
|
margin-right: 0.5em;
|
|
}
|
|
.ui[class*="right floated"].header {
|
|
float: right;
|
|
margin-top: 0em;
|
|
margin-left: 0.5em;
|
|
}
|
|
/*-------------------
|
|
Fitted
|
|
--------------------*/
|
|
.ui.fitted.header {
|
|
padding: 0em;
|
|
}
|
|
/*-------------------
|
|
Dividing
|
|
--------------------*/
|
|
.ui.dividing.header {
|
|
padding-bottom: 0.21428571rem;
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.dividing.header .sub.header {
|
|
padding-bottom: 0.21428571rem;
|
|
}
|
|
.ui.dividing.header .icon {
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.inverted.dividing.header {
|
|
border-bottom-color: rgba(255, 255, 255, 0.1);
|
|
}
|
|
/*-------------------
|
|
Block
|
|
--------------------*/
|
|
.ui.block.header {
|
|
background: #F3F4F5;
|
|
padding: 0.78571429rem 1rem;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: 1px solid #D4D4D5;
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
.ui.tiny.block.header {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.block.header {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.block.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.block.header {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.huge.block.header {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
/*-------------------
|
|
Attached
|
|
--------------------*/
|
|
.ui.attached.header {
|
|
background: #FFFFFF;
|
|
padding: 0.78571429rem 1rem;
|
|
margin-left: -1px;
|
|
margin-right: -1px;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: 1px solid #D4D4D5;
|
|
}
|
|
.ui.attached.block.header {
|
|
background: #F3F4F5;
|
|
}
|
|
.ui.attached:not(.top):not(.bottom).header {
|
|
margin-top: 0em;
|
|
margin-bottom: 0em;
|
|
border-top: none;
|
|
border-radius: 0em;
|
|
}
|
|
.ui.top.attached.header {
|
|
margin-bottom: 0em;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.bottom.attached.header {
|
|
margin-top: 0em;
|
|
border-top: none;
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
/* Attached Sizes */
|
|
.ui.tiny.attached.header {
|
|
font-size: 0.85714286em;
|
|
}
|
|
.ui.small.attached.header {
|
|
font-size: 0.92857143em;
|
|
}
|
|
.ui.attached.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
font-size: 1em;
|
|
}
|
|
.ui.large.attached.header {
|
|
font-size: 1.14285714em;
|
|
}
|
|
.ui.huge.attached.header {
|
|
font-size: 1.42857143em;
|
|
}
|
|
/*-------------------
|
|
Sizing
|
|
--------------------*/
|
|
.ui.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
|
|
font-size: 1.28em;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.modal > .header {
|
|
padding-right: 0.75rem !important;
|
|
}
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Icon
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Icon
|
|
*******************************/
|
|
/*-------------------
|
|
Icon Variables
|
|
--------------------*/
|
|
/* Variations */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Icon
|
|
*******************************/
|
|
/*-------------------
|
|
Icon Variables
|
|
--------------------*/
|
|
/* Variations */
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Icon
|
|
*******************************/
|
|
@font-face {
|
|
font-family: 'Icons';
|
|
|
|
src: url(data:application/font-woff;charset=utf-8;base64,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) format('woff');
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
font-variant: normal;
|
|
text-decoration: inherit;
|
|
text-transform: none;
|
|
}
|
|
i.icon {
|
|
display: inline-block;
|
|
opacity: 1;
|
|
margin: 0em 0.25rem 0em 0em;
|
|
width: 1.18em;
|
|
height: 1em;
|
|
font-family: 'Icons';
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
text-decoration: inherit;
|
|
text-align: center;
|
|
speak: none;
|
|
font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
-webkit-font-smoothing: antialiased;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
}
|
|
i.icon:before {
|
|
background: none !important;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Loading
|
|
---------------*/
|
|
i.icon.loading {
|
|
height: 1em;
|
|
line-height: 1;
|
|
-webkit-animation: icon-loading 2s linear infinite;
|
|
animation: icon-loading 2s linear infinite;
|
|
}
|
|
@-webkit-keyframes icon-loading {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes icon-loading {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
i.icon.hover {
|
|
opacity: 1 !important;
|
|
}
|
|
i.icon.active {
|
|
opacity: 1 !important;
|
|
}
|
|
i.emphasized.icon {
|
|
opacity: 1 !important;
|
|
}
|
|
i.disabled.icon {
|
|
opacity: 0.45 !important;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Fitted
|
|
--------------------*/
|
|
i.fitted.icon {
|
|
width: auto;
|
|
margin: 0em;
|
|
}
|
|
/*-------------------
|
|
Link
|
|
--------------------*/
|
|
i.link.icon,
|
|
i.link.icons {
|
|
cursor: pointer;
|
|
opacity: 0.8;
|
|
-webkit-transition: opacity 0.1s ease;
|
|
transition: opacity 0.1s ease;
|
|
}
|
|
i.link.icon:hover,
|
|
i.link.icons:hover {
|
|
opacity: 1 !important;
|
|
}
|
|
/*-------------------
|
|
Circular
|
|
--------------------*/
|
|
i.circular.icon {
|
|
border-radius: 500em !important;
|
|
line-height: 1 !important;
|
|
padding: 0.5em 0.5em !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;
|
|
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);
|
|
transform: scale(-1, 1);
|
|
}
|
|
i.vertically.flipped.icon {
|
|
-webkit-transform: scale(1, -1);
|
|
transform: scale(1, -1);
|
|
}
|
|
/*-------------------
|
|
Rotated
|
|
--------------------*/
|
|
i.rotated.icon,
|
|
i.right.rotated.icon,
|
|
i.clockwise.rotated.icon {
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg);
|
|
}
|
|
i.left.rotated.icon,
|
|
i.counterclockwise.rotated.icon {
|
|
-webkit-transform: rotate(-90deg);
|
|
transform: rotate(-90deg);
|
|
}
|
|
/*-------------------
|
|
Bordered
|
|
--------------------*/
|
|
i.bordered.icon {
|
|
line-height: 1;
|
|
vertical-align: baseline;
|
|
width: 2em;
|
|
height: 2em;
|
|
padding: 0.5em 0.41em !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;
|
|
}
|
|
i.bordered.inverted.icon {
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/*-------------------
|
|
Inverted
|
|
--------------------*/
|
|
/* Inverted Shapes */
|
|
i.inverted.bordered.icon,
|
|
i.inverted.circular.icon {
|
|
background-color: #1B1C1D !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
i.inverted.icon {
|
|
color: #FFFFFF;
|
|
}
|
|
/*-------------------
|
|
Colors
|
|
--------------------*/
|
|
/* Red */
|
|
i.red.icon {
|
|
color: #EF767A !important;
|
|
}
|
|
i.inverted.red.icon {
|
|
color: #FF695E !important;
|
|
}
|
|
i.inverted.bordered.red.icon,
|
|
i.inverted.circular.red.icon {
|
|
background-color: #EF767A !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Orange */
|
|
i.orange.icon {
|
|
color: #ff8b27 !important;
|
|
}
|
|
i.inverted.orange.icon {
|
|
color: #FF851B !important;
|
|
}
|
|
i.inverted.bordered.orange.icon,
|
|
i.inverted.circular.orange.icon {
|
|
background-color: #ff8b27 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Yellow */
|
|
i.yellow.icon {
|
|
color: #FDE74C !important;
|
|
}
|
|
i.inverted.yellow.icon {
|
|
color: #FFE21F !important;
|
|
}
|
|
i.inverted.bordered.yellow.icon,
|
|
i.inverted.circular.yellow.icon {
|
|
background-color: #FDE74C !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Olive */
|
|
i.olive.icon {
|
|
color: #B5CC18 !important;
|
|
}
|
|
i.inverted.olive.icon {
|
|
color: #D9E778 !important;
|
|
}
|
|
i.inverted.bordered.olive.icon,
|
|
i.inverted.circular.olive.icon {
|
|
background-color: #B5CC18 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Green */
|
|
i.green.icon {
|
|
color: #00ED00 !important;
|
|
}
|
|
i.inverted.green.icon {
|
|
color: #2ECC40 !important;
|
|
}
|
|
i.inverted.bordered.green.icon,
|
|
i.inverted.circular.green.icon {
|
|
background-color: #00ED00 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Teal */
|
|
i.teal.icon {
|
|
color: #3891A6 !important;
|
|
}
|
|
i.inverted.teal.icon {
|
|
color: #6DFFFF !important;
|
|
}
|
|
i.inverted.bordered.teal.icon,
|
|
i.inverted.circular.teal.icon {
|
|
background-color: #3891A6 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Blue */
|
|
i.blue.icon {
|
|
color: #3454D1 !important;
|
|
}
|
|
i.inverted.blue.icon {
|
|
color: #54C8FF !important;
|
|
}
|
|
i.inverted.bordered.blue.icon,
|
|
i.inverted.circular.blue.icon {
|
|
background-color: #3454D1 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Violet */
|
|
i.violet.icon {
|
|
color: #6435C9 !important;
|
|
}
|
|
i.inverted.violet.icon {
|
|
color: #A291FB !important;
|
|
}
|
|
i.inverted.bordered.violet.icon,
|
|
i.inverted.circular.violet.icon {
|
|
background-color: #6435C9 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Purple */
|
|
i.purple.icon {
|
|
color: #6633cc !important;
|
|
}
|
|
i.inverted.purple.icon {
|
|
color: #DC73FF !important;
|
|
}
|
|
i.inverted.bordered.purple.icon,
|
|
i.inverted.circular.purple.icon {
|
|
background-color: #6633cc !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Pink */
|
|
i.pink.icon {
|
|
color: #F46197 !important;
|
|
}
|
|
i.inverted.pink.icon {
|
|
color: #FF8EDF !important;
|
|
}
|
|
i.inverted.bordered.pink.icon,
|
|
i.inverted.circular.pink.icon {
|
|
background-color: #F46197 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Brown */
|
|
i.brown.icon {
|
|
color: #A5673F !important;
|
|
}
|
|
i.inverted.brown.icon {
|
|
color: #D67C1C !important;
|
|
}
|
|
i.inverted.bordered.brown.icon,
|
|
i.inverted.circular.brown.icon {
|
|
background-color: #A5673F !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Grey */
|
|
i.grey.icon {
|
|
color: #95a5a6 !important;
|
|
}
|
|
i.inverted.grey.icon {
|
|
color: #DCDDDE !important;
|
|
}
|
|
i.inverted.bordered.grey.icon,
|
|
i.inverted.circular.grey.icon {
|
|
background-color: #95a5a6 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Black */
|
|
i.black.icon {
|
|
color: #1B1C1D !important;
|
|
}
|
|
i.inverted.black.icon {
|
|
color: #545454 !important;
|
|
}
|
|
i.inverted.bordered.black.icon,
|
|
i.inverted.circular.black.icon {
|
|
background-color: #1B1C1D !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
i.mini.icon,
|
|
i.mini.icons {
|
|
line-height: 1;
|
|
font-size: 0.4em;
|
|
}
|
|
i.tiny.icon,
|
|
i.tiny.icons {
|
|
line-height: 1;
|
|
font-size: 0.5em;
|
|
}
|
|
i.small.icon,
|
|
i.small.icons {
|
|
line-height: 1;
|
|
font-size: 0.75em;
|
|
}
|
|
i.icon,
|
|
i.icons {
|
|
font-size: 1em;
|
|
}
|
|
i.large.icon,
|
|
i.large.icons {
|
|
line-height: 1;
|
|
vertical-align: middle;
|
|
font-size: 1.5em;
|
|
}
|
|
i.big.icon,
|
|
i.big.icons {
|
|
line-height: 1;
|
|
vertical-align: middle;
|
|
font-size: 2em;
|
|
}
|
|
i.huge.icon,
|
|
i.huge.icons {
|
|
line-height: 1;
|
|
vertical-align: middle;
|
|
font-size: 4em;
|
|
}
|
|
i.massive.icon,
|
|
i.massive.icons {
|
|
line-height: 1;
|
|
vertical-align: middle;
|
|
font-size: 8em;
|
|
}
|
|
/*******************************
|
|
Groups
|
|
*******************************/
|
|
i.icons {
|
|
display: inline-block;
|
|
position: relative;
|
|
line-height: 1;
|
|
}
|
|
i.icons .icon {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
-webkit-transform: translateX(-50%) translateY(-50%);
|
|
transform: translateX(-50%) translateY(-50%);
|
|
margin: 0em;
|
|
margin: 0;
|
|
}
|
|
i.icons .icon:first-child {
|
|
position: static;
|
|
width: auto;
|
|
height: auto;
|
|
vertical-align: top;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
margin-right: 0.25rem;
|
|
}
|
|
/* Corner Icon */
|
|
i.icons .corner.icon {
|
|
top: auto;
|
|
left: auto;
|
|
right: 0;
|
|
bottom: 0;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
font-size: 0.45em;
|
|
text-shadow: -1px -1px 0 #FFFFFF, 1px -1px 0 #FFFFFF, -1px 1px 0 #FFFFFF, 1px 1px 0 #FFFFFF;
|
|
}
|
|
i.icons .inverted.corner.icon {
|
|
text-shadow: -1px -1px 0 #1B1C1D, 1px -1px 0 #1B1C1D, -1px 1px 0 #1B1C1D, 1px 1px 0 #1B1C1D;
|
|
}
|
|
/*
|
|
* Font Awesome 4.6.3 by @davegandy - http://fontawesome.io - @fontawesome
|
|
* License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
|
|
*/
|
|
/*******************************
|
|
|
|
Semantic-UI integration of font-awesome :
|
|
|
|
///class names are separated
|
|
i.icon.circle => i.icon.circle
|
|
i.icon.circle-o => i.icon.circle.outline
|
|
|
|
//abbreviation are replaced by full letters:
|
|
i.icon.ellipsis-h => i.icon.ellipsis.horizontal
|
|
i.icon.ellipsis-v => i.icon.ellipsis.vertical
|
|
.alpha => .i.icon.alphabet
|
|
.asc => .i.icon.ascending
|
|
.desc => .i.icon.descending
|
|
.alt =>.alternate
|
|
|
|
ASCII order is conserved for easier maintenance.
|
|
|
|
Icons that only have one style 'outline', 'square' etc do not require this class
|
|
for instance `lemon icon` not `lemon outline icon` since there is only one lemon
|
|
|
|
*******************************/
|
|
/*******************************
|
|
Icons
|
|
*******************************/
|
|
/* Web Content */
|
|
i.icon.search:before {
|
|
content: "\f002";
|
|
}
|
|
i.icon.mail.outline:before {
|
|
content: "\f003";
|
|
}
|
|
i.icon.signal:before {
|
|
content: "\f012";
|
|
}
|
|
i.icon.setting:before {
|
|
content: "\f013";
|
|
}
|
|
i.icon.home:before {
|
|
content: "\f015";
|
|
}
|
|
i.icon.inbox:before {
|
|
content: "\f01c";
|
|
}
|
|
i.icon.browser:before {
|
|
content: "\f022";
|
|
}
|
|
i.icon.tag:before {
|
|
content: "\f02b";
|
|
}
|
|
i.icon.tags:before {
|
|
content: "\f02c";
|
|
}
|
|
i.icon.image:before {
|
|
content: "\f03e";
|
|
}
|
|
i.icon.calendar:before {
|
|
content: "\f073";
|
|
}
|
|
i.icon.comment:before {
|
|
content: "\f075";
|
|
}
|
|
i.icon.shop:before {
|
|
content: "\f07a";
|
|
}
|
|
i.icon.comments:before {
|
|
content: "\f086";
|
|
}
|
|
i.icon.external:before {
|
|
content: "\f08e";
|
|
}
|
|
i.icon.privacy:before {
|
|
content: "\f084";
|
|
}
|
|
i.icon.settings:before {
|
|
content: "\f085";
|
|
}
|
|
i.icon.comments:before {
|
|
content: "\f086";
|
|
}
|
|
i.icon.external:before {
|
|
content: "\f08e";
|
|
}
|
|
i.icon.trophy:before {
|
|
content: "\f091";
|
|
}
|
|
i.icon.payment:before {
|
|
content: "\f09d";
|
|
}
|
|
i.icon.feed:before {
|
|
content: "\f09e";
|
|
}
|
|
i.icon.alarm.outline:before {
|
|
content: "\f0a2";
|
|
}
|
|
i.icon.tasks:before {
|
|
content: "\f0ae";
|
|
}
|
|
i.icon.cloud:before {
|
|
content: "\f0c2";
|
|
}
|
|
i.icon.lab:before {
|
|
content: "\f0c3";
|
|
}
|
|
i.icon.mail:before {
|
|
content: "\f0e0";
|
|
}
|
|
i.icon.dashboard:before {
|
|
content: "\f0e4";
|
|
}
|
|
i.icon.comment.outline:before {
|
|
content: "\f0e5";
|
|
}
|
|
i.icon.comments.outline:before {
|
|
content: "\f0e6";
|
|
}
|
|
i.icon.sitemap:before {
|
|
content: "\f0e8";
|
|
}
|
|
i.icon.idea:before {
|
|
content: "\f0eb";
|
|
}
|
|
i.icon.alarm:before {
|
|
content: "\f0f3";
|
|
}
|
|
i.icon.terminal:before {
|
|
content: "\f120";
|
|
}
|
|
i.icon.code:before {
|
|
content: "\f121";
|
|
}
|
|
i.icon.protect:before {
|
|
content: "\f132";
|
|
}
|
|
i.icon.calendar.outline:before {
|
|
content: "\f133";
|
|
}
|
|
i.icon.ticket:before {
|
|
content: "\f145";
|
|
}
|
|
i.icon.external.square:before {
|
|
content: "\f14c";
|
|
}
|
|
i.icon.bug:before {
|
|
content: "\f188";
|
|
}
|
|
i.icon.mail.square:before {
|
|
content: "\f199";
|
|
}
|
|
i.icon.history:before {
|
|
content: "\f1da";
|
|
}
|
|
i.icon.options:before {
|
|
content: "\f1de";
|
|
}
|
|
i.icon.text.telephone:before {
|
|
content: "\f1e4";
|
|
}
|
|
i.icon.find:before {
|
|
content: "\f1e5";
|
|
}
|
|
i.icon.wifi:before {
|
|
content: "\f1eb";
|
|
}
|
|
i.icon.alarm.mute:before {
|
|
content: "\f1f6";
|
|
}
|
|
i.icon.alarm.mute.outline:before {
|
|
content: "\f1f7";
|
|
}
|
|
i.icon.copyright:before {
|
|
content: "\f1f9";
|
|
}
|
|
i.icon.at:before {
|
|
content: "\f1fa";
|
|
}
|
|
i.icon.eyedropper:before {
|
|
content: "\f1fb";
|
|
}
|
|
i.icon.paint.brush:before {
|
|
content: "\f1fc";
|
|
}
|
|
i.icon.heartbeat:before {
|
|
content: "\f21e";
|
|
}
|
|
i.icon.mouse.pointer:before {
|
|
content: "\f245";
|
|
}
|
|
i.icon.hourglass.empty:before {
|
|
content: "\f250";
|
|
}
|
|
i.icon.hourglass.start:before {
|
|
content: "\f251";
|
|
}
|
|
i.icon.hourglass.half:before {
|
|
content: "\f252";
|
|
}
|
|
i.icon.hourglass.end:before {
|
|
content: "\f253";
|
|
}
|
|
i.icon.hourglass.full:before {
|
|
content: "\f254";
|
|
}
|
|
i.icon.hand.pointer:before {
|
|
content: "\f25a";
|
|
}
|
|
i.icon.trademark:before {
|
|
content: "\f25c";
|
|
}
|
|
i.icon.registered:before {
|
|
content: "\f25d";
|
|
}
|
|
i.icon.creative.commons:before {
|
|
content: "\f25e";
|
|
}
|
|
i.icon.add.to.calendar:before {
|
|
content: "\f271";
|
|
}
|
|
i.icon.remove.from.calendar:before {
|
|
content: "\f272";
|
|
}
|
|
i.icon.delete.calendar:before {
|
|
content: "\f273";
|
|
}
|
|
i.icon.checked.calendar:before {
|
|
content: "\f274";
|
|
}
|
|
i.icon.industry:before {
|
|
content: "\f275";
|
|
}
|
|
i.icon.shopping.bag:before {
|
|
content: "\f290";
|
|
}
|
|
i.icon.shopping.basket:before {
|
|
content: "\f291";
|
|
}
|
|
i.icon.hashtag:before {
|
|
content: "\f292";
|
|
}
|
|
i.icon.percent:before {
|
|
content: "\f295";
|
|
}
|
|
/* User Actions */
|
|
i.icon.wait:before {
|
|
content: "\f017";
|
|
}
|
|
i.icon.download:before {
|
|
content: "\f019";
|
|
}
|
|
i.icon.repeat:before {
|
|
content: "\f01e";
|
|
}
|
|
i.icon.refresh:before {
|
|
content: "\f021";
|
|
}
|
|
i.icon.lock:before {
|
|
content: "\f023";
|
|
}
|
|
i.icon.bookmark:before {
|
|
content: "\f02e";
|
|
}
|
|
i.icon.print:before {
|
|
content: "\f02f";
|
|
}
|
|
i.icon.write:before {
|
|
content: "\f040";
|
|
}
|
|
i.icon.adjust:before {
|
|
content: "\f042";
|
|
}
|
|
i.icon.theme:before {
|
|
content: "\f043";
|
|
}
|
|
i.icon.edit:before {
|
|
content: "\f044";
|
|
}
|
|
i.icon.external.share:before {
|
|
content: "\f045";
|
|
}
|
|
i.icon.ban:before {
|
|
content: "\f05e";
|
|
}
|
|
i.icon.mail.forward:before {
|
|
content: "\f064";
|
|
}
|
|
i.icon.share:before {
|
|
content: "\f064";
|
|
}
|
|
i.icon.expand:before {
|
|
content: "\f065";
|
|
}
|
|
i.icon.compress:before {
|
|
content: "\f066";
|
|
}
|
|
i.icon.unhide:before {
|
|
content: "\f06e";
|
|
}
|
|
i.icon.hide:before {
|
|
content: "\f070";
|
|
}
|
|
i.icon.random:before {
|
|
content: "\f074";
|
|
}
|
|
i.icon.retweet:before {
|
|
content: "\f079";
|
|
}
|
|
i.icon.sign.out:before {
|
|
content: "\f08b";
|
|
}
|
|
i.icon.pin:before {
|
|
content: "\f08d";
|
|
}
|
|
i.icon.sign.in:before {
|
|
content: "\f090";
|
|
}
|
|
i.icon.upload:before {
|
|
content: "\f093";
|
|
}
|
|
i.icon.call:before {
|
|
content: "\f095";
|
|
}
|
|
i.icon.remove.bookmark:before {
|
|
content: "\f097";
|
|
}
|
|
i.icon.call.square:before {
|
|
content: "\f098";
|
|
}
|
|
i.icon.unlock:before {
|
|
content: "\f09c";
|
|
}
|
|
i.icon.configure:before {
|
|
content: "\f0ad";
|
|
}
|
|
i.icon.filter:before {
|
|
content: "\f0b0";
|
|
}
|
|
i.icon.wizard:before {
|
|
content: "\f0d0";
|
|
}
|
|
i.icon.undo:before {
|
|
content: "\f0e2";
|
|
}
|
|
i.icon.exchange:before {
|
|
content: "\f0ec";
|
|
}
|
|
i.icon.cloud.download:before {
|
|
content: "\f0ed";
|
|
}
|
|
i.icon.cloud.upload:before {
|
|
content: "\f0ee";
|
|
}
|
|
i.icon.reply:before {
|
|
content: "\f112";
|
|
}
|
|
i.icon.reply.all:before {
|
|
content: "\f122";
|
|
}
|
|
i.icon.erase:before {
|
|
content: "\f12d";
|
|
}
|
|
i.icon.unlock.alternate:before {
|
|
content: "\f13e";
|
|
}
|
|
i.icon.write.square:before {
|
|
content: "\f14b";
|
|
}
|
|
i.icon.share.square:before {
|
|
content: "\f14d";
|
|
}
|
|
i.icon.archive:before {
|
|
content: "\f187";
|
|
}
|
|
i.icon.translate:before {
|
|
content: "\f1ab";
|
|
}
|
|
i.icon.recycle:before {
|
|
content: "\f1b8";
|
|
}
|
|
i.icon.send:before {
|
|
content: "\f1d8";
|
|
}
|
|
i.icon.send.outline:before {
|
|
content: "\f1d9";
|
|
}
|
|
i.icon.share.alternate:before {
|
|
content: "\f1e0";
|
|
}
|
|
i.icon.share.alternate.square:before {
|
|
content: "\f1e1";
|
|
}
|
|
i.icon.add.to.cart:before {
|
|
content: "\f217";
|
|
}
|
|
i.icon.in.cart:before {
|
|
content: "\f218";
|
|
}
|
|
i.icon.add.user:before {
|
|
content: "\f234";
|
|
}
|
|
i.icon.remove.user:before {
|
|
content: "\f235";
|
|
}
|
|
i.icon.object.group:before {
|
|
content: "\f247";
|
|
}
|
|
i.icon.object.ungroup:before {
|
|
content: "\f248";
|
|
}
|
|
i.icon.clone:before {
|
|
content: "\f24d";
|
|
}
|
|
i.icon.talk:before {
|
|
content: "\f27a";
|
|
}
|
|
i.icon.talk.outline:before {
|
|
content: "\f27b";
|
|
}
|
|
/* Messages */
|
|
i.icon.help.circle:before {
|
|
content: "\f059";
|
|
}
|
|
i.icon.info.circle:before {
|
|
content: "\f05a";
|
|
}
|
|
i.icon.warning.circle:before {
|
|
content: "\f06a";
|
|
}
|
|
i.icon.warning.sign:before {
|
|
content: "\f071";
|
|
}
|
|
i.icon.announcement:before {
|
|
content: "\f0a1";
|
|
}
|
|
i.icon.help:before {
|
|
content: "\f128";
|
|
}
|
|
i.icon.info:before {
|
|
content: "\f129";
|
|
}
|
|
i.icon.warning:before {
|
|
content: "\f12a";
|
|
}
|
|
i.icon.birthday:before {
|
|
content: "\f1fd";
|
|
}
|
|
i.icon.help.circle.outline:before {
|
|
content: "\f29c";
|
|
}
|
|
/* Users */
|
|
i.icon.user:before {
|
|
content: "\f007";
|
|
}
|
|
i.icon.users:before {
|
|
content: "\f0c0";
|
|
}
|
|
i.icon.doctor:before {
|
|
content: "\f0f0";
|
|
}
|
|
i.icon.handicap:before {
|
|
content: "\f193";
|
|
}
|
|
i.icon.student:before {
|
|
content: "\f19d";
|
|
}
|
|
i.icon.child:before {
|
|
content: "\f1ae";
|
|
}
|
|
i.icon.spy:before {
|
|
content: "\f21b";
|
|
}
|
|
/* Gender & Sexuality */
|
|
i.icon.female:before {
|
|
content: "\f182";
|
|
}
|
|
i.icon.male:before {
|
|
content: "\f183";
|
|
}
|
|
i.icon.woman:before {
|
|
content: "\f221";
|
|
}
|
|
i.icon.man:before {
|
|
content: "\f222";
|
|
}
|
|
i.icon.non.binary.transgender:before {
|
|
content: "\f223";
|
|
}
|
|
i.icon.intergender:before {
|
|
content: "\f224";
|
|
}
|
|
i.icon.transgender:before {
|
|
content: "\f225";
|
|
}
|
|
i.icon.lesbian:before {
|
|
content: "\f226";
|
|
}
|
|
i.icon.gay:before {
|
|
content: "\f227";
|
|
}
|
|
i.icon.heterosexual:before {
|
|
content: "\f228";
|
|
}
|
|
i.icon.other.gender:before {
|
|
content: "\f229";
|
|
}
|
|
i.icon.other.gender.vertical:before {
|
|
content: "\f22a";
|
|
}
|
|
i.icon.other.gender.horizontal:before {
|
|
content: "\f22b";
|
|
}
|
|
i.icon.neuter:before {
|
|
content: "\f22c";
|
|
}
|
|
i.icon.genderless:before {
|
|
content: "\f22d";
|
|
}
|
|
/* Accessibility */
|
|
i.icon.universal.access:before {
|
|
content: "\f29a";
|
|
}
|
|
i.icon.wheelchair:before {
|
|
content: "\f29b";
|
|
}
|
|
i.icon.blind:before {
|
|
content: "\f29d";
|
|
}
|
|
i.icon.audio.description:before {
|
|
content: "\f29e";
|
|
}
|
|
i.icon.volume.control.phone:before {
|
|
content: "\f2a0";
|
|
}
|
|
i.icon.braille:before {
|
|
content: "\f2a1";
|
|
}
|
|
i.icon.asl:before {
|
|
content: "\f2a3";
|
|
}
|
|
i.icon.assistive.listening.systems:before {
|
|
content: "\f2a2";
|
|
}
|
|
i.icon.deafness:before {
|
|
content: "\f2a4";
|
|
}
|
|
i.icon.sign.language:before {
|
|
content: "\f2a7";
|
|
}
|
|
i.icon.low.vision:before {
|
|
content: "\f2a8";
|
|
}
|
|
/* View Adjustment */
|
|
i.icon.block.layout:before {
|
|
content: "\f009";
|
|
}
|
|
i.icon.grid.layout:before {
|
|
content: "\f00a";
|
|
}
|
|
i.icon.list.layout:before {
|
|
content: "\f00b";
|
|
}
|
|
i.icon.zoom:before {
|
|
content: "\f00e";
|
|
}
|
|
i.icon.zoom.out:before {
|
|
content: "\f010";
|
|
}
|
|
i.icon.resize.vertical:before {
|
|
content: "\f07d";
|
|
}
|
|
i.icon.resize.horizontal:before {
|
|
content: "\f07e";
|
|
}
|
|
i.icon.maximize:before {
|
|
content: "\f0b2";
|
|
}
|
|
i.icon.crop:before {
|
|
content: "\f125";
|
|
}
|
|
/* Literal Objects */
|
|
i.icon.cocktail:before {
|
|
content: "\f000";
|
|
}
|
|
i.icon.road:before {
|
|
content: "\f018";
|
|
}
|
|
i.icon.flag:before {
|
|
content: "\f024";
|
|
}
|
|
i.icon.book:before {
|
|
content: "\f02d";
|
|
}
|
|
i.icon.gift:before {
|
|
content: "\f06b";
|
|
}
|
|
i.icon.leaf:before {
|
|
content: "\f06c";
|
|
}
|
|
i.icon.fire:before {
|
|
content: "\f06d";
|
|
}
|
|
i.icon.plane:before {
|
|
content: "\f072";
|
|
}
|
|
i.icon.magnet:before {
|
|
content: "\f076";
|
|
}
|
|
i.icon.lemon:before {
|
|
content: "\f094";
|
|
}
|
|
i.icon.world:before {
|
|
content: "\f0ac";
|
|
}
|
|
i.icon.travel:before {
|
|
content: "\f0b1";
|
|
}
|
|
i.icon.shipping:before {
|
|
content: "\f0d1";
|
|
}
|
|
i.icon.money:before {
|
|
content: "\f0d6";
|
|
}
|
|
i.icon.legal:before {
|
|
content: "\f0e3";
|
|
}
|
|
i.icon.lightning:before {
|
|
content: "\f0e7";
|
|
}
|
|
i.icon.umbrella:before {
|
|
content: "\f0e9";
|
|
}
|
|
i.icon.treatment:before {
|
|
content: "\f0f1";
|
|
}
|
|
i.icon.suitcase:before {
|
|
content: "\f0f2";
|
|
}
|
|
i.icon.bar:before {
|
|
content: "\f0fc";
|
|
}
|
|
i.icon.flag.outline:before {
|
|
content: "\f11d";
|
|
}
|
|
i.icon.flag.checkered:before {
|
|
content: "\f11e";
|
|
}
|
|
i.icon.puzzle:before {
|
|
content: "\f12e";
|
|
}
|
|
i.icon.fire.extinguisher:before {
|
|
content: "\f134";
|
|
}
|
|
i.icon.rocket:before {
|
|
content: "\f135";
|
|
}
|
|
i.icon.anchor:before {
|
|
content: "\f13d";
|
|
}
|
|
i.icon.bullseye:before {
|
|
content: "\f140";
|
|
}
|
|
i.icon.sun:before {
|
|
content: "\f185";
|
|
}
|
|
i.icon.moon:before {
|
|
content: "\f186";
|
|
}
|
|
i.icon.fax:before {
|
|
content: "\f1ac";
|
|
}
|
|
i.icon.life.ring:before {
|
|
content: "\f1cd";
|
|
}
|
|
i.icon.bomb:before {
|
|
content: "\f1e2";
|
|
}
|
|
i.icon.soccer:before {
|
|
content: "\f1e3";
|
|
}
|
|
i.icon.calculator:before {
|
|
content: "\f1ec";
|
|
}
|
|
i.icon.diamond:before {
|
|
content: "\f219";
|
|
}
|
|
i.icon.sticky.note:before {
|
|
content: "\f249";
|
|
}
|
|
i.icon.sticky.note.outline:before {
|
|
content: "\f24a";
|
|
}
|
|
i.icon.law:before {
|
|
content: "\f24e";
|
|
}
|
|
i.icon.hand.peace:before {
|
|
content: "\f25b";
|
|
}
|
|
i.icon.hand.rock:before {
|
|
content: "\f255";
|
|
}
|
|
i.icon.hand.paper:before {
|
|
content: "\f256";
|
|
}
|
|
i.icon.hand.scissors:before {
|
|
content: "\f257";
|
|
}
|
|
i.icon.hand.lizard:before {
|
|
content: "\f258";
|
|
}
|
|
i.icon.hand.spock:before {
|
|
content: "\f259";
|
|
}
|
|
i.icon.tv:before {
|
|
content: "\f26c";
|
|
}
|
|
/* Shapes */
|
|
i.icon.crosshairs:before {
|
|
content: "\f05b";
|
|
}
|
|
i.icon.asterisk:before {
|
|
content: "\f069";
|
|
}
|
|
i.icon.square.outline:before {
|
|
content: "\f096";
|
|
}
|
|
i.icon.certificate:before {
|
|
content: "\f0a3";
|
|
}
|
|
i.icon.square:before {
|
|
content: "\f0c8";
|
|
}
|
|
i.icon.quote.left:before {
|
|
content: "\f10d";
|
|
}
|
|
i.icon.quote.right:before {
|
|
content: "\f10e";
|
|
}
|
|
i.icon.spinner:before {
|
|
content: "\f110";
|
|
}
|
|
i.icon.circle:before {
|
|
content: "\f111";
|
|
}
|
|
i.icon.ellipsis.horizontal:before {
|
|
content: "\f141";
|
|
}
|
|
i.icon.ellipsis.vertical:before {
|
|
content: "\f142";
|
|
}
|
|
i.icon.cube:before {
|
|
content: "\f1b2";
|
|
}
|
|
i.icon.cubes:before {
|
|
content: "\f1b3";
|
|
}
|
|
i.icon.circle.notched:before {
|
|
content: "\f1ce";
|
|
}
|
|
i.icon.circle.thin:before {
|
|
content: "\f1db";
|
|
}
|
|
/* Item Selection */
|
|
i.icon.checkmark:before {
|
|
content: "\f00c";
|
|
}
|
|
i.icon.remove:before {
|
|
content: "\f00d";
|
|
}
|
|
i.icon.checkmark.box:before {
|
|
content: "\f046";
|
|
}
|
|
i.icon.move:before {
|
|
content: "\f047";
|
|
}
|
|
i.icon.add.circle:before {
|
|
content: "\f055";
|
|
}
|
|
i.icon.minus.circle:before {
|
|
content: "\f056";
|
|
}
|
|
i.icon.remove.circle:before {
|
|
content: "\f057";
|
|
}
|
|
i.icon.check.circle:before {
|
|
content: "\f058";
|
|
}
|
|
i.icon.remove.circle.outline:before {
|
|
content: "\f05c";
|
|
}
|
|
i.icon.check.circle.outline:before {
|
|
content: "\f05d";
|
|
}
|
|
i.icon.plus:before {
|
|
content: "\f067";
|
|
}
|
|
i.icon.minus:before {
|
|
content: "\f068";
|
|
}
|
|
i.icon.add.square:before {
|
|
content: "\f0fe";
|
|
}
|
|
i.icon.radio:before {
|
|
content: "\f10c";
|
|
}
|
|
i.icon.minus.square:before {
|
|
content: "\f146";
|
|
}
|
|
i.icon.minus.square.outline:before {
|
|
content: "\f147";
|
|
}
|
|
i.icon.check.square:before {
|
|
content: "\f14a";
|
|
}
|
|
i.icon.selected.radio:before {
|
|
content: "\f192";
|
|
}
|
|
i.icon.plus.square.outline:before {
|
|
content: "\f196";
|
|
}
|
|
i.icon.toggle.off:before {
|
|
content: "\f204";
|
|
}
|
|
i.icon.toggle.on:before {
|
|
content: "\f205";
|
|
}
|
|
/* Media */
|
|
i.icon.film:before {
|
|
content: "\f008";
|
|
}
|
|
i.icon.sound:before {
|
|
content: "\f025";
|
|
}
|
|
i.icon.photo:before {
|
|
content: "\f030";
|
|
}
|
|
i.icon.bar.chart:before {
|
|
content: "\f080";
|
|
}
|
|
i.icon.camera.retro:before {
|
|
content: "\f083";
|
|
}
|
|
i.icon.newspaper:before {
|
|
content: "\f1ea";
|
|
}
|
|
i.icon.area.chart:before {
|
|
content: "\f1fe";
|
|
}
|
|
i.icon.pie.chart:before {
|
|
content: "\f200";
|
|
}
|
|
i.icon.line.chart:before {
|
|
content: "\f201";
|
|
}
|
|
/* Pointers */
|
|
i.icon.arrow.circle.outline.down:before {
|
|
content: "\f01a";
|
|
}
|
|
i.icon.arrow.circle.outline.up:before {
|
|
content: "\f01b";
|
|
}
|
|
i.icon.chevron.left:before {
|
|
content: "\f053";
|
|
}
|
|
i.icon.chevron.right:before {
|
|
content: "\f054";
|
|
}
|
|
i.icon.arrow.left:before {
|
|
content: "\f060";
|
|
}
|
|
i.icon.arrow.right:before {
|
|
content: "\f061";
|
|
}
|
|
i.icon.arrow.up:before {
|
|
content: "\f062";
|
|
}
|
|
i.icon.arrow.down:before {
|
|
content: "\f063";
|
|
}
|
|
i.icon.chevron.up:before {
|
|
content: "\f077";
|
|
}
|
|
i.icon.chevron.down:before {
|
|
content: "\f078";
|
|
}
|
|
i.icon.pointing.right:before {
|
|
content: "\f0a4";
|
|
}
|
|
i.icon.pointing.left:before {
|
|
content: "\f0a5";
|
|
}
|
|
i.icon.pointing.up:before {
|
|
content: "\f0a6";
|
|
}
|
|
i.icon.pointing.down:before {
|
|
content: "\f0a7";
|
|
}
|
|
i.icon.arrow.circle.left:before {
|
|
content: "\f0a8";
|
|
}
|
|
i.icon.arrow.circle.right:before {
|
|
content: "\f0a9";
|
|
}
|
|
i.icon.arrow.circle.up:before {
|
|
content: "\f0aa";
|
|
}
|
|
i.icon.arrow.circle.down:before {
|
|
content: "\f0ab";
|
|
}
|
|
i.icon.caret.down:before {
|
|
content: "\f0d7";
|
|
}
|
|
i.icon.caret.up:before {
|
|
content: "\f0d8";
|
|
}
|
|
i.icon.caret.left:before {
|
|
content: "\f0d9";
|
|
}
|
|
i.icon.caret.right:before {
|
|
content: "\f0da";
|
|
}
|
|
i.icon.angle.double.left:before {
|
|
content: "\f100";
|
|
}
|
|
i.icon.angle.double.right:before {
|
|
content: "\f101";
|
|
}
|
|
i.icon.angle.double.up:before {
|
|
content: "\f102";
|
|
}
|
|
i.icon.angle.double.down:before {
|
|
content: "\f103";
|
|
}
|
|
i.icon.angle.left:before {
|
|
content: "\f104";
|
|
}
|
|
i.icon.angle.right:before {
|
|
content: "\f105";
|
|
}
|
|
i.icon.angle.up:before {
|
|
content: "\f106";
|
|
}
|
|
i.icon.angle.down:before {
|
|
content: "\f107";
|
|
}
|
|
i.icon.chevron.circle.left:before {
|
|
content: "\f137";
|
|
}
|
|
i.icon.chevron.circle.right:before {
|
|
content: "\f138";
|
|
}
|
|
i.icon.chevron.circle.up:before {
|
|
content: "\f139";
|
|
}
|
|
i.icon.chevron.circle.down:before {
|
|
content: "\f13a";
|
|
}
|
|
i.icon.toggle.down:before {
|
|
content: "\f150";
|
|
}
|
|
i.icon.toggle.up:before {
|
|
content: "\f151";
|
|
}
|
|
i.icon.toggle.right:before {
|
|
content: "\f152";
|
|
}
|
|
i.icon.long.arrow.down:before {
|
|
content: "\f175";
|
|
}
|
|
i.icon.long.arrow.up:before {
|
|
content: "\f176";
|
|
}
|
|
i.icon.long.arrow.left:before {
|
|
content: "\f177";
|
|
}
|
|
i.icon.long.arrow.right:before {
|
|
content: "\f178";
|
|
}
|
|
i.icon.arrow.circle.outline.right:before {
|
|
content: "\f18e";
|
|
}
|
|
i.icon.arrow.circle.outline.left:before {
|
|
content: "\f190";
|
|
}
|
|
i.icon.toggle.left:before {
|
|
content: "\f191";
|
|
}
|
|
/* Mobile */
|
|
i.icon.tablet:before {
|
|
content: "\f10a";
|
|
}
|
|
i.icon.mobile:before {
|
|
content: "\f10b";
|
|
}
|
|
i.icon.battery.full:before {
|
|
content: "\f240";
|
|
}
|
|
i.icon.battery.high:before {
|
|
content: "\f241";
|
|
}
|
|
i.icon.battery.medium:before {
|
|
content: "\f242";
|
|
}
|
|
i.icon.battery.low:before {
|
|
content: "\f243";
|
|
}
|
|
i.icon.battery.empty:before {
|
|
content: "\f244";
|
|
}
|
|
/* Computer */
|
|
i.icon.power:before {
|
|
content: "\f011";
|
|
}
|
|
i.icon.trash.outline:before {
|
|
content: "\f014";
|
|
}
|
|
i.icon.disk.outline:before {
|
|
content: "\f0a0";
|
|
}
|
|
i.icon.desktop:before {
|
|
content: "\f108";
|
|
}
|
|
i.icon.laptop:before {
|
|
content: "\f109";
|
|
}
|
|
i.icon.game:before {
|
|
content: "\f11b";
|
|
}
|
|
i.icon.keyboard:before {
|
|
content: "\f11c";
|
|
}
|
|
i.icon.plug:before {
|
|
content: "\f1e6";
|
|
}
|
|
/* File System */
|
|
i.icon.trash:before {
|
|
content: "\f1f8";
|
|
}
|
|
i.icon.file.outline:before {
|
|
content: "\f016";
|
|
}
|
|
i.icon.folder:before {
|
|
content: "\f07b";
|
|
}
|
|
i.icon.folder.open:before {
|
|
content: "\f07c";
|
|
}
|
|
i.icon.file.text.outline:before {
|
|
content: "\f0f6";
|
|
}
|
|
i.icon.folder.outline:before {
|
|
content: "\f114";
|
|
}
|
|
i.icon.folder.open.outline:before {
|
|
content: "\f115";
|
|
}
|
|
i.icon.level.up:before {
|
|
content: "\f148";
|
|
}
|
|
i.icon.level.down:before {
|
|
content: "\f149";
|
|
}
|
|
i.icon.file:before {
|
|
content: "\f15b";
|
|
}
|
|
i.icon.file.text:before {
|
|
content: "\f15c";
|
|
}
|
|
i.icon.file.pdf.outline:before {
|
|
content: "\f1c1";
|
|
}
|
|
i.icon.file.word.outline:before {
|
|
content: "\f1c2";
|
|
}
|
|
i.icon.file.excel.outline:before {
|
|
content: "\f1c3";
|
|
}
|
|
i.icon.file.powerpoint.outline:before {
|
|
content: "\f1c4";
|
|
}
|
|
i.icon.file.image.outline:before {
|
|
content: "\f1c5";
|
|
}
|
|
i.icon.file.archive.outline:before {
|
|
content: "\f1c6";
|
|
}
|
|
i.icon.file.audio.outline:before {
|
|
content: "\f1c7";
|
|
}
|
|
i.icon.file.video.outline:before {
|
|
content: "\f1c8";
|
|
}
|
|
i.icon.file.code.outline:before {
|
|
content: "\f1c9";
|
|
}
|
|
/* Technologies */
|
|
i.icon.qrcode:before {
|
|
content: "\f029";
|
|
}
|
|
i.icon.barcode:before {
|
|
content: "\f02a";
|
|
}
|
|
i.icon.rss:before {
|
|
content: "\f09e";
|
|
}
|
|
i.icon.fork:before {
|
|
content: "\f126";
|
|
}
|
|
i.icon.html5:before {
|
|
content: "\f13b";
|
|
}
|
|
i.icon.css3:before {
|
|
content: "\f13c";
|
|
}
|
|
i.icon.rss.square:before {
|
|
content: "\f143";
|
|
}
|
|
i.icon.openid:before {
|
|
content: "\f19b";
|
|
}
|
|
i.icon.database:before {
|
|
content: "\f1c0";
|
|
}
|
|
i.icon.server:before {
|
|
content: "\f233";
|
|
}
|
|
i.icon.usb:before {
|
|
content: "\f287";
|
|
}
|
|
i.icon.bluetooth:before {
|
|
content: "\f293";
|
|
}
|
|
i.icon.bluetooth.alternative:before {
|
|
content: "\f294";
|
|
}
|
|
/* Rating */
|
|
i.icon.heart:before {
|
|
content: "\f004";
|
|
}
|
|
i.icon.star:before {
|
|
content: "\f005";
|
|
}
|
|
i.icon.empty.star:before {
|
|
content: "\f006";
|
|
}
|
|
i.icon.thumbs.outline.up:before {
|
|
content: "\f087";
|
|
}
|
|
i.icon.thumbs.outline.down:before {
|
|
content: "\f088";
|
|
}
|
|
i.icon.star.half:before {
|
|
content: "\f089";
|
|
}
|
|
i.icon.empty.heart:before {
|
|
content: "\f08a";
|
|
}
|
|
i.icon.smile:before {
|
|
content: "\f118";
|
|
}
|
|
i.icon.frown:before {
|
|
content: "\f119";
|
|
}
|
|
i.icon.meh:before {
|
|
content: "\f11a";
|
|
}
|
|
i.icon.star.half.empty:before {
|
|
content: "\f123";
|
|
}
|
|
i.icon.thumbs.up:before {
|
|
content: "\f164";
|
|
}
|
|
i.icon.thumbs.down:before {
|
|
content: "\f165";
|
|
}
|
|
/* Audio */
|
|
i.icon.music:before {
|
|
content: "\f001";
|
|
}
|
|
i.icon.video.play.outline:before {
|
|
content: "\f01d";
|
|
}
|
|
i.icon.volume.off:before {
|
|
content: "\f026";
|
|
}
|
|
i.icon.volume.down:before {
|
|
content: "\f027";
|
|
}
|
|
i.icon.volume.up:before {
|
|
content: "\f028";
|
|
}
|
|
i.icon.record:before {
|
|
content: "\f03d";
|
|
}
|
|
i.icon.step.backward:before {
|
|
content: "\f048";
|
|
}
|
|
i.icon.fast.backward:before {
|
|
content: "\f049";
|
|
}
|
|
i.icon.backward:before {
|
|
content: "\f04a";
|
|
}
|
|
i.icon.play:before {
|
|
content: "\f04b";
|
|
}
|
|
i.icon.pause:before {
|
|
content: "\f04c";
|
|
}
|
|
i.icon.stop:before {
|
|
content: "\f04d";
|
|
}
|
|
i.icon.forward:before {
|
|
content: "\f04e";
|
|
}
|
|
i.icon.fast.forward:before {
|
|
content: "\f050";
|
|
}
|
|
i.icon.step.forward:before {
|
|
content: "\f051";
|
|
}
|
|
i.icon.eject:before {
|
|
content: "\f052";
|
|
}
|
|
i.icon.unmute:before {
|
|
content: "\f130";
|
|
}
|
|
i.icon.mute:before {
|
|
content: "\f131";
|
|
}
|
|
i.icon.video.play:before {
|
|
content: "\f144";
|
|
}
|
|
i.icon.closed.captioning:before {
|
|
content: "\f20a";
|
|
}
|
|
i.icon.pause.circle:before {
|
|
content: "\f28b";
|
|
}
|
|
i.icon.pause.circle.outline:before {
|
|
content: "\f28c";
|
|
}
|
|
i.icon.stop.circle:before {
|
|
content: "\f28d";
|
|
}
|
|
i.icon.stop.circle.outline:before {
|
|
content: "\f28e";
|
|
}
|
|
/* Map, Locations, & Transportation */
|
|
i.icon.marker:before {
|
|
content: "\f041";
|
|
}
|
|
i.icon.coffee:before {
|
|
content: "\f0f4";
|
|
}
|
|
i.icon.food:before {
|
|
content: "\f0f5";
|
|
}
|
|
i.icon.building.outline:before {
|
|
content: "\f0f7";
|
|
}
|
|
i.icon.hospital:before {
|
|
content: "\f0f8";
|
|
}
|
|
i.icon.emergency:before {
|
|
content: "\f0f9";
|
|
}
|
|
i.icon.first.aid:before {
|
|
content: "\f0fa";
|
|
}
|
|
i.icon.military:before {
|
|
content: "\f0fb";
|
|
}
|
|
i.icon.h:before {
|
|
content: "\f0fd";
|
|
}
|
|
i.icon.location.arrow:before {
|
|
content: "\f124";
|
|
}
|
|
i.icon.compass:before {
|
|
content: "\f14e";
|
|
}
|
|
i.icon.space.shuttle:before {
|
|
content: "\f197";
|
|
}
|
|
i.icon.university:before {
|
|
content: "\f19c";
|
|
}
|
|
i.icon.building:before {
|
|
content: "\f1ad";
|
|
}
|
|
i.icon.paw:before {
|
|
content: "\f1b0";
|
|
}
|
|
i.icon.spoon:before {
|
|
content: "\f1b1";
|
|
}
|
|
i.icon.car:before {
|
|
content: "\f1b9";
|
|
}
|
|
i.icon.taxi:before {
|
|
content: "\f1ba";
|
|
}
|
|
i.icon.tree:before {
|
|
content: "\f1bb";
|
|
}
|
|
i.icon.bicycle:before {
|
|
content: "\f206";
|
|
}
|
|
i.icon.bus:before {
|
|
content: "\f207";
|
|
}
|
|
i.icon.ship:before {
|
|
content: "\f21a";
|
|
}
|
|
i.icon.motorcycle:before {
|
|
content: "\f21c";
|
|
}
|
|
i.icon.street.view:before {
|
|
content: "\f21d";
|
|
}
|
|
i.icon.hotel:before {
|
|
content: "\f236";
|
|
}
|
|
i.icon.train:before {
|
|
content: "\f238";
|
|
}
|
|
i.icon.subway:before {
|
|
content: "\f239";
|
|
}
|
|
i.icon.map.pin:before {
|
|
content: "\f276";
|
|
}
|
|
i.icon.map.signs:before {
|
|
content: "\f277";
|
|
}
|
|
i.icon.map.outline:before {
|
|
content: "\f278";
|
|
}
|
|
i.icon.map:before {
|
|
content: "\f279";
|
|
}
|
|
/* Tables */
|
|
i.icon.table:before {
|
|
content: "\f0ce";
|
|
}
|
|
i.icon.columns:before {
|
|
content: "\f0db";
|
|
}
|
|
i.icon.sort:before {
|
|
content: "\f0dc";
|
|
}
|
|
i.icon.sort.descending:before {
|
|
content: "\f0dd";
|
|
}
|
|
i.icon.sort.ascending:before {
|
|
content: "\f0de";
|
|
}
|
|
i.icon.sort.alphabet.ascending:before {
|
|
content: "\f15d";
|
|
}
|
|
i.icon.sort.alphabet.descending:before {
|
|
content: "\f15e";
|
|
}
|
|
i.icon.sort.content.ascending:before {
|
|
content: "\f160";
|
|
}
|
|
i.icon.sort.content.descending:before {
|
|
content: "\f161";
|
|
}
|
|
i.icon.sort.numeric.ascending:before {
|
|
content: "\f162";
|
|
}
|
|
i.icon.sort.numeric.descending:before {
|
|
content: "\f163";
|
|
}
|
|
/* Text Editor */
|
|
i.icon.font:before {
|
|
content: "\f031";
|
|
}
|
|
i.icon.bold:before {
|
|
content: "\f032";
|
|
}
|
|
i.icon.italic:before {
|
|
content: "\f033";
|
|
}
|
|
i.icon.text.height:before {
|
|
content: "\f034";
|
|
}
|
|
i.icon.text.width:before {
|
|
content: "\f035";
|
|
}
|
|
i.icon.align.left:before {
|
|
content: "\f036";
|
|
}
|
|
i.icon.align.center:before {
|
|
content: "\f037";
|
|
}
|
|
i.icon.align.right:before {
|
|
content: "\f038";
|
|
}
|
|
i.icon.align.justify:before {
|
|
content: "\f039";
|
|
}
|
|
i.icon.list:before {
|
|
content: "\f03a";
|
|
}
|
|
i.icon.outdent:before {
|
|
content: "\f03b";
|
|
}
|
|
i.icon.indent:before {
|
|
content: "\f03c";
|
|
}
|
|
i.icon.linkify:before {
|
|
content: "\f0c1";
|
|
}
|
|
i.icon.cut:before {
|
|
content: "\f0c4";
|
|
}
|
|
i.icon.copy:before {
|
|
content: "\f0c5";
|
|
}
|
|
i.icon.attach:before {
|
|
content: "\f0c6";
|
|
}
|
|
i.icon.save:before {
|
|
content: "\f0c7";
|
|
}
|
|
i.icon.content:before {
|
|
content: "\f0c9";
|
|
}
|
|
i.icon.unordered.list:before {
|
|
content: "\f0ca";
|
|
}
|
|
i.icon.ordered.list:before {
|
|
content: "\f0cb";
|
|
}
|
|
i.icon.strikethrough:before {
|
|
content: "\f0cc";
|
|
}
|
|
i.icon.underline:before {
|
|
content: "\f0cd";
|
|
}
|
|
i.icon.paste:before {
|
|
content: "\f0ea";
|
|
}
|
|
i.icon.unlinkify:before {
|
|
content: "\f127";
|
|
}
|
|
i.icon.superscript:before {
|
|
content: "\f12b";
|
|
}
|
|
i.icon.subscript:before {
|
|
content: "\f12c";
|
|
}
|
|
i.icon.header:before {
|
|
content: "\f1dc";
|
|
}
|
|
i.icon.paragraph:before {
|
|
content: "\f1dd";
|
|
}
|
|
i.icon.text.cursor:before {
|
|
content: "\f246";
|
|
}
|
|
/* Currency */
|
|
i.icon.euro:before {
|
|
content: "\f153";
|
|
}
|
|
i.icon.pound:before {
|
|
content: "\f154";
|
|
}
|
|
i.icon.dollar:before {
|
|
content: "\f155";
|
|
}
|
|
i.icon.rupee:before {
|
|
content: "\f156";
|
|
}
|
|
i.icon.yen:before {
|
|
content: "\f157";
|
|
}
|
|
i.icon.ruble:before {
|
|
content: "\f158";
|
|
}
|
|
i.icon.won:before {
|
|
content: "\f159";
|
|
}
|
|
i.icon.bitcoin:before {
|
|
content: "\f15a";
|
|
}
|
|
i.icon.lira:before {
|
|
content: "\f195";
|
|
}
|
|
i.icon.shekel:before {
|
|
content: "\f20b";
|
|
}
|
|
/* Payment Options */
|
|
i.icon.paypal:before {
|
|
content: "\f1ed";
|
|
}
|
|
i.icon.google.wallet:before {
|
|
content: "\f1ee";
|
|
}
|
|
i.icon.visa:before {
|
|
content: "\f1f0";
|
|
}
|
|
i.icon.mastercard:before {
|
|
content: "\f1f1";
|
|
}
|
|
i.icon.discover:before {
|
|
content: "\f1f2";
|
|
}
|
|
i.icon.american.express:before {
|
|
content: "\f1f3";
|
|
}
|
|
i.icon.paypal.card:before {
|
|
content: "\f1f4";
|
|
}
|
|
i.icon.stripe:before {
|
|
content: "\f1f5";
|
|
}
|
|
i.icon.japan.credit.bureau:before {
|
|
content: "\f24b";
|
|
}
|
|
i.icon.diners.club:before {
|
|
content: "\f24c";
|
|
}
|
|
i.icon.credit.card.alternative:before {
|
|
content: "\f283";
|
|
}
|
|
/* Networks and Websites*/
|
|
i.icon.twitter.square:before {
|
|
content: "\f081";
|
|
}
|
|
i.icon.facebook.square:before {
|
|
content: "\f082";
|
|
}
|
|
i.icon.linkedin.square:before {
|
|
content: "\f08c";
|
|
}
|
|
i.icon.github.square:before {
|
|
content: "\f092";
|
|
}
|
|
i.icon.twitter:before {
|
|
content: "\f099";
|
|
}
|
|
i.icon.facebook.f:before {
|
|
content: "\f09a";
|
|
}
|
|
i.icon.github:before {
|
|
content: "\f09b";
|
|
}
|
|
i.icon.pinterest:before {
|
|
content: "\f0d2";
|
|
}
|
|
i.icon.pinterest.square:before {
|
|
content: "\f0d3";
|
|
}
|
|
i.icon.google.plus.square:before {
|
|
content: "\f0d4";
|
|
}
|
|
i.icon.google.plus:before {
|
|
content: "\f0d5";
|
|
}
|
|
i.icon.linkedin:before {
|
|
content: "\f0e1";
|
|
}
|
|
i.icon.github.alternate:before {
|
|
content: "\f113";
|
|
}
|
|
i.icon.maxcdn:before {
|
|
content: "\f136";
|
|
}
|
|
i.icon.youtube.square:before {
|
|
content: "\f166";
|
|
}
|
|
i.icon.youtube:before {
|
|
content: "\f167";
|
|
}
|
|
i.icon.xing:before {
|
|
content: "\f168";
|
|
}
|
|
i.icon.xing.square:before {
|
|
content: "\f169";
|
|
}
|
|
i.icon.youtube.play:before {
|
|
content: "\f16a";
|
|
}
|
|
i.icon.dropbox:before {
|
|
content: "\f16b";
|
|
}
|
|
i.icon.stack.overflow:before {
|
|
content: "\f16c";
|
|
}
|
|
i.icon.instagram:before {
|
|
content: "\f16d";
|
|
}
|
|
i.icon.flickr:before {
|
|
content: "\f16e";
|
|
}
|
|
i.icon.adn:before {
|
|
content: "\f170";
|
|
}
|
|
i.icon.bitbucket:before {
|
|
content: "\f171";
|
|
}
|
|
i.icon.bitbucket.square:before {
|
|
content: "\f172";
|
|
}
|
|
i.icon.tumblr:before {
|
|
content: "\f173";
|
|
}
|
|
i.icon.tumblr.square:before {
|
|
content: "\f174";
|
|
}
|
|
i.icon.apple:before {
|
|
content: "\f179";
|
|
}
|
|
i.icon.windows:before {
|
|
content: "\f17a";
|
|
}
|
|
i.icon.android:before {
|
|
content: "\f17b";
|
|
}
|
|
i.icon.linux:before {
|
|
content: "\f17c";
|
|
}
|
|
i.icon.dribble:before {
|
|
content: "\f17d";
|
|
}
|
|
i.icon.skype:before {
|
|
content: "\f17e";
|
|
}
|
|
i.icon.foursquare:before {
|
|
content: "\f180";
|
|
}
|
|
i.icon.trello:before {
|
|
content: "\f181";
|
|
}
|
|
i.icon.gittip:before {
|
|
content: "\f184";
|
|
}
|
|
i.icon.vk:before {
|
|
content: "\f189";
|
|
}
|
|
i.icon.weibo:before {
|
|
content: "\f18a";
|
|
}
|
|
i.icon.renren:before {
|
|
content: "\f18b";
|
|
}
|
|
i.icon.pagelines:before {
|
|
content: "\f18c";
|
|
}
|
|
i.icon.stack.exchange:before {
|
|
content: "\f18d";
|
|
}
|
|
i.icon.vimeo.square:before {
|
|
content: "\f194";
|
|
}
|
|
i.icon.slack:before {
|
|
content: "\f198";
|
|
}
|
|
i.icon.wordpress:before {
|
|
content: "\f19a";
|
|
}
|
|
i.icon.yahoo:before {
|
|
content: "\f19e";
|
|
}
|
|
i.icon.google:before {
|
|
content: "\f1a0";
|
|
}
|
|
i.icon.reddit:before {
|
|
content: "\f1a1";
|
|
}
|
|
i.icon.reddit.square:before {
|
|
content: "\f1a2";
|
|
}
|
|
i.icon.stumbleupon.circle:before {
|
|
content: "\f1a3";
|
|
}
|
|
i.icon.stumbleupon:before {
|
|
content: "\f1a4";
|
|
}
|
|
i.icon.delicious:before {
|
|
content: "\f1a5";
|
|
}
|
|
i.icon.digg:before {
|
|
content: "\f1a6";
|
|
}
|
|
i.icon.pied.piper:before {
|
|
content: "\f1a7";
|
|
}
|
|
i.icon.pied.piper.alternate:before {
|
|
content: "\f1a8";
|
|
}
|
|
i.icon.drupal:before {
|
|
content: "\f1a9";
|
|
}
|
|
i.icon.joomla:before {
|
|
content: "\f1aa";
|
|
}
|
|
i.icon.behance:before {
|
|
content: "\f1b4";
|
|
}
|
|
i.icon.behance.square:before {
|
|
content: "\f1b5";
|
|
}
|
|
i.icon.steam:before {
|
|
content: "\f1b6";
|
|
}
|
|
i.icon.steam.square:before {
|
|
content: "\f1b7";
|
|
}
|
|
i.icon.spotify:before {
|
|
content: "\f1bc";
|
|
}
|
|
i.icon.deviantart:before {
|
|
content: "\f1bd";
|
|
}
|
|
i.icon.soundcloud:before {
|
|
content: "\f1be";
|
|
}
|
|
i.icon.vine:before {
|
|
content: "\f1ca";
|
|
}
|
|
i.icon.codepen:before {
|
|
content: "\f1cb";
|
|
}
|
|
i.icon.jsfiddle:before {
|
|
content: "\f1cc";
|
|
}
|
|
i.icon.rebel:before {
|
|
content: "\f1d0";
|
|
}
|
|
i.icon.empire:before {
|
|
content: "\f1d1";
|
|
}
|
|
i.icon.git.square:before {
|
|
content: "\f1d2";
|
|
}
|
|
i.icon.git:before {
|
|
content: "\f1d3";
|
|
}
|
|
i.icon.hacker.news:before {
|
|
content: "\f1d4";
|
|
}
|
|
i.icon.tencent.weibo:before {
|
|
content: "\f1d5";
|
|
}
|
|
i.icon.qq:before {
|
|
content: "\f1d6";
|
|
}
|
|
i.icon.wechat:before {
|
|
content: "\f1d7";
|
|
}
|
|
i.icon.slideshare:before {
|
|
content: "\f1e7";
|
|
}
|
|
i.icon.twitch:before {
|
|
content: "\f1e8";
|
|
}
|
|
i.icon.yelp:before {
|
|
content: "\f1e9";
|
|
}
|
|
i.icon.lastfm:before {
|
|
content: "\f202";
|
|
}
|
|
i.icon.lastfm.square:before {
|
|
content: "\f203";
|
|
}
|
|
i.icon.ioxhost:before {
|
|
content: "\f208";
|
|
}
|
|
i.icon.angellist:before {
|
|
content: "\f209";
|
|
}
|
|
i.icon.meanpath:before {
|
|
content: "\f20c";
|
|
}
|
|
i.icon.buysellads:before {
|
|
content: "\f20d";
|
|
}
|
|
i.icon.connectdevelop:before {
|
|
content: "\f20e";
|
|
}
|
|
i.icon.dashcube:before {
|
|
content: "\f210";
|
|
}
|
|
i.icon.forumbee:before {
|
|
content: "\f211";
|
|
}
|
|
i.icon.leanpub:before {
|
|
content: "\f212";
|
|
}
|
|
i.icon.sellsy:before {
|
|
content: "\f213";
|
|
}
|
|
i.icon.shirtsinbulk:before {
|
|
content: "\f214";
|
|
}
|
|
i.icon.simplybuilt:before {
|
|
content: "\f215";
|
|
}
|
|
i.icon.skyatlas:before {
|
|
content: "\f216";
|
|
}
|
|
i.icon.facebook:before {
|
|
content: "\f230";
|
|
}
|
|
i.icon.pinterest:before {
|
|
content: "\f231";
|
|
}
|
|
i.icon.whatsapp:before {
|
|
content: "\f232";
|
|
}
|
|
i.icon.viacoin:before {
|
|
content: "\f237";
|
|
}
|
|
i.icon.medium:before {
|
|
content: "\f23a";
|
|
}
|
|
i.icon.y.combinator:before {
|
|
content: "\f23b";
|
|
}
|
|
i.icon.optinmonster:before {
|
|
content: "\f23c";
|
|
}
|
|
i.icon.opencart:before {
|
|
content: "\f23d";
|
|
}
|
|
i.icon.expeditedssl:before {
|
|
content: "\f23e";
|
|
}
|
|
i.icon.gg:before {
|
|
content: "\f260";
|
|
}
|
|
i.icon.gg.circle:before {
|
|
content: "\f261";
|
|
}
|
|
i.icon.tripadvisor:before {
|
|
content: "\f262";
|
|
}
|
|
i.icon.odnoklassniki:before {
|
|
content: "\f263";
|
|
}
|
|
i.icon.odnoklassniki.square:before {
|
|
content: "\f264";
|
|
}
|
|
i.icon.pocket:before {
|
|
content: "\f265";
|
|
}
|
|
i.icon.wikipedia:before {
|
|
content: "\f266";
|
|
}
|
|
i.icon.safari:before {
|
|
content: "\f267";
|
|
}
|
|
i.icon.chrome:before {
|
|
content: "\f268";
|
|
}
|
|
i.icon.firefox:before {
|
|
content: "\f269";
|
|
}
|
|
i.icon.opera:before {
|
|
content: "\f26a";
|
|
}
|
|
i.icon.internet.explorer:before {
|
|
content: "\f26b";
|
|
}
|
|
i.icon.contao:before {
|
|
content: "\f26d";
|
|
}
|
|
i.icon.\35 00px:before {
|
|
content: "\f26e";
|
|
}
|
|
i.icon.amazon:before {
|
|
content: "\f270";
|
|
}
|
|
i.icon.houzz:before {
|
|
content: "\f27c";
|
|
}
|
|
i.icon.vimeo:before {
|
|
content: "\f27d";
|
|
}
|
|
i.icon.black.tie:before {
|
|
content: "\f27e";
|
|
}
|
|
i.icon.fonticons:before {
|
|
content: "\f280";
|
|
}
|
|
i.icon.reddit.alien:before {
|
|
content: "\f281";
|
|
}
|
|
i.icon.microsoft.edge:before {
|
|
content: "\f282";
|
|
}
|
|
i.icon.codiepie:before {
|
|
content: "\f284";
|
|
}
|
|
i.icon.modx:before {
|
|
content: "\f285";
|
|
}
|
|
i.icon.fort.awesome:before {
|
|
content: "\f286";
|
|
}
|
|
i.icon.product.hunt:before {
|
|
content: "\f288";
|
|
}
|
|
i.icon.mixcloud:before {
|
|
content: "\f289";
|
|
}
|
|
i.icon.scribd:before {
|
|
content: "\f28a";
|
|
}
|
|
i.icon.gitlab:before {
|
|
content: "\f296";
|
|
}
|
|
i.icon.wpbeginner:before {
|
|
content: "\f297";
|
|
}
|
|
i.icon.wpforms:before {
|
|
content: "\f298";
|
|
}
|
|
i.icon.envira.gallery:before {
|
|
content: "\f299";
|
|
}
|
|
i.icon.glide:before {
|
|
content: "\f2a5";
|
|
}
|
|
i.icon.glide.g:before {
|
|
content: "\f2a6";
|
|
}
|
|
i.icon.viadeo:before {
|
|
content: "\f2a9";
|
|
}
|
|
i.icon.viadeo.square:before {
|
|
content: "\f2aa";
|
|
}
|
|
i.icon.snapchat:before {
|
|
content: "\f2ab";
|
|
}
|
|
i.icon.snapchat.ghost:before {
|
|
content: "\f2ac";
|
|
}
|
|
i.icon.snapchat.square:before {
|
|
content: "\f2ad";
|
|
}
|
|
i.icon.pied.piper.hat:before {
|
|
content: "\f2ae";
|
|
}
|
|
i.icon.first.order:before {
|
|
content: "\f2b0";
|
|
}
|
|
i.icon.yoast:before {
|
|
content: "\f2b1";
|
|
}
|
|
i.icon.themeisle:before {
|
|
content: "\f2b2";
|
|
}
|
|
i.icon.google.plus.circle:before {
|
|
content: "\f2b3";
|
|
}
|
|
i.icon.font.awesome:before {
|
|
content: "\f2b4";
|
|
}
|
|
/*******************************
|
|
Aliases
|
|
*******************************/
|
|
i.icon.like:before {
|
|
content: "\f004";
|
|
}
|
|
i.icon.favorite:before {
|
|
content: "\f005";
|
|
}
|
|
i.icon.video:before {
|
|
content: "\f008";
|
|
}
|
|
i.icon.check:before {
|
|
content: "\f00c";
|
|
}
|
|
i.icon.close:before {
|
|
content: "\f00d";
|
|
}
|
|
i.icon.cancel:before {
|
|
content: "\f00d";
|
|
}
|
|
i.icon.delete:before {
|
|
content: "\f00d";
|
|
}
|
|
i.icon.x:before {
|
|
content: "\f00d";
|
|
}
|
|
i.icon.zoom.in:before {
|
|
content: "\f00e";
|
|
}
|
|
i.icon.magnify:before {
|
|
content: "\f00e";
|
|
}
|
|
i.icon.shutdown:before {
|
|
content: "\f011";
|
|
}
|
|
i.icon.clock:before {
|
|
content: "\f017";
|
|
}
|
|
i.icon.time:before {
|
|
content: "\f017";
|
|
}
|
|
i.icon.play.circle.outline:before {
|
|
content: "\f01d";
|
|
}
|
|
i.icon.headphone:before {
|
|
content: "\f025";
|
|
}
|
|
i.icon.camera:before {
|
|
content: "\f030";
|
|
}
|
|
i.icon.video.camera:before {
|
|
content: "\f03d";
|
|
}
|
|
i.icon.picture:before {
|
|
content: "\f03e";
|
|
}
|
|
i.icon.pencil:before {
|
|
content: "\f040";
|
|
}
|
|
i.icon.compose:before {
|
|
content: "\f040";
|
|
}
|
|
i.icon.point:before {
|
|
content: "\f041";
|
|
}
|
|
i.icon.tint:before {
|
|
content: "\f043";
|
|
}
|
|
i.icon.signup:before {
|
|
content: "\f044";
|
|
}
|
|
i.icon.plus.circle:before {
|
|
content: "\f055";
|
|
}
|
|
i.icon.question.circle:before {
|
|
content: "\f059";
|
|
}
|
|
i.icon.dont:before {
|
|
content: "\f05e";
|
|
}
|
|
i.icon.minimize:before {
|
|
content: "\f066";
|
|
}
|
|
i.icon.add:before {
|
|
content: "\f067";
|
|
}
|
|
i.icon.exclamation.circle:before {
|
|
content: "\f06a";
|
|
}
|
|
i.icon.attention:before {
|
|
content: "\f06a";
|
|
}
|
|
i.icon.eye:before {
|
|
content: "\f06e";
|
|
}
|
|
i.icon.exclamation.triangle:before {
|
|
content: "\f071";
|
|
}
|
|
i.icon.shuffle:before {
|
|
content: "\f074";
|
|
}
|
|
i.icon.chat:before {
|
|
content: "\f075";
|
|
}
|
|
i.icon.cart:before {
|
|
content: "\f07a";
|
|
}
|
|
i.icon.shopping.cart:before {
|
|
content: "\f07a";
|
|
}
|
|
i.icon.bar.graph:before {
|
|
content: "\f080";
|
|
}
|
|
i.icon.key:before {
|
|
content: "\f084";
|
|
}
|
|
i.icon.cogs:before {
|
|
content: "\f085";
|
|
}
|
|
i.icon.discussions:before {
|
|
content: "\f086";
|
|
}
|
|
i.icon.like.outline:before {
|
|
content: "\f087";
|
|
}
|
|
i.icon.dislike.outline:before {
|
|
content: "\f088";
|
|
}
|
|
i.icon.heart.outline:before {
|
|
content: "\f08a";
|
|
}
|
|
i.icon.log.out:before {
|
|
content: "\f08b";
|
|
}
|
|
i.icon.thumb.tack:before {
|
|
content: "\f08d";
|
|
}
|
|
i.icon.winner:before {
|
|
content: "\f091";
|
|
}
|
|
i.icon.phone:before {
|
|
content: "\f095";
|
|
}
|
|
i.icon.bookmark.outline:before {
|
|
content: "\f097";
|
|
}
|
|
i.icon.phone.square:before {
|
|
content: "\f098";
|
|
}
|
|
i.icon.credit.card:before {
|
|
content: "\f09d";
|
|
}
|
|
i.icon.hdd.outline:before {
|
|
content: "\f0a0";
|
|
}
|
|
i.icon.bullhorn:before {
|
|
content: "\f0a1";
|
|
}
|
|
i.icon.bell.outline:before {
|
|
content: "\f0a2";
|
|
}
|
|
i.icon.hand.outline.right:before {
|
|
content: "\f0a4";
|
|
}
|
|
i.icon.hand.outline.left:before {
|
|
content: "\f0a5";
|
|
}
|
|
i.icon.hand.outline.up:before {
|
|
content: "\f0a6";
|
|
}
|
|
i.icon.hand.outline.down:before {
|
|
content: "\f0a7";
|
|
}
|
|
i.icon.globe:before {
|
|
content: "\f0ac";
|
|
}
|
|
i.icon.wrench:before {
|
|
content: "\f0ad";
|
|
}
|
|
i.icon.briefcase:before {
|
|
content: "\f0b1";
|
|
}
|
|
i.icon.group:before {
|
|
content: "\f0c0";
|
|
}
|
|
i.icon.linkify:before {
|
|
content: "\f0c1";
|
|
}
|
|
i.icon.chain:before {
|
|
content: "\f0c1";
|
|
}
|
|
i.icon.flask:before {
|
|
content: "\f0c3";
|
|
}
|
|
i.icon.sidebar:before {
|
|
content: "\f0c9";
|
|
}
|
|
i.icon.bars:before {
|
|
content: "\f0c9";
|
|
}
|
|
i.icon.list.ul:before {
|
|
content: "\f0ca";
|
|
}
|
|
i.icon.list.ol:before {
|
|
content: "\f0cb";
|
|
}
|
|
i.icon.numbered.list:before {
|
|
content: "\f0cb";
|
|
}
|
|
i.icon.magic:before {
|
|
content: "\f0d0";
|
|
}
|
|
i.icon.truck:before {
|
|
content: "\f0d1";
|
|
}
|
|
i.icon.currency:before {
|
|
content: "\f0d6";
|
|
}
|
|
i.icon.triangle.down:before {
|
|
content: "\f0d7";
|
|
}
|
|
i.icon.dropdown:before {
|
|
content: "\f0d7";
|
|
}
|
|
i.icon.triangle.up:before {
|
|
content: "\f0d8";
|
|
}
|
|
i.icon.triangle.left:before {
|
|
content: "\f0d9";
|
|
}
|
|
i.icon.triangle.right:before {
|
|
content: "\f0da";
|
|
}
|
|
i.icon.envelope:before {
|
|
content: "\f0e0";
|
|
}
|
|
i.icon.conversation:before {
|
|
content: "\f0e6";
|
|
}
|
|
i.icon.rain:before {
|
|
content: "\f0e9";
|
|
}
|
|
i.icon.clipboard:before {
|
|
content: "\f0ea";
|
|
}
|
|
i.icon.lightbulb:before {
|
|
content: "\f0eb";
|
|
}
|
|
i.icon.bell:before {
|
|
content: "\f0f3";
|
|
}
|
|
i.icon.ambulance:before {
|
|
content: "\f0f9";
|
|
}
|
|
i.icon.medkit:before {
|
|
content: "\f0fa";
|
|
}
|
|
i.icon.fighter.jet:before {
|
|
content: "\f0fb";
|
|
}
|
|
i.icon.beer:before {
|
|
content: "\f0fc";
|
|
}
|
|
i.icon.plus.square:before {
|
|
content: "\f0fe";
|
|
}
|
|
i.icon.computer:before {
|
|
content: "\f108";
|
|
}
|
|
i.icon.circle.outline:before {
|
|
content: "\f10c";
|
|
}
|
|
i.icon.gamepad:before {
|
|
content: "\f11b";
|
|
}
|
|
i.icon.star.half.full:before {
|
|
content: "\f123";
|
|
}
|
|
i.icon.broken.chain:before {
|
|
content: "\f127";
|
|
}
|
|
i.icon.question:before {
|
|
content: "\f128";
|
|
}
|
|
i.icon.exclamation:before {
|
|
content: "\f12a";
|
|
}
|
|
i.icon.eraser:before {
|
|
content: "\f12d";
|
|
}
|
|
i.icon.microphone:before {
|
|
content: "\f130";
|
|
}
|
|
i.icon.microphone.slash:before {
|
|
content: "\f131";
|
|
}
|
|
i.icon.shield:before {
|
|
content: "\f132";
|
|
}
|
|
i.icon.target:before {
|
|
content: "\f140";
|
|
}
|
|
i.icon.play.circle:before {
|
|
content: "\f144";
|
|
}
|
|
i.icon.pencil.square:before {
|
|
content: "\f14b";
|
|
}
|
|
i.icon.eur:before {
|
|
content: "\f153";
|
|
}
|
|
i.icon.gbp:before {
|
|
content: "\f154";
|
|
}
|
|
i.icon.usd:before {
|
|
content: "\f155";
|
|
}
|
|
i.icon.inr:before {
|
|
content: "\f156";
|
|
}
|
|
i.icon.cny:before {
|
|
content: "\f157";
|
|
}
|
|
i.icon.rmb:before {
|
|
content: "\f157";
|
|
}
|
|
i.icon.jpy:before {
|
|
content: "\f157";
|
|
}
|
|
i.icon.rouble:before {
|
|
content: "\f158";
|
|
}
|
|
i.icon.rub:before {
|
|
content: "\f158";
|
|
}
|
|
i.icon.krw:before {
|
|
content: "\f159";
|
|
}
|
|
i.icon.btc:before {
|
|
content: "\f15a";
|
|
}
|
|
i.icon.gratipay:before {
|
|
content: "\f184";
|
|
}
|
|
i.icon.zip:before {
|
|
content: "\f187";
|
|
}
|
|
i.icon.dot.circle.outline:before {
|
|
content: "\f192";
|
|
}
|
|
i.icon.try:before {
|
|
content: "\f195";
|
|
}
|
|
i.icon.graduation:before {
|
|
content: "\f19d";
|
|
}
|
|
i.icon.circle.outline:before {
|
|
content: "\f1db";
|
|
}
|
|
i.icon.sliders:before {
|
|
content: "\f1de";
|
|
}
|
|
i.icon.weixin:before {
|
|
content: "\f1d7";
|
|
}
|
|
i.icon.tty:before {
|
|
content: "\f1e4";
|
|
}
|
|
i.icon.teletype:before {
|
|
content: "\f1e4";
|
|
}
|
|
i.icon.binoculars:before {
|
|
content: "\f1e5";
|
|
}
|
|
i.icon.power.cord:before {
|
|
content: "\f1e6";
|
|
}
|
|
i.icon.wi-fi:before {
|
|
content: "\f1eb";
|
|
}
|
|
i.icon.visa.card:before {
|
|
content: "\f1f0";
|
|
}
|
|
i.icon.mastercard.card:before {
|
|
content: "\f1f1";
|
|
}
|
|
i.icon.discover.card:before {
|
|
content: "\f1f2";
|
|
}
|
|
i.icon.amex:before {
|
|
content: "\f1f3";
|
|
}
|
|
i.icon.american.express.card:before {
|
|
content: "\f1f3";
|
|
}
|
|
i.icon.stripe.card:before {
|
|
content: "\f1f5";
|
|
}
|
|
i.icon.bell.slash:before {
|
|
content: "\f1f6";
|
|
}
|
|
i.icon.bell.slash.outline:before {
|
|
content: "\f1f7";
|
|
}
|
|
i.icon.area.graph:before {
|
|
content: "\f1fe";
|
|
}
|
|
i.icon.pie.graph:before {
|
|
content: "\f200";
|
|
}
|
|
i.icon.line.graph:before {
|
|
content: "\f201";
|
|
}
|
|
i.icon.cc:before {
|
|
content: "\f20a";
|
|
}
|
|
i.icon.sheqel:before {
|
|
content: "\f20b";
|
|
}
|
|
i.icon.ils:before {
|
|
content: "\f20b";
|
|
}
|
|
i.icon.plus.cart:before {
|
|
content: "\f217";
|
|
}
|
|
i.icon.arrow.down.cart:before {
|
|
content: "\f218";
|
|
}
|
|
i.icon.detective:before {
|
|
content: "\f21b";
|
|
}
|
|
i.icon.venus:before {
|
|
content: "\f221";
|
|
}
|
|
i.icon.mars:before {
|
|
content: "\f222";
|
|
}
|
|
i.icon.mercury:before {
|
|
content: "\f223";
|
|
}
|
|
i.icon.intersex:before {
|
|
content: "\f224";
|
|
}
|
|
i.icon.venus.double:before {
|
|
content: "\f226";
|
|
}
|
|
i.icon.female.homosexual:before {
|
|
content: "\f226";
|
|
}
|
|
i.icon.mars.double:before {
|
|
content: "\f227";
|
|
}
|
|
i.icon.male.homosexual:before {
|
|
content: "\f227";
|
|
}
|
|
i.icon.venus.mars:before {
|
|
content: "\f228";
|
|
}
|
|
i.icon.mars.stroke:before {
|
|
content: "\f229";
|
|
}
|
|
i.icon.mars.alternate:before {
|
|
content: "\f229";
|
|
}
|
|
i.icon.mars.vertical:before {
|
|
content: "\f22a";
|
|
}
|
|
i.icon.mars.stroke.vertical:before {
|
|
content: "\f22a";
|
|
}
|
|
i.icon.mars.horizontal:before {
|
|
content: "\f22b";
|
|
}
|
|
i.icon.mars.stroke.horizontal:before {
|
|
content: "\f22b";
|
|
}
|
|
i.icon.asexual:before {
|
|
content: "\f22d";
|
|
}
|
|
i.icon.facebook.official:before {
|
|
content: "\f230";
|
|
}
|
|
i.icon.user.plus:before {
|
|
content: "\f234";
|
|
}
|
|
i.icon.user.times:before {
|
|
content: "\f235";
|
|
}
|
|
i.icon.user.close:before {
|
|
content: "\f235";
|
|
}
|
|
i.icon.user.cancel:before {
|
|
content: "\f235";
|
|
}
|
|
i.icon.user.delete:before {
|
|
content: "\f235";
|
|
}
|
|
i.icon.user.x:before {
|
|
content: "\f235";
|
|
}
|
|
i.icon.bed:before {
|
|
content: "\f236";
|
|
}
|
|
i.icon.yc:before {
|
|
content: "\f23b";
|
|
}
|
|
i.icon.ycombinator:before {
|
|
content: "\f23b";
|
|
}
|
|
i.icon.battery.four:before {
|
|
content: "\f240";
|
|
}
|
|
i.icon.battery.three:before {
|
|
content: "\f241";
|
|
}
|
|
i.icon.battery.three.quarters:before {
|
|
content: "\f241";
|
|
}
|
|
i.icon.battery.two:before {
|
|
content: "\f242";
|
|
}
|
|
i.icon.battery.half:before {
|
|
content: "\f242";
|
|
}
|
|
i.icon.battery.one:before {
|
|
content: "\f243";
|
|
}
|
|
i.icon.battery.quarter:before {
|
|
content: "\f243";
|
|
}
|
|
i.icon.battery.zero:before {
|
|
content: "\f244";
|
|
}
|
|
i.icon.i.cursor:before {
|
|
content: "\f246";
|
|
}
|
|
i.icon.jcb:before {
|
|
content: "\f24b";
|
|
}
|
|
i.icon.japan.credit.bureau.card:before {
|
|
content: "\f24b";
|
|
}
|
|
i.icon.diners.club.card:before {
|
|
content: "\f24c";
|
|
}
|
|
i.icon.balance:before {
|
|
content: "\f24e";
|
|
}
|
|
i.icon.hourglass.outline:before {
|
|
content: "\f250";
|
|
}
|
|
i.icon.hourglass.zero:before {
|
|
content: "\f250";
|
|
}
|
|
i.icon.hourglass.one:before {
|
|
content: "\f251";
|
|
}
|
|
i.icon.hourglass.two:before {
|
|
content: "\f252";
|
|
}
|
|
i.icon.hourglass.three:before {
|
|
content: "\f253";
|
|
}
|
|
i.icon.hourglass.four:before {
|
|
content: "\f254";
|
|
}
|
|
i.icon.grab:before {
|
|
content: "\f255";
|
|
}
|
|
i.icon.hand.victory:before {
|
|
content: "\f25b";
|
|
}
|
|
i.icon.tm:before {
|
|
content: "\f25c";
|
|
}
|
|
i.icon.r.circle:before {
|
|
content: "\f25d";
|
|
}
|
|
i.icon.television:before {
|
|
content: "\f26c";
|
|
}
|
|
i.icon.five.hundred.pixels:before {
|
|
content: "\f26e";
|
|
}
|
|
i.icon.calendar.plus:before {
|
|
content: "\f271";
|
|
}
|
|
i.icon.calendar.minus:before {
|
|
content: "\f272";
|
|
}
|
|
i.icon.calendar.times:before {
|
|
content: "\f273";
|
|
}
|
|
i.icon.calendar.check:before {
|
|
content: "\f274";
|
|
}
|
|
i.icon.factory:before {
|
|
content: "\f275";
|
|
}
|
|
i.icon.commenting:before {
|
|
content: "\f27a";
|
|
}
|
|
i.icon.commenting.outline:before {
|
|
content: "\f27b";
|
|
}
|
|
i.icon.edge:before {
|
|
content: "\f282";
|
|
}
|
|
i.icon.ms.edge:before {
|
|
content: "\f282";
|
|
}
|
|
i.icon.wordpress.beginner:before {
|
|
content: "\f297";
|
|
}
|
|
i.icon.wordpress.forms:before {
|
|
content: "\f298";
|
|
}
|
|
i.icon.envira:before {
|
|
content: "\f299";
|
|
}
|
|
i.icon.question.circle.outline:before {
|
|
content: "\f29c";
|
|
}
|
|
i.icon.assistive.listening.devices:before {
|
|
content: "\f2a2";
|
|
}
|
|
i.icon.als:before {
|
|
content: "\f2a2";
|
|
}
|
|
i.icon.ald:before {
|
|
content: "\f2a2";
|
|
}
|
|
i.icon.asl.interpreting:before {
|
|
content: "\f2a3";
|
|
}
|
|
i.icon.deaf:before {
|
|
content: "\f2a4";
|
|
}
|
|
i.icon.american.sign.language.interpreting:before {
|
|
content: "\f2a3";
|
|
}
|
|
i.icon.hard.of.hearing:before {
|
|
content: "\f2a4";
|
|
}
|
|
i.icon.signing:before {
|
|
content: "\f2a7";
|
|
}
|
|
i.icon.new.pied.piper:before {
|
|
content: "\f2ae";
|
|
}
|
|
i.icon.theme.isle:before {
|
|
content: "\f2b2";
|
|
}
|
|
i.icon.google.plus.official:before {
|
|
content: "\f2b3";
|
|
}
|
|
i.icon.fa:before {
|
|
content: "\f2b4";
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Image
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Image
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Avatar */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Spaced */
|
|
/* Floated */
|
|
/* Size */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Image
|
|
*******************************/
|
|
.ui.image {
|
|
position: relative;
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
max-width: 100%;
|
|
background-color: transparent;
|
|
}
|
|
img.ui.image {
|
|
display: block;
|
|
}
|
|
.ui.image svg,
|
|
.ui.image img {
|
|
display: block;
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
.ui.hidden.images,
|
|
.ui.hidden.image {
|
|
display: none;
|
|
}
|
|
.ui.hidden.transition.images,
|
|
.ui.hidden.transition.image {
|
|
display: block;
|
|
visibility: hidden;
|
|
}
|
|
.ui.disabled.images,
|
|
.ui.disabled.image {
|
|
cursor: default;
|
|
opacity: 0.45;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Inline
|
|
---------------*/
|
|
.ui.inline.image,
|
|
.ui.inline.image svg,
|
|
.ui.inline.image img {
|
|
display: inline-block;
|
|
}
|
|
/*------------------
|
|
Vertical Aligned
|
|
-------------------*/
|
|
.ui.top.aligned.images .image,
|
|
.ui.top.aligned.image,
|
|
.ui.top.aligned.image svg,
|
|
.ui.top.aligned.image img {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
}
|
|
.ui.middle.aligned.images .image,
|
|
.ui.middle.aligned.image,
|
|
.ui.middle.aligned.image svg,
|
|
.ui.middle.aligned.image img {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
.ui.bottom.aligned.images .image,
|
|
.ui.bottom.aligned.image,
|
|
.ui.bottom.aligned.image svg,
|
|
.ui.bottom.aligned.image img {
|
|
display: inline-block;
|
|
vertical-align: bottom;
|
|
}
|
|
/*--------------
|
|
Rounded
|
|
---------------*/
|
|
.ui.rounded.images .image,
|
|
.ui.rounded.image,
|
|
.ui.rounded.images .image > *,
|
|
.ui.rounded.image > * {
|
|
border-radius: 0.3125em;
|
|
}
|
|
/*--------------
|
|
Bordered
|
|
---------------*/
|
|
.ui.bordered.images .image,
|
|
.ui.bordered.images img,
|
|
.ui.bordered.images svg,
|
|
.ui.bordered.image img,
|
|
.ui.bordered.image svg,
|
|
img.ui.bordered.image {
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
}
|
|
/*--------------
|
|
Circular
|
|
---------------*/
|
|
.ui.circular.images,
|
|
.ui.circular.image {
|
|
overflow: hidden;
|
|
}
|
|
.ui.circular.images .image,
|
|
.ui.circular.image,
|
|
.ui.circular.images .image > *,
|
|
.ui.circular.image > * {
|
|
border-radius: 500rem;
|
|
}
|
|
/*--------------
|
|
Fluid
|
|
---------------*/
|
|
.ui.fluid.images,
|
|
.ui.fluid.image,
|
|
.ui.fluid.images img,
|
|
.ui.fluid.images svg,
|
|
.ui.fluid.image svg,
|
|
.ui.fluid.image img {
|
|
display: block;
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
/*--------------
|
|
Avatar
|
|
---------------*/
|
|
.ui.avatar.images .image,
|
|
.ui.avatar.images img,
|
|
.ui.avatar.images svg,
|
|
.ui.avatar.image img,
|
|
.ui.avatar.image svg,
|
|
.ui.avatar.image {
|
|
margin-right: 0.25em;
|
|
display: inline-block;
|
|
width: 2em;
|
|
height: 2em;
|
|
border-radius: 500rem;
|
|
}
|
|
/*-------------------
|
|
Spaced
|
|
--------------------*/
|
|
.ui.spaced.image {
|
|
display: inline-block !important;
|
|
margin-left: 0.5em;
|
|
margin-right: 0.5em;
|
|
}
|
|
.ui[class*="left spaced"].image {
|
|
margin-left: 0.5em;
|
|
margin-right: 0em;
|
|
}
|
|
.ui[class*="right spaced"].image {
|
|
margin-left: 0em;
|
|
margin-right: 0.5em;
|
|
}
|
|
/*-------------------
|
|
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-right: 0em;
|
|
margin-bottom: 1em;
|
|
margin-left: 1em;
|
|
}
|
|
.ui.floated.images:last-child,
|
|
.ui.floated.image:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.centered.images,
|
|
.ui.centered.image {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
/*--------------
|
|
Sizes
|
|
---------------*/
|
|
.ui.mini.images .image,
|
|
.ui.mini.images img,
|
|
.ui.mini.images svg,
|
|
.ui.mini.image {
|
|
width: 35px;
|
|
height: auto;
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.tiny.images .image,
|
|
.ui.tiny.images img,
|
|
.ui.tiny.images svg,
|
|
.ui.tiny.image {
|
|
width: 80px;
|
|
height: auto;
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.images .image,
|
|
.ui.small.images img,
|
|
.ui.small.images svg,
|
|
.ui.small.image {
|
|
width: 150px;
|
|
height: auto;
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.medium.images .image,
|
|
.ui.medium.images img,
|
|
.ui.medium.images svg,
|
|
.ui.medium.image {
|
|
width: 300px;
|
|
height: auto;
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.images .image,
|
|
.ui.large.images img,
|
|
.ui.large.images svg,
|
|
.ui.large.image {
|
|
width: 450px;
|
|
height: auto;
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.big.images .image,
|
|
.ui.big.images img,
|
|
.ui.big.images svg,
|
|
.ui.big.image {
|
|
width: 600px;
|
|
height: auto;
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.huge.images .image,
|
|
.ui.huge.images img,
|
|
.ui.huge.images svg,
|
|
.ui.huge.image {
|
|
width: 800px;
|
|
height: auto;
|
|
font-size: 1.42857143rem;
|
|
}
|
|
.ui.massive.images .image,
|
|
.ui.massive.images img,
|
|
.ui.massive.images svg,
|
|
.ui.massive.image {
|
|
width: 960px;
|
|
height: auto;
|
|
font-size: 1.71428571rem;
|
|
}
|
|
/*******************************
|
|
Groups
|
|
*******************************/
|
|
.ui.images {
|
|
font-size: 0em;
|
|
margin: 0em -0.25rem 0rem;
|
|
}
|
|
.ui.images .image,
|
|
.ui.images img,
|
|
.ui.images svg {
|
|
display: inline-block;
|
|
margin: 0em 0.25rem 0.5rem;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Input
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Input
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Icon Input */
|
|
/* Circular Icon Input */
|
|
/* Labeled Input */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Placeholder */
|
|
/* Down */
|
|
/* Focus */
|
|
/* Error */
|
|
/* Loader */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Inverted */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Standard
|
|
*******************************/
|
|
/*--------------------
|
|
Inputs
|
|
---------------------*/
|
|
.ui.input {
|
|
position: relative;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.input input {
|
|
margin: 0em;
|
|
max-width: 100%;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1 0 auto;
|
|
flex: 1 0 auto;
|
|
outline: none;
|
|
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
|
|
text-align: left;
|
|
line-height: 1.2142em;
|
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
padding: 0.67861429em 1em;
|
|
background: #FFFFFF;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
border-radius: 0.28571429rem;
|
|
-webkit-transition: border-color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: border-color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: box-shadow 0.1s ease, border-color 0.1s ease;
|
|
transition: box-shadow 0.1s ease, border-color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/*--------------------
|
|
Placeholder
|
|
---------------------*/
|
|
/* browsers require these rules separate */
|
|
.ui.input input::-webkit-input-placeholder {
|
|
color: rgba(191, 191, 191, 0.87);
|
|
}
|
|
.ui.input input::-moz-placeholder {
|
|
color: rgba(191, 191, 191, 0.87);
|
|
}
|
|
.ui.input input:-ms-input-placeholder {
|
|
color: rgba(191, 191, 191, 0.87);
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------------
|
|
Disabled
|
|
---------------------*/
|
|
.ui.disabled.input,
|
|
.ui.input input[disabled] {
|
|
opacity: 0.45;
|
|
}
|
|
.ui.disabled.input input,
|
|
.ui.input input[disabled] {
|
|
pointer-events: none;
|
|
}
|
|
/*--------------------
|
|
Active
|
|
---------------------*/
|
|
.ui.input input:active,
|
|
.ui.input.down input {
|
|
border-color: rgba(0, 0, 0, 0.3);
|
|
background: #FAFAFA;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/*--------------------
|
|
Loading
|
|
---------------------*/
|
|
.ui.loading.loading.input > i.icon:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -0.64285714em 0em 0em -0.64285714em;
|
|
width: 1.28571429em;
|
|
height: 1.28571429em;
|
|
border-radius: 500rem;
|
|
border: 0.2em solid rgba(0, 0, 0, 0.1);
|
|
}
|
|
.ui.loading.loading.input > i.icon:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -0.64285714em 0em 0em -0.64285714em;
|
|
width: 1.28571429em;
|
|
height: 1.28571429em;
|
|
-webkit-animation: button-spin 0.6s linear;
|
|
animation: button-spin 0.6s linear;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
border-radius: 500rem;
|
|
border-color: #95a5a6 transparent transparent;
|
|
border-style: solid;
|
|
border-width: 0.2em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent;
|
|
box-shadow: 0px 0px 0px 1px transparent;
|
|
}
|
|
/*--------------------
|
|
Focus
|
|
---------------------*/
|
|
.ui.input.focus input,
|
|
.ui.input input:focus {
|
|
border-color: #85B7D9;
|
|
background: #FFFFFF;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.input.focus input::-webkit-input-placeholder,
|
|
.ui.input input:focus::-webkit-input-placeholder {
|
|
color: rgba(115, 115, 115, 0.87);
|
|
}
|
|
.ui.input.focus input::-moz-placeholder,
|
|
.ui.input input:focus::-moz-placeholder {
|
|
color: rgba(115, 115, 115, 0.87);
|
|
}
|
|
.ui.input.focus input:-ms-input-placeholder,
|
|
.ui.input input:focus:-ms-input-placeholder {
|
|
color: rgba(115, 115, 115, 0.87);
|
|
}
|
|
/*--------------------
|
|
Error
|
|
---------------------*/
|
|
.ui.input.error input {
|
|
background-color: #FFF6F6;
|
|
border-color: #E0B4B4;
|
|
color: #9F3A38;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Error Placeholder */
|
|
.ui.input.error input::-webkit-input-placeholder {
|
|
color: #e7bdbc;
|
|
}
|
|
.ui.input.error input::-moz-placeholder {
|
|
color: #e7bdbc;
|
|
}
|
|
.ui.input.error input:-ms-input-placeholder {
|
|
color: #e7bdbc !important;
|
|
}
|
|
/* Focused Error Placeholder */
|
|
.ui.input.error input:focus::-webkit-input-placeholder {
|
|
color: #da9796;
|
|
}
|
|
.ui.input.error input:focus::-moz-placeholder {
|
|
color: #da9796;
|
|
}
|
|
.ui.input.error input:focus:-ms-input-placeholder {
|
|
color: #da9796 !important;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------------
|
|
Transparent
|
|
---------------------*/
|
|
.ui.transparent.input input {
|
|
border-color: transparent !important;
|
|
background-color: transparent !important;
|
|
padding: 0em !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
/* Transparent Icon */
|
|
.ui.transparent.icon.input > i.icon {
|
|
width: 1.1em;
|
|
}
|
|
.ui.transparent.icon.input > input {
|
|
padding-left: 0em !important;
|
|
padding-right: 2em !important;
|
|
}
|
|
.ui.transparent[class*="left icon"].input > input {
|
|
padding-left: 2em !important;
|
|
padding-right: 0em !important;
|
|
}
|
|
/* Transparent Inverted */
|
|
.ui.transparent.inverted.input {
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.transparent.inverted.input input {
|
|
color: inherit;
|
|
}
|
|
.ui.transparent.inverted.input input::-webkit-input-placeholder {
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
.ui.transparent.inverted.input input::-moz-placeholder {
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
.ui.transparent.inverted.input input:-ms-input-placeholder {
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
/*--------------------
|
|
Icon
|
|
---------------------*/
|
|
.ui.icon.input > i.icon {
|
|
cursor: default;
|
|
position: absolute;
|
|
line-height: 1;
|
|
text-align: center;
|
|
top: 0px;
|
|
right: 0px;
|
|
margin: 0em;
|
|
height: 100%;
|
|
width: 2.67142857em;
|
|
opacity: 0.5;
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
-webkit-transition: opacity 0.3s ease;
|
|
transition: opacity 0.3s ease;
|
|
}
|
|
.ui.icon.input > i.icon:not(.link) {
|
|
pointer-events: none;
|
|
}
|
|
.ui.icon.input input {
|
|
padding-right: 2.67142857em !important;
|
|
}
|
|
.ui.icon.input > i.icon:before,
|
|
.ui.icon.input > i.icon:after {
|
|
left: 0;
|
|
position: absolute;
|
|
text-align: center;
|
|
top: 50%;
|
|
width: 100%;
|
|
margin-top: -0.5em;
|
|
}
|
|
.ui.icon.input > i.link.icon {
|
|
cursor: pointer;
|
|
}
|
|
.ui.icon.input > i.circular.icon {
|
|
top: 0.35em;
|
|
right: 0.5em;
|
|
}
|
|
/* Left Icon Input */
|
|
.ui[class*="left icon"].input > i.icon {
|
|
right: auto;
|
|
left: 1px;
|
|
border-radius: 0.28571429rem 0em 0em 0.28571429rem;
|
|
}
|
|
.ui[class*="left icon"].input > i.circular.icon {
|
|
right: auto;
|
|
left: 0.5em;
|
|
}
|
|
.ui[class*="left icon"].input > input {
|
|
padding-left: 2.67142857em !important;
|
|
padding-right: 1em !important;
|
|
}
|
|
/* Focus */
|
|
.ui.icon.input > input:focus ~ i.icon {
|
|
opacity: 1;
|
|
}
|
|
/*--------------------
|
|
Labeled
|
|
---------------------*/
|
|
/* Adjacent Label */
|
|
.ui.labeled.input > .label {
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 0 auto;
|
|
flex: 0 0 auto;
|
|
margin: 0;
|
|
font-size: 1em;
|
|
}
|
|
.ui.labeled.input > .label:not(.corner) {
|
|
padding-top: 0.78571429em;
|
|
padding-bottom: 0.78571429em;
|
|
}
|
|
/* Regular Label on Left */
|
|
.ui.labeled.input:not([class*="corner labeled"]) .label:first-child {
|
|
border-top-right-radius: 0px;
|
|
border-bottom-right-radius: 0px;
|
|
}
|
|
.ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input {
|
|
border-top-left-radius: 0px;
|
|
border-bottom-left-radius: 0px;
|
|
border-left-color: transparent;
|
|
}
|
|
.ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input:focus {
|
|
border-left-color: #85B7D9;
|
|
}
|
|
/* Regular Label on Right */
|
|
.ui[class*="right labeled"].input input {
|
|
border-top-right-radius: 0px !important;
|
|
border-bottom-right-radius: 0px !important;
|
|
border-right-color: transparent !important;
|
|
}
|
|
.ui[class*="right labeled"].input input + .label {
|
|
border-top-left-radius: 0px;
|
|
border-bottom-left-radius: 0px;
|
|
}
|
|
.ui[class*="right labeled"].input input:focus {
|
|
border-right-color: #85B7D9 !important;
|
|
}
|
|
/* Corner Label */
|
|
.ui.labeled.input .corner.label {
|
|
top: 1px;
|
|
right: 1px;
|
|
font-size: 0.64285714em;
|
|
border-radius: 0em 0.28571429rem 0em 0em;
|
|
}
|
|
/* Spacing with corner label */
|
|
.ui[class*="corner labeled"]:not([class*="left corner labeled"]).labeled.input input {
|
|
padding-right: 2.5em !important;
|
|
}
|
|
.ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > input {
|
|
padding-right: 3.25em !important;
|
|
}
|
|
.ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > .icon {
|
|
margin-right: 1.25em;
|
|
}
|
|
/* Left Labeled */
|
|
.ui[class*="left corner labeled"].labeled.input input {
|
|
padding-left: 2.5em !important;
|
|
}
|
|
.ui[class*="left corner labeled"].icon.input > input {
|
|
padding-left: 3.25em !important;
|
|
}
|
|
.ui[class*="left corner labeled"].icon.input > .icon {
|
|
margin-left: 1.25em;
|
|
}
|
|
/* Corner Label Position */
|
|
.ui.input > .ui.corner.label {
|
|
top: 1px;
|
|
right: 1px;
|
|
}
|
|
.ui.input > .ui.left.corner.label {
|
|
right: auto;
|
|
left: 1px;
|
|
}
|
|
/*--------------------
|
|
Action
|
|
---------------------*/
|
|
.ui.action.input > .button,
|
|
.ui.action.input > .buttons {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 0 auto;
|
|
flex: 0 0 auto;
|
|
}
|
|
.ui.action.input > .button,
|
|
.ui.action.input > .buttons > .button {
|
|
padding-top: 0.78571429em;
|
|
padding-bottom: 0.78571429em;
|
|
margin: 0;
|
|
}
|
|
/* Button on Right */
|
|
.ui.action.input:not([class*="left action"]) > input {
|
|
border-top-right-radius: 0px !important;
|
|
border-bottom-right-radius: 0px !important;
|
|
border-right-color: transparent !important;
|
|
}
|
|
.ui.action.input:not([class*="left action"]) > .dropdown:not(:first-child),
|
|
.ui.action.input:not([class*="left action"]) > .button:not(:first-child),
|
|
.ui.action.input:not([class*="left action"]) > .buttons:not(:first-child) > .button {
|
|
border-radius: 0px;
|
|
}
|
|
.ui.action.input:not([class*="left action"]) > .dropdown:last-child,
|
|
.ui.action.input:not([class*="left action"]) > .button:last-child,
|
|
.ui.action.input:not([class*="left action"]) > .buttons:last-child > .button {
|
|
border-radius: 0px 0.28571429rem 0.28571429rem 0px;
|
|
}
|
|
/* Input Focus */
|
|
.ui.action.input:not([class*="left action"]) input:focus {
|
|
border-right-color: #85B7D9 !important;
|
|
}
|
|
/* Button on Left */
|
|
.ui[class*="left action"].input > input {
|
|
border-top-left-radius: 0px !important;
|
|
border-bottom-left-radius: 0px !important;
|
|
border-left-color: transparent !important;
|
|
}
|
|
.ui[class*="left action"].input > .dropdown,
|
|
.ui[class*="left action"].input > .button,
|
|
.ui[class*="left action"].input > .buttons > .button {
|
|
border-radius: 0px;
|
|
}
|
|
.ui[class*="left action"].input > .dropdown:first-child,
|
|
.ui[class*="left action"].input > .button:first-child,
|
|
.ui[class*="left action"].input > .buttons:first-child > .button {
|
|
border-radius: 0.28571429rem 0px 0px 0.28571429rem;
|
|
}
|
|
/* Input Focus */
|
|
.ui[class*="left action"].input > input:focus {
|
|
border-left-color: #85B7D9 !important;
|
|
}
|
|
/*--------------------
|
|
Inverted
|
|
---------------------*/
|
|
/* Standard */
|
|
.ui.inverted.input input {
|
|
border: none;
|
|
}
|
|
/*--------------------
|
|
Fluid
|
|
---------------------*/
|
|
.ui.fluid.input {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
.ui.fluid.input > input {
|
|
width: 0px !important;
|
|
}
|
|
/*--------------------
|
|
Size
|
|
---------------------*/
|
|
.ui.mini.input {
|
|
font-size: 0.78571429em;
|
|
}
|
|
.ui.small.input {
|
|
font-size: 0.92857143em;
|
|
}
|
|
.ui.input {
|
|
font-size: 1em;
|
|
}
|
|
.ui.large.input {
|
|
font-size: 1.14285714em;
|
|
}
|
|
.ui.big.input {
|
|
font-size: 1.28571429em;
|
|
}
|
|
.ui.huge.input {
|
|
font-size: 1.42857143em;
|
|
}
|
|
.ui.massive.input {
|
|
font-size: 1.71428571em;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
.ui.inverted.input input {
|
|
border: #FFFFFF 2px solid !important;
|
|
color: #FFFFFF;
|
|
background: transparent;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Label
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Label
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/* medium is not @emSize custom value required */
|
|
/* Group */
|
|
/*-------------------
|
|
Parts
|
|
--------------------*/
|
|
/* Link */
|
|
/* Icon */
|
|
/* Image */
|
|
/* Detail */
|
|
/* Delete */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Image Label */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Hover */
|
|
/* Active */
|
|
/* Active Hover */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Basic */
|
|
/* Tag */
|
|
/* Avoids error with background: inherit; on animation */
|
|
/* Ribbon */
|
|
/* Rounding Offset on Triangle */
|
|
/* Rounding Offset on Triangle */
|
|
/* Colors */
|
|
/* Attached */
|
|
/* Corner */
|
|
/* Corner Text */
|
|
/* Horizontal */
|
|
/* Circular Padding */
|
|
/* Pointing */
|
|
/* Basic Pointing */
|
|
/* Floating */
|
|
/*-------------------
|
|
Group
|
|
--------------------*/
|
|
/* Sizing */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Label
|
|
*******************************/
|
|
.ui.label {
|
|
display: inline-block;
|
|
line-height: 1;
|
|
vertical-align: baseline;
|
|
margin: 0em 0.14285714em;
|
|
background-color: #E8E8E8;
|
|
background-image: none;
|
|
padding: 0.5833em 0.833em;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
text-transform: none;
|
|
font-weight: bold;
|
|
border: 0px solid transparent;
|
|
border-radius: 0.28571429rem;
|
|
-webkit-transition: background 0.1s ease;
|
|
transition: background 0.1s ease;
|
|
}
|
|
.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.5;
|
|
-webkit-transition: 0.1s opacity ease;
|
|
transition: 0.1s opacity ease;
|
|
}
|
|
.ui.label > a:hover {
|
|
opacity: 1;
|
|
}
|
|
/* Image */
|
|
.ui.label > img {
|
|
width: auto !important;
|
|
vertical-align: middle;
|
|
height: 2.1666em !important;
|
|
}
|
|
/* Icon */
|
|
.ui.label > .icon {
|
|
width: auto;
|
|
margin: 0em 0.75em 0em 0em;
|
|
}
|
|
/* Detail */
|
|
.ui.label > .detail {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
font-weight: bold;
|
|
margin-left: 1em;
|
|
opacity: 0.8;
|
|
}
|
|
.ui.label > .detail .icon {
|
|
margin: 0em 0.25em 0em 0em;
|
|
}
|
|
/* Removable label */
|
|
.ui.label > .close.icon,
|
|
.ui.label > .delete.icon {
|
|
cursor: pointer;
|
|
margin-right: 0em;
|
|
margin-left: 0.5em;
|
|
font-size: 0.92857143em;
|
|
opacity: 0.5;
|
|
-webkit-transition: background 0.1s ease;
|
|
transition: background 0.1s ease;
|
|
}
|
|
.ui.label > .delete.icon:hover {
|
|
opacity: 1;
|
|
}
|
|
/*-------------------
|
|
Group
|
|
--------------------*/
|
|
.ui.labels > .label {
|
|
margin: 0em 0.5em 0.5em 0em;
|
|
}
|
|
/*-------------------
|
|
Coupling
|
|
--------------------*/
|
|
.ui.header > .ui.label {
|
|
margin-top: -0.29165em;
|
|
}
|
|
/* Remove border radius on attached segment */
|
|
.ui.attached.segment > .ui.top.left.attached.label,
|
|
.ui.bottom.attached.segment > .ui.top.left.attached.label {
|
|
border-top-left-radius: 0;
|
|
}
|
|
.ui.attached.segment > .ui.top.right.attached.label,
|
|
.ui.bottom.attached.segment > .ui.top.right.attached.label {
|
|
border-top-right-radius: 0;
|
|
}
|
|
.ui.top.attached.segment > .ui.bottom.left.attached.label {
|
|
border-bottom-left-radius: 0;
|
|
}
|
|
.ui.top.attached.segment > .ui.bottom.right.attached.label {
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
/* Padding on next content after a label */
|
|
.ui.top.attached.label:first-child + :not(.attached),
|
|
.ui.top.attached.label + [class*="right floated"] + * {
|
|
margin-top: 2rem !important;
|
|
}
|
|
.ui.bottom.attached.label:first-child ~ :last-child:not(.attached) {
|
|
margin-top: 0em;
|
|
margin-bottom: 2rem !important;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
.ui.image.label {
|
|
width: auto !important;
|
|
margin-top: 0em;
|
|
margin-bottom: 0em;
|
|
max-width: 9999px;
|
|
vertical-align: baseline;
|
|
text-transform: none;
|
|
background: #E8E8E8;
|
|
padding: 0.5833em 0.833em 0.5833em 0.5em;
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.image.label img {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
height: 2.1666em;
|
|
margin: -0.5833em 0.5em -0.5833em -0.5em;
|
|
border-radius: 0.28571429rem 0em 0em 0.28571429rem;
|
|
}
|
|
.ui.image.label .detail {
|
|
background: rgba(0, 0, 0, 0.1);
|
|
margin: -0.5833em -0.833em -0.5833em 0.5em;
|
|
padding: 0.5833em 0.833em;
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
}
|
|
/*-------------------
|
|
Tag
|
|
--------------------*/
|
|
.ui.tag.labels .label,
|
|
.ui.tag.label {
|
|
margin-left: 1em;
|
|
position: relative;
|
|
padding-left: 1.5em;
|
|
padding-right: 1.5em;
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
-webkit-transition: none;
|
|
transition: none;
|
|
}
|
|
.ui.tag.labels .label:before,
|
|
.ui.tag.label:before {
|
|
position: absolute;
|
|
-webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg);
|
|
transform: translateY(-50%) translateX(50%) rotate(-45deg);
|
|
top: 50%;
|
|
right: 100%;
|
|
content: '';
|
|
background-color: inherit;
|
|
background-image: none;
|
|
width: 1.56em;
|
|
height: 1.56em;
|
|
-webkit-transition: none;
|
|
transition: none;
|
|
}
|
|
.ui.tag.labels .label:after,
|
|
.ui.tag.label:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: -0.25em;
|
|
margin-top: -0.25em;
|
|
background-color: #FFFFFF !important;
|
|
width: 0.5em;
|
|
height: 0.5em;
|
|
-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: 500rem;
|
|
}
|
|
/*-------------------
|
|
Corner Label
|
|
--------------------*/
|
|
.ui.corner.label {
|
|
position: absolute;
|
|
top: 0em;
|
|
right: 0em;
|
|
margin: 0em;
|
|
padding: 0em;
|
|
text-align: center;
|
|
border-color: #E8E8E8;
|
|
width: 4em;
|
|
height: 4em;
|
|
z-index: 1;
|
|
-webkit-transition: border-color 0.1s ease;
|
|
transition: border-color 0.1s ease;
|
|
}
|
|
/* Icon Label */
|
|
.ui.corner.label {
|
|
background-color: transparent !important;
|
|
}
|
|
.ui.corner.label:after {
|
|
position: absolute;
|
|
content: "";
|
|
right: 0em;
|
|
top: 0em;
|
|
z-index: -1;
|
|
width: 0em;
|
|
height: 0em;
|
|
background-color: transparent !important;
|
|
border-top: 0em solid transparent;
|
|
border-right: 4em solid transparent;
|
|
border-bottom: 4em solid transparent;
|
|
border-left: 0em solid transparent;
|
|
border-right-color: inherit;
|
|
-webkit-transition: border-color 0.1s ease;
|
|
transition: border-color 0.1s ease;
|
|
}
|
|
.ui.corner.label .icon {
|
|
cursor: default;
|
|
position: relative;
|
|
top: 0.64285714em;
|
|
left: 0.78571429em;
|
|
font-size: 1.14285714em;
|
|
margin: 0em;
|
|
}
|
|
/* Left Corner */
|
|
.ui.left.corner.label,
|
|
.ui.left.corner.label:after {
|
|
right: auto;
|
|
left: 0em;
|
|
}
|
|
.ui.left.corner.label:after {
|
|
border-top: 4em solid transparent;
|
|
border-right: 4em solid transparent;
|
|
border-bottom: 0em solid transparent;
|
|
border-left: 0em solid transparent;
|
|
border-top-color: inherit;
|
|
}
|
|
.ui.left.corner.label .icon {
|
|
left: -0.78571429em;
|
|
}
|
|
/* Segment */
|
|
.ui.segment > .ui.corner.label {
|
|
top: -1px;
|
|
right: -1px;
|
|
}
|
|
.ui.segment > .ui.left.corner.label {
|
|
right: auto;
|
|
left: -1px;
|
|
}
|
|
/*-------------------
|
|
Ribbon
|
|
--------------------*/
|
|
.ui.ribbon.label {
|
|
position: relative;
|
|
margin: 0em;
|
|
min-width: -webkit-max-content;
|
|
min-width: -moz-max-content;
|
|
min-width: max-content;
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
border-color: rgba(0, 0, 0, 0.15);
|
|
}
|
|
.ui.ribbon.label:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 100%;
|
|
left: 0%;
|
|
background-color: transparent !important;
|
|
border-style: solid;
|
|
border-width: 0em 1.2em 1.2em 0em;
|
|
border-color: transparent;
|
|
border-right-color: inherit;
|
|
width: 0em;
|
|
height: 0em;
|
|
}
|
|
/* Positioning */
|
|
.ui.ribbon.label {
|
|
left: calc( -1rem - 1.2em );
|
|
margin-right: -1.2em;
|
|
padding-left: calc( 1rem + 1.2em );
|
|
padding-right: 1.2em;
|
|
}
|
|
.ui[class*="right ribbon"].label {
|
|
left: calc(100% + 1rem + 1.2em );
|
|
padding-left: 1.2em;
|
|
padding-right: calc( 1rem + 1.2em );
|
|
}
|
|
/* Right Ribbon */
|
|
.ui[class*="right ribbon"].label {
|
|
text-align: left;
|
|
-webkit-transform: translateX(-100%);
|
|
transform: translateX(-100%);
|
|
border-radius: 0.28571429rem 0em 0em 0.28571429rem;
|
|
}
|
|
.ui[class*="right ribbon"].label:after {
|
|
left: auto;
|
|
right: 0%;
|
|
border-style: solid;
|
|
border-width: 1.2em 1.2em 0em 0em;
|
|
border-color: transparent;
|
|
border-top-color: inherit;
|
|
}
|
|
/* Inside Table */
|
|
.ui.image > .ribbon.label,
|
|
.ui.card .image > .ribbon.label {
|
|
position: absolute;
|
|
top: 1rem;
|
|
}
|
|
.ui.card .image > .ui.ribbon.label,
|
|
.ui.image > .ui.ribbon.label {
|
|
left: calc( 0.05rem - 1.2em );
|
|
}
|
|
.ui.card .image > .ui[class*="right ribbon"].label,
|
|
.ui.image > .ui[class*="right ribbon"].label {
|
|
left: calc(100% + -0.05rem + 1.2em );
|
|
padding-left: 0.833em;
|
|
}
|
|
/* Inside Table */
|
|
.ui.table td > .ui.ribbon.label {
|
|
left: calc( -0.78571429em - 1.2em );
|
|
}
|
|
.ui.table td > .ui[class*="right ribbon"].label {
|
|
left: calc(100% + 0.78571429em + 1.2em );
|
|
padding-left: 0.833em;
|
|
}
|
|
/*-------------------
|
|
Attached
|
|
--------------------*/
|
|
.ui[class*="top attached"].label,
|
|
.ui.attached.label {
|
|
width: 100%;
|
|
position: absolute;
|
|
margin: 0em;
|
|
top: 0em;
|
|
left: 0em;
|
|
padding: 0.75em 1em;
|
|
border-radius: 0.21428571rem 0.21428571rem 0em 0em;
|
|
}
|
|
.ui[class*="bottom attached"].label {
|
|
top: auto;
|
|
bottom: 0em;
|
|
border-radius: 0em 0em 0.21428571rem 0.21428571rem;
|
|
}
|
|
.ui[class*="top left attached"].label {
|
|
width: auto;
|
|
margin-top: 0em !important;
|
|
border-radius: 0.21428571rem 0em 0.28571429rem 0em;
|
|
}
|
|
.ui[class*="top right attached"].label {
|
|
width: auto;
|
|
left: auto;
|
|
right: 0em;
|
|
border-radius: 0em 0.21428571rem 0em 0.28571429rem;
|
|
}
|
|
.ui[class*="bottom left attached"].label {
|
|
width: auto;
|
|
top: auto;
|
|
bottom: 0em;
|
|
border-radius: 0em 0.28571429rem 0em 0.21428571rem;
|
|
}
|
|
.ui[class*="bottom right attached"].label {
|
|
top: auto;
|
|
bottom: 0em;
|
|
left: auto;
|
|
right: 0em;
|
|
width: auto;
|
|
border-radius: 0.28571429rem 0em 0.21428571rem 0em;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
.ui.label.disabled {
|
|
opacity: 0.5;
|
|
}
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
a.ui.labels .label:hover,
|
|
a.ui.label:hover {
|
|
background-color: #E0E0E0;
|
|
border-color: #E0E0E0;
|
|
background-image: none;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
.ui.labels a.label:hover:before,
|
|
a.ui.label:hover:before {
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
.ui.active.label {
|
|
background-color: #D0D0D0;
|
|
border-color: #D0D0D0;
|
|
background-image: none;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
.ui.active.label:before {
|
|
background-color: #D0D0D0;
|
|
background-image: none;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*-------------------
|
|
Active Hover
|
|
--------------------*/
|
|
a.ui.labels .active.label:hover,
|
|
a.ui.active.label:hover {
|
|
background-color: #C8C8C8;
|
|
border-color: #C8C8C8;
|
|
background-image: none;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
.ui.labels a.active.label:ActiveHover:before,
|
|
a.ui.active.label:ActiveHover:before {
|
|
background-color: #C8C8C8;
|
|
background-image: none;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*-------------------
|
|
Visible
|
|
--------------------*/
|
|
.ui.labels.visible .label,
|
|
.ui.label.visible:not(.dropdown) {
|
|
display: inline-block !important;
|
|
}
|
|
/*-------------------
|
|
Hidden
|
|
--------------------*/
|
|
.ui.labels.hidden .label,
|
|
.ui.label.hidden {
|
|
display: none !important;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Colors
|
|
--------------------*/
|
|
/*--- Red ---*/
|
|
.ui.red.labels .label,
|
|
.ui.red.label {
|
|
background-color: #EF767A !important;
|
|
border-color: #EF767A !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.red.labels .label:hover,
|
|
a.ui.red.label:hover {
|
|
background-color: #f3585d !important;
|
|
border-color: #f3585d !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.red.corner.label,
|
|
.ui.red.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.red.ribbon.label {
|
|
border-color: #ea484e !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.red.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #EF767A !important;
|
|
border-color: #EF767A !important;
|
|
}
|
|
.ui.basic.red.labels a.label:hover,
|
|
a.ui.basic.red.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #f3585d !important;
|
|
border-color: #f3585d !important;
|
|
}
|
|
/*--- Orange ---*/
|
|
.ui.orange.labels .label,
|
|
.ui.orange.label {
|
|
background-color: #ff8b27 !important;
|
|
border-color: #ff8b27 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.orange.labels .label:hover,
|
|
a.ui.orange.label:hover {
|
|
background-color: #ff7d0d !important;
|
|
border-color: #ff7d0d !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.orange.corner.label,
|
|
.ui.orange.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.orange.ribbon.label {
|
|
border-color: #f37000 !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.orange.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #ff8b27 !important;
|
|
border-color: #ff8b27 !important;
|
|
}
|
|
.ui.basic.orange.labels a.label:hover,
|
|
a.ui.basic.orange.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #ff7d0d !important;
|
|
border-color: #ff7d0d !important;
|
|
}
|
|
/*--- Yellow ---*/
|
|
.ui.yellow.labels .label,
|
|
.ui.yellow.label {
|
|
background-color: #FDE74C !important;
|
|
border-color: #FDE74C !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.yellow.labels .label:hover,
|
|
a.ui.yellow.label:hover {
|
|
background-color: #ffe531 !important;
|
|
border-color: #ffe531 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.yellow.corner.label,
|
|
.ui.yellow.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.yellow.ribbon.label {
|
|
border-color: #fce01a !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.yellow.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #FDE74C !important;
|
|
border-color: #FDE74C !important;
|
|
}
|
|
.ui.basic.yellow.labels a.label:hover,
|
|
a.ui.basic.yellow.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #ffe531 !important;
|
|
border-color: #ffe531 !important;
|
|
}
|
|
/*--- Olive ---*/
|
|
.ui.olive.labels .label,
|
|
.ui.olive.label {
|
|
background-color: #B5CC18 !important;
|
|
border-color: #B5CC18 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.olive.labels .label:hover,
|
|
a.ui.olive.label:hover {
|
|
background-color: #a7bd0d !important;
|
|
border-color: #a7bd0d !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.olive.corner.label,
|
|
.ui.olive.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.olive.ribbon.label {
|
|
border-color: #00ba00 !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.olive.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #B5CC18 !important;
|
|
border-color: #B5CC18 !important;
|
|
}
|
|
.ui.basic.olive.labels a.label:hover,
|
|
a.ui.basic.olive.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #a7bd0d !important;
|
|
border-color: #a7bd0d !important;
|
|
}
|
|
/*--- Green ---*/
|
|
.ui.green.labels .label,
|
|
.ui.green.label {
|
|
background-color: #00ED00 !important;
|
|
border-color: #00ED00 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.green.labels .label:hover,
|
|
a.ui.green.label:hover {
|
|
background-color: #00d400 !important;
|
|
border-color: #00d400 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.green.corner.label,
|
|
.ui.green.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.green.ribbon.label {
|
|
border-color: #00ba00 !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.green.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #00ED00 !important;
|
|
border-color: #00ED00 !important;
|
|
}
|
|
.ui.basic.green.labels a.label:hover,
|
|
a.ui.basic.green.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #00d400 !important;
|
|
border-color: #00d400 !important;
|
|
}
|
|
/*--- Teal ---*/
|
|
.ui.teal.labels .label,
|
|
.ui.teal.label {
|
|
background-color: #3891A6 !important;
|
|
border-color: #3891A6 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.teal.labels .label:hover,
|
|
a.ui.teal.label:hover {
|
|
background-color: #2d8398 !important;
|
|
border-color: #2d8398 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.teal.corner.label,
|
|
.ui.teal.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.teal.ribbon.label {
|
|
border-color: #2b7080 !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.teal.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #3891A6 !important;
|
|
border-color: #3891A6 !important;
|
|
}
|
|
.ui.basic.teal.labels a.label:hover,
|
|
a.ui.basic.teal.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #2d8398 !important;
|
|
border-color: #2d8398 !important;
|
|
}
|
|
/*--- Blue ---*/
|
|
.ui.blue.labels .label,
|
|
.ui.blue.label {
|
|
background-color: #3454D1 !important;
|
|
border-color: #3454D1 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.blue.labels .label:hover,
|
|
a.ui.blue.label:hover {
|
|
background-color: #2445c7 !important;
|
|
border-color: #2445c7 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.blue.corner.label,
|
|
.ui.blue.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.blue.ribbon.label {
|
|
border-color: #2742ab !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.blue.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #3454D1 !important;
|
|
border-color: #3454D1 !important;
|
|
}
|
|
.ui.basic.blue.labels a.label:hover,
|
|
a.ui.basic.blue.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #2445c7 !important;
|
|
border-color: #2445c7 !important;
|
|
}
|
|
/*--- Violet ---*/
|
|
.ui.violet.labels .label,
|
|
.ui.violet.label {
|
|
background-color: #B4009E !important;
|
|
border-color: #B4009E !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.violet.labels .label:hover,
|
|
a.ui.violet.label:hover {
|
|
background-color: #9b0088 !important;
|
|
border-color: #9b0088 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.violet.corner.label,
|
|
.ui.violet.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.violet.ribbon.label {
|
|
border-color: #810071 !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.violet.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #B4009E !important;
|
|
border-color: #B4009E !important;
|
|
}
|
|
.ui.basic.violet.labels a.label:hover,
|
|
a.ui.basic.violet.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #9b0088 !important;
|
|
border-color: #9b0088 !important;
|
|
}
|
|
/*--- Purple ---*/
|
|
.ui.purple.labels .label,
|
|
.ui.purple.label {
|
|
background-color: #6633cc !important;
|
|
border-color: #6633cc !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.purple.labels .label:hover,
|
|
a.ui.purple.label:hover {
|
|
background-color: #5a27be !important;
|
|
border-color: #5a27be !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.purple.corner.label,
|
|
.ui.purple.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.purple.ribbon.label {
|
|
border-color: #5229a3 !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.purple.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #6633cc !important;
|
|
border-color: #6633cc !important;
|
|
}
|
|
.ui.basic.purple.labels a.label:hover,
|
|
a.ui.basic.purple.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #5a27be !important;
|
|
border-color: #5a27be !important;
|
|
}
|
|
/*--- Pink ---*/
|
|
.ui.pink.labels .label,
|
|
.ui.pink.label {
|
|
background-color: #F46197 !important;
|
|
border-color: #F46197 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.pink.labels .label:hover,
|
|
a.ui.pink.label:hover {
|
|
background-color: #fb4185 !important;
|
|
border-color: #fb4185 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.pink.corner.label,
|
|
.ui.pink.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.pink.ribbon.label {
|
|
border-color: #f13178 !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.pink.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #F46197 !important;
|
|
border-color: #F46197 !important;
|
|
}
|
|
.ui.basic.pink.labels a.label:hover,
|
|
a.ui.basic.pink.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #fb4185 !important;
|
|
border-color: #fb4185 !important;
|
|
}
|
|
/*--- Brown ---*/
|
|
.ui.brown.labels .label,
|
|
.ui.brown.label {
|
|
background-color: #00BCF2 !important;
|
|
border-color: #00BCF2 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.brown.labels .label:hover,
|
|
a.ui.brown.label:hover {
|
|
background-color: #00a8d9 !important;
|
|
border-color: #00a8d9 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.brown.corner.label,
|
|
.ui.brown.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.brown.ribbon.label {
|
|
border-color: #0094bf !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.brown.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #00BCF2 !important;
|
|
border-color: #00BCF2 !important;
|
|
}
|
|
.ui.basic.brown.labels a.label:hover,
|
|
a.ui.basic.brown.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #00a8d9 !important;
|
|
border-color: #00a8d9 !important;
|
|
}
|
|
/*--- Grey ---*/
|
|
.ui.grey.labels .label,
|
|
.ui.grey.label {
|
|
background-color: #95a5a6 !important;
|
|
border-color: #95a5a6 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.grey.labels .label:hover,
|
|
a.ui.grey.label:hover {
|
|
background-color: #a3b1b2 !important;
|
|
border-color: #a3b1b2 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.grey.corner.label,
|
|
.ui.grey.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.grey.ribbon.label {
|
|
border-color: #0094bf !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.grey.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #95a5a6 !important;
|
|
border-color: #95a5a6 !important;
|
|
}
|
|
.ui.basic.grey.labels a.label:hover,
|
|
a.ui.basic.grey.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #a3b1b2 !important;
|
|
border-color: #a3b1b2 !important;
|
|
}
|
|
/*--- Black ---*/
|
|
.ui.black.labels .label,
|
|
.ui.black.label {
|
|
background-color: #1B1C1D !important;
|
|
border-color: #1B1C1D !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Link */
|
|
.ui.black.labels .label:hover,
|
|
a.ui.black.label:hover {
|
|
background-color: #27292a !important;
|
|
border-color: #27292a !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Corner */
|
|
.ui.black.corner.label,
|
|
.ui.black.corner.label:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Ribbon */
|
|
.ui.black.ribbon.label {
|
|
border-color: #0094bf !important;
|
|
}
|
|
/* Basic */
|
|
.ui.basic.black.label {
|
|
background-color: #FFFFFF !important;
|
|
color: #1B1C1D !important;
|
|
border-color: #1B1C1D !important;
|
|
}
|
|
.ui.basic.black.labels a.label:hover,
|
|
a.ui.basic.black.label:hover {
|
|
background-color: #FFFFFF !important;
|
|
color: #27292a !important;
|
|
border-color: #27292a !important;
|
|
}
|
|
/*-------------------
|
|
Basic
|
|
--------------------*/
|
|
.ui.basic.label {
|
|
background: none #FFFFFF;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Link */
|
|
a.ui.basic.label:hover {
|
|
text-decoration: none;
|
|
background: none #FFFFFF;
|
|
color: #1e70bf;
|
|
-webkit-box-shadow: 1px solid rgba(34, 36, 38, 0.15);
|
|
box-shadow: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Pointing */
|
|
.ui.basic.pointing.label:before {
|
|
border-color: inherit;
|
|
}
|
|
/*-------------------
|
|
Fluid
|
|
--------------------*/
|
|
.ui.label.fluid,
|
|
.ui.fluid.labels > .label {
|
|
width: 100%;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
/*-------------------
|
|
Inverted
|
|
--------------------*/
|
|
.ui.inverted.labels .label,
|
|
.ui.inverted.label {
|
|
color: rgba(255, 255, 255, 0.9) !important;
|
|
}
|
|
/*-------------------
|
|
Horizontal
|
|
--------------------*/
|
|
.ui.horizontal.labels .label,
|
|
.ui.horizontal.label {
|
|
margin: 0em 0.5em 0em 0em;
|
|
padding: 0.4em 0.833em;
|
|
min-width: 3em;
|
|
text-align: center;
|
|
}
|
|
/*-------------------
|
|
Circular
|
|
--------------------*/
|
|
.ui.circular.labels .label,
|
|
.ui.circular.label {
|
|
min-width: 2em;
|
|
min-height: 2em;
|
|
padding: 0.5em !important;
|
|
line-height: 1em;
|
|
text-align: center;
|
|
border-radius: 500rem;
|
|
}
|
|
.ui.empty.circular.labels .label,
|
|
.ui.empty.circular.label {
|
|
min-width: 0em;
|
|
min-height: 0em;
|
|
overflow: hidden;
|
|
width: 0.5em;
|
|
height: 0.5em;
|
|
vertical-align: baseline;
|
|
}
|
|
/*-------------------
|
|
Pointing
|
|
--------------------*/
|
|
.ui.pointing.label {
|
|
position: relative;
|
|
}
|
|
.ui.attached.pointing.label {
|
|
position: absolute;
|
|
}
|
|
.ui.pointing.label:before {
|
|
background-color: inherit;
|
|
background-image: inherit;
|
|
border-width: none;
|
|
border-style: solid;
|
|
border-color: inherit;
|
|
}
|
|
/* Arrow */
|
|
.ui.pointing.label:before {
|
|
position: absolute;
|
|
content: '';
|
|
-webkit-transform: rotate(45deg);
|
|
transform: rotate(45deg);
|
|
background-image: none;
|
|
z-index: 2;
|
|
width: 0.6666em;
|
|
height: 0.6666em;
|
|
-webkit-transition: background 0.1s ease;
|
|
transition: background 0.1s ease;
|
|
}
|
|
/*--- Above ---*/
|
|
.ui.pointing.label,
|
|
.ui[class*="pointing above"].label {
|
|
margin-top: 1em;
|
|
}
|
|
.ui.pointing.label:before,
|
|
.ui[class*="pointing above"].label:before {
|
|
border-width: 1px 0px 0px 1px;
|
|
-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
|
|
transform: translateX(-50%) translateY(-50%) rotate(45deg);
|
|
top: 0%;
|
|
left: 50%;
|
|
}
|
|
/*--- Below ---*/
|
|
.ui[class*="bottom pointing"].label,
|
|
.ui[class*="pointing below"].label {
|
|
margin-top: 0em;
|
|
margin-bottom: 1em;
|
|
}
|
|
.ui[class*="bottom pointing"].label:before,
|
|
.ui[class*="pointing below"].label:before {
|
|
border-width: 0px 1px 1px 0px;
|
|
top: auto;
|
|
right: auto;
|
|
-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
|
|
transform: translateX(-50%) translateY(-50%) rotate(45deg);
|
|
top: 100%;
|
|
left: 50%;
|
|
}
|
|
/*--- Left ---*/
|
|
.ui[class*="left pointing"].label {
|
|
margin-top: 0em;
|
|
margin-left: 0.6666em;
|
|
}
|
|
.ui[class*="left pointing"].label:before {
|
|
border-width: 0px 0px 1px 1px;
|
|
-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
|
|
transform: translateX(-50%) translateY(-50%) rotate(45deg);
|
|
bottom: auto;
|
|
right: auto;
|
|
top: 50%;
|
|
left: 0em;
|
|
}
|
|
/*--- Right ---*/
|
|
.ui[class*="right pointing"].label {
|
|
margin-top: 0em;
|
|
margin-right: 0.6666em;
|
|
}
|
|
.ui[class*="right pointing"].label:before {
|
|
border-width: 1px 1px 0px 0px;
|
|
-webkit-transform: translateX(50%) translateY(-50%) rotate(45deg);
|
|
transform: translateX(50%) translateY(-50%) rotate(45deg);
|
|
top: 50%;
|
|
right: 0%;
|
|
bottom: auto;
|
|
left: auto;
|
|
}
|
|
/* Basic Pointing */
|
|
/*--- Above ---*/
|
|
.ui.basic.pointing.label:before,
|
|
.ui.basic[class*="pointing above"].label:before {
|
|
margin-top: -1px;
|
|
}
|
|
/*--- Below ---*/
|
|
.ui.basic[class*="bottom pointing"].label:before,
|
|
.ui.basic[class*="pointing below"].label:before {
|
|
bottom: auto;
|
|
top: 100%;
|
|
margin-top: 1px;
|
|
}
|
|
/*--- Left ---*/
|
|
.ui.basic[class*="left pointing"].label:before {
|
|
top: 50%;
|
|
left: -1px;
|
|
}
|
|
/*--- Right ---*/
|
|
.ui.basic[class*="right pointing"].label:before {
|
|
top: 50%;
|
|
right: -1px;
|
|
}
|
|
/*------------------
|
|
Floating Label
|
|
-------------------*/
|
|
.ui.floating.label {
|
|
position: absolute;
|
|
z-index: 100;
|
|
top: -1em;
|
|
left: 100%;
|
|
margin: 0em 0em 0em -1.5em !important;
|
|
}
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
.ui.mini.labels .label,
|
|
.ui.mini.label {
|
|
font-size: 0.64285714rem;
|
|
}
|
|
.ui.tiny.labels .label,
|
|
.ui.tiny.label {
|
|
font-size: 0.71428571rem;
|
|
}
|
|
.ui.small.labels .label,
|
|
.ui.small.label {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.labels .label,
|
|
.ui.label {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.large.labels .label,
|
|
.ui.large.label {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.big.labels .label,
|
|
.ui.big.label {
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.huge.labels .label,
|
|
.ui.huge.label {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
.ui.massive.labels .label,
|
|
.ui.massive.label {
|
|
font-size: 1.71428571rem;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - List
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
List
|
|
*******************************/
|
|
/*-------------------
|
|
View
|
|
--------------------*/
|
|
/* List */
|
|
/* List Item */
|
|
/* Sub List */
|
|
/* Sub List Item */
|
|
/*-------------------
|
|
Elements
|
|
--------------------*/
|
|
/* Icon */
|
|
/* Image */
|
|
/* Content */
|
|
/* Header */
|
|
/* Description */
|
|
/* Link */
|
|
/* Header Link */
|
|
/* Linked Icon */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Float */
|
|
/* Horizontal */
|
|
/* Inverted */
|
|
/* Link List */
|
|
/* Inverted Link List */
|
|
/* Selection List */
|
|
/* Selection List States */
|
|
/* Inverted Selection List */
|
|
/* Animated List */
|
|
/* Bulleted */
|
|
/* Horizontal Bullets */
|
|
/* Ordered List */
|
|
/* Horizontal Ordered */
|
|
/* Divided */
|
|
/* Divided Horizontal */
|
|
/* Divided */
|
|
/* Divided Horizontal */
|
|
/* Relaxed */
|
|
/* Very Relaxed */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
List
|
|
*******************************/
|
|
ul.ui.list,
|
|
ol.ui.list,
|
|
.ui.list {
|
|
list-style-type: none;
|
|
margin: 1em 0em;
|
|
padding: 0em 0em;
|
|
}
|
|
ul.ui.list:first-child,
|
|
ol.ui.list:first-child,
|
|
.ui.list:first-child {
|
|
margin-top: 0em;
|
|
padding-top: 0em;
|
|
}
|
|
ul.ui.list:last-child,
|
|
ol.ui.list:last-child,
|
|
.ui.list:last-child {
|
|
margin-bottom: 0em;
|
|
padding-bottom: 0em;
|
|
}
|
|
/*******************************
|
|
Content
|
|
*******************************/
|
|
/* List Item */
|
|
ul.ui.list li,
|
|
ol.ui.list li,
|
|
.ui.list > .item,
|
|
.ui.list .list > .item {
|
|
display: list-item;
|
|
table-layout: fixed;
|
|
list-style-type: none;
|
|
list-style-position: outside;
|
|
padding: 0.21428571em 0em;
|
|
line-height: 1.14285714em;
|
|
}
|
|
ul.ui.list > li:first-child:after,
|
|
ol.ui.list > li:first-child:after,
|
|
.ui.list > .list > .item,
|
|
.ui.list > .item:after {
|
|
content: '';
|
|
display: block;
|
|
height: 0;
|
|
clear: both;
|
|
visibility: hidden;
|
|
}
|
|
ul.ui.list li:first-child,
|
|
ol.ui.list li:first-child,
|
|
.ui.list .list > .item:first-child,
|
|
.ui.list > .item:first-child {
|
|
padding-top: 0em;
|
|
}
|
|
ul.ui.list li:last-child,
|
|
ol.ui.list li:last-child,
|
|
.ui.list .list > .item:last-child,
|
|
.ui.list > .item:last-child {
|
|
padding-bottom: 0em;
|
|
}
|
|
/* Child List */
|
|
ul.ui.list ul,
|
|
ol.ui.list ol,
|
|
.ui.list .list {
|
|
clear: both;
|
|
margin: 0em;
|
|
padding: 0.75em 0em 0.25em 0.5em;
|
|
}
|
|
/* Child Item */
|
|
ul.ui.list ul li,
|
|
ol.ui.list ol li,
|
|
.ui.list .list > .item {
|
|
padding: 0.14285714em 0em;
|
|
line-height: inherit;
|
|
}
|
|
/* Icon */
|
|
.ui.list .list > .item > i.icon,
|
|
.ui.list > .item > i.icon {
|
|
display: table-cell;
|
|
margin: 0em;
|
|
padding-top: 0.07142857em;
|
|
padding-right: 0.28571429em;
|
|
vertical-align: top;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
.ui.list .list > .item > i.icon:only-child,
|
|
.ui.list > .item > i.icon:only-child {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
}
|
|
/* Image */
|
|
.ui.list .list > .item > .image,
|
|
.ui.list > .item > .image {
|
|
display: table-cell;
|
|
background-color: transparent;
|
|
margin: 0em;
|
|
vertical-align: top;
|
|
}
|
|
.ui.list .list > .item > .image:not(:only-child):not(img),
|
|
.ui.list > .item > .image:not(:only-child):not(img) {
|
|
padding-right: 0.5em;
|
|
}
|
|
.ui.list .list > .item > .image img,
|
|
.ui.list > .item > .image img {
|
|
vertical-align: top;
|
|
}
|
|
.ui.list .list > .item > img.image,
|
|
.ui.list .list > .item > .image:only-child,
|
|
.ui.list > .item > img.image,
|
|
.ui.list > .item > .image:only-child {
|
|
display: inline-block;
|
|
}
|
|
/* Content */
|
|
.ui.list .list > .item > .content,
|
|
.ui.list > .item > .content {
|
|
line-height: 1.14285714em;
|
|
}
|
|
.ui.list .list > .item > .image + .content,
|
|
.ui.list .list > .item > .icon + .content,
|
|
.ui.list > .item > .image + .content,
|
|
.ui.list > .item > .icon + .content {
|
|
display: table-cell;
|
|
padding: 0em 0em 0em 0.5em;
|
|
vertical-align: top;
|
|
}
|
|
.ui.list .list > .item > img.image + .content,
|
|
.ui.list > .item > img.image + .content {
|
|
display: inline-block;
|
|
}
|
|
.ui.list .list > .item > .content > .list,
|
|
.ui.list > .item > .content > .list {
|
|
margin-left: 0em;
|
|
padding-left: 0em;
|
|
}
|
|
/* Header */
|
|
.ui.list .list > .item .header,
|
|
.ui.list > .item .header {
|
|
display: block;
|
|
margin: 0em;
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/* Description */
|
|
.ui.list .list > .item .description,
|
|
.ui.list > .item .description {
|
|
display: block;
|
|
color: rgba(0, 0, 0, 0.7);
|
|
}
|
|
/* Child Link */
|
|
.ui.list > .item a,
|
|
.ui.list .list > .item a {
|
|
cursor: pointer;
|
|
}
|
|
/* Linking Item */
|
|
.ui.list .list > a.item,
|
|
.ui.list > a.item {
|
|
cursor: pointer;
|
|
color: #4183C4;
|
|
}
|
|
.ui.list .list > a.item:hover,
|
|
.ui.list > a.item:hover {
|
|
color: #1e70bf;
|
|
}
|
|
/* Linked Item Icons */
|
|
.ui.list .list > a.item i.icon,
|
|
.ui.list > a.item i.icon {
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
/* Header Link */
|
|
.ui.list .list > .item a.header,
|
|
.ui.list > .item a.header {
|
|
cursor: pointer;
|
|
color: #4183C4 !important;
|
|
}
|
|
.ui.list .list > .item a.header:hover,
|
|
.ui.list > .item a.header:hover {
|
|
color: #1e70bf !important;
|
|
}
|
|
/* Floated Content */
|
|
.ui[class*="left floated"].list {
|
|
float: left;
|
|
}
|
|
.ui[class*="right floated"].list {
|
|
float: right;
|
|
}
|
|
.ui.list .list > .item [class*="left floated"],
|
|
.ui.list > .item [class*="left floated"] {
|
|
float: left;
|
|
margin: 0em 1em 0em 0em;
|
|
}
|
|
.ui.list .list > .item [class*="right floated"],
|
|
.ui.list > .item [class*="right floated"] {
|
|
float: right;
|
|
margin: 0em 0em 0em 1em;
|
|
}
|
|
/*******************************
|
|
Coupling
|
|
*******************************/
|
|
.ui.menu .ui.list > .item,
|
|
.ui.menu .ui.list .list > .item {
|
|
display: list-item;
|
|
table-layout: fixed;
|
|
background-color: transparent;
|
|
list-style-type: none;
|
|
list-style-position: outside;
|
|
padding: 0.21428571em 0em;
|
|
line-height: 1.14285714em;
|
|
}
|
|
.ui.menu .ui.list .list > .item:before,
|
|
.ui.menu .ui.list > .item:before {
|
|
border: none;
|
|
background: none;
|
|
}
|
|
.ui.menu .ui.list .list > .item:first-child,
|
|
.ui.menu .ui.list > .item:first-child {
|
|
padding-top: 0em;
|
|
}
|
|
.ui.menu .ui.list .list > .item:last-child,
|
|
.ui.menu .ui.list > .item:last-child {
|
|
padding-bottom: 0em;
|
|
}
|
|
/*******************************
|
|
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:not(.celled) > .item:first-child {
|
|
margin-left: 0em !important;
|
|
padding-left: 0em !important;
|
|
}
|
|
.ui.horizontal.list .list {
|
|
padding-left: 0em;
|
|
padding-bottom: 0em;
|
|
}
|
|
.ui.horizontal.list > .item > .image,
|
|
.ui.horizontal.list .list > .item > .image,
|
|
.ui.horizontal.list > .item > .icon,
|
|
.ui.horizontal.list .list > .item > .icon,
|
|
.ui.horizontal.list > .item > .content,
|
|
.ui.horizontal.list .list > .item > .content {
|
|
vertical-align: middle;
|
|
}
|
|
/* Padding on all elements */
|
|
.ui.horizontal.list > .item:first-child,
|
|
.ui.horizontal.list > .item:last-child {
|
|
padding-top: 0.21428571em;
|
|
padding-bottom: 0.21428571em;
|
|
}
|
|
/* Horizontal List */
|
|
.ui.horizontal.list > .item > i.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;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
.ui.list .list > .disabled.item,
|
|
.ui.list > .disabled.item {
|
|
pointer-events: none;
|
|
color: rgba(40, 40, 40, 0.3) !important;
|
|
}
|
|
.ui.inverted.list .list > .disabled.item,
|
|
.ui.inverted.list > .disabled.item {
|
|
color: rgba(225, 225, 225, 0.3) !important;
|
|
}
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
.ui.list .list > a.item:hover .icon,
|
|
.ui.list > a.item:hover .icon {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Inverted
|
|
--------------------*/
|
|
.ui.inverted.list .list > a.item > .icon,
|
|
.ui.inverted.list > a.item > .icon {
|
|
color: rgba(255, 255, 255, 0.7);
|
|
}
|
|
.ui.inverted.list .list > .item .header,
|
|
.ui.inverted.list > .item .header {
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
.ui.inverted.list .list > .item .description,
|
|
.ui.inverted.list > .item .description {
|
|
color: rgba(255, 255, 255, 0.7);
|
|
}
|
|
/* Item Link */
|
|
.ui.inverted.list .list > a.item,
|
|
.ui.inverted.list > a.item {
|
|
cursor: pointer;
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
.ui.inverted.list .list > a.item:hover,
|
|
.ui.inverted.list > a.item:hover {
|
|
color: #1e70bf;
|
|
}
|
|
/* Linking Content */
|
|
.ui.inverted.list .item a:not(.ui) {
|
|
color: rgba(255, 255, 255, 0.9) !important;
|
|
}
|
|
.ui.inverted.list .item a:not(.ui):hover {
|
|
color: #1e70bf !important;
|
|
}
|
|
/*-------------------
|
|
Aligned
|
|
--------------------*/
|
|
.ui.list[class*="top aligned"] .image,
|
|
.ui.list[class*="top aligned"] .content,
|
|
.ui.list [class*="top aligned"] {
|
|
vertical-align: top !important;
|
|
}
|
|
.ui.list[class*="middle aligned"] .image,
|
|
.ui.list[class*="middle aligned"] .content,
|
|
.ui.list [class*="middle aligned"] {
|
|
vertical-align: middle !important;
|
|
}
|
|
.ui.list[class*="bottom aligned"] .image,
|
|
.ui.list[class*="bottom aligned"] .content,
|
|
.ui.list [class*="bottom aligned"] {
|
|
vertical-align: bottom !important;
|
|
}
|
|
/*-------------------
|
|
Link
|
|
--------------------*/
|
|
.ui.link.list .item,
|
|
.ui.link.list a.item,
|
|
.ui.link.list .item a:not(.ui) {
|
|
color: rgba(0, 0, 0, 0.4);
|
|
-webkit-transition: 0.1s color ease;
|
|
transition: 0.1s color ease;
|
|
}
|
|
.ui.link.list a.item:hover,
|
|
.ui.link.list .item a:not(.ui):hover {
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
.ui.link.list a.item:active,
|
|
.ui.link.list .item a:not(.ui):active {
|
|
color: rgba(0, 0, 0, 0.9);
|
|
}
|
|
.ui.link.list .active.item,
|
|
.ui.link.list .active.item a:not(.ui) {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.link.list .item,
|
|
.ui.inverted.link.list a.item,
|
|
.ui.inverted.link.list .item a:not(.ui) {
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
.ui.inverted.link.list a.item:hover,
|
|
.ui.inverted.link.list .item a:not(.ui):hover {
|
|
color: #ffffff;
|
|
}
|
|
.ui.inverted.link.list a.item:active,
|
|
.ui.inverted.link.list .item a:not(.ui):active {
|
|
color: #ffffff;
|
|
}
|
|
.ui.inverted.link.list a.active.item,
|
|
.ui.inverted.link.list .active.item a:not(.ui) {
|
|
color: #ffffff;
|
|
}
|
|
/*-------------------
|
|
Selection
|
|
--------------------*/
|
|
.ui.selection.list .list > .item,
|
|
.ui.selection.list > .item {
|
|
cursor: pointer;
|
|
background: transparent;
|
|
padding: 0.5em 0.5em;
|
|
margin: 0em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
border-radius: 0.5em;
|
|
-webkit-transition: 0.1s color ease, 0.1s padding-left ease, 0.1s background-color ease;
|
|
transition: 0.1s color ease, 0.1s padding-left ease, 0.1s background-color ease;
|
|
}
|
|
.ui.selection.list .list > .item:last-child,
|
|
.ui.selection.list > .item:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.selection.list.list > .item:hover,
|
|
.ui.selection.list > .item:hover {
|
|
background: rgba(0, 0, 0, 0.03);
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
.ui.selection.list .list > .item:active,
|
|
.ui.selection.list > .item:active {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.9);
|
|
}
|
|
.ui.selection.list .list > .item.active,
|
|
.ui.selection.list > .item.active {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.selection.list > .item,
|
|
.ui.inverted.selection.list > .item {
|
|
background: transparent;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
.ui.inverted.selection.list > .item:hover,
|
|
.ui.inverted.selection.list > .item:hover {
|
|
background: rgba(255, 255, 255, 0.02);
|
|
color: #ffffff;
|
|
}
|
|
.ui.inverted.selection.list > .item:active,
|
|
.ui.inverted.selection.list > .item:active {
|
|
background: rgba(255, 255, 255, 0.08);
|
|
color: #ffffff;
|
|
}
|
|
.ui.inverted.selection.list > .item.active,
|
|
.ui.inverted.selection.list > .item.active {
|
|
background: rgba(255, 255, 255, 0.08);
|
|
color: #ffffff;
|
|
}
|
|
/* Celled / Divided Selection List */
|
|
.ui.celled.selection.list .list > .item,
|
|
.ui.divided.selection.list .list > .item,
|
|
.ui.celled.selection.list > .item,
|
|
.ui.divided.selection.list > .item {
|
|
border-radius: 0em;
|
|
}
|
|
/*-------------------
|
|
Animated
|
|
--------------------*/
|
|
.ui.animated.list > .item {
|
|
-webkit-transition: 0.25s color ease 0.1s, 0.25s padding-left ease 0.1s, 0.25s background-color ease 0.1s;
|
|
transition: 0.25s color ease 0.1s, 0.25s padding-left ease 0.1s, 0.25s background-color ease 0.1s;
|
|
}
|
|
.ui.animated.list:not(.horizontal) > .item:hover {
|
|
padding-left: 1em;
|
|
}
|
|
/*-------------------
|
|
Fitted
|
|
--------------------*/
|
|
.ui.fitted.list:not(.selection) .list > .item,
|
|
.ui.fitted.list:not(.selection) > .item {
|
|
padding-left: 0em;
|
|
padding-right: 0em;
|
|
}
|
|
.ui.fitted.selection.list .list > .item,
|
|
.ui.fitted.selection.list > .item {
|
|
margin-left: -0.5em;
|
|
margin-right: -0.5em;
|
|
}
|
|
/*-------------------
|
|
Bulleted
|
|
--------------------*/
|
|
ul.ui.list,
|
|
.ui.bulleted.list {
|
|
margin-left: 1.25rem;
|
|
}
|
|
ul.ui.list li,
|
|
.ui.bulleted.list .list > .item,
|
|
.ui.bulleted.list > .item {
|
|
position: relative;
|
|
}
|
|
ul.ui.list li:before,
|
|
.ui.bulleted.list .list > .item:before,
|
|
.ui.bulleted.list > .item:before {
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
pointer-events: none;
|
|
position: absolute;
|
|
top: auto;
|
|
left: auto;
|
|
font-weight: normal;
|
|
margin-left: -1.25rem;
|
|
content: '•';
|
|
opacity: 1;
|
|
color: inherit;
|
|
vertical-align: top;
|
|
}
|
|
ul.ui.list li:before,
|
|
.ui.bulleted.list .list > a.item:before,
|
|
.ui.bulleted.list > a.item:before {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
ul.ui.list ul,
|
|
.ui.bulleted.list .list {
|
|
padding-left: 1.25rem;
|
|
}
|
|
/* 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.75rem;
|
|
}
|
|
ul.ui.horizontal.bulleted.list li:first-child,
|
|
.ui.horizontal.bulleted.list > .item:first-child {
|
|
margin-left: 0em;
|
|
}
|
|
ul.ui.horizontal.bulleted.list li::before,
|
|
.ui.horizontal.bulleted.list > .item::before {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
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,
|
|
.ui.ordered.list .list,
|
|
ol.ui.list ol {
|
|
counter-reset: ordered;
|
|
margin-left: 1.25rem;
|
|
list-style-type: none;
|
|
}
|
|
ol.ui.list li,
|
|
.ui.ordered.list .list > .item,
|
|
.ui.ordered.list > .item {
|
|
list-style-type: none;
|
|
position: relative;
|
|
}
|
|
ol.ui.list li:before,
|
|
.ui.ordered.list .list > .item:before,
|
|
.ui.ordered.list > .item:before {
|
|
position: absolute;
|
|
top: auto;
|
|
left: auto;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
pointer-events: none;
|
|
margin-left: -1.25rem;
|
|
counter-increment: ordered;
|
|
content: counters(ordered, ".") " ";
|
|
text-align: right;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
vertical-align: middle;
|
|
opacity: 0.8;
|
|
}
|
|
ol.ui.inverted.list li:before,
|
|
.ui.ordered.inverted.list .list > .item:before,
|
|
.ui.ordered.inverted.list > .item:before {
|
|
color: rgba(255, 255, 255, 0.7);
|
|
}
|
|
/* Value */
|
|
.ui.ordered.list > .list > .item[data-value],
|
|
.ui.ordered.list > .item[data-value] {
|
|
content: attr(data-value);
|
|
}
|
|
ol.ui.list li[value]:before {
|
|
content: attr(value);
|
|
}
|
|
/* Child Lists */
|
|
ol.ui.list ol,
|
|
.ui.ordered.list .list {
|
|
margin-left: 1em;
|
|
}
|
|
ol.ui.list ol li:before,
|
|
.ui.ordered.list .list > .item:before {
|
|
margin-left: -2em;
|
|
}
|
|
/* Horizontal Ordered */
|
|
ol.ui.horizontal.list,
|
|
.ui.ordered.horizontal.list {
|
|
margin-left: 0em;
|
|
}
|
|
ol.ui.horizontal.list li:before,
|
|
.ui.ordered.horizontal.list .list > .item:before,
|
|
.ui.ordered.horizontal.list > .item:before {
|
|
position: static;
|
|
margin: 0em 0.5em 0em 0em;
|
|
}
|
|
/*-------------------
|
|
Divided
|
|
--------------------*/
|
|
.ui.divided.list > .item {
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.divided.list .list > .item {
|
|
border-top: none;
|
|
}
|
|
.ui.divided.list .item .list > .item {
|
|
border-top: none;
|
|
}
|
|
.ui.divided.list .list > .item:first-child,
|
|
.ui.divided.list > .item:first-child {
|
|
border-top: none;
|
|
}
|
|
/* Sub Menu */
|
|
.ui.divided.list:not(.horizontal) .list > .item:first-child {
|
|
border-top-width: 1px;
|
|
}
|
|
/* Divided bulleted */
|
|
.ui.divided.bulleted.list:not(.horizontal),
|
|
.ui.divided.bulleted.list .list {
|
|
margin-left: 0em;
|
|
padding-left: 0em;
|
|
}
|
|
.ui.divided.bulleted.list > .item:not(.horizontal) {
|
|
padding-left: 1.25rem;
|
|
}
|
|
/* Divided Ordered */
|
|
.ui.divided.ordered.list {
|
|
margin-left: 0em;
|
|
}
|
|
.ui.divided.ordered.list .list > .item,
|
|
.ui.divided.ordered.list > .item {
|
|
padding-left: 1.25rem;
|
|
}
|
|
.ui.divided.ordered.list .item .list {
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
padding-bottom: 0.21428571em;
|
|
}
|
|
.ui.divided.ordered.list .item .list > .item {
|
|
padding-left: 1em;
|
|
}
|
|
/* Divided Selection */
|
|
.ui.divided.selection.list .list > .item,
|
|
.ui.divided.selection.list > .item {
|
|
margin: 0em;
|
|
border-radius: 0em;
|
|
}
|
|
/* Divided horizontal */
|
|
.ui.divided.horizontal.list {
|
|
margin-left: 0em;
|
|
}
|
|
.ui.divided.horizontal.list > .item:not(:first-child) {
|
|
padding-left: 0.5em;
|
|
}
|
|
.ui.divided.horizontal.list > .item:not(:last-child) {
|
|
padding-right: 0.5em;
|
|
}
|
|
.ui.divided.horizontal.list > .item {
|
|
border-top: none;
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
margin: 0em;
|
|
line-height: 0.6;
|
|
}
|
|
.ui.horizontal.divided.list > .item:first-child {
|
|
border-left: none;
|
|
}
|
|
/* Inverted */
|
|
.ui.divided.inverted.list > .item,
|
|
.ui.divided.inverted.list > .list,
|
|
.ui.divided.inverted.horizontal.list > .item {
|
|
border-color: rgba(255, 255, 255, 0.1);
|
|
}
|
|
/*-------------------
|
|
Celled
|
|
--------------------*/
|
|
.ui.celled.list > .item,
|
|
.ui.celled.list > .list {
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
padding-left: 0.5em;
|
|
padding-right: 0.5em;
|
|
}
|
|
.ui.celled.list > .item:last-child {
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Padding on all elements */
|
|
.ui.celled.list > .item:first-child,
|
|
.ui.celled.list > .item:last-child {
|
|
padding-top: 0.21428571em;
|
|
padding-bottom: 0.21428571em;
|
|
}
|
|
/* Sub Menu */
|
|
.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 .list > .item,
|
|
.ui.celled.bulleted.list > .item {
|
|
padding-left: 1.25rem;
|
|
}
|
|
.ui.celled.bulleted.list .item .list {
|
|
margin-left: -1.25rem;
|
|
margin-right: -1.25rem;
|
|
padding-bottom: 0.21428571em;
|
|
}
|
|
/* Celled Ordered */
|
|
.ui.celled.ordered.list {
|
|
margin-left: 0em;
|
|
}
|
|
.ui.celled.ordered.list .list > .item,
|
|
.ui.celled.ordered.list > .item {
|
|
padding-left: 1.25rem;
|
|
}
|
|
.ui.celled.ordered.list .item .list {
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
padding-bottom: 0.21428571em;
|
|
}
|
|
.ui.celled.ordered.list .list > .item {
|
|
padding-left: 1em;
|
|
}
|
|
/* Celled Horizontal */
|
|
.ui.horizontal.celled.list {
|
|
margin-left: 0em;
|
|
}
|
|
.ui.horizontal.celled.list .list > .item,
|
|
.ui.horizontal.celled.list > .item {
|
|
border-top: none;
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
margin: 0em;
|
|
padding-left: 0.5em;
|
|
padding-right: 0.5em;
|
|
line-height: 0.6;
|
|
}
|
|
.ui.horizontal.celled.list .list > .item:last-child,
|
|
.ui.horizontal.celled.list > .item:last-child {
|
|
border-bottom: none;
|
|
border-right: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Inverted */
|
|
.ui.celled.inverted.list > .item,
|
|
.ui.celled.inverted.list > .list {
|
|
border-color: 1px solid rgba(255, 255, 255, 0.1);
|
|
}
|
|
.ui.celled.inverted.horizontal.list .list > .item,
|
|
.ui.celled.inverted.horizontal.list > .item {
|
|
border-color: 1px solid rgba(255, 255, 255, 0.1);
|
|
}
|
|
/*-------------------
|
|
Relaxed
|
|
--------------------*/
|
|
.ui.relaxed.list:not(.horizontal) > .item:not(:first-child) {
|
|
padding-top: 0.42857143em;
|
|
}
|
|
.ui.relaxed.list:not(.horizontal) > .item:not(:last-child) {
|
|
padding-bottom: 0.42857143em;
|
|
}
|
|
.ui.horizontal.relaxed.list .list > .item:not(:first-child),
|
|
.ui.horizontal.relaxed.list > .item:not(:first-child) {
|
|
padding-left: 1rem;
|
|
}
|
|
.ui.horizontal.relaxed.list .list > .item:not(:last-child),
|
|
.ui.horizontal.relaxed.list > .item:not(:last-child) {
|
|
padding-right: 1rem;
|
|
}
|
|
/* Very Relaxed */
|
|
.ui[class*="very relaxed"].list:not(.horizontal) > .item:not(:first-child) {
|
|
padding-top: 0.85714286em;
|
|
}
|
|
.ui[class*="very relaxed"].list:not(.horizontal) > .item:not(:last-child) {
|
|
padding-bottom: 0.85714286em;
|
|
}
|
|
.ui.horizontal[class*="very relaxed"].list .list > .item:not(:first-child),
|
|
.ui.horizontal[class*="very relaxed"].list > .item:not(:first-child) {
|
|
padding-left: 1.5rem;
|
|
}
|
|
.ui.horizontal[class*="very relaxed"].list .list > .item:not(:last-child),
|
|
.ui.horizontal[class*="very relaxed"].list > .item:not(:last-child) {
|
|
padding-right: 1.5rem;
|
|
}
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
.ui.mini.list {
|
|
font-size: 0.78571429em;
|
|
}
|
|
.ui.tiny.list {
|
|
font-size: 0.85714286em;
|
|
}
|
|
.ui.small.list {
|
|
font-size: 0.92857143em;
|
|
}
|
|
.ui.list {
|
|
font-size: 1em;
|
|
}
|
|
.ui.large.list {
|
|
font-size: 1.14285714em;
|
|
}
|
|
.ui.big.list {
|
|
font-size: 1.28571429em;
|
|
}
|
|
.ui.huge.list {
|
|
font-size: 1.42857143em;
|
|
}
|
|
.ui.massive.list {
|
|
font-size: 1.71428571em;
|
|
}
|
|
.ui.mini.horizontal.list .list > .item,
|
|
.ui.mini.horizontal.list > .item {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.tiny.horizontal.list .list > .item,
|
|
.ui.tiny.horizontal.list > .item {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.horizontal.list .list > .item,
|
|
.ui.small.horizontal.list > .item {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.horizontal.list .list > .item,
|
|
.ui.horizontal.list > .item {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.horizontal.list .list > .item,
|
|
.ui.large.horizontal.list > .item {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.big.horizontal.list .list > .item,
|
|
.ui.big.horizontal.list > .item {
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.huge.horizontal.list .list > .item,
|
|
.ui.huge.horizontal.list > .item {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
.ui.massive.horizontal.list .list > .item,
|
|
.ui.massive.horizontal.list > .item {
|
|
font-size: 1.71428571rem;
|
|
}
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Loader
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Loader
|
|
*******************************/
|
|
/* Some global loader styles defined in site.variables */
|
|
/*-------------------
|
|
Standard
|
|
--------------------*/
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Text */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Exact Sizes (Avoids Rounding Errors) */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Loader
|
|
*******************************/
|
|
/* Standard Size */
|
|
.ui.loader {
|
|
display: none;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: 0px;
|
|
text-align: center;
|
|
z-index: 1000;
|
|
-webkit-transform: translateX(-50%) translateY(-50%);
|
|
transform: translateX(-50%) translateY(-50%);
|
|
}
|
|
/* Static Shape */
|
|
.ui.loader:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 0%;
|
|
left: 50%;
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 500rem;
|
|
border: 0.2em solid rgba(0, 0, 0, 0.1);
|
|
}
|
|
/* Active Shape */
|
|
.ui.loader:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 0%;
|
|
left: 50%;
|
|
width: 100%;
|
|
height: 100%;
|
|
-webkit-animation: loader 2s linear;
|
|
animation: loader 2s linear;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
border-radius: 500rem;
|
|
border-color: #95a5a6 transparent transparent;
|
|
border-style: solid;
|
|
border-width: 0.2em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent;
|
|
box-shadow: 0px 0px 0px 1px transparent;
|
|
}
|
|
/* Active Animation */
|
|
@-webkit-keyframes loader {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes loader {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
/* Sizes */
|
|
.ui.mini.loader:before,
|
|
.ui.mini.loader:after {
|
|
width: 1rem;
|
|
height: 1rem;
|
|
margin: 0em 0em 0em -0.5rem;
|
|
}
|
|
.ui.tiny.loader:before,
|
|
.ui.tiny.loader:after {
|
|
width: 1.14285714rem;
|
|
height: 1.14285714rem;
|
|
margin: 0em 0em 0em -0.57142857rem;
|
|
}
|
|
.ui.small.loader:before,
|
|
.ui.small.loader:after {
|
|
width: 1.71428571rem;
|
|
height: 1.71428571rem;
|
|
margin: 0em 0em 0em -0.85714286rem;
|
|
}
|
|
.ui.loader:before,
|
|
.ui.loader:after {
|
|
width: 2.28571429rem;
|
|
height: 2.28571429rem;
|
|
margin: 0em 0em 0em -1.14285714rem;
|
|
}
|
|
.ui.large.loader:before,
|
|
.ui.large.loader:after {
|
|
width: 200px;
|
|
height: 200px;
|
|
margin: 0em 0em 0em -100px;
|
|
}
|
|
.ui.big.loader:before,
|
|
.ui.big.loader:after {
|
|
width: 3.71428571rem;
|
|
height: 3.71428571rem;
|
|
margin: 0em 0em 0em -1.85714286rem;
|
|
}
|
|
.ui.huge.loader:before,
|
|
.ui.huge.loader:after {
|
|
width: 4.14285714rem;
|
|
height: 4.14285714rem;
|
|
margin: 0em 0em 0em -2.07142857rem;
|
|
}
|
|
.ui.massive.loader:before,
|
|
.ui.massive.loader:after {
|
|
width: 4.57142857rem;
|
|
height: 4.57142857rem;
|
|
margin: 0em 0em 0em -2.28571429rem;
|
|
}
|
|
/*-------------------
|
|
Coupling
|
|
--------------------*/
|
|
/* Show inside active dimmer */
|
|
.ui.dimmer .loader {
|
|
display: block;
|
|
}
|
|
/* Black Dimmer */
|
|
.ui.dimmer .ui.loader {
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
.ui.dimmer .ui.loader:before {
|
|
border-color: rgba(255, 255, 255, 0.15);
|
|
}
|
|
.ui.dimmer .ui.loader:after {
|
|
border-color: #FFFFFF transparent transparent;
|
|
}
|
|
/* White Dimmer (Inverted) */
|
|
.ui.inverted.dimmer .ui.loader {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.inverted.dimmer .ui.loader:before {
|
|
border-color: rgba(0, 0, 0, 0.1);
|
|
}
|
|
.ui.inverted.dimmer .ui.loader:after {
|
|
border-color: #95a5a6 transparent transparent;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*-------------------
|
|
Text
|
|
--------------------*/
|
|
.ui.text.loader {
|
|
width: auto !important;
|
|
height: auto !important;
|
|
text-align: center;
|
|
font-style: normal;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
.ui.indeterminate.loader:after {
|
|
-webkit-animation-direction: reverse;
|
|
animation-direction: reverse;
|
|
-webkit-animation-duration: 4s;
|
|
animation-duration: 4s;
|
|
}
|
|
.ui.loader.active,
|
|
.ui.loader.visible {
|
|
display: block;
|
|
}
|
|
.ui.loader.disabled,
|
|
.ui.loader.hidden {
|
|
display: none;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/* Loader */
|
|
.ui.inverted.dimmer .ui.mini.loader,
|
|
.ui.mini.loader {
|
|
width: 1rem;
|
|
height: 1rem;
|
|
font-size: 0.78571429em;
|
|
}
|
|
.ui.inverted.dimmer .ui.tiny.loader,
|
|
.ui.tiny.loader {
|
|
width: 1.14285714rem;
|
|
height: 1.14285714rem;
|
|
font-size: 0.85714286em;
|
|
}
|
|
.ui.inverted.dimmer .ui.small.loader,
|
|
.ui.small.loader {
|
|
width: 1.71428571rem;
|
|
height: 1.71428571rem;
|
|
font-size: 0.92857143em;
|
|
}
|
|
.ui.inverted.dimmer .ui.loader,
|
|
.ui.loader {
|
|
width: 2.28571429rem;
|
|
height: 2.28571429rem;
|
|
font-size: 1em;
|
|
}
|
|
.ui.inverted.dimmer .ui.large.loader,
|
|
.ui.large.loader {
|
|
width: 200px;
|
|
height: 200px;
|
|
font-size: 1.14285714em;
|
|
}
|
|
.ui.inverted.dimmer .ui.big.loader,
|
|
.ui.big.loader {
|
|
width: 3.71428571rem;
|
|
height: 3.71428571rem;
|
|
font-size: 1.28571429em;
|
|
}
|
|
.ui.inverted.dimmer .ui.huge.loader,
|
|
.ui.huge.loader {
|
|
width: 4.14285714rem;
|
|
height: 4.14285714rem;
|
|
font-size: 1.42857143em;
|
|
}
|
|
.ui.inverted.dimmer .ui.massive.loader,
|
|
.ui.massive.loader {
|
|
width: 4.57142857rem;
|
|
height: 4.57142857rem;
|
|
font-size: 1.71428571em;
|
|
}
|
|
/* Text Loader */
|
|
.ui.mini.text.loader {
|
|
min-width: 1rem;
|
|
padding-top: 1.78571429rem;
|
|
}
|
|
.ui.tiny.text.loader {
|
|
min-width: 1.14285714rem;
|
|
padding-top: 1.92857143rem;
|
|
}
|
|
.ui.small.text.loader {
|
|
min-width: 1.71428571rem;
|
|
padding-top: 2.5rem;
|
|
}
|
|
.ui.text.loader {
|
|
min-width: 2.28571429rem;
|
|
padding-top: 3.07142857rem;
|
|
}
|
|
.ui.large.text.loader {
|
|
min-width: 200px;
|
|
padding-top: 200.78571429px;
|
|
}
|
|
.ui.big.text.loader {
|
|
min-width: 3.71428571rem;
|
|
padding-top: 4.5rem;
|
|
}
|
|
.ui.huge.text.loader {
|
|
min-width: 4.14285714rem;
|
|
padding-top: 4.92857143rem;
|
|
}
|
|
.ui.massive.text.loader {
|
|
min-width: 4.57142857rem;
|
|
padding-top: 5.35714286rem;
|
|
}
|
|
/*-------------------
|
|
Inverted
|
|
--------------------*/
|
|
.ui.inverted.loader {
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
.ui.inverted.loader:before {
|
|
border-color: rgba(255, 255, 255, 0.15);
|
|
}
|
|
.ui.inverted.loader:after {
|
|
border-top-color: #FFFFFF;
|
|
}
|
|
/*-------------------
|
|
Inline
|
|
--------------------*/
|
|
.ui.inline.loader {
|
|
position: relative;
|
|
vertical-align: middle;
|
|
margin: 0em;
|
|
left: 0em;
|
|
top: 0em;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
.ui.inline.loader.active,
|
|
.ui.inline.loader.visible {
|
|
display: inline-block;
|
|
}
|
|
/* Centered Inline */
|
|
.ui.centered.inline.loader.active,
|
|
.ui.centered.inline.loader.visible {
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
.ui.loader:before {
|
|
border: none;
|
|
border-radius: 0px;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.loader:after {
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-radius: 0px;
|
|
margin: 40px auto;
|
|
background: transparent url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3Csvg%0A%20%20%20xmlns%3Adc%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Felements%2F1.1%2F%22%0A%20%20%20xmlns%3Acc%3D%22http%3A%2F%2Fcreativecommons.org%2Fns%23%22%0A%20%20%20xmlns%3Ardf%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2F02%2F22-rdf-syntax-ns%23%22%0A%20%20%20xmlns%3Asvg%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3Asodipodi%3D%22http%3A%2F%2Fsodipodi.sourceforge.net%2FDTD%2Fsodipodi-0.dtd%22%0A%20%20%20xmlns%3Ainkscape%3D%22http%3A%2F%2Fwww.inkscape.org%2Fnamespaces%2Finkscape%22%0A%20%20%20role%3D%22img%22%0A%20%20%20aria-labelledby%3D%22title%20%20desc%22%0A%20%20%20xml%3Aspace%3D%22preserve%22%0A%20%20%20enable-background%3D%22new%200%200%20280%2032.755%22%0A%20%20%20height%3D%2252.672001%22%0A%20%20%20width%3D%2252.672001%22%0A%20%20%20version%3D%221.1%22%0A%20%20%20id%3D%22svg2%22%0A%20%20%20inkscape%3Aversion%3D%220.91%20r13725%22%0A%20%20%20sodipodi%3Adocname%3D%22logo.square.white.svg%22%3E%3Csodipodi%3Anamedview%0A%20%20%20%20%20pagecolor%3D%22%23ff00ff%22%0A%20%20%20%20%20bordercolor%3D%22%23666666%22%0A%20%20%20%20%20borderopacity%3D%221%22%0A%20%20%20%20%20objecttolerance%3D%2210%22%0A%20%20%20%20%20gridtolerance%3D%2210%22%0A%20%20%20%20%20guidetolerance%3D%2210%22%0A%20%20%20%20%20inkscape%3Apageopacity%3D%220%22%0A%20%20%20%20%20inkscape%3Apageshadow%3D%222%22%0A%20%20%20%20%20inkscape%3Awindow-width%3D%221536%22%0A%20%20%20%20%20inkscape%3Awindow-height%3D%22801%22%0A%20%20%20%20%20id%3D%22namedview14%22%0A%20%20%20%20%20showgrid%3D%22false%22%0A%20%20%20%20%20inkscape%3Azoom%3D%222.0836233%22%0A%20%20%20%20%20inkscape%3Acx%3D%2283.390493%22%0A%20%20%20%20%20inkscape%3Acy%3D%2216.071144%22%0A%20%20%20%20%20inkscape%3Awindow-x%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-y%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-maximized%3D%221%22%0A%20%20%20%20%20inkscape%3Acurrent-layer%3D%22svg2%22%20%2F%3E%3Crect%0A%20%20%20%20%20id%3D%22backgroundrect%22%0A%20%20%20%20%20width%3D%22195.47368%22%0A%20%20%20%20%20height%3D%2234.210526%22%0A%20%20%20%20%20x%3D%220%22%0A%20%20%20%20%20y%3D%2218.461473%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bstroke%3Anone%22%20%2F%3E%3Ctitle%0A%20%20%20%20%20id%3D%22title%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%3C%2Ftitle%3E%3Cdesc%0A%20%20%20%20%20id%3D%22desc%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%20logo%3C%2Fdesc%3E%3Cmetadata%0A%20%20%20%20%20id%3D%22metadata37%22%3E%3Crdf%3Ardf%3E%3Ccc%3Awork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%20%2F%3E%3C%2Fcc%3Awork%3E%3C%2Frdf%3Ardf%3E%3Crdf%3ARDF%3E%3Ccc%3AWork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%3EBBC%20micro%3Abit%3C%2Fdc%3Atitle%3E%3C%2Fcc%3AWork%3E%3C%2Frdf%3ARDF%3E%3C%2Fmetadata%3E%3Cdefs%0A%20%20%20%20%20id%3D%22defs35%22%20%2F%3E%3Cpath%0A%20%20%20%20%20inkscape%3Aconnector-curvature%3D%220%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20d%3D%22m%2037.363%2C29.377%20c%20-1.677%2C0%20-3.035%2C-1.364%20-3.035%2C-3.042%200%2C-1.678%201.357%2C-3.038%203.035%2C-3.038%201.684%2C0%203.039%2C1.36%203.039%2C3.038%200%2C1.678%20-1.355%2C3.042%20-3.039%2C3.042%20M%2015.052%2C23.3%20c%20-1.677%2C0%20-3.042%2C1.357%20-3.042%2C3.035%200%2C1.678%201.363%2C3.042%203.042%2C3.042%201.674%2C0%203.036%2C-1.364%203.036%2C-3.042%200%2C-1.678%20-1.363%2C-3.035%20-3.036%2C-3.035%20m%20-0.003%2C-5.99%2022.576%2C0%20c%204.979%2C0%209.027%2C4.047%209.027%2C9.027%200%2C4.979%20-4.049%2C9.031%20-9.027%2C9.031%20l%20-22.576%2C0%20c%20-4.977%2C0%20-9.0299993%2C-4.053%20-9.0299993%2C-9.031%20C%206.0180007%2C21.357%2010.072%2C17.31%2015.049%2C17.31%20m%2022.576%2C24.076%20c%208.299%2C0%2015.047%2C-6.75%2015.047%2C-15.049%200%2C-8.299%20-6.748%2C-15.051%20-15.047%2C-15.051%20l%20-22.576%2C0%20C%206.7500007%2C11.286%206.9250488e-7%2C18.038%206.9250488e-7%2C26.337%206.9250488e-7%2C34.636%206.7500007%2C41.386%2015.049%2C41.386%20l%2022.576%2C0%22%0A%20%20%20%20%20id%3D%22path21%22%0A%20%20%20%20%20style%3D%22fill%3A%23ffffff%22%0A%20%20%20%20%20sodipodi%3Anodetypes%3D%22csssccsssccsssscccsssssc%22%20%2F%3E%3C%2Fsvg%3E") no-repeat center center;
|
|
background-size: 100%;
|
|
-webkit-animation: loader-pxt 2s infinite linear;
|
|
animation: loader-pxt 2s infinite linear;
|
|
}
|
|
@-webkit-keyframes loader-pxt {
|
|
0% {
|
|
-webkit-transform: perspective(160px) rotateX(0deg) rotateY(0deg);
|
|
transform: perspective(160px) rotateX(0deg) rotateY(0deg);
|
|
}
|
|
15% {
|
|
-webkit-transform: perspective(160px) rotateX(0deg) rotateY(-5deg);
|
|
transform: perspective(160px) rotateX(0deg) rotateY(-5deg);
|
|
}
|
|
50% {
|
|
-webkit-transform: perspective(160px) rotateX(0deg) rotateY(5deg);
|
|
transform: perspective(160px) rotateX(0deg) rotateY(5deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(160px) rotateX(0deg) rotateY(0deg);
|
|
transform: perspective(160px) rotateX(0deg) rotateY(0deg);
|
|
}
|
|
}
|
|
@keyframes loader-pxt {
|
|
0% {
|
|
-webkit-transform: perspective(160px) rotateX(0deg) rotateY(0deg);
|
|
transform: perspective(160px) rotateX(0deg) rotateY(0deg);
|
|
}
|
|
15% {
|
|
-webkit-transform: perspective(160px) rotateX(0deg) rotateY(-5deg);
|
|
transform: perspective(160px) rotateX(0deg) rotateY(-5deg);
|
|
}
|
|
50% {
|
|
-webkit-transform: perspective(160px) rotateX(0deg) rotateY(5deg);
|
|
transform: perspective(160px) rotateX(0deg) rotateY(5deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(160px) rotateX(0deg) rotateY(0deg);
|
|
transform: perspective(160px) rotateX(0deg) rotateY(0deg);
|
|
}
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Segment
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Segment
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*-------------------
|
|
Group
|
|
--------------------*/
|
|
/*-------------------
|
|
Coupling
|
|
--------------------*/
|
|
/* Page Grid Segment */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/* Loading Dimmer */
|
|
/* Loading Spinner */
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/* Piled */
|
|
/* Circular */
|
|
/* Stacked */
|
|
/* Raised */
|
|
/* Padded */
|
|
/* Attached */
|
|
/* Inverted */
|
|
/* Floated */
|
|
/* Basic */
|
|
/* Colors */
|
|
/* Ordinality */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Segment
|
|
*******************************/
|
|
.ui.segment {
|
|
position: relative;
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
margin: 1rem 0em;
|
|
padding: 1em 1em;
|
|
border-radius: 0.28571429rem;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.segment:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.segment:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/* Vertical */
|
|
.ui.vertical.segment {
|
|
margin: 0em;
|
|
padding-left: 0em;
|
|
padding-right: 0em;
|
|
background: none transparent;
|
|
border-radius: 0px;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: none;
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.vertical.segment:last-child {
|
|
border-bottom: none;
|
|
}
|
|
/*-------------------
|
|
Loose Coupling
|
|
--------------------*/
|
|
/* Header */
|
|
.ui.inverted.segment > .ui.header {
|
|
color: #FFFFFF;
|
|
}
|
|
/* Label */
|
|
.ui[class*="bottom attached"].segment > [class*="top attached"].label {
|
|
border-top-left-radius: 0em;
|
|
border-top-right-radius: 0em;
|
|
}
|
|
.ui[class*="top attached"].segment > [class*="bottom attached"].label {
|
|
border-bottom-left-radius: 0em;
|
|
border-bottom-right-radius: 0em;
|
|
}
|
|
.ui.attached.segment:not(.top):not(.bottom) > [class*="top attached"].label {
|
|
border-top-left-radius: 0em;
|
|
border-top-right-radius: 0em;
|
|
}
|
|
.ui.attached.segment:not(.top):not(.bottom) > [class*="bottom attached"].label {
|
|
border-bottom-left-radius: 0em;
|
|
border-bottom-right-radius: 0em;
|
|
}
|
|
/* Grid */
|
|
.ui.page.grid.segment,
|
|
.ui.grid > .row > .ui.segment.column,
|
|
.ui.grid > .ui.segment.column {
|
|
padding-top: 2em;
|
|
padding-bottom: 2em;
|
|
}
|
|
.ui.grid.segment {
|
|
margin: 1rem 0em;
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/* Table */
|
|
.ui.basic.table.segment {
|
|
background: #FFFFFF;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui[class*="very basic"].table.segment {
|
|
padding: 1em 1em;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*-------------------
|
|
Piled
|
|
--------------------*/
|
|
.ui.piled.segments,
|
|
.ui.piled.segment {
|
|
margin: 3em 0em;
|
|
-webkit-box-shadow: '';
|
|
box-shadow: '';
|
|
z-index: auto;
|
|
}
|
|
.ui.piled.segment:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.piled.segment:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.piled.segments:after,
|
|
.ui.piled.segments:before,
|
|
.ui.piled.segment:after,
|
|
.ui.piled.segment:before {
|
|
background-color: #FFFFFF;
|
|
visibility: visible;
|
|
content: '';
|
|
display: block;
|
|
height: 100%;
|
|
left: 0px;
|
|
position: absolute;
|
|
width: 100%;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: '';
|
|
box-shadow: '';
|
|
}
|
|
.ui.piled.segments:before,
|
|
.ui.piled.segment:before {
|
|
-webkit-transform: rotate(-1.2deg);
|
|
transform: rotate(-1.2deg);
|
|
top: 0;
|
|
z-index: -2;
|
|
}
|
|
.ui.piled.segments:after,
|
|
.ui.piled.segment:after {
|
|
-webkit-transform: rotate(1.2deg);
|
|
transform: rotate(1.2deg);
|
|
top: 0;
|
|
z-index: -1;
|
|
}
|
|
/* Piled Attached */
|
|
.ui[class*="top attached"].piled.segment {
|
|
margin-top: 3em;
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.piled.segment[class*="top attached"]:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.piled.segment[class*="bottom attached"] {
|
|
margin-top: 0em;
|
|
margin-bottom: 3em;
|
|
}
|
|
.ui.piled.segment[class*="bottom attached"]:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*-------------------
|
|
Stacked
|
|
--------------------*/
|
|
.ui.stacked.segment {
|
|
padding-bottom: 1.4em;
|
|
}
|
|
.ui.stacked.segments:before,
|
|
.ui.stacked.segments:after,
|
|
.ui.stacked.segment:before,
|
|
.ui.stacked.segment:after {
|
|
content: '';
|
|
position: absolute;
|
|
bottom: -3px;
|
|
left: 0%;
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
background: rgba(0, 0, 0, 0.03);
|
|
width: 100%;
|
|
height: 6px;
|
|
visibility: visible;
|
|
}
|
|
.ui.stacked.segments:before,
|
|
.ui.stacked.segment:before {
|
|
display: none;
|
|
}
|
|
/* Add additional page */
|
|
.ui.tall.stacked.segments:before,
|
|
.ui.tall.stacked.segment:before {
|
|
display: block;
|
|
bottom: 0px;
|
|
}
|
|
/* Inverted */
|
|
.ui.stacked.inverted.segments:before,
|
|
.ui.stacked.inverted.segments:after,
|
|
.ui.stacked.inverted.segment:before,
|
|
.ui.stacked.inverted.segment:after {
|
|
background-color: rgba(0, 0, 0, 0.03);
|
|
border-top: 1px solid rgba(34, 36, 38, 0.35);
|
|
}
|
|
/*-------------------
|
|
Padded
|
|
--------------------*/
|
|
.ui.padded.segment {
|
|
padding: 1.5em;
|
|
}
|
|
.ui[class*="very padded"].segment {
|
|
padding: 3em;
|
|
}
|
|
/*-------------------
|
|
Compact
|
|
--------------------*/
|
|
.ui.compact.segment {
|
|
display: table;
|
|
}
|
|
/* Compact Group */
|
|
.ui.compact.segments {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
}
|
|
.ui.compact.segments .segment,
|
|
.ui.segments .compact.segment {
|
|
display: block;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 1 auto;
|
|
flex: 0 1 auto;
|
|
}
|
|
/*-------------------
|
|
Circular
|
|
--------------------*/
|
|
.ui.circular.segment {
|
|
display: table-cell;
|
|
padding: 2em;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
border-radius: 500em;
|
|
}
|
|
/*-------------------
|
|
Raised
|
|
--------------------*/
|
|
.ui.raised.segments,
|
|
.ui.raised.segment {
|
|
-webkit-box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/*******************************
|
|
Groups
|
|
*******************************/
|
|
/* Group */
|
|
.ui.segments {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
position: relative;
|
|
margin: 1rem 0em;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
.ui.segments:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.segments:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/* Nested Segment */
|
|
.ui.segments > .segment {
|
|
top: 0px;
|
|
bottom: 0px;
|
|
border-radius: 0px;
|
|
margin: 0em;
|
|
width: auto;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: none;
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.segments:not(.horizontal) > .segment:first-child {
|
|
border-top: none;
|
|
margin-top: 0em;
|
|
bottom: 0px;
|
|
margin-bottom: 0em;
|
|
top: 0px;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
/* Bottom */
|
|
.ui.segments:not(.horizontal) > .segment:last-child {
|
|
top: 0px;
|
|
bottom: 0px;
|
|
margin-top: 0em;
|
|
margin-bottom: 0em;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
/* Only */
|
|
.ui.segments:not(.horizontal) > .segment:only-child {
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/* Nested Group */
|
|
.ui.segments > .ui.segments {
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
margin: 1rem 1rem;
|
|
}
|
|
.ui.segments > .segments:first-child {
|
|
border-top: none;
|
|
}
|
|
.ui.segments > .segment + .segments:not(.horizontal) {
|
|
margin-top: 0em;
|
|
}
|
|
/* Horizontal Group */
|
|
.ui.horizontal.segments {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
background-color: transparent;
|
|
border-radius: 0px;
|
|
padding: 0em;
|
|
background-color: #FFFFFF;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
margin: 1rem 0em;
|
|
border-radius: 0.28571429rem;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Nested Horizontal Group */
|
|
.ui.segments > .horizontal.segments {
|
|
margin: 0em;
|
|
background-color: transparent;
|
|
border-radius: 0px;
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Horizontal Segment */
|
|
.ui.horizontal.segments > .segment {
|
|
-webkit-box-flex: 1;
|
|
flex: 1 1 auto;
|
|
-ms-flex: 1 1 0px;
|
|
/* Solves #2550 MS Flex */
|
|
margin: 0em;
|
|
min-width: 0px;
|
|
background-color: transparent;
|
|
border-radius: 0px;
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Border Fixes */
|
|
.ui.segments > .horizontal.segments:first-child {
|
|
border-top: none;
|
|
}
|
|
.ui.horizontal.segments > .segment:first-child {
|
|
border-left: none;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Disabled
|
|
---------------*/
|
|
.ui.disabled.segment {
|
|
opacity: 0.45;
|
|
color: rgba(40, 40, 40, 0.3);
|
|
}
|
|
/*--------------
|
|
Loading
|
|
---------------*/
|
|
.ui.loading.segment {
|
|
position: relative;
|
|
cursor: default;
|
|
pointer-events: none;
|
|
text-shadow: none !important;
|
|
color: transparent !important;
|
|
-webkit-transition: all 0s linear;
|
|
transition: all 0s linear;
|
|
}
|
|
.ui.loading.segment:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 0%;
|
|
left: 0%;
|
|
background: rgba(255, 255, 255, 0.8);
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 0.28571429rem;
|
|
z-index: 100;
|
|
}
|
|
.ui.loading.segment:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -1.5em 0em 0em -1.5em;
|
|
width: 3em;
|
|
height: 3em;
|
|
-webkit-animation: segment-spin 0.6s linear;
|
|
animation: segment-spin 0.6s linear;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
border-radius: 500rem;
|
|
border-color: #95a5a6 rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
|
|
border-style: solid;
|
|
border-width: 0.2em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent;
|
|
box-shadow: 0px 0px 0px 1px transparent;
|
|
visibility: visible;
|
|
z-index: 101;
|
|
}
|
|
@-webkit-keyframes segment-spin {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes segment-spin {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Basic
|
|
--------------------*/
|
|
.ui.basic.segment {
|
|
background: none transparent;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: none;
|
|
border-radius: 0px;
|
|
}
|
|
/*-------------------
|
|
Clearing
|
|
--------------------*/
|
|
.ui.clearing.segment:after {
|
|
content: ".";
|
|
display: block;
|
|
height: 0;
|
|
clear: both;
|
|
visibility: hidden;
|
|
}
|
|
/*-------------------
|
|
Colors
|
|
--------------------*/
|
|
/* Red */
|
|
.ui.red.segment:not(.inverted) {
|
|
border-top: 2px solid #EF767A;
|
|
}
|
|
.ui.inverted.red.segment {
|
|
background-color: #EF767A !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Orange */
|
|
.ui.orange.segment:not(.inverted) {
|
|
border-top: 2px solid #ff8b27;
|
|
}
|
|
.ui.inverted.orange.segment {
|
|
background-color: #ff8b27 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Yellow */
|
|
.ui.yellow.segment:not(.inverted) {
|
|
border-top: 2px solid #FDE74C;
|
|
}
|
|
.ui.inverted.yellow.segment {
|
|
background-color: #FDE74C !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Olive */
|
|
.ui.olive.segment:not(.inverted) {
|
|
border-top: 2px solid #B5CC18;
|
|
}
|
|
.ui.inverted.olive.segment {
|
|
background-color: #B5CC18 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Green */
|
|
.ui.green.segment:not(.inverted) {
|
|
border-top: 2px solid #00ED00;
|
|
}
|
|
.ui.inverted.green.segment {
|
|
background-color: #00ED00 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Teal */
|
|
.ui.teal.segment:not(.inverted) {
|
|
border-top: 2px solid #3891A6;
|
|
}
|
|
.ui.inverted.teal.segment {
|
|
background-color: #3891A6 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Blue */
|
|
.ui.blue.segment:not(.inverted) {
|
|
border-top: 2px solid #3454D1;
|
|
}
|
|
.ui.inverted.blue.segment {
|
|
background-color: #3454D1 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Violet */
|
|
.ui.violet.segment:not(.inverted) {
|
|
border-top: 2px solid #B4009E;
|
|
}
|
|
.ui.inverted.violet.segment {
|
|
background-color: #B4009E !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Purple */
|
|
.ui.purple.segment:not(.inverted) {
|
|
border-top: 2px solid #6633cc;
|
|
}
|
|
.ui.inverted.purple.segment {
|
|
background-color: #6633cc !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Pink */
|
|
.ui.pink.segment:not(.inverted) {
|
|
border-top: 2px solid #F46197;
|
|
}
|
|
.ui.inverted.pink.segment {
|
|
background-color: #F46197 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Brown */
|
|
.ui.brown.segment:not(.inverted) {
|
|
border-top: 2px solid #00BCF2;
|
|
}
|
|
.ui.inverted.brown.segment {
|
|
background-color: #00BCF2 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Grey */
|
|
.ui.grey.segment:not(.inverted) {
|
|
border-top: 2px solid #95a5a6;
|
|
}
|
|
.ui.inverted.grey.segment {
|
|
background-color: #95a5a6 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Black */
|
|
.ui.black.segment:not(.inverted) {
|
|
border-top: 2px solid #1B1C1D;
|
|
}
|
|
.ui.inverted.black.segment {
|
|
background-color: #1B1C1D !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/*-------------------
|
|
Aligned
|
|
--------------------*/
|
|
.ui[class*="left aligned"].segment {
|
|
text-align: left;
|
|
}
|
|
.ui[class*="right aligned"].segment {
|
|
text-align: right;
|
|
}
|
|
.ui[class*="center aligned"].segment {
|
|
text-align: center;
|
|
}
|
|
/*-------------------
|
|
Floated
|
|
--------------------*/
|
|
.ui.floated.segment,
|
|
.ui[class*="left floated"].segment {
|
|
float: left;
|
|
margin-right: 1em;
|
|
}
|
|
.ui[class*="right floated"].segment {
|
|
float: right;
|
|
margin-left: 1em;
|
|
}
|
|
/*-------------------
|
|
Inverted
|
|
--------------------*/
|
|
.ui.inverted.segment {
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.inverted.segment,
|
|
.ui.primary.inverted.segment {
|
|
background: #3454D1;
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
/* Nested */
|
|
.ui.inverted.segment .segment {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.inverted.segment .inverted.segment {
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
/* Attached */
|
|
.ui.inverted.attached.segment {
|
|
border-color: #555555;
|
|
}
|
|
/*-------------------
|
|
Emphasis
|
|
--------------------*/
|
|
/* Secondary */
|
|
.ui.secondary.segment {
|
|
background: #F3F4F5;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
.ui.secondary.inverted.segment {
|
|
background: #4c4f52 -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.2)), to(rgba(255, 255, 255, 0.2)));
|
|
background: #4c4f52 linear-gradient(rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 100%);
|
|
color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
/* Tertiary */
|
|
.ui.tertiary.segment {
|
|
background: #DCDDDE;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
.ui.tertiary.inverted.segment {
|
|
background: #717579 -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.35)), to(rgba(255, 255, 255, 0.35)));
|
|
background: #717579 linear-gradient(rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0.35) 100%);
|
|
color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
/*-------------------
|
|
Attached
|
|
--------------------*/
|
|
/* Middle */
|
|
.ui.attached.segment {
|
|
top: 0px;
|
|
bottom: 0px;
|
|
border-radius: 0px;
|
|
margin: 0em -1px;
|
|
width: calc(100% + 2px );
|
|
max-width: calc(100% + 2px );
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: 1px solid #D4D4D5;
|
|
}
|
|
.ui.attached:not(.message) + .ui.attached.segment:not(.top) {
|
|
border-top: none;
|
|
}
|
|
/* Top */
|
|
.ui[class*="top attached"].segment {
|
|
bottom: 0px;
|
|
margin-bottom: 0em;
|
|
top: 0px;
|
|
margin-top: 1rem;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.segment[class*="top attached"]:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
/* Bottom */
|
|
.ui.segment[class*="bottom attached"] {
|
|
bottom: 0px;
|
|
margin-top: 0em;
|
|
top: 0px;
|
|
margin-bottom: 1rem;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
.ui.segment[class*="bottom attached"]:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*-------------------
|
|
Size
|
|
--------------------*/
|
|
.ui.mini.segments .segment,
|
|
.ui.mini.segment {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.tiny.segments .segment,
|
|
.ui.tiny.segment {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.segments .segment,
|
|
.ui.small.segment {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.segments .segment,
|
|
.ui.segment {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.segments .segment,
|
|
.ui.large.segment {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.big.segments .segment,
|
|
.ui.big.segment {
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.huge.segments .segment,
|
|
.ui.huge.segment {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
.ui.massive.segments .segment,
|
|
.ui.massive.segment {
|
|
font-size: 1.71428571rem;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Step
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Step
|
|
*******************************/
|
|
/*--------------
|
|
Load Theme
|
|
---------------*/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Step
|
|
*******************************/
|
|
/*-------------------
|
|
Group
|
|
--------------------*/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/* Icon */
|
|
/* Title */
|
|
/* Description */
|
|
/* Arrow */
|
|
/* Mobile */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Vertical */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Completed */
|
|
/* Hover */
|
|
/* Down */
|
|
/* Active */
|
|
/* Active + Hover */
|
|
/* Disabled */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Plural
|
|
*******************************/
|
|
.ui.steps {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-webkit-box-align: stretch;
|
|
-ms-flex-align: stretch;
|
|
align-items: stretch;
|
|
margin: 1em 0em;
|
|
background: '';
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
line-height: 1.14285714em;
|
|
border-radius: 0.28571429rem;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* First Steps */
|
|
.ui.steps:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
/* Last Steps */
|
|
.ui.steps:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*******************************
|
|
Singular
|
|
*******************************/
|
|
.ui.steps .step {
|
|
position: relative;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1 0 auto;
|
|
flex: 1 0 auto;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
vertical-align: middle;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
margin: 0em 0em;
|
|
padding: 1.14285714em 2em;
|
|
background: #FFFFFF;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-radius: 0em;
|
|
border: none;
|
|
border-right: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
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, -webkit-box-shadow 0.1s ease;
|
|
}
|
|
/* Arrow */
|
|
.ui.steps .step:after {
|
|
display: none;
|
|
position: absolute;
|
|
z-index: 2;
|
|
content: '';
|
|
top: 50%;
|
|
right: 0%;
|
|
border: medium none;
|
|
background-color: #FFFFFF;
|
|
width: 1.14285714em;
|
|
height: 1.14285714em;
|
|
border-style: solid;
|
|
border-color: rgba(34, 36, 38, 0.15);
|
|
border-width: 0px 1px 1px 0px;
|
|
-webkit-transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: background-color 0.1s ease, opacity 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
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, -webkit-box-shadow 0.1s ease;
|
|
-webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg);
|
|
transform: translateY(-50%) translateX(50%) rotate(-45deg);
|
|
}
|
|
/* First Step */
|
|
.ui.steps .step:first-child {
|
|
padding-left: 2em;
|
|
border-radius: 0.28571429rem 0em 0em 0.28571429rem;
|
|
}
|
|
/* Last Step */
|
|
.ui.steps .step:last-child {
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
}
|
|
.ui.steps .step:last-child {
|
|
border-right: none;
|
|
margin-right: 0em;
|
|
}
|
|
/* Only Step */
|
|
.ui.steps .step:only-child {
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/*******************************
|
|
Content
|
|
*******************************/
|
|
/* Title */
|
|
.ui.steps .step .title {
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-size: 1.14285714em;
|
|
font-weight: bold;
|
|
}
|
|
.ui.steps .step > .title {
|
|
width: 100%;
|
|
}
|
|
/* Description */
|
|
.ui.steps .step .description {
|
|
font-weight: normal;
|
|
font-size: 0.92857143em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.steps .step > .description {
|
|
width: 100%;
|
|
}
|
|
.ui.steps .step .title ~ .description {
|
|
margin-top: 0.25em;
|
|
}
|
|
/* Icon */
|
|
.ui.steps .step > .icon {
|
|
line-height: 1;
|
|
font-size: 2.5em;
|
|
margin: 0em 1rem 0em 0em;
|
|
}
|
|
.ui.steps .step > .icon,
|
|
.ui.steps .step > .icon ~ .content {
|
|
display: block;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 1 auto;
|
|
flex: 0 1 auto;
|
|
-ms-flex-item-align: middle;
|
|
align-self: middle;
|
|
}
|
|
.ui.steps .step > .icon ~ .content {
|
|
-webkit-box-flex: 1 0 auto;
|
|
-ms-flex-positive: 1 0 auto;
|
|
flex-grow: 1 0 auto;
|
|
}
|
|
/* Horizontal Icon */
|
|
.ui.steps:not(.vertical) .step > .icon {
|
|
width: auto;
|
|
}
|
|
/* Link */
|
|
.ui.steps .link.step,
|
|
.ui.steps a.step {
|
|
cursor: pointer;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Ordered
|
|
---------------*/
|
|
.ui.ordered.steps {
|
|
counter-reset: ordered;
|
|
}
|
|
.ui.ordered.steps .step:before {
|
|
display: block;
|
|
position: static;
|
|
text-align: center;
|
|
content: counters(ordered, ".");
|
|
-ms-flex-item-align: middle;
|
|
align-self: middle;
|
|
margin-right: 1rem;
|
|
font-size: 2.5em;
|
|
counter-increment: ordered;
|
|
font-family: inherit;
|
|
font-weight: bold;
|
|
}
|
|
.ui.ordered.steps .step > * {
|
|
display: block;
|
|
-ms-flex-item-align: middle;
|
|
align-self: middle;
|
|
}
|
|
/*--------------
|
|
Vertical
|
|
---------------*/
|
|
.ui.vertical.steps {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
overflow: visible;
|
|
}
|
|
.ui.vertical.steps .step {
|
|
-webkit-box-pack: start;
|
|
-ms-flex-pack: start;
|
|
justify-content: flex-start;
|
|
border-radius: 0em;
|
|
padding: 1.14285714em 2em;
|
|
border-right: none;
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.vertical.steps .step:first-child {
|
|
padding: 1.14285714em 2em;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.vertical.steps .step:last-child {
|
|
border-bottom: none;
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
.ui.vertical.steps .step:only-child {
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/* Arrow */
|
|
.ui.vertical.steps .step:after {
|
|
display: none;
|
|
}
|
|
.ui.vertical.steps .step:after {
|
|
top: 50%;
|
|
right: 0%;
|
|
border-width: 0px 1px 1px 0px;
|
|
}
|
|
.ui.vertical.steps .step:after {
|
|
display: none;
|
|
}
|
|
.ui.vertical.steps .active.step:after {
|
|
display: block;
|
|
}
|
|
.ui.vertical.steps .step:last-child:after {
|
|
display: none;
|
|
}
|
|
.ui.vertical.steps .active.step:last-child:after {
|
|
display: block;
|
|
}
|
|
/*---------------
|
|
Responsive
|
|
----------------*/
|
|
/* Mobile (Default) */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.steps {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
overflow: visible;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
.ui.steps .step {
|
|
width: 100% !important;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
border-radius: 0em;
|
|
padding: 1.14285714em 2em;
|
|
}
|
|
.ui.steps .step:first-child {
|
|
padding: 1.14285714em 2em;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.steps .step:last-child {
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
/* Arrow */
|
|
.ui.steps .step:after {
|
|
display: none !important;
|
|
}
|
|
/* Content */
|
|
.ui.steps .step .content {
|
|
text-align: center;
|
|
}
|
|
/* Icon */
|
|
.ui.steps .step > .icon,
|
|
.ui.ordered.steps .step:before {
|
|
margin: 0em 0em 1rem 0em;
|
|
}
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/* Link Hover */
|
|
.ui.steps .link.step:hover::after,
|
|
.ui.steps .link.step:hover,
|
|
.ui.steps a.step:hover::after,
|
|
.ui.steps a.step:hover {
|
|
background: #F9FAFB;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
/* Link Down */
|
|
.ui.steps .link.step:active::after,
|
|
.ui.steps .link.step:active,
|
|
.ui.steps a.step:active::after,
|
|
.ui.steps a.step:active {
|
|
background: #F3F4F5;
|
|
color: rgba(0, 0, 0, 0.9);
|
|
}
|
|
/* Active */
|
|
.ui.steps .step.active {
|
|
cursor: auto;
|
|
background: #F3F4F5;
|
|
}
|
|
.ui.steps .step.active:after {
|
|
background: #F3F4F5;
|
|
}
|
|
.ui.steps .step.active .title {
|
|
color: #4183C4;
|
|
}
|
|
.ui.ordered.steps .step.active:before,
|
|
.ui.steps .active.step .icon {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
/* Active Arrow */
|
|
.ui.steps .step:after {
|
|
display: block;
|
|
}
|
|
.ui.steps .active.step:after {
|
|
display: block;
|
|
}
|
|
.ui.steps .step:last-child:after {
|
|
display: none;
|
|
}
|
|
.ui.steps .active.step:last-child:after {
|
|
display: none;
|
|
}
|
|
/* Active Hover */
|
|
.ui.steps .link.active.step:hover::after,
|
|
.ui.steps .link.active.step:hover,
|
|
.ui.steps a.active.step:hover::after,
|
|
.ui.steps a.active.step:hover {
|
|
cursor: pointer;
|
|
background: #DCDDDE;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/* Completed */
|
|
.ui.steps .step.completed > .icon:before,
|
|
.ui.ordered.steps .step.completed:before {
|
|
color: #00ED00;
|
|
}
|
|
/* Disabled */
|
|
.ui.steps .disabled.step {
|
|
cursor: auto;
|
|
background: #FFFFFF;
|
|
pointer-events: none;
|
|
}
|
|
.ui.steps .disabled.step,
|
|
.ui.steps .disabled.step .title,
|
|
.ui.steps .disabled.step .description {
|
|
color: rgba(40, 40, 40, 0.3);
|
|
}
|
|
.ui.steps .disabled.step:after {
|
|
background: #FFFFFF;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Stackable
|
|
---------------*/
|
|
/* Tablet Or Below */
|
|
@media only screen and (max-width: 991px) {
|
|
.ui[class*="tablet stackable"].steps {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
overflow: visible;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
/* Steps */
|
|
.ui[class*="tablet stackable"].steps .step {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
border-radius: 0em;
|
|
padding: 1.14285714em 2em;
|
|
}
|
|
.ui[class*="tablet stackable"].steps .step:first-child {
|
|
padding: 1.14285714em 2em;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui[class*="tablet stackable"].steps .step:last-child {
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
/* Arrow */
|
|
.ui[class*="tablet stackable"].steps .step:after {
|
|
display: none !important;
|
|
}
|
|
/* Content */
|
|
.ui[class*="tablet stackable"].steps .step .content {
|
|
text-align: center;
|
|
}
|
|
/* Icon */
|
|
.ui[class*="tablet stackable"].steps .step > .icon,
|
|
.ui[class*="tablet stackable"].ordered.steps .step:before {
|
|
margin: 0em 0em 1rem 0em;
|
|
}
|
|
}
|
|
/*--------------
|
|
Fluid
|
|
---------------*/
|
|
/* Fluid */
|
|
.ui.fluid.steps {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
/*--------------
|
|
Attached
|
|
---------------*/
|
|
/* Top */
|
|
.ui.attached.steps {
|
|
width: calc(100% + 2px ) !important;
|
|
margin: 0em -1px 0;
|
|
max-width: calc(100% + 2px );
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.attached.steps .step:first-child {
|
|
border-radius: 0.28571429rem 0em 0em 0em;
|
|
}
|
|
.ui.attached.steps .step:last-child {
|
|
border-radius: 0em 0.28571429rem 0em 0em;
|
|
}
|
|
/* Bottom */
|
|
.ui.bottom.attached.steps {
|
|
margin: 0 -1px 0em;
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
.ui.bottom.attached.steps .step:first-child {
|
|
border-radius: 0em 0em 0em 0.28571429rem;
|
|
}
|
|
.ui.bottom.attached.steps .step:last-child {
|
|
border-radius: 0em 0em 0.28571429rem 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 {
|
|
width: 100%;
|
|
}
|
|
.ui.one.steps > .step,
|
|
.ui.two.steps > .step,
|
|
.ui.three.steps > .step,
|
|
.ui.four.steps > .step,
|
|
.ui.five.steps > .step,
|
|
.ui.six.steps > .step,
|
|
.ui.seven.steps > .step,
|
|
.ui.eight.steps > .step {
|
|
-ms-flex-wrap: nowrap;
|
|
flex-wrap: nowrap;
|
|
}
|
|
.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.mini.steps .step,
|
|
.ui.mini.step {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.tiny.steps .step,
|
|
.ui.tiny.step {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.steps .step,
|
|
.ui.small.step {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.steps .step,
|
|
.ui.step {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.steps .step,
|
|
.ui.large.step {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.big.steps .step,
|
|
.ui.big.step {
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.huge.steps .step,
|
|
.ui.huge.step {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
.ui.massive.steps .step,
|
|
.ui.massive.step {
|
|
font-size: 1.71428571rem;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/* Collections */
|
|
/*!
|
|
* # Semantic UI - Breadcrumb
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Breadcrumb
|
|
*******************************/
|
|
/*-------------------
|
|
Breadcrumb
|
|
--------------------*/
|
|
/* Coupling */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Breadcrumb
|
|
*******************************/
|
|
/*-------------------
|
|
Breadcrumb
|
|
--------------------*/
|
|
/* Coupling */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Site Theme */
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Breadcrumb
|
|
*******************************/
|
|
.ui.breadcrumb {
|
|
line-height: 1;
|
|
display: inline-block;
|
|
margin: 0em 0em;
|
|
vertical-align: middle;
|
|
}
|
|
.ui.breadcrumb:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.breadcrumb:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*******************************
|
|
Content
|
|
*******************************/
|
|
/* Divider */
|
|
.ui.breadcrumb .divider {
|
|
display: inline-block;
|
|
opacity: 0.7;
|
|
margin: 0em 0.21428571rem 0em;
|
|
font-size: 0.92857143em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
vertical-align: baseline;
|
|
}
|
|
/* Link */
|
|
.ui.breadcrumb a {
|
|
color: #4183C4;
|
|
}
|
|
.ui.breadcrumb a:hover {
|
|
color: #1e70bf;
|
|
}
|
|
/* Icon Divider */
|
|
.ui.breadcrumb .icon.divider {
|
|
font-size: 0.85714286em;
|
|
vertical-align: baseline;
|
|
}
|
|
/* Section */
|
|
.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.78571429em 1em;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
.ui.breadcrumb .active.section {
|
|
font-weight: bold;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
.ui.mini.breadcrumb {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.tiny.breadcrumb {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.breadcrumb {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.breadcrumb {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.breadcrumb {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.big.breadcrumb {
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.huge.breadcrumb {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
.ui.massive.breadcrumb {
|
|
font-size: 1.71428571rem;
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Form
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Form
|
|
*******************************/
|
|
/*-------------------
|
|
Elements
|
|
--------------------*/
|
|
/* Form */
|
|
/* Text */
|
|
/* Field */
|
|
/* Fields */
|
|
/* Form Label */
|
|
/* Input */
|
|
/* Select */
|
|
/* Text Area */
|
|
/* Checkbox */
|
|
/* Inline Validation Prompt */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Focus */
|
|
/* Input Focus */
|
|
/* Text Area Focus */
|
|
/* Disabled */
|
|
/* Errored Input */
|
|
/* AutoFill */
|
|
/* Input Error */
|
|
/* Dropdown Error */
|
|
/* Focused Error */
|
|
/* Placeholder Error */
|
|
/* Loading Dimmer */
|
|
/* Loading Spinner */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Required */
|
|
/* Inverted */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Grouped Fields */
|
|
/* Inline */
|
|
/*-------------------
|
|
Groups
|
|
--------------------*/
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Form
|
|
*******************************/
|
|
/*-------------------
|
|
Elements
|
|
--------------------*/
|
|
/* Form */
|
|
/* Text */
|
|
/* Field */
|
|
/* Fields */
|
|
/* Form Label */
|
|
/* Input */
|
|
/* Select */
|
|
/* Text Area */
|
|
/* Checkbox */
|
|
/* Inline Validation Prompt */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Focus */
|
|
/* Input Focus */
|
|
/* Text Area Focus */
|
|
/* Disabled */
|
|
/* Errored Input */
|
|
/* AutoFill */
|
|
/* Input Error */
|
|
/* Dropdown Error */
|
|
/* Focused Error */
|
|
/* Placeholder Error */
|
|
/* Loading Dimmer */
|
|
/* Loading Spinner */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Required */
|
|
/* Inverted */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Grouped Fields */
|
|
/* Inline */
|
|
/*-------------------
|
|
Groups
|
|
--------------------*/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Elements
|
|
*******************************/
|
|
/*--------------------
|
|
Form
|
|
---------------------*/
|
|
.ui.form {
|
|
position: relative;
|
|
max-width: 100%;
|
|
}
|
|
/*--------------------
|
|
Content
|
|
---------------------*/
|
|
.ui.form > p {
|
|
margin: 1em 0em;
|
|
}
|
|
/*--------------------
|
|
Field
|
|
---------------------*/
|
|
.ui.form .field {
|
|
clear: both;
|
|
margin: 0em 0em 1em;
|
|
}
|
|
.ui.form .field:last-child,
|
|
.ui.form .fields:last-child .field {
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.form .fields .field {
|
|
clear: both;
|
|
margin: 0em;
|
|
}
|
|
/*--------------------
|
|
Labels
|
|
---------------------*/
|
|
.ui.form .field > label {
|
|
display: block;
|
|
margin: 0em 0em 0.28571429rem 0em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
font-size: 0.92857143em;
|
|
font-weight: bold;
|
|
text-transform: none;
|
|
}
|
|
/*--------------------
|
|
Standard Inputs
|
|
---------------------*/
|
|
.ui.form textarea,
|
|
.ui.form input:not([type]),
|
|
.ui.form input[type="date"],
|
|
.ui.form input[type="datetime-local"],
|
|
.ui.form input[type="email"],
|
|
.ui.form input[type="number"],
|
|
.ui.form input[type="password"],
|
|
.ui.form input[type="search"],
|
|
.ui.form input[type="tel"],
|
|
.ui.form input[type="time"],
|
|
.ui.form input[type="text"],
|
|
.ui.form input[type="file"],
|
|
.ui.form input[type="url"] {
|
|
width: 100%;
|
|
vertical-align: top;
|
|
}
|
|
/* Set max height on unusual input */
|
|
.ui.form ::-webkit-datetime-edit,
|
|
.ui.form ::-webkit-inner-spin-button {
|
|
height: 1.2142em;
|
|
}
|
|
.ui.form input:not([type]),
|
|
.ui.form input[type="date"],
|
|
.ui.form input[type="datetime-local"],
|
|
.ui.form input[type="email"],
|
|
.ui.form input[type="number"],
|
|
.ui.form input[type="password"],
|
|
.ui.form input[type="search"],
|
|
.ui.form input[type="tel"],
|
|
.ui.form input[type="time"],
|
|
.ui.form input[type="text"],
|
|
.ui.form input[type="file"],
|
|
.ui.form input[type="url"] {
|
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
margin: 0em;
|
|
outline: none;
|
|
-webkit-appearance: none;
|
|
tap-highlight-color: rgba(255, 255, 255, 0);
|
|
line-height: 1.2142em;
|
|
padding: 0.67861429em 1em;
|
|
font-size: 1em;
|
|
background: #FFFFFF;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0em 0em 0em 0em transparent inset;
|
|
box-shadow: 0em 0em 0em 0em transparent inset;
|
|
-webkit-transition: color 0.1s ease, border-color 0.1s ease;
|
|
transition: color 0.1s ease, border-color 0.1s ease;
|
|
}
|
|
/* Text Area */
|
|
.ui.form textarea {
|
|
margin: 0em;
|
|
-webkit-appearance: none;
|
|
tap-highlight-color: rgba(255, 255, 255, 0);
|
|
padding: 0.78571429em 1em;
|
|
background: #FFFFFF;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
outline: none;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0em 0em 0em 0em transparent inset;
|
|
box-shadow: 0em 0em 0em 0em transparent inset;
|
|
-webkit-transition: color 0.1s ease, border-color 0.1s ease;
|
|
transition: color 0.1s ease, border-color 0.1s ease;
|
|
font-size: 1em;
|
|
line-height: 1.2857;
|
|
resize: vertical;
|
|
}
|
|
.ui.form textarea:not([rows]) {
|
|
height: 12em;
|
|
min-height: 8em;
|
|
max-height: 24em;
|
|
}
|
|
.ui.form textarea,
|
|
.ui.form input[type="checkbox"] {
|
|
vertical-align: top;
|
|
}
|
|
/*--------------------------
|
|
Input w/ attached Button
|
|
---------------------------*/
|
|
.ui.form input.attached {
|
|
width: auto;
|
|
}
|
|
/*--------------------
|
|
Basic Select
|
|
---------------------*/
|
|
.ui.form select {
|
|
display: block;
|
|
height: auto;
|
|
width: 100%;
|
|
background: #FFFFFF;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0em 0em 0em 0em transparent inset;
|
|
box-shadow: 0em 0em 0em 0em transparent inset;
|
|
padding: 0.62em 1em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-transition: color 0.1s ease, border-color 0.1s ease;
|
|
transition: color 0.1s ease, border-color 0.1s ease;
|
|
}
|
|
/*--------------------
|
|
Dropdown
|
|
---------------------*/
|
|
/* Block */
|
|
.ui.form .field > .selection.dropdown {
|
|
width: 100%;
|
|
}
|
|
.ui.form .field > .selection.dropdown > .dropdown.icon {
|
|
float: right;
|
|
}
|
|
/* Inline */
|
|
.ui.form .inline.fields .field > .selection.dropdown,
|
|
.ui.form .inline.field > .selection.dropdown {
|
|
width: auto;
|
|
}
|
|
.ui.form .inline.fields .field > .selection.dropdown > .dropdown.icon,
|
|
.ui.form .inline.field > .selection.dropdown > .dropdown.icon {
|
|
float: none;
|
|
}
|
|
/*--------------------
|
|
UI Input
|
|
---------------------*/
|
|
/* Block */
|
|
.ui.form .field .ui.input,
|
|
.ui.form .fields .field .ui.input,
|
|
.ui.form .wide.field .ui.input {
|
|
width: 100%;
|
|
}
|
|
/* Inline */
|
|
.ui.form .inline.fields .field:not(.wide) .ui.input,
|
|
.ui.form .inline.field:not(.wide) .ui.input {
|
|
width: auto;
|
|
vertical-align: middle;
|
|
}
|
|
/* Auto Input */
|
|
.ui.form .fields .field .ui.input input,
|
|
.ui.form .field .ui.input input {
|
|
width: auto;
|
|
}
|
|
/* Full Width Input */
|
|
.ui.form .ten.fields .ui.input input,
|
|
.ui.form .nine.fields .ui.input input,
|
|
.ui.form .eight.fields .ui.input input,
|
|
.ui.form .seven.fields .ui.input input,
|
|
.ui.form .six.fields .ui.input input,
|
|
.ui.form .five.fields .ui.input input,
|
|
.ui.form .four.fields .ui.input input,
|
|
.ui.form .three.fields .ui.input input,
|
|
.ui.form .two.fields .ui.input input,
|
|
.ui.form .wide.field .ui.input input {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1 0 auto;
|
|
flex: 1 0 auto;
|
|
width: 0px;
|
|
}
|
|
/*--------------------
|
|
Types of Messages
|
|
---------------------*/
|
|
.ui.form .success.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: normal;
|
|
background: #FFFFFF !important;
|
|
border: 1px solid #E0B4B4 !important;
|
|
color: #9F3A38 !important;
|
|
}
|
|
.ui.form .inline.fields .field .prompt,
|
|
.ui.form .inline.field .prompt {
|
|
vertical-align: top;
|
|
margin: -0.25em 0em -0.5em 0.5em;
|
|
}
|
|
.ui.form .inline.fields .field .prompt:before,
|
|
.ui.form .inline.field .prompt:before {
|
|
border-width: 0px 0px 1px 1px;
|
|
bottom: auto;
|
|
right: auto;
|
|
top: 50%;
|
|
left: 0em;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------------
|
|
Autofilled
|
|
---------------------*/
|
|
.ui.form .field.field input:-webkit-autofill {
|
|
-webkit-box-shadow: 0px 0px 0px 100px #FFFFF0 inset !important;
|
|
box-shadow: 0px 0px 0px 100px #FFFFF0 inset !important;
|
|
border-color: #E5DFA1 !important;
|
|
}
|
|
/* Focus */
|
|
.ui.form .field.field input:-webkit-autofill:focus {
|
|
-webkit-box-shadow: 0px 0px 0px 100px #FFFFF0 inset !important;
|
|
box-shadow: 0px 0px 0px 100px #FFFFF0 inset !important;
|
|
border-color: #D5C315 !important;
|
|
}
|
|
/* Error */
|
|
.ui.form .error.error input:-webkit-autofill {
|
|
-webkit-box-shadow: 0px 0px 0px 100px #FFFAF0 inset !important;
|
|
box-shadow: 0px 0px 0px 100px #FFFAF0 inset !important;
|
|
border-color: #E0B4B4 !important;
|
|
}
|
|
/*--------------------
|
|
Placeholder
|
|
---------------------*/
|
|
/* browsers require these rules separate */
|
|
.ui.form ::-webkit-input-placeholder {
|
|
color: rgba(191, 191, 191, 0.87);
|
|
}
|
|
.ui.form :-ms-input-placeholder {
|
|
color: rgba(191, 191, 191, 0.87);
|
|
}
|
|
.ui.form ::-moz-placeholder {
|
|
color: rgba(191, 191, 191, 0.87);
|
|
}
|
|
.ui.form :focus::-webkit-input-placeholder {
|
|
color: rgba(115, 115, 115, 0.87);
|
|
}
|
|
.ui.form :focus:-ms-input-placeholder {
|
|
color: rgba(115, 115, 115, 0.87);
|
|
}
|
|
.ui.form :focus::-moz-placeholder {
|
|
color: rgba(115, 115, 115, 0.87);
|
|
}
|
|
/* Error Placeholder */
|
|
.ui.form .error ::-webkit-input-placeholder {
|
|
color: #e7bdbc;
|
|
}
|
|
.ui.form .error :-ms-input-placeholder {
|
|
color: #e7bdbc !important;
|
|
}
|
|
.ui.form .error ::-moz-placeholder {
|
|
color: #e7bdbc;
|
|
}
|
|
.ui.form .error :focus::-webkit-input-placeholder {
|
|
color: #da9796;
|
|
}
|
|
.ui.form .error :focus:-ms-input-placeholder {
|
|
color: #da9796 !important;
|
|
}
|
|
.ui.form .error :focus::-moz-placeholder {
|
|
color: #da9796;
|
|
}
|
|
/*--------------------
|
|
Focus
|
|
---------------------*/
|
|
.ui.form input:not([type]):focus,
|
|
.ui.form input[type="date"]:focus,
|
|
.ui.form input[type="datetime-local"]:focus,
|
|
.ui.form input[type="email"]:focus,
|
|
.ui.form input[type="number"]:focus,
|
|
.ui.form input[type="password"]:focus,
|
|
.ui.form input[type="search"]:focus,
|
|
.ui.form input[type="tel"]:focus,
|
|
.ui.form input[type="time"]:focus,
|
|
.ui.form input[type="text"]:focus,
|
|
.ui.form input[type="file"]:focus,
|
|
.ui.form input[type="url"]:focus {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
border-color: #85B7D9;
|
|
border-radius: 0.28571429rem;
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.35) inset;
|
|
box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.35) inset;
|
|
}
|
|
.ui.form textarea:focus {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
border-color: #85B7D9;
|
|
border-radius: 0.28571429rem;
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.35) inset;
|
|
box-shadow: 0px 0em 0em 0em rgba(34, 36, 38, 0.35) inset;
|
|
-webkit-appearance: none;
|
|
}
|
|
/*--------------------
|
|
Success
|
|
---------------------*/
|
|
/* On Form */
|
|
.ui.form.success .success.message:not(:empty) {
|
|
display: block;
|
|
}
|
|
.ui.form.success .compact.success.message:not(:empty) {
|
|
display: inline-block;
|
|
}
|
|
.ui.form.success .icon.success.message:not(:empty) {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
/*--------------------
|
|
Warning
|
|
---------------------*/
|
|
/* On Form */
|
|
.ui.form.warning .warning.message:not(:empty) {
|
|
display: block;
|
|
}
|
|
.ui.form.warning .compact.warning.message:not(:empty) {
|
|
display: inline-block;
|
|
}
|
|
.ui.form.warning .icon.warning.message:not(:empty) {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
/*--------------------
|
|
Error
|
|
---------------------*/
|
|
/* On Form */
|
|
.ui.form.error .error.message:not(:empty) {
|
|
display: block;
|
|
}
|
|
.ui.form.error .compact.error.message:not(:empty) {
|
|
display: inline-block;
|
|
}
|
|
.ui.form.error .icon.error.message:not(:empty) {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
/* 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: #9F3A38;
|
|
}
|
|
.ui.form .fields.error .field .corner.label,
|
|
.ui.form .field.error .corner.label {
|
|
border-color: #9F3A38;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.form .fields.error .field textarea,
|
|
.ui.form .fields.error .field select,
|
|
.ui.form .fields.error .field input:not([type]),
|
|
.ui.form .fields.error .field input[type="date"],
|
|
.ui.form .fields.error .field input[type="datetime-local"],
|
|
.ui.form .fields.error .field input[type="email"],
|
|
.ui.form .fields.error .field input[type="number"],
|
|
.ui.form .fields.error .field input[type="password"],
|
|
.ui.form .fields.error .field input[type="search"],
|
|
.ui.form .fields.error .field input[type="tel"],
|
|
.ui.form .fields.error .field input[type="time"],
|
|
.ui.form .fields.error .field input[type="text"],
|
|
.ui.form .fields.error .field input[type="file"],
|
|
.ui.form .fields.error .field input[type="url"],
|
|
.ui.form .field.error textarea,
|
|
.ui.form .field.error select,
|
|
.ui.form .field.error input:not([type]),
|
|
.ui.form .field.error input[type="date"],
|
|
.ui.form .field.error input[type="datetime-local"],
|
|
.ui.form .field.error input[type="email"],
|
|
.ui.form .field.error input[type="number"],
|
|
.ui.form .field.error input[type="password"],
|
|
.ui.form .field.error input[type="search"],
|
|
.ui.form .field.error input[type="tel"],
|
|
.ui.form .field.error input[type="time"],
|
|
.ui.form .field.error input[type="text"],
|
|
.ui.form .field.error input[type="file"],
|
|
.ui.form .field.error input[type="url"] {
|
|
background: #FFF6F6;
|
|
border-color: #E0B4B4;
|
|
color: #9F3A38;
|
|
border-radius: '';
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.form .field.error textarea:focus,
|
|
.ui.form .field.error select:focus,
|
|
.ui.form .field.error input:not([type]):focus,
|
|
.ui.form .field.error input[type="date"]:focus,
|
|
.ui.form .field.error input[type="datetime-local"]:focus,
|
|
.ui.form .field.error input[type="email"]:focus,
|
|
.ui.form .field.error input[type="number"]:focus,
|
|
.ui.form .field.error input[type="password"]:focus,
|
|
.ui.form .field.error input[type="search"]:focus,
|
|
.ui.form .field.error input[type="tel"]:focus,
|
|
.ui.form .field.error input[type="time"]:focus,
|
|
.ui.form .field.error input[type="text"]:focus,
|
|
.ui.form .field.error input[type="file"]:focus,
|
|
.ui.form .field.error input[type="url"]:focus {
|
|
background: #FFF6F6;
|
|
border-color: #E0B4B4;
|
|
color: #9F3A38;
|
|
-webkit-appearance: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Preserve Native Select Stylings */
|
|
.ui.form .field.error select {
|
|
-webkit-appearance: menulist-button;
|
|
}
|
|
/*------------------
|
|
Dropdown Error
|
|
--------------------*/
|
|
.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 .text,
|
|
.ui.form .field.error .ui.dropdown .item {
|
|
background: #FFF6F6;
|
|
color: #9F3A38;
|
|
}
|
|
.ui.form .fields.error .field .ui.dropdown,
|
|
.ui.form .field.error .ui.dropdown {
|
|
border-color: #E0B4B4 !important;
|
|
}
|
|
.ui.form .fields.error .field .ui.dropdown:hover,
|
|
.ui.form .field.error .ui.dropdown:hover {
|
|
border-color: #E0B4B4 !important;
|
|
}
|
|
.ui.form .fields.error .field .ui.dropdown:hover .menu,
|
|
.ui.form .field.error .ui.dropdown:hover .menu {
|
|
border-color: #E0B4B4;
|
|
}
|
|
.ui.form .fields.error .field .ui.multiple.selection.dropdown > .label,
|
|
.ui.form .field.error .ui.multiple.selection.dropdown > .label {
|
|
background-color: #EACBCB;
|
|
color: #9F3A38;
|
|
}
|
|
/* Hover */
|
|
.ui.form .fields.error .field .ui.dropdown .menu .item:hover,
|
|
.ui.form .field.error .ui.dropdown .menu .item:hover {
|
|
background-color: #FBE7E7;
|
|
}
|
|
/* Selected */
|
|
.ui.form .fields.error .field .ui.dropdown .menu .selected.item,
|
|
.ui.form .field.error .ui.dropdown .menu .selected.item {
|
|
background-color: #FBE7E7;
|
|
}
|
|
/* Active */
|
|
.ui.form .fields.error .field .ui.dropdown .menu .active.item,
|
|
.ui.form .field.error .ui.dropdown .menu .active.item {
|
|
background-color: #FDCFCF !important;
|
|
}
|
|
/*--------------------
|
|
Checkbox Error
|
|
---------------------*/
|
|
.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label,
|
|
.ui.form .field.error .checkbox:not(.toggle):not(.slider) label,
|
|
.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box,
|
|
.ui.form .field.error .checkbox:not(.toggle):not(.slider) .box {
|
|
color: #9F3A38;
|
|
}
|
|
.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) label:before,
|
|
.ui.form .field.error .checkbox:not(.toggle):not(.slider) label:before,
|
|
.ui.form .fields.error .field .checkbox:not(.toggle):not(.slider) .box:before,
|
|
.ui.form .field.error .checkbox:not(.toggle):not(.slider) .box:before {
|
|
background: #FFF6F6;
|
|
border-color: #E0B4B4;
|
|
}
|
|
.ui.form .fields.error .field .checkbox label:after,
|
|
.ui.form .field.error .checkbox label:after,
|
|
.ui.form .fields.error .field .checkbox .box:after,
|
|
.ui.form .field.error .checkbox .box:after {
|
|
color: #9F3A38;
|
|
}
|
|
/*--------------------
|
|
Disabled
|
|
---------------------*/
|
|
.ui.form .disabled.fields .field,
|
|
.ui.form .disabled.field,
|
|
.ui.form .field :disabled {
|
|
pointer-events: none;
|
|
opacity: 0.45;
|
|
}
|
|
.ui.form .field.disabled > label,
|
|
.ui.form .fields.disabled > label {
|
|
opacity: 0.45;
|
|
}
|
|
.ui.form .field.disabled :disabled {
|
|
opacity: 1;
|
|
}
|
|
/*--------------
|
|
Loading
|
|
---------------*/
|
|
.ui.loading.form {
|
|
position: relative;
|
|
cursor: default;
|
|
pointer-events: none;
|
|
}
|
|
.ui.loading.form:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 0%;
|
|
left: 0%;
|
|
background: rgba(255, 255, 255, 0.8);
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 100;
|
|
}
|
|
.ui.loading.form:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -1.5em 0em 0em -1.5em;
|
|
width: 3em;
|
|
height: 3em;
|
|
-webkit-animation: form-spin 0.6s linear;
|
|
animation: form-spin 0.6s linear;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
border-radius: 500rem;
|
|
border-color: #95a5a6 rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
|
|
border-style: solid;
|
|
border-width: 0.2em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent;
|
|
box-shadow: 0px 0px 0px 1px transparent;
|
|
visibility: visible;
|
|
z-index: 101;
|
|
}
|
|
@-webkit-keyframes form-spin {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes form-spin {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
/*******************************
|
|
Element Types
|
|
*******************************/
|
|
/*--------------------
|
|
Required Field
|
|
---------------------*/
|
|
.ui.form .required.fields:not(.grouped) > .field > label:after,
|
|
.ui.form .required.fields.grouped > label:after,
|
|
.ui.form .required.field > label:after,
|
|
.ui.form .required.fields:not(.grouped) > .field > .checkbox:after,
|
|
.ui.form .required.field > .checkbox:after {
|
|
margin: -0.2em 0em 0em 0.2em;
|
|
content: '*';
|
|
color: #EF767A;
|
|
}
|
|
.ui.form .required.fields:not(.grouped) > .field > label:after,
|
|
.ui.form .required.fields.grouped > label:after,
|
|
.ui.form .required.field > label:after {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
}
|
|
.ui.form .required.fields:not(.grouped) > .field > .checkbox:after,
|
|
.ui.form .required.field > .checkbox:after {
|
|
position: absolute;
|
|
top: 0%;
|
|
left: 100%;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------------
|
|
Inverted Colors
|
|
---------------------*/
|
|
.ui.inverted.form label,
|
|
.ui.form .inverted.segment label,
|
|
.ui.form .inverted.segment .ui.checkbox label,
|
|
.ui.form .inverted.segment .ui.checkbox .box,
|
|
.ui.inverted.form .ui.checkbox label,
|
|
.ui.inverted.form .ui.checkbox .box,
|
|
.ui.inverted.form .inline.fields > label,
|
|
.ui.inverted.form .inline.fields .field > label,
|
|
.ui.inverted.form .inline.fields .field > p,
|
|
.ui.inverted.form .inline.field > label,
|
|
.ui.inverted.form .inline.field > p {
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
/* Inverted Field */
|
|
.ui.inverted.form input:not([type]),
|
|
.ui.inverted.form input[type="date"],
|
|
.ui.inverted.form input[type="datetime-local"],
|
|
.ui.inverted.form input[type="email"],
|
|
.ui.inverted.form input[type="number"],
|
|
.ui.inverted.form input[type="password"],
|
|
.ui.inverted.form input[type="search"],
|
|
.ui.inverted.form input[type="tel"],
|
|
.ui.inverted.form input[type="time"],
|
|
.ui.inverted.form input[type="text"],
|
|
.ui.inverted.form input[type="file"],
|
|
.ui.inverted.form input[type="url"] {
|
|
background: #FFFFFF;
|
|
border-color: rgba(255, 255, 255, 0.1);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/*--------------------
|
|
Field Groups
|
|
---------------------*/
|
|
/* Grouped Vertically */
|
|
.ui.form .grouped.fields {
|
|
display: block;
|
|
margin: 0em 0em 1em;
|
|
}
|
|
.ui.form .grouped.fields:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.form .grouped.fields > label {
|
|
margin: 0em 0em 0.28571429rem 0em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
font-size: 0.92857143em;
|
|
font-weight: bold;
|
|
text-transform: none;
|
|
}
|
|
.ui.form .grouped.fields .field,
|
|
.ui.form .grouped.inline.fields .field {
|
|
display: block;
|
|
margin: 0.5em 0em;
|
|
padding: 0em;
|
|
}
|
|
/*--------------------
|
|
Fields
|
|
---------------------*/
|
|
/* Split fields */
|
|
.ui.form .fields {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
margin: 0em -0.5em 1em;
|
|
}
|
|
.ui.form .fields > .field {
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 1 auto;
|
|
flex: 0 1 auto;
|
|
padding-left: 0.5em;
|
|
padding-right: 0.5em;
|
|
}
|
|
.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%;
|
|
}
|
|
.ui.form .three.fields > .fields,
|
|
.ui.form .three.fields > .field {
|
|
width: 33.33333333%;
|
|
}
|
|
.ui.form .four.fields > .fields,
|
|
.ui.form .four.fields > .field {
|
|
width: 25%;
|
|
}
|
|
.ui.form .five.fields > .fields,
|
|
.ui.form .five.fields > .field {
|
|
width: 20%;
|
|
}
|
|
.ui.form .six.fields > .fields,
|
|
.ui.form .six.fields > .field {
|
|
width: 16.66666667%;
|
|
}
|
|
.ui.form .seven.fields > .fields,
|
|
.ui.form .seven.fields > .field {
|
|
width: 14.28571429%;
|
|
}
|
|
.ui.form .eight.fields > .fields,
|
|
.ui.form .eight.fields > .field {
|
|
width: 12.5%;
|
|
}
|
|
.ui.form .nine.fields > .fields,
|
|
.ui.form .nine.fields > .field {
|
|
width: 11.11111111%;
|
|
}
|
|
.ui.form .ten.fields > .fields,
|
|
.ui.form .ten.fields > .field {
|
|
width: 10%;
|
|
}
|
|
/* Swap to full width on mobile */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.form .fields {
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
}
|
|
.ui[class*="equal width"].form .fields > .field,
|
|
.ui.form [class*="equal width"].fields > .field,
|
|
.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 .six.fields > .fields,
|
|
.ui.form .six.fields > .field,
|
|
.ui.form .seven.fields > .fields,
|
|
.ui.form .seven.fields > .field,
|
|
.ui.form .eight.fields > .fields,
|
|
.ui.form .eight.fields > .field,
|
|
.ui.form .nine.fields > .fields,
|
|
.ui.form .nine.fields > .field,
|
|
.ui.form .ten.fields > .fields,
|
|
.ui.form .ten.fields > .field {
|
|
width: 100% !important;
|
|
margin: 0em 0em 1em;
|
|
}
|
|
}
|
|
/* Sizing Combinations */
|
|
.ui.form .fields .wide.field {
|
|
width: 6.25%;
|
|
padding-left: 0.5em;
|
|
padding-right: 0.5em;
|
|
}
|
|
.ui.form .one.wide.field {
|
|
width: 6.25% !important;
|
|
}
|
|
.ui.form .two.wide.field {
|
|
width: 12.5% !important;
|
|
}
|
|
.ui.form .three.wide.field {
|
|
width: 18.75% !important;
|
|
}
|
|
.ui.form .four.wide.field {
|
|
width: 25% !important;
|
|
}
|
|
.ui.form .five.wide.field {
|
|
width: 31.25% !important;
|
|
}
|
|
.ui.form .six.wide.field {
|
|
width: 37.5% !important;
|
|
}
|
|
.ui.form .seven.wide.field {
|
|
width: 43.75% !important;
|
|
}
|
|
.ui.form .eight.wide.field {
|
|
width: 50% !important;
|
|
}
|
|
.ui.form .nine.wide.field {
|
|
width: 56.25% !important;
|
|
}
|
|
.ui.form .ten.wide.field {
|
|
width: 62.5% !important;
|
|
}
|
|
.ui.form .eleven.wide.field {
|
|
width: 68.75% !important;
|
|
}
|
|
.ui.form .twelve.wide.field {
|
|
width: 75% !important;
|
|
}
|
|
.ui.form .thirteen.wide.field {
|
|
width: 81.25% !important;
|
|
}
|
|
.ui.form .fourteen.wide.field {
|
|
width: 87.5% !important;
|
|
}
|
|
.ui.form .fifteen.wide.field {
|
|
width: 93.75% !important;
|
|
}
|
|
.ui.form .sixteen.wide.field {
|
|
width: 100% !important;
|
|
}
|
|
/* 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% !important;
|
|
}
|
|
.ui.form .fields {
|
|
margin-bottom: 0em;
|
|
}
|
|
}
|
|
/*--------------------
|
|
Equal Width
|
|
---------------------*/
|
|
.ui[class*="equal width"].form .fields > .field,
|
|
.ui.form [class*="equal width"].fields > .field {
|
|
width: 100%;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1 1 auto;
|
|
flex: 1 1 auto;
|
|
}
|
|
/*--------------------
|
|
Inline Fields
|
|
---------------------*/
|
|
.ui.form .inline.fields {
|
|
margin: 0em 0em 1em;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.ui.form .inline.fields .field {
|
|
margin: 0em;
|
|
padding: 0em 1em 0em 0em;
|
|
}
|
|
/* Inline Label */
|
|
.ui.form .inline.fields > label,
|
|
.ui.form .inline.fields .field > label,
|
|
.ui.form .inline.fields .field > p,
|
|
.ui.form .inline.field > label,
|
|
.ui.form .inline.field > p {
|
|
display: inline-block;
|
|
width: auto;
|
|
margin-top: 0em;
|
|
margin-bottom: 0em;
|
|
vertical-align: baseline;
|
|
font-size: 0.92857143em;
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
text-transform: none;
|
|
}
|
|
/* Grouped Inline Label */
|
|
.ui.form .inline.fields > label {
|
|
margin: 0.035714em 1em 0em 0em;
|
|
}
|
|
/* Inline Input */
|
|
.ui.form .inline.fields .field > input,
|
|
.ui.form .inline.fields .field > select,
|
|
.ui.form .inline.field > input,
|
|
.ui.form .inline.field > select {
|
|
display: inline-block;
|
|
width: auto;
|
|
margin-top: 0em;
|
|
margin-bottom: 0em;
|
|
vertical-align: middle;
|
|
font-size: 1em;
|
|
}
|
|
/* Label */
|
|
.ui.form .inline.fields .field > :first-child,
|
|
.ui.form .inline.field > :first-child {
|
|
margin: 0em 0.85714286em 0em 0em;
|
|
}
|
|
.ui.form .inline.fields .field > :only-child,
|
|
.ui.form .inline.field > :only-child {
|
|
margin: 0em;
|
|
}
|
|
/* Wide */
|
|
.ui.form .inline.fields .wide.field {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.ui.form .inline.fields .wide.field > input,
|
|
.ui.form .inline.fields .wide.field > select {
|
|
width: 100%;
|
|
}
|
|
/*--------------------
|
|
Sizes
|
|
---------------------*/
|
|
.ui.mini.form {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.tiny.form {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.form {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.form {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.form {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.big.form {
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.huge.form {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
.ui.massive.form {
|
|
font-size: 1.71428571rem;
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Grid
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Grid
|
|
*******************************/
|
|
/* Inherited From Site */
|
|
/*******************************
|
|
Grid
|
|
*******************************/
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Relaxed
|
|
---------------*/
|
|
/*--------------
|
|
Divided
|
|
---------------*/
|
|
/*--------------
|
|
Celled
|
|
---------------*/
|
|
/*--------------
|
|
Stackable
|
|
---------------*/
|
|
/*******************************
|
|
Legacy
|
|
*******************************/
|
|
/*--------------
|
|
Page
|
|
---------------*/
|
|
/* Legacy (DO NOT USE)
|
|
*/
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Standard
|
|
*******************************/
|
|
.ui.grid {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
-webkit-box-align: stretch;
|
|
-ms-flex-align: stretch;
|
|
align-items: stretch;
|
|
padding: 0em;
|
|
}
|
|
/*----------------------
|
|
Remove Gutters
|
|
-----------------------*/
|
|
.ui.grid {
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
margin-left: -1rem;
|
|
margin-right: -1rem;
|
|
}
|
|
.ui.relaxed.grid {
|
|
margin-left: -1.5rem;
|
|
margin-right: -1.5rem;
|
|
}
|
|
.ui[class*="very relaxed"].grid {
|
|
margin-left: -2.5rem;
|
|
margin-right: -2.5rem;
|
|
}
|
|
/* Preserve Rows Spacing on Consecutive Grids */
|
|
.ui.grid + .grid {
|
|
margin-top: 1rem;
|
|
}
|
|
/*-------------------
|
|
Columns
|
|
--------------------*/
|
|
/* Standard 16 column */
|
|
.ui.grid > .column:not(.row),
|
|
.ui.grid > .row > .column {
|
|
position: relative;
|
|
display: inline-block;
|
|
width: 6.25%;
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
vertical-align: top;
|
|
}
|
|
.ui.grid > * {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
/*-------------------
|
|
Rows
|
|
--------------------*/
|
|
.ui.grid > .row {
|
|
position: relative;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
-webkit-box-pack: inherit;
|
|
-ms-flex-pack: inherit;
|
|
justify-content: inherit;
|
|
-webkit-box-align: stretch;
|
|
-ms-flex-align: stretch;
|
|
align-items: stretch;
|
|
width: 100% !important;
|
|
padding: 0rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
/*-------------------
|
|
Columns
|
|
--------------------*/
|
|
/* Vertical padding when no rows */
|
|
.ui.grid > .column:not(.row) {
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
.ui.grid > .row > .column {
|
|
margin-top: 0em;
|
|
margin-bottom: 0em;
|
|
}
|
|
/*-------------------
|
|
Content
|
|
--------------------*/
|
|
.ui.grid > .row > img,
|
|
.ui.grid > .row > .column > img {
|
|
max-width: 100%;
|
|
}
|
|
/*-------------------
|
|
Loose Coupling
|
|
--------------------*/
|
|
/* Collapse Margin on Consecutive Grid */
|
|
.ui.grid > .ui.grid:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.grid > .ui.grid:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/* Segment inside Aligned Grid */
|
|
.ui.grid .aligned.row > .column > .segment:not(.compact):not(.attached),
|
|
.ui.aligned.grid .column > .segment:not(.compact):not(.attached) {
|
|
width: 100%;
|
|
}
|
|
/* Align Dividers with Gutter */
|
|
.ui.grid .row + .ui.divider {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
margin: 1rem 1rem;
|
|
}
|
|
.ui.grid .column + .ui.vertical.divider {
|
|
height: calc(50% - 1rem );
|
|
}
|
|
/* Remove Border on Last Horizontal Segment */
|
|
.ui.grid > .row > .column:last-child > .horizontal.segment,
|
|
.ui.grid > .column:last-child > .horizontal.segment {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-----------------------
|
|
Page Grid
|
|
-------------------------*/
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.page.grid {
|
|
width: auto;
|
|
padding-left: 0em;
|
|
padding-right: 0em;
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui.page.grid {
|
|
width: auto;
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
padding-left: 2em;
|
|
padding-right: 2em;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 992px) and (max-width: 1199px) {
|
|
.ui.page.grid {
|
|
width: auto;
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
padding-left: 3%;
|
|
padding-right: 3%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
|
|
.ui.page.grid {
|
|
width: auto;
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
padding-left: 15%;
|
|
padding-right: 15%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui.page.grid {
|
|
width: auto;
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
padding-left: 23%;
|
|
padding-right: 23%;
|
|
}
|
|
}
|
|
/*-------------------
|
|
Column Count
|
|
--------------------*/
|
|
/* Assume full width with one column */
|
|
.ui.grid > .column:only-child,
|
|
.ui.grid > .row > .column:only-child {
|
|
width: 100%;
|
|
}
|
|
/* Grid Based */
|
|
.ui[class*="one column"].grid > .row > .column,
|
|
.ui[class*="one column"].grid > .column:not(.row) {
|
|
width: 100%;
|
|
}
|
|
.ui[class*="two column"].grid > .row > .column,
|
|
.ui[class*="two column"].grid > .column:not(.row) {
|
|
width: 50%;
|
|
}
|
|
.ui[class*="three column"].grid > .row > .column,
|
|
.ui[class*="three column"].grid > .column:not(.row) {
|
|
width: 33.33333333%;
|
|
}
|
|
.ui[class*="four column"].grid > .row > .column,
|
|
.ui[class*="four column"].grid > .column:not(.row) {
|
|
width: 25%;
|
|
}
|
|
.ui[class*="five column"].grid > .row > .column,
|
|
.ui[class*="five column"].grid > .column:not(.row) {
|
|
width: 20%;
|
|
}
|
|
.ui[class*="six column"].grid > .row > .column,
|
|
.ui[class*="six column"].grid > .column:not(.row) {
|
|
width: 16.66666667%;
|
|
}
|
|
.ui[class*="seven column"].grid > .row > .column,
|
|
.ui[class*="seven column"].grid > .column:not(.row) {
|
|
width: 14.28571429%;
|
|
}
|
|
.ui[class*="eight column"].grid > .row > .column,
|
|
.ui[class*="eight column"].grid > .column:not(.row) {
|
|
width: 12.5%;
|
|
}
|
|
.ui[class*="nine column"].grid > .row > .column,
|
|
.ui[class*="nine column"].grid > .column:not(.row) {
|
|
width: 11.11111111%;
|
|
}
|
|
.ui[class*="ten column"].grid > .row > .column,
|
|
.ui[class*="ten column"].grid > .column:not(.row) {
|
|
width: 10%;
|
|
}
|
|
.ui[class*="eleven column"].grid > .row > .column,
|
|
.ui[class*="eleven column"].grid > .column:not(.row) {
|
|
width: 9.09090909%;
|
|
}
|
|
.ui[class*="twelve column"].grid > .row > .column,
|
|
.ui[class*="twelve column"].grid > .column:not(.row) {
|
|
width: 8.33333333%;
|
|
}
|
|
.ui[class*="thirteen column"].grid > .row > .column,
|
|
.ui[class*="thirteen column"].grid > .column:not(.row) {
|
|
width: 7.69230769%;
|
|
}
|
|
.ui[class*="fourteen column"].grid > .row > .column,
|
|
.ui[class*="fourteen column"].grid > .column:not(.row) {
|
|
width: 7.14285714%;
|
|
}
|
|
.ui[class*="fifteen column"].grid > .row > .column,
|
|
.ui[class*="fifteen column"].grid > .column:not(.row) {
|
|
width: 6.66666667%;
|
|
}
|
|
.ui[class*="sixteen column"].grid > .row > .column,
|
|
.ui[class*="sixteen column"].grid > .column:not(.row) {
|
|
width: 6.25%;
|
|
}
|
|
/* Row Based Overrides */
|
|
.ui.grid > [class*="one column"].row > .column {
|
|
width: 100% !important;
|
|
}
|
|
.ui.grid > [class*="two column"].row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui.grid > [class*="three column"].row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui.grid > [class*="four column"].row > .column {
|
|
width: 25% !important;
|
|
}
|
|
.ui.grid > [class*="five column"].row > .column {
|
|
width: 20% !important;
|
|
}
|
|
.ui.grid > [class*="six column"].row > .column {
|
|
width: 16.66666667% !important;
|
|
}
|
|
.ui.grid > [class*="seven column"].row > .column {
|
|
width: 14.28571429% !important;
|
|
}
|
|
.ui.grid > [class*="eight column"].row > .column {
|
|
width: 12.5% !important;
|
|
}
|
|
.ui.grid > [class*="nine column"].row > .column {
|
|
width: 11.11111111% !important;
|
|
}
|
|
.ui.grid > [class*="ten column"].row > .column {
|
|
width: 10% !important;
|
|
}
|
|
.ui.grid > [class*="eleven column"].row > .column {
|
|
width: 9.09090909% !important;
|
|
}
|
|
.ui.grid > [class*="twelve column"].row > .column {
|
|
width: 8.33333333% !important;
|
|
}
|
|
.ui.grid > [class*="thirteen column"].row > .column {
|
|
width: 7.69230769% !important;
|
|
}
|
|
.ui.grid > [class*="fourteen column"].row > .column {
|
|
width: 7.14285714% !important;
|
|
}
|
|
.ui.grid > [class*="fifteen column"].row > .column {
|
|
width: 6.66666667% !important;
|
|
}
|
|
.ui.grid > [class*="sixteen column"].row > .column {
|
|
width: 6.25% !important;
|
|
}
|
|
/* Celled Page */
|
|
.ui.celled.page.grid {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/*-------------------
|
|
Column Width
|
|
--------------------*/
|
|
/* Sizing Combinations */
|
|
.ui.grid > .row > [class*="one wide"].column,
|
|
.ui.grid > .column.row > [class*="one wide"].column,
|
|
.ui.grid > [class*="one wide"].column,
|
|
.ui.column.grid > [class*="one wide"].column {
|
|
width: 6.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="two wide"].column,
|
|
.ui.grid > .column.row > [class*="two wide"].column,
|
|
.ui.grid > [class*="two wide"].column,
|
|
.ui.column.grid > [class*="two wide"].column {
|
|
width: 12.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="three wide"].column,
|
|
.ui.grid > .column.row > [class*="three wide"].column,
|
|
.ui.grid > [class*="three wide"].column,
|
|
.ui.column.grid > [class*="three wide"].column {
|
|
width: 18.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="four wide"].column,
|
|
.ui.grid > .column.row > [class*="four wide"].column,
|
|
.ui.grid > [class*="four wide"].column,
|
|
.ui.column.grid > [class*="four wide"].column {
|
|
width: 25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="five wide"].column,
|
|
.ui.grid > .column.row > [class*="five wide"].column,
|
|
.ui.grid > [class*="five wide"].column,
|
|
.ui.column.grid > [class*="five wide"].column {
|
|
width: 31.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="six wide"].column,
|
|
.ui.grid > .column.row > [class*="six wide"].column,
|
|
.ui.grid > [class*="six wide"].column,
|
|
.ui.column.grid > [class*="six wide"].column {
|
|
width: 37.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="seven wide"].column,
|
|
.ui.grid > .column.row > [class*="seven wide"].column,
|
|
.ui.grid > [class*="seven wide"].column,
|
|
.ui.column.grid > [class*="seven wide"].column {
|
|
width: 43.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eight wide"].column,
|
|
.ui.grid > .column.row > [class*="eight wide"].column,
|
|
.ui.grid > [class*="eight wide"].column,
|
|
.ui.column.grid > [class*="eight wide"].column {
|
|
width: 50% !important;
|
|
}
|
|
.ui.grid > .row > [class*="nine wide"].column,
|
|
.ui.grid > .column.row > [class*="nine wide"].column,
|
|
.ui.grid > [class*="nine wide"].column,
|
|
.ui.column.grid > [class*="nine wide"].column {
|
|
width: 56.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="ten wide"].column,
|
|
.ui.grid > .column.row > [class*="ten wide"].column,
|
|
.ui.grid > [class*="ten wide"].column,
|
|
.ui.column.grid > [class*="ten wide"].column {
|
|
width: 62.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eleven wide"].column,
|
|
.ui.grid > .column.row > [class*="eleven wide"].column,
|
|
.ui.grid > [class*="eleven wide"].column,
|
|
.ui.column.grid > [class*="eleven wide"].column {
|
|
width: 68.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="twelve wide"].column,
|
|
.ui.grid > .column.row > [class*="twelve wide"].column,
|
|
.ui.grid > [class*="twelve wide"].column,
|
|
.ui.column.grid > [class*="twelve wide"].column {
|
|
width: 75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="thirteen wide"].column,
|
|
.ui.grid > .column.row > [class*="thirteen wide"].column,
|
|
.ui.grid > [class*="thirteen wide"].column,
|
|
.ui.column.grid > [class*="thirteen wide"].column {
|
|
width: 81.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fourteen wide"].column,
|
|
.ui.grid > .column.row > [class*="fourteen wide"].column,
|
|
.ui.grid > [class*="fourteen wide"].column,
|
|
.ui.column.grid > [class*="fourteen wide"].column {
|
|
width: 87.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fifteen wide"].column,
|
|
.ui.grid > .column.row > [class*="fifteen wide"].column,
|
|
.ui.grid > [class*="fifteen wide"].column,
|
|
.ui.column.grid > [class*="fifteen wide"].column {
|
|
width: 93.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="sixteen wide"].column,
|
|
.ui.grid > .column.row > [class*="sixteen wide"].column,
|
|
.ui.grid > [class*="sixteen wide"].column,
|
|
.ui.column.grid > [class*="sixteen wide"].column {
|
|
width: 100% !important;
|
|
}
|
|
/*----------------------
|
|
Width per Device
|
|
-----------------------*/
|
|
/* Mobile Sizing Combinations */
|
|
@media only screen and (min-width: 320px) and (max-width: 767px) {
|
|
.ui.grid > .row > [class*="one wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="one wide mobile"].column,
|
|
.ui.grid > [class*="one wide mobile"].column,
|
|
.ui.column.grid > [class*="one wide mobile"].column {
|
|
width: 6.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="two wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="two wide mobile"].column,
|
|
.ui.grid > [class*="two wide mobile"].column,
|
|
.ui.column.grid > [class*="two wide mobile"].column {
|
|
width: 12.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="three wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="three wide mobile"].column,
|
|
.ui.grid > [class*="three wide mobile"].column,
|
|
.ui.column.grid > [class*="three wide mobile"].column {
|
|
width: 18.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="four wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="four wide mobile"].column,
|
|
.ui.grid > [class*="four wide mobile"].column,
|
|
.ui.column.grid > [class*="four wide mobile"].column {
|
|
width: 25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="five wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="five wide mobile"].column,
|
|
.ui.grid > [class*="five wide mobile"].column,
|
|
.ui.column.grid > [class*="five wide mobile"].column {
|
|
width: 31.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="six wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="six wide mobile"].column,
|
|
.ui.grid > [class*="six wide mobile"].column,
|
|
.ui.column.grid > [class*="six wide mobile"].column {
|
|
width: 37.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="seven wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="seven wide mobile"].column,
|
|
.ui.grid > [class*="seven wide mobile"].column,
|
|
.ui.column.grid > [class*="seven wide mobile"].column {
|
|
width: 43.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eight wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="eight wide mobile"].column,
|
|
.ui.grid > [class*="eight wide mobile"].column,
|
|
.ui.column.grid > [class*="eight wide mobile"].column {
|
|
width: 50% !important;
|
|
}
|
|
.ui.grid > .row > [class*="nine wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="nine wide mobile"].column,
|
|
.ui.grid > [class*="nine wide mobile"].column,
|
|
.ui.column.grid > [class*="nine wide mobile"].column {
|
|
width: 56.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="ten wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="ten wide mobile"].column,
|
|
.ui.grid > [class*="ten wide mobile"].column,
|
|
.ui.column.grid > [class*="ten wide mobile"].column {
|
|
width: 62.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eleven wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="eleven wide mobile"].column,
|
|
.ui.grid > [class*="eleven wide mobile"].column,
|
|
.ui.column.grid > [class*="eleven wide mobile"].column {
|
|
width: 68.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="twelve wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="twelve wide mobile"].column,
|
|
.ui.grid > [class*="twelve wide mobile"].column,
|
|
.ui.column.grid > [class*="twelve wide mobile"].column {
|
|
width: 75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="thirteen wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="thirteen wide mobile"].column,
|
|
.ui.grid > [class*="thirteen wide mobile"].column,
|
|
.ui.column.grid > [class*="thirteen wide mobile"].column {
|
|
width: 81.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fourteen wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="fourteen wide mobile"].column,
|
|
.ui.grid > [class*="fourteen wide mobile"].column,
|
|
.ui.column.grid > [class*="fourteen wide mobile"].column {
|
|
width: 87.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fifteen wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="fifteen wide mobile"].column,
|
|
.ui.grid > [class*="fifteen wide mobile"].column,
|
|
.ui.column.grid > [class*="fifteen wide mobile"].column {
|
|
width: 93.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="sixteen wide mobile"].column,
|
|
.ui.grid > .column.row > [class*="sixteen wide mobile"].column,
|
|
.ui.grid > [class*="sixteen wide mobile"].column,
|
|
.ui.column.grid > [class*="sixteen wide mobile"].column {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
/* Tablet Sizing Combinations */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui.grid > .row > [class*="one wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="one wide tablet"].column,
|
|
.ui.grid > [class*="one wide tablet"].column,
|
|
.ui.column.grid > [class*="one wide tablet"].column {
|
|
width: 6.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="two wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="two wide tablet"].column,
|
|
.ui.grid > [class*="two wide tablet"].column,
|
|
.ui.column.grid > [class*="two wide tablet"].column {
|
|
width: 12.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="three wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="three wide tablet"].column,
|
|
.ui.grid > [class*="three wide tablet"].column,
|
|
.ui.column.grid > [class*="three wide tablet"].column {
|
|
width: 18.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="four wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="four wide tablet"].column,
|
|
.ui.grid > [class*="four wide tablet"].column,
|
|
.ui.column.grid > [class*="four wide tablet"].column {
|
|
width: 25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="five wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="five wide tablet"].column,
|
|
.ui.grid > [class*="five wide tablet"].column,
|
|
.ui.column.grid > [class*="five wide tablet"].column {
|
|
width: 31.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="six wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="six wide tablet"].column,
|
|
.ui.grid > [class*="six wide tablet"].column,
|
|
.ui.column.grid > [class*="six wide tablet"].column {
|
|
width: 37.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="seven wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="seven wide tablet"].column,
|
|
.ui.grid > [class*="seven wide tablet"].column,
|
|
.ui.column.grid > [class*="seven wide tablet"].column {
|
|
width: 43.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eight wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="eight wide tablet"].column,
|
|
.ui.grid > [class*="eight wide tablet"].column,
|
|
.ui.column.grid > [class*="eight wide tablet"].column {
|
|
width: 50% !important;
|
|
}
|
|
.ui.grid > .row > [class*="nine wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="nine wide tablet"].column,
|
|
.ui.grid > [class*="nine wide tablet"].column,
|
|
.ui.column.grid > [class*="nine wide tablet"].column {
|
|
width: 56.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="ten wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="ten wide tablet"].column,
|
|
.ui.grid > [class*="ten wide tablet"].column,
|
|
.ui.column.grid > [class*="ten wide tablet"].column {
|
|
width: 62.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eleven wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="eleven wide tablet"].column,
|
|
.ui.grid > [class*="eleven wide tablet"].column,
|
|
.ui.column.grid > [class*="eleven wide tablet"].column {
|
|
width: 68.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="twelve wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="twelve wide tablet"].column,
|
|
.ui.grid > [class*="twelve wide tablet"].column,
|
|
.ui.column.grid > [class*="twelve wide tablet"].column {
|
|
width: 75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="thirteen wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="thirteen wide tablet"].column,
|
|
.ui.grid > [class*="thirteen wide tablet"].column,
|
|
.ui.column.grid > [class*="thirteen wide tablet"].column {
|
|
width: 81.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fourteen wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="fourteen wide tablet"].column,
|
|
.ui.grid > [class*="fourteen wide tablet"].column,
|
|
.ui.column.grid > [class*="fourteen wide tablet"].column {
|
|
width: 87.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fifteen wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="fifteen wide tablet"].column,
|
|
.ui.grid > [class*="fifteen wide tablet"].column,
|
|
.ui.column.grid > [class*="fifteen wide tablet"].column {
|
|
width: 93.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="sixteen wide tablet"].column,
|
|
.ui.grid > .column.row > [class*="sixteen wide tablet"].column,
|
|
.ui.grid > [class*="sixteen wide tablet"].column,
|
|
.ui.column.grid > [class*="sixteen wide tablet"].column {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
/* Computer/Desktop Sizing Combinations */
|
|
@media only screen and (min-width: 992px) {
|
|
.ui.grid > .row > [class*="one wide computer"].column,
|
|
.ui.grid > .column.row > [class*="one wide computer"].column,
|
|
.ui.grid > [class*="one wide computer"].column,
|
|
.ui.column.grid > [class*="one wide computer"].column {
|
|
width: 6.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="two wide computer"].column,
|
|
.ui.grid > .column.row > [class*="two wide computer"].column,
|
|
.ui.grid > [class*="two wide computer"].column,
|
|
.ui.column.grid > [class*="two wide computer"].column {
|
|
width: 12.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="three wide computer"].column,
|
|
.ui.grid > .column.row > [class*="three wide computer"].column,
|
|
.ui.grid > [class*="three wide computer"].column,
|
|
.ui.column.grid > [class*="three wide computer"].column {
|
|
width: 18.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="four wide computer"].column,
|
|
.ui.grid > .column.row > [class*="four wide computer"].column,
|
|
.ui.grid > [class*="four wide computer"].column,
|
|
.ui.column.grid > [class*="four wide computer"].column {
|
|
width: 25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="five wide computer"].column,
|
|
.ui.grid > .column.row > [class*="five wide computer"].column,
|
|
.ui.grid > [class*="five wide computer"].column,
|
|
.ui.column.grid > [class*="five wide computer"].column {
|
|
width: 31.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="six wide computer"].column,
|
|
.ui.grid > .column.row > [class*="six wide computer"].column,
|
|
.ui.grid > [class*="six wide computer"].column,
|
|
.ui.column.grid > [class*="six wide computer"].column {
|
|
width: 37.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="seven wide computer"].column,
|
|
.ui.grid > .column.row > [class*="seven wide computer"].column,
|
|
.ui.grid > [class*="seven wide computer"].column,
|
|
.ui.column.grid > [class*="seven wide computer"].column {
|
|
width: 43.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eight wide computer"].column,
|
|
.ui.grid > .column.row > [class*="eight wide computer"].column,
|
|
.ui.grid > [class*="eight wide computer"].column,
|
|
.ui.column.grid > [class*="eight wide computer"].column {
|
|
width: 50% !important;
|
|
}
|
|
.ui.grid > .row > [class*="nine wide computer"].column,
|
|
.ui.grid > .column.row > [class*="nine wide computer"].column,
|
|
.ui.grid > [class*="nine wide computer"].column,
|
|
.ui.column.grid > [class*="nine wide computer"].column {
|
|
width: 56.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="ten wide computer"].column,
|
|
.ui.grid > .column.row > [class*="ten wide computer"].column,
|
|
.ui.grid > [class*="ten wide computer"].column,
|
|
.ui.column.grid > [class*="ten wide computer"].column {
|
|
width: 62.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eleven wide computer"].column,
|
|
.ui.grid > .column.row > [class*="eleven wide computer"].column,
|
|
.ui.grid > [class*="eleven wide computer"].column,
|
|
.ui.column.grid > [class*="eleven wide computer"].column {
|
|
width: 68.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="twelve wide computer"].column,
|
|
.ui.grid > .column.row > [class*="twelve wide computer"].column,
|
|
.ui.grid > [class*="twelve wide computer"].column,
|
|
.ui.column.grid > [class*="twelve wide computer"].column {
|
|
width: 75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="thirteen wide computer"].column,
|
|
.ui.grid > .column.row > [class*="thirteen wide computer"].column,
|
|
.ui.grid > [class*="thirteen wide computer"].column,
|
|
.ui.column.grid > [class*="thirteen wide computer"].column {
|
|
width: 81.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fourteen wide computer"].column,
|
|
.ui.grid > .column.row > [class*="fourteen wide computer"].column,
|
|
.ui.grid > [class*="fourteen wide computer"].column,
|
|
.ui.column.grid > [class*="fourteen wide computer"].column {
|
|
width: 87.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fifteen wide computer"].column,
|
|
.ui.grid > .column.row > [class*="fifteen wide computer"].column,
|
|
.ui.grid > [class*="fifteen wide computer"].column,
|
|
.ui.column.grid > [class*="fifteen wide computer"].column {
|
|
width: 93.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="sixteen wide computer"].column,
|
|
.ui.grid > .column.row > [class*="sixteen wide computer"].column,
|
|
.ui.grid > [class*="sixteen wide computer"].column,
|
|
.ui.column.grid > [class*="sixteen wide computer"].column {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
/* Large Monitor Sizing Combinations */
|
|
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
|
|
.ui.grid > .row > [class*="one wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="one wide large screen"].column,
|
|
.ui.grid > [class*="one wide large screen"].column,
|
|
.ui.column.grid > [class*="one wide large screen"].column {
|
|
width: 6.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="two wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="two wide large screen"].column,
|
|
.ui.grid > [class*="two wide large screen"].column,
|
|
.ui.column.grid > [class*="two wide large screen"].column {
|
|
width: 12.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="three wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="three wide large screen"].column,
|
|
.ui.grid > [class*="three wide large screen"].column,
|
|
.ui.column.grid > [class*="three wide large screen"].column {
|
|
width: 18.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="four wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="four wide large screen"].column,
|
|
.ui.grid > [class*="four wide large screen"].column,
|
|
.ui.column.grid > [class*="four wide large screen"].column {
|
|
width: 25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="five wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="five wide large screen"].column,
|
|
.ui.grid > [class*="five wide large screen"].column,
|
|
.ui.column.grid > [class*="five wide large screen"].column {
|
|
width: 31.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="six wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="six wide large screen"].column,
|
|
.ui.grid > [class*="six wide large screen"].column,
|
|
.ui.column.grid > [class*="six wide large screen"].column {
|
|
width: 37.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="seven wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="seven wide large screen"].column,
|
|
.ui.grid > [class*="seven wide large screen"].column,
|
|
.ui.column.grid > [class*="seven wide large screen"].column {
|
|
width: 43.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eight wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="eight wide large screen"].column,
|
|
.ui.grid > [class*="eight wide large screen"].column,
|
|
.ui.column.grid > [class*="eight wide large screen"].column {
|
|
width: 50% !important;
|
|
}
|
|
.ui.grid > .row > [class*="nine wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="nine wide large screen"].column,
|
|
.ui.grid > [class*="nine wide large screen"].column,
|
|
.ui.column.grid > [class*="nine wide large screen"].column {
|
|
width: 56.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="ten wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="ten wide large screen"].column,
|
|
.ui.grid > [class*="ten wide large screen"].column,
|
|
.ui.column.grid > [class*="ten wide large screen"].column {
|
|
width: 62.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eleven wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="eleven wide large screen"].column,
|
|
.ui.grid > [class*="eleven wide large screen"].column,
|
|
.ui.column.grid > [class*="eleven wide large screen"].column {
|
|
width: 68.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="twelve wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="twelve wide large screen"].column,
|
|
.ui.grid > [class*="twelve wide large screen"].column,
|
|
.ui.column.grid > [class*="twelve wide large screen"].column {
|
|
width: 75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="thirteen wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="thirteen wide large screen"].column,
|
|
.ui.grid > [class*="thirteen wide large screen"].column,
|
|
.ui.column.grid > [class*="thirteen wide large screen"].column {
|
|
width: 81.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fourteen wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="fourteen wide large screen"].column,
|
|
.ui.grid > [class*="fourteen wide large screen"].column,
|
|
.ui.column.grid > [class*="fourteen wide large screen"].column {
|
|
width: 87.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fifteen wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="fifteen wide large screen"].column,
|
|
.ui.grid > [class*="fifteen wide large screen"].column,
|
|
.ui.column.grid > [class*="fifteen wide large screen"].column {
|
|
width: 93.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="sixteen wide large screen"].column,
|
|
.ui.grid > .column.row > [class*="sixteen wide large screen"].column,
|
|
.ui.grid > [class*="sixteen wide large screen"].column,
|
|
.ui.column.grid > [class*="sixteen wide large screen"].column {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
/* Widescreen Sizing Combinations */
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui.grid > .row > [class*="one wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="one wide widescreen"].column,
|
|
.ui.grid > [class*="one wide widescreen"].column,
|
|
.ui.column.grid > [class*="one wide widescreen"].column {
|
|
width: 6.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="two wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="two wide widescreen"].column,
|
|
.ui.grid > [class*="two wide widescreen"].column,
|
|
.ui.column.grid > [class*="two wide widescreen"].column {
|
|
width: 12.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="three wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="three wide widescreen"].column,
|
|
.ui.grid > [class*="three wide widescreen"].column,
|
|
.ui.column.grid > [class*="three wide widescreen"].column {
|
|
width: 18.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="four wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="four wide widescreen"].column,
|
|
.ui.grid > [class*="four wide widescreen"].column,
|
|
.ui.column.grid > [class*="four wide widescreen"].column {
|
|
width: 25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="five wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="five wide widescreen"].column,
|
|
.ui.grid > [class*="five wide widescreen"].column,
|
|
.ui.column.grid > [class*="five wide widescreen"].column {
|
|
width: 31.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="six wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="six wide widescreen"].column,
|
|
.ui.grid > [class*="six wide widescreen"].column,
|
|
.ui.column.grid > [class*="six wide widescreen"].column {
|
|
width: 37.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="seven wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="seven wide widescreen"].column,
|
|
.ui.grid > [class*="seven wide widescreen"].column,
|
|
.ui.column.grid > [class*="seven wide widescreen"].column {
|
|
width: 43.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eight wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="eight wide widescreen"].column,
|
|
.ui.grid > [class*="eight wide widescreen"].column,
|
|
.ui.column.grid > [class*="eight wide widescreen"].column {
|
|
width: 50% !important;
|
|
}
|
|
.ui.grid > .row > [class*="nine wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="nine wide widescreen"].column,
|
|
.ui.grid > [class*="nine wide widescreen"].column,
|
|
.ui.column.grid > [class*="nine wide widescreen"].column {
|
|
width: 56.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="ten wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="ten wide widescreen"].column,
|
|
.ui.grid > [class*="ten wide widescreen"].column,
|
|
.ui.column.grid > [class*="ten wide widescreen"].column {
|
|
width: 62.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="eleven wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="eleven wide widescreen"].column,
|
|
.ui.grid > [class*="eleven wide widescreen"].column,
|
|
.ui.column.grid > [class*="eleven wide widescreen"].column {
|
|
width: 68.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="twelve wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="twelve wide widescreen"].column,
|
|
.ui.grid > [class*="twelve wide widescreen"].column,
|
|
.ui.column.grid > [class*="twelve wide widescreen"].column {
|
|
width: 75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="thirteen wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="thirteen wide widescreen"].column,
|
|
.ui.grid > [class*="thirteen wide widescreen"].column,
|
|
.ui.column.grid > [class*="thirteen wide widescreen"].column {
|
|
width: 81.25% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fourteen wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="fourteen wide widescreen"].column,
|
|
.ui.grid > [class*="fourteen wide widescreen"].column,
|
|
.ui.column.grid > [class*="fourteen wide widescreen"].column {
|
|
width: 87.5% !important;
|
|
}
|
|
.ui.grid > .row > [class*="fifteen wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="fifteen wide widescreen"].column,
|
|
.ui.grid > [class*="fifteen wide widescreen"].column,
|
|
.ui.column.grid > [class*="fifteen wide widescreen"].column {
|
|
width: 93.75% !important;
|
|
}
|
|
.ui.grid > .row > [class*="sixteen wide widescreen"].column,
|
|
.ui.grid > .column.row > [class*="sixteen wide widescreen"].column,
|
|
.ui.grid > [class*="sixteen wide widescreen"].column,
|
|
.ui.column.grid > [class*="sixteen wide widescreen"].column {
|
|
width: 100% !important;
|
|
}
|
|
}
|
|
/*----------------------
|
|
Centered
|
|
-----------------------*/
|
|
.ui.centered.grid,
|
|
.ui.centered.grid > .row,
|
|
.ui.grid > .centered.row {
|
|
text-align: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
}
|
|
.ui.centered.grid > .column:not(.aligned):not(.justified):not(.row),
|
|
.ui.centered.grid > .row > .column:not(.aligned):not(.justified),
|
|
.ui.grid .centered.row > .column:not(.aligned):not(.justified) {
|
|
text-align: left;
|
|
}
|
|
.ui.grid > .centered.column,
|
|
.ui.grid > .row > .centered.column {
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
/*----------------------
|
|
Relaxed
|
|
-----------------------*/
|
|
.ui.relaxed.grid > .column:not(.row),
|
|
.ui.relaxed.grid > .row > .column,
|
|
.ui.grid > .relaxed.row > .column {
|
|
padding-left: 1.5rem;
|
|
padding-right: 1.5rem;
|
|
}
|
|
.ui[class*="very relaxed"].grid > .column:not(.row),
|
|
.ui[class*="very relaxed"].grid > .row > .column,
|
|
.ui.grid > [class*="very relaxed"].row > .column {
|
|
padding-left: 2.5rem;
|
|
padding-right: 2.5rem;
|
|
}
|
|
/* Coupling with UI Divider */
|
|
.ui.relaxed.grid .row + .ui.divider,
|
|
.ui.grid .relaxed.row + .ui.divider {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
.ui[class*="very relaxed"].grid .row + .ui.divider,
|
|
.ui.grid [class*="very relaxed"].row + .ui.divider {
|
|
margin-left: 2.5rem;
|
|
margin-right: 2.5rem;
|
|
}
|
|
/*----------------------
|
|
Padded
|
|
-----------------------*/
|
|
.ui.padded.grid:not(.vertically):not(.horizontally) {
|
|
margin: 0em !important;
|
|
}
|
|
[class*="horizontally padded"].ui.grid {
|
|
margin-left: 0em !important;
|
|
margin-right: 0em !important;
|
|
}
|
|
[class*="vertically padded"].ui.grid {
|
|
margin-top: 0em !important;
|
|
margin-bottom: 0em !important;
|
|
}
|
|
/*----------------------
|
|
"Floated"
|
|
-----------------------*/
|
|
.ui.grid [class*="left floated"].column {
|
|
margin-right: auto;
|
|
}
|
|
.ui.grid [class*="right floated"].column {
|
|
margin-left: auto;
|
|
}
|
|
/*----------------------
|
|
Divided
|
|
-----------------------*/
|
|
.ui.divided.grid:not([class*="vertically divided"]) > .column:not(.row),
|
|
.ui.divided.grid:not([class*="vertically divided"]) > .row > .column {
|
|
-webkit-box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Swap from padding to margin on columns to have dividers align */
|
|
.ui[class*="vertically divided"].grid > .column:not(.row),
|
|
.ui[class*="vertically divided"].grid > .row > .column {
|
|
margin-top: 1rem;
|
|
margin-bottom: 1rem;
|
|
padding-top: 0rem;
|
|
padding-bottom: 0rem;
|
|
}
|
|
.ui[class*="vertically divided"].grid > .row {
|
|
margin-top: 0em;
|
|
margin-bottom: 0em;
|
|
}
|
|
/* No divider on first column on row */
|
|
.ui.divided.grid:not([class*="vertically divided"]) > .column:first-child,
|
|
.ui.divided.grid:not([class*="vertically divided"]) > .row > .column:first-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* No space on top of first row */
|
|
.ui[class*="vertically divided"].grid > .row:first-child > .column {
|
|
margin-top: 0em;
|
|
}
|
|
/* Divided Row */
|
|
.ui.grid > .divided.row > .column {
|
|
-webkit-box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.grid > .divided.row > .column:first-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Vertically Divided */
|
|
.ui[class*="vertically divided"].grid > .row {
|
|
position: relative;
|
|
}
|
|
.ui[class*="vertically divided"].grid > .row:before {
|
|
position: absolute;
|
|
content: "";
|
|
top: 0em;
|
|
left: 0px;
|
|
width: calc(100% - 2rem );
|
|
height: 1px;
|
|
margin: 0% 1rem;
|
|
-webkit-box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Padded Horizontally Divided */
|
|
[class*="horizontally padded"].ui.divided.grid,
|
|
.ui.padded.divided.grid:not(.vertically):not(.horizontally) {
|
|
width: 100%;
|
|
}
|
|
/* First Row Vertically Divided */
|
|
.ui[class*="vertically divided"].grid > .row:first-child:before {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Inverted Divided */
|
|
.ui.inverted.divided.grid:not([class*="vertically divided"]) > .column:not(.row),
|
|
.ui.inverted.divided.grid:not([class*="vertically divided"]) > .row > .column {
|
|
-webkit-box-shadow: -1px 0px 0px 0px rgba(255, 255, 255, 0.1);
|
|
box-shadow: -1px 0px 0px 0px rgba(255, 255, 255, 0.1);
|
|
}
|
|
.ui.inverted.divided.grid:not([class*="vertically divided"]) > .column:not(.row):first-child,
|
|
.ui.inverted.divided.grid:not([class*="vertically divided"]) > .row > .column:first-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.inverted[class*="vertically divided"].grid > .row:before {
|
|
-webkit-box-shadow: 0px -1px 0px 0px rgba(255, 255, 255, 0.1);
|
|
box-shadow: 0px -1px 0px 0px rgba(255, 255, 255, 0.1);
|
|
}
|
|
/* Relaxed */
|
|
.ui.relaxed[class*="vertically divided"].grid > .row:before {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
width: calc(100% - 3rem );
|
|
}
|
|
.ui[class*="very relaxed"][class*="vertically divided"].grid > .row:before {
|
|
margin-left: 5rem;
|
|
margin-right: 5rem;
|
|
width: calc(100% - 5rem );
|
|
}
|
|
/*----------------------
|
|
Celled
|
|
-----------------------*/
|
|
.ui.celled.grid {
|
|
width: 100%;
|
|
margin: 1em 0em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #D4D4D5;
|
|
box-shadow: 0px 0px 0px 1px #D4D4D5;
|
|
}
|
|
.ui.celled.grid > .row {
|
|
width: 100% !important;
|
|
margin: 0em;
|
|
padding: 0em;
|
|
-webkit-box-shadow: 0px -1px 0px 0px #D4D4D5;
|
|
box-shadow: 0px -1px 0px 0px #D4D4D5;
|
|
}
|
|
.ui.celled.grid > .column:not(.row),
|
|
.ui.celled.grid > .row > .column {
|
|
-webkit-box-shadow: -1px 0px 0px 0px #D4D4D5;
|
|
box-shadow: -1px 0px 0px 0px #D4D4D5;
|
|
}
|
|
.ui.celled.grid > .column:first-child,
|
|
.ui.celled.grid > .row > .column:first-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.celled.grid > .column:not(.row),
|
|
.ui.celled.grid > .row > .column {
|
|
padding: 1em;
|
|
}
|
|
.ui.relaxed.celled.grid > .column:not(.row),
|
|
.ui.relaxed.celled.grid > .row > .column {
|
|
padding: 1.5em;
|
|
}
|
|
.ui[class*="very relaxed"].celled.grid > .column:not(.row),
|
|
.ui[class*="very relaxed"].celled.grid > .row > .column {
|
|
padding: 2em;
|
|
}
|
|
/* Internally Celled */
|
|
.ui[class*="internally celled"].grid {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
margin: 0em;
|
|
}
|
|
.ui[class*="internally celled"].grid > .row:first-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui[class*="internally celled"].grid > .row > .column:first-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/*----------------------
|
|
Vertically Aligned
|
|
-----------------------*/
|
|
/* Top Aligned */
|
|
.ui[class*="top aligned"].grid > .column:not(.row),
|
|
.ui[class*="top aligned"].grid > .row > .column,
|
|
.ui.grid > [class*="top aligned"].row > .column,
|
|
.ui.grid > [class*="top aligned"].column:not(.row),
|
|
.ui.grid > .row > [class*="top aligned"].column {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
vertical-align: top;
|
|
-ms-flex-item-align: start !important;
|
|
align-self: flex-start !important;
|
|
}
|
|
/* Middle Aligned */
|
|
.ui[class*="middle aligned"].grid > .column:not(.row),
|
|
.ui[class*="middle aligned"].grid > .row > .column,
|
|
.ui.grid > [class*="middle aligned"].row > .column,
|
|
.ui.grid > [class*="middle aligned"].column:not(.row),
|
|
.ui.grid > .row > [class*="middle aligned"].column {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
vertical-align: middle;
|
|
-ms-flex-item-align: center !important;
|
|
align-self: center !important;
|
|
}
|
|
/* Bottom Aligned */
|
|
.ui[class*="bottom aligned"].grid > .column:not(.row),
|
|
.ui[class*="bottom aligned"].grid > .row > .column,
|
|
.ui.grid > [class*="bottom aligned"].row > .column,
|
|
.ui.grid > [class*="bottom aligned"].column:not(.row),
|
|
.ui.grid > .row > [class*="bottom aligned"].column {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
vertical-align: bottom;
|
|
-ms-flex-item-align: end !important;
|
|
align-self: flex-end !important;
|
|
}
|
|
/* Stretched */
|
|
.ui.stretched.grid > .row > .column,
|
|
.ui.stretched.grid > .column,
|
|
.ui.grid > .stretched.row > .column,
|
|
.ui.grid > .stretched.column:not(.row),
|
|
.ui.grid > .row > .stretched.column {
|
|
display: -webkit-inline-box !important;
|
|
display: -ms-inline-flexbox !important;
|
|
display: inline-flex !important;
|
|
-ms-flex-item-align: stretch;
|
|
align-self: stretch;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
.ui.stretched.grid > .row > .column > *,
|
|
.ui.stretched.grid > .column > *,
|
|
.ui.grid > .stretched.row > .column > *,
|
|
.ui.grid > .stretched.column:not(.row) > *,
|
|
.ui.grid > .row > .stretched.column > * {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
}
|
|
/*----------------------
|
|
Horizontally Centered
|
|
-----------------------*/
|
|
/* Left Aligned */
|
|
.ui[class*="left aligned"].grid > .column,
|
|
.ui[class*="left aligned"].grid > .row > .column,
|
|
.ui.grid > [class*="left aligned"].row > .column,
|
|
.ui.grid > [class*="left aligned"].column.column,
|
|
.ui.grid > .row > [class*="left aligned"].column.column {
|
|
text-align: left;
|
|
-ms-flex-item-align: inherit;
|
|
align-self: inherit;
|
|
}
|
|
/* Center Aligned */
|
|
.ui[class*="center aligned"].grid > .column,
|
|
.ui[class*="center aligned"].grid > .row > .column,
|
|
.ui.grid > [class*="center aligned"].row > .column,
|
|
.ui.grid > [class*="center aligned"].column.column,
|
|
.ui.grid > .row > [class*="center aligned"].column.column {
|
|
text-align: center;
|
|
-ms-flex-item-align: inherit;
|
|
align-self: inherit;
|
|
}
|
|
.ui[class*="center aligned"].grid {
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
}
|
|
/* Right Aligned */
|
|
.ui[class*="right aligned"].grid > .column,
|
|
.ui[class*="right aligned"].grid > .row > .column,
|
|
.ui.grid > [class*="right aligned"].row > .column,
|
|
.ui.grid > [class*="right aligned"].column.column,
|
|
.ui.grid > .row > [class*="right aligned"].column.column {
|
|
text-align: right;
|
|
-ms-flex-item-align: inherit;
|
|
align-self: inherit;
|
|
}
|
|
/* Justified */
|
|
.ui.justified.grid > .column,
|
|
.ui.justified.grid > .row > .column,
|
|
.ui.grid > .justified.row > .column,
|
|
.ui.grid > .justified.column.column,
|
|
.ui.grid > .row > .justified.column.column {
|
|
text-align: justify;
|
|
-webkit-hyphens: auto;
|
|
-ms-hyphens: auto;
|
|
hyphens: auto;
|
|
}
|
|
/*----------------------
|
|
Colored
|
|
-----------------------*/
|
|
.ui.grid > .row > .red.column,
|
|
.ui.grid > .row > .orange.column,
|
|
.ui.grid > .row > .yellow.column,
|
|
.ui.grid > .row > .olive.column,
|
|
.ui.grid > .row > .green.column,
|
|
.ui.grid > .row > .teal.column,
|
|
.ui.grid > .row > .blue.column,
|
|
.ui.grid > .row > .violet.column,
|
|
.ui.grid > .row > .purple.column,
|
|
.ui.grid > .row > .pink.column,
|
|
.ui.grid > .row > .brown.column,
|
|
.ui.grid > .row > .grey.column,
|
|
.ui.grid > .row > .black.column {
|
|
margin-top: -1rem;
|
|
margin-bottom: -1rem;
|
|
padding-top: 1rem;
|
|
padding-bottom: 1rem;
|
|
}
|
|
/* Red */
|
|
.ui.grid > .red.row,
|
|
.ui.grid > .red.column,
|
|
.ui.grid > .row > .red.column {
|
|
background-color: #EF767A !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Orange */
|
|
.ui.grid > .orange.row,
|
|
.ui.grid > .orange.column,
|
|
.ui.grid > .row > .orange.column {
|
|
background-color: #ff8b27 !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Yellow */
|
|
.ui.grid > .yellow.row,
|
|
.ui.grid > .yellow.column,
|
|
.ui.grid > .row > .yellow.column {
|
|
background-color: #FDE74C !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Olive */
|
|
.ui.grid > .olive.row,
|
|
.ui.grid > .olive.column,
|
|
.ui.grid > .row > .olive.column {
|
|
background-color: #B5CC18 !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Green */
|
|
.ui.grid > .green.row,
|
|
.ui.grid > .green.column,
|
|
.ui.grid > .row > .green.column {
|
|
background-color: #00ED00 !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Teal */
|
|
.ui.grid > .teal.row,
|
|
.ui.grid > .teal.column,
|
|
.ui.grid > .row > .teal.column {
|
|
background-color: #3891A6 !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Blue */
|
|
.ui.grid > .blue.row,
|
|
.ui.grid > .blue.column,
|
|
.ui.grid > .row > .blue.column {
|
|
background-color: #3454D1 !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Violet */
|
|
.ui.grid > .violet.row,
|
|
.ui.grid > .violet.column,
|
|
.ui.grid > .row > .violet.column {
|
|
background-color: #B4009E !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Purple */
|
|
.ui.grid > .purple.row,
|
|
.ui.grid > .purple.column,
|
|
.ui.grid > .row > .purple.column {
|
|
background-color: #6633cc !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Pink */
|
|
.ui.grid > .pink.row,
|
|
.ui.grid > .pink.column,
|
|
.ui.grid > .row > .pink.column {
|
|
background-color: #F46197 !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Brown */
|
|
.ui.grid > .brown.row,
|
|
.ui.grid > .brown.column,
|
|
.ui.grid > .row > .brown.column {
|
|
background-color: #00BCF2 !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Grey */
|
|
.ui.grid > .grey.row,
|
|
.ui.grid > .grey.column,
|
|
.ui.grid > .row > .grey.column {
|
|
background-color: #95a5a6 !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Black */
|
|
.ui.grid > .black.row,
|
|
.ui.grid > .black.column,
|
|
.ui.grid > .row > .black.column {
|
|
background-color: #1B1C1D !important;
|
|
color: #FFFFFF;
|
|
}
|
|
/*----------------------
|
|
Equal Width
|
|
-----------------------*/
|
|
.ui[class*="equal width"].grid > .column:not(.row),
|
|
.ui[class*="equal width"].grid > .row > .column,
|
|
.ui.grid > [class*="equal width"].row > .column {
|
|
display: inline-block;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
}
|
|
.ui[class*="equal width"].grid > .wide.column,
|
|
.ui[class*="equal width"].grid > .row > .wide.column,
|
|
.ui.grid > [class*="equal width"].row > .wide.column {
|
|
-webkit-box-flex: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
}
|
|
/*----------------------
|
|
Reverse
|
|
-----------------------*/
|
|
/* Mobile */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui[class*="mobile reversed"].grid,
|
|
.ui[class*="mobile reversed"].grid > .row,
|
|
.ui.grid > [class*="mobile reversed"].row {
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: reverse;
|
|
-ms-flex-direction: row-reverse;
|
|
flex-direction: row-reverse;
|
|
}
|
|
.ui[class*="mobile vertically reversed"].grid,
|
|
.ui.stackable[class*="mobile reversed"] {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: reverse;
|
|
-ms-flex-direction: column-reverse;
|
|
flex-direction: column-reverse;
|
|
}
|
|
/* Divided Reversed */
|
|
.ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"]) > .column:first-child,
|
|
.ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:first-child {
|
|
-webkit-box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"]) > .column:last-child,
|
|
.ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:last-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Vertically Divided Reversed */
|
|
.ui.grid[class*="vertically divided"][class*="mobile vertically reversed"] > .row:first-child:before {
|
|
-webkit-box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.grid[class*="vertically divided"][class*="mobile vertically reversed"] > .row:last-child:before {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Celled Reversed */
|
|
.ui[class*="mobile reversed"].celled.grid > .row > .column:first-child {
|
|
-webkit-box-shadow: -1px 0px 0px 0px #D4D4D5;
|
|
box-shadow: -1px 0px 0px 0px #D4D4D5;
|
|
}
|
|
.ui[class*="mobile reversed"].celled.grid > .row > .column:last-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
/* Tablet */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui[class*="tablet reversed"].grid,
|
|
.ui[class*="tablet reversed"].grid > .row,
|
|
.ui.grid > [class*="tablet reversed"].row {
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: reverse;
|
|
-ms-flex-direction: row-reverse;
|
|
flex-direction: row-reverse;
|
|
}
|
|
.ui[class*="tablet vertically reversed"].grid {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: reverse;
|
|
-ms-flex-direction: column-reverse;
|
|
flex-direction: column-reverse;
|
|
}
|
|
/* Divided Reversed */
|
|
.ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"]) > .column:first-child,
|
|
.ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:first-child {
|
|
-webkit-box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"]) > .column:last-child,
|
|
.ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:last-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Vertically Divided Reversed */
|
|
.ui.grid[class*="vertically divided"][class*="tablet vertically reversed"] > .row:first-child:before {
|
|
-webkit-box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.grid[class*="vertically divided"][class*="tablet vertically reversed"] > .row:last-child:before {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Celled Reversed */
|
|
.ui[class*="tablet reversed"].celled.grid > .row > .column:first-child {
|
|
-webkit-box-shadow: -1px 0px 0px 0px #D4D4D5;
|
|
box-shadow: -1px 0px 0px 0px #D4D4D5;
|
|
}
|
|
.ui[class*="tablet reversed"].celled.grid > .row > .column:last-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
/* Computer */
|
|
@media only screen and (min-width: 992px) {
|
|
.ui[class*="computer reversed"].grid,
|
|
.ui[class*="computer reversed"].grid > .row,
|
|
.ui.grid > [class*="computer reversed"].row {
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: reverse;
|
|
-ms-flex-direction: row-reverse;
|
|
flex-direction: row-reverse;
|
|
}
|
|
.ui[class*="computer vertically reversed"].grid {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: reverse;
|
|
-ms-flex-direction: column-reverse;
|
|
flex-direction: column-reverse;
|
|
}
|
|
/* Divided Reversed */
|
|
.ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"]) > .column:first-child,
|
|
.ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:first-child {
|
|
-webkit-box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"]) > .column:last-child,
|
|
.ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:last-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Vertically Divided Reversed */
|
|
.ui.grid[class*="vertically divided"][class*="computer vertically reversed"] > .row:first-child:before {
|
|
-webkit-box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.grid[class*="vertically divided"][class*="computer vertically reversed"] > .row:last-child:before {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Celled Reversed */
|
|
.ui[class*="computer reversed"].celled.grid > .row > .column:first-child {
|
|
-webkit-box-shadow: -1px 0px 0px 0px #D4D4D5;
|
|
box-shadow: -1px 0px 0px 0px #D4D4D5;
|
|
}
|
|
.ui[class*="computer reversed"].celled.grid > .row > .column:last-child {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
/*-------------------
|
|
Doubling
|
|
--------------------*/
|
|
/* Tablet Only */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui.doubling.grid {
|
|
width: auto;
|
|
}
|
|
.ui.grid > .doubling.row,
|
|
.ui.doubling.grid > .row {
|
|
margin: 0em !important;
|
|
padding: 0em !important;
|
|
}
|
|
.ui.grid > .doubling.row > .column,
|
|
.ui.doubling.grid > .row > .column {
|
|
display: inline-block !important;
|
|
padding-top: 1rem !important;
|
|
padding-bottom: 1rem !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
margin: 0em;
|
|
}
|
|
.ui[class*="two column"].doubling.grid > .row > .column,
|
|
.ui[class*="two column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="two column"].doubling.row.row > .column {
|
|
width: 100% !important;
|
|
}
|
|
.ui[class*="three column"].doubling.grid > .row > .column,
|
|
.ui[class*="three column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="three column"].doubling.row.row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui[class*="four column"].doubling.grid > .row > .column,
|
|
.ui[class*="four column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="four column"].doubling.row.row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui[class*="five column"].doubling.grid > .row > .column,
|
|
.ui[class*="five column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="five column"].doubling.row.row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui[class*="six column"].doubling.grid > .row > .column,
|
|
.ui[class*="six column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="six column"].doubling.row.row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui[class*="seven column"].doubling.grid > .row > .column,
|
|
.ui[class*="seven column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="seven column"].doubling.row.row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui[class*="eight column"].doubling.grid > .row > .column,
|
|
.ui[class*="eight column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="eight column"].doubling.row.row > .column {
|
|
width: 25% !important;
|
|
}
|
|
.ui[class*="nine column"].doubling.grid > .row > .column,
|
|
.ui[class*="nine column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="nine column"].doubling.row.row > .column {
|
|
width: 25% !important;
|
|
}
|
|
.ui[class*="ten column"].doubling.grid > .row > .column,
|
|
.ui[class*="ten column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="ten column"].doubling.row.row > .column {
|
|
width: 20% !important;
|
|
}
|
|
.ui[class*="eleven column"].doubling.grid > .row > .column,
|
|
.ui[class*="eleven column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="eleven column"].doubling.row.row > .column {
|
|
width: 20% !important;
|
|
}
|
|
.ui[class*="twelve column"].doubling.grid > .row > .column,
|
|
.ui[class*="twelve column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="twelve column"].doubling.row.row > .column {
|
|
width: 16.66666667% !important;
|
|
}
|
|
.ui[class*="thirteen column"].doubling.grid > .row > .column,
|
|
.ui[class*="thirteen column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="thirteen column"].doubling.row.row > .column {
|
|
width: 16.66666667% !important;
|
|
}
|
|
.ui[class*="fourteen column"].doubling.grid > .row > .column,
|
|
.ui[class*="fourteen column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="fourteen column"].doubling.row.row > .column {
|
|
width: 14.28571429% !important;
|
|
}
|
|
.ui[class*="fifteen column"].doubling.grid > .row > .column,
|
|
.ui[class*="fifteen column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="fifteen column"].doubling.row.row > .column {
|
|
width: 14.28571429% !important;
|
|
}
|
|
.ui[class*="sixteen column"].doubling.grid > .row > .column,
|
|
.ui[class*="sixteen column"].doubling.grid > .column:not(.row),
|
|
.ui.grid > [class*="sixteen column"].doubling.row.row > .column {
|
|
width: 12.5% !important;
|
|
}
|
|
}
|
|
/* Mobile Only */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.grid > .doubling.row,
|
|
.ui.doubling.grid > .row {
|
|
margin: 0em !important;
|
|
padding: 0em !important;
|
|
}
|
|
.ui.grid > .doubling.row > .column,
|
|
.ui.doubling.grid > .row > .column {
|
|
padding-top: 1rem !important;
|
|
padding-bottom: 1rem !important;
|
|
margin: 0em !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.ui[class*="two column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="two column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="two column"].doubling:not(.stackable).row.row > .column {
|
|
width: 100% !important;
|
|
}
|
|
.ui[class*="three column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="three column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="three column"].doubling:not(.stackable).row.row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui[class*="four column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="four column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="four column"].doubling:not(.stackable).row.row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui[class*="five column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="five column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="five column"].doubling:not(.stackable).row.row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui[class*="six column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="six column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="six column"].doubling:not(.stackable).row.row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui[class*="seven column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="seven column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="seven column"].doubling:not(.stackable).row.row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui[class*="eight column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="eight column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="eight column"].doubling:not(.stackable).row.row > .column {
|
|
width: 50% !important;
|
|
}
|
|
.ui[class*="nine column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="nine column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="nine column"].doubling:not(.stackable).row.row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui[class*="ten column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="ten column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="ten column"].doubling:not(.stackable).row.row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui[class*="eleven column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="eleven column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="eleven column"].doubling:not(.stackable).row.row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui[class*="twelve column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="twelve column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="twelve column"].doubling:not(.stackable).row.row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui[class*="thirteen column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="thirteen column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="thirteen column"].doubling:not(.stackable).row.row > .column {
|
|
width: 33.33333333% !important;
|
|
}
|
|
.ui[class*="fourteen column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="fourteen column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="fourteen column"].doubling:not(.stackable).row.row > .column {
|
|
width: 25% !important;
|
|
}
|
|
.ui[class*="fifteen column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="fifteen column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="fifteen column"].doubling:not(.stackable).row.row > .column {
|
|
width: 25% !important;
|
|
}
|
|
.ui[class*="sixteen column"].doubling:not(.stackable).grid > .row > .column,
|
|
.ui[class*="sixteen column"].doubling:not(.stackable).grid > .column:not(.row),
|
|
.ui.grid > [class*="sixteen column"].doubling:not(.stackable).row.row > .column {
|
|
width: 25% !important;
|
|
}
|
|
}
|
|
/*-------------------
|
|
Stackable
|
|
--------------------*/
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.stackable.grid {
|
|
width: auto;
|
|
margin-left: 0em !important;
|
|
margin-right: 0em !important;
|
|
}
|
|
.ui.stackable.grid > .row > .wide.column,
|
|
.ui.stackable.grid > .wide.column,
|
|
.ui.stackable.grid > .column.grid > .column,
|
|
.ui.stackable.grid > .column.row > .column,
|
|
.ui.stackable.grid > .row > .column,
|
|
.ui.stackable.grid > .column:not(.row),
|
|
.ui.grid > .stackable.stackable.row > .column {
|
|
width: 100% !important;
|
|
margin: 0em 0em !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
padding: 1rem 1rem !important;
|
|
}
|
|
.ui.stackable.grid:not(.vertically) > .row {
|
|
margin: 0em;
|
|
padding: 0em;
|
|
}
|
|
/* Coupling */
|
|
.ui.container > .ui.stackable.grid > .column,
|
|
.ui.container > .ui.stackable.grid > .row > .column {
|
|
padding-left: 0em !important;
|
|
padding-right: 0em !important;
|
|
}
|
|
/* Don't pad inside segment or nested grid */
|
|
.ui.grid .ui.stackable.grid,
|
|
.ui.segment:not(.vertical) .ui.stackable.page.grid {
|
|
margin-left: -1rem !important;
|
|
margin-right: -1rem !important;
|
|
}
|
|
/* Divided Stackable */
|
|
.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:not(.row):first-child,
|
|
.ui.stackable.celled.grid > .column:not(.row):first-child {
|
|
border-top: none !important;
|
|
}
|
|
.ui.inverted.stackable.celled.grid > .column:not(.row),
|
|
.ui.inverted.stackable.divided.grid > .column:not(.row),
|
|
.ui.inverted.stackable.celled.grid > .row > .column,
|
|
.ui.inverted.stackable.divided.grid > .row > .column {
|
|
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
|
}
|
|
.ui.stackable.celled.grid > .column:not(.row),
|
|
.ui.stackable.divided:not(.vertically).grid > .column:not(.row),
|
|
.ui.stackable.celled.grid > .row > .column,
|
|
.ui.stackable.divided:not(.vertically).grid > .row > .column {
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
padding-top: 2rem !important;
|
|
padding-bottom: 2rem !important;
|
|
}
|
|
.ui.stackable.celled.grid > .row {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.ui.stackable.divided:not(.vertically).grid > .column:not(.row),
|
|
.ui.stackable.divided:not(.vertically).grid > .row > .column {
|
|
padding-left: 0em !important;
|
|
padding-right: 0em !important;
|
|
}
|
|
}
|
|
/*----------------------
|
|
Only (Device)
|
|
-----------------------*/
|
|
/* These include arbitrary class repetitions for forced specificity */
|
|
/* Mobile Only Hide */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui[class*="tablet only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="tablet only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="tablet only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="computer only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="computer only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="computer only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="computer only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="large screen only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="large screen only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="large screen only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="large screen only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="widescreen only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="widescreen only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="widescreen only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="widescreen only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* Tablet Only Hide */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui[class*="mobile only"].grid.grid.grid:not(.tablet),
|
|
.ui.grid.grid.grid > [class*="mobile only"].row:not(.tablet),
|
|
.ui.grid.grid.grid > [class*="mobile only"].column:not(.tablet),
|
|
.ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.tablet) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="computer only"].grid.grid.grid:not(.tablet),
|
|
.ui.grid.grid.grid > [class*="computer only"].row:not(.tablet),
|
|
.ui.grid.grid.grid > [class*="computer only"].column:not(.tablet),
|
|
.ui.grid.grid.grid > .row > [class*="computer only"].column:not(.tablet) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="large screen only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="large screen only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="large screen only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="large screen only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="widescreen only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="widescreen only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="widescreen only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="widescreen only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* Computer Only Hide */
|
|
@media only screen and (min-width: 992px) and (max-width: 1199px) {
|
|
.ui[class*="mobile only"].grid.grid.grid:not(.computer),
|
|
.ui.grid.grid.grid > [class*="mobile only"].row:not(.computer),
|
|
.ui.grid.grid.grid > [class*="mobile only"].column:not(.computer),
|
|
.ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.computer) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="tablet only"].grid.grid.grid:not(.computer),
|
|
.ui.grid.grid.grid > [class*="tablet only"].row:not(.computer),
|
|
.ui.grid.grid.grid > [class*="tablet only"].column:not(.computer),
|
|
.ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.computer) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="large screen only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="large screen only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="large screen only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="large screen only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="widescreen only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="widescreen only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="widescreen only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="widescreen only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* Large Screen Only Hide */
|
|
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
|
|
.ui[class*="mobile only"].grid.grid.grid:not(.computer),
|
|
.ui.grid.grid.grid > [class*="mobile only"].row:not(.computer),
|
|
.ui.grid.grid.grid > [class*="mobile only"].column:not(.computer),
|
|
.ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.computer) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="tablet only"].grid.grid.grid:not(.computer),
|
|
.ui.grid.grid.grid > [class*="tablet only"].row:not(.computer),
|
|
.ui.grid.grid.grid > [class*="tablet only"].column:not(.computer),
|
|
.ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.computer) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="widescreen only"].grid.grid.grid:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="widescreen only"].row:not(.mobile),
|
|
.ui.grid.grid.grid > [class*="widescreen only"].column:not(.mobile),
|
|
.ui.grid.grid.grid > .row > [class*="widescreen only"].column:not(.mobile) {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* Widescreen Only Hide */
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui[class*="mobile only"].grid.grid.grid:not(.computer),
|
|
.ui.grid.grid.grid > [class*="mobile only"].row:not(.computer),
|
|
.ui.grid.grid.grid > [class*="mobile only"].column:not(.computer),
|
|
.ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.computer) {
|
|
display: none !important;
|
|
}
|
|
.ui[class*="tablet only"].grid.grid.grid:not(.computer),
|
|
.ui.grid.grid.grid > [class*="tablet only"].row:not(.computer),
|
|
.ui.grid.grid.grid > [class*="tablet only"].column:not(.computer),
|
|
.ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.computer) {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*
|
|
* # Semantic - Menu
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Copyright 2015 Contributor
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Menu
|
|
*******************************/
|
|
/*-------------------
|
|
Collection
|
|
--------------------*/
|
|
/* Menu */
|
|
/* Menu Item */
|
|
/* Divider */
|
|
/* Sub Menu */
|
|
/* Text Item */
|
|
/*--------------
|
|
Elements
|
|
---------------*/
|
|
/* Icon */
|
|
/* Dropdown Icon */
|
|
/* Header */
|
|
/* Vertical Icon */
|
|
/* Vertical Header */
|
|
/* Pointing Arrow */
|
|
/*--------------
|
|
Couplings
|
|
---------------*/
|
|
/* Button */
|
|
/* Input */
|
|
/* Image */
|
|
/* Label */
|
|
/* Dropdown in Menu */
|
|
/* Dropdown Variations */
|
|
/*--------------
|
|
States
|
|
---------------*/
|
|
/* Hovered Item */
|
|
/* Pressed Item */
|
|
/* Active Item */
|
|
/* Active Hovered Item */
|
|
/* Selected Dropdown */
|
|
/* Active Dropdown */
|
|
/* Active Sub Menu */
|
|
/*--------------
|
|
Types
|
|
---------------*/
|
|
/* Vertical */
|
|
/* Secondary */
|
|
/* Pointing */
|
|
/* Inverted Secondary */
|
|
/* Inverted Pointing */
|
|
/* Tiered */
|
|
/* Icon */
|
|
/* Tabular */
|
|
/* Pagination */
|
|
/* Labeled Icon */
|
|
/* Text */
|
|
/*--------------
|
|
Variations
|
|
---------------*/
|
|
/* Inverted */
|
|
/* Inverted Sub Menu */
|
|
/* Inverted Hover */
|
|
/* Pressed */
|
|
/* Inverted Active */
|
|
/* Inverted Active Hover */
|
|
/* Inverted Menu Divider */
|
|
/* Inverted Colored */
|
|
/* Fixed */
|
|
/* Floated */
|
|
/* Attached */
|
|
/* Resize large sizes */
|
|
/* Sizes */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* PXT Variables */
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Standard
|
|
*******************************/
|
|
/*--------------
|
|
Menu
|
|
---------------*/
|
|
.ui.menu {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
margin: 1rem 0em;
|
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
background: #FFFFFF;
|
|
font-weight: normal;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
border-radius: 0.28571429rem;
|
|
min-height: 2.85714286em;
|
|
}
|
|
.ui.menu:after {
|
|
content: '';
|
|
display: block;
|
|
height: 0px;
|
|
clear: both;
|
|
visibility: hidden;
|
|
}
|
|
.ui.menu:first-child {
|
|
margin-top: 0rem;
|
|
}
|
|
.ui.menu:last-child {
|
|
margin-bottom: 0rem;
|
|
}
|
|
/*--------------
|
|
Sub-Menu
|
|
---------------*/
|
|
.ui.menu .menu {
|
|
margin: 0em;
|
|
}
|
|
.ui.menu:not(.vertical) > .menu {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
/*--------------
|
|
Item
|
|
---------------*/
|
|
.ui.menu:not(.vertical) .item {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.ui.menu .item {
|
|
position: relative;
|
|
vertical-align: middle;
|
|
line-height: 1;
|
|
text-decoration: none;
|
|
-webkit-tap-highlight-color: transparent;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 0 auto;
|
|
flex: 0 0 auto;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
background: none;
|
|
padding: 0.92857143em 1.14285714em;
|
|
text-transform: none;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
font-weight: normal;
|
|
-webkit-transition: background 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: background 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease;
|
|
transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
}
|
|
.ui.menu > .item:first-child {
|
|
border-radius: 0.28571429rem 0px 0px 0.28571429rem;
|
|
}
|
|
/* Border */
|
|
.ui.menu .item:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 0%;
|
|
right: 0px;
|
|
height: 100%;
|
|
width: 1px;
|
|
background: rgba(34, 36, 38, 0.1);
|
|
}
|
|
/*--------------
|
|
Text Content
|
|
---------------*/
|
|
.ui.menu .text.item > *,
|
|
.ui.menu .item > a:not(.ui),
|
|
.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;
|
|
}
|
|
.ui.menu .item > p:first-child {
|
|
margin-top: 0;
|
|
}
|
|
.ui.menu .item > p:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
/*--------------
|
|
Icons
|
|
---------------*/
|
|
.ui.menu .item > i.icon {
|
|
opacity: 0.9;
|
|
float: none;
|
|
margin: 0em 0.35714286em 0em 0em;
|
|
}
|
|
/*--------------
|
|
Button
|
|
---------------*/
|
|
.ui.menu:not(.vertical) .item > .button {
|
|
position: relative;
|
|
top: 0em;
|
|
margin: -0.5em 0em;
|
|
padding-bottom: 0.78571429em;
|
|
padding-top: 0.78571429em;
|
|
font-size: 1em;
|
|
}
|
|
/*----------------
|
|
Grid / Container
|
|
-----------------*/
|
|
.ui.menu > .grid,
|
|
.ui.menu > .container {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-align: inherit;
|
|
-ms-flex-align: inherit;
|
|
align-items: inherit;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: inherit;
|
|
flex-direction: inherit;
|
|
}
|
|
/*--------------
|
|
Inputs
|
|
---------------*/
|
|
.ui.menu .item > .input {
|
|
width: 100%;
|
|
}
|
|
.ui.menu:not(.vertical) .item > .input {
|
|
position: relative;
|
|
top: 0em;
|
|
margin: -0.5em 0em;
|
|
}
|
|
.ui.menu .item > .input input {
|
|
font-size: 1em;
|
|
padding-top: 0.57142857em;
|
|
padding-bottom: 0.57142857em;
|
|
}
|
|
/*--------------
|
|
Header
|
|
---------------*/
|
|
.ui.menu .header.item,
|
|
.ui.vertical.menu .header.item {
|
|
margin: 0em;
|
|
background: '';
|
|
text-transform: normal;
|
|
font-weight: bold;
|
|
}
|
|
.ui.vertical.menu .item > .header:not(.ui) {
|
|
margin: 0em 0em 0.5em;
|
|
font-size: 1em;
|
|
font-weight: bold;
|
|
}
|
|
/*--------------
|
|
Dropdowns
|
|
---------------*/
|
|
/* Dropdown Icon */
|
|
.ui.menu .item > i.dropdown.icon {
|
|
padding: 0em;
|
|
float: right;
|
|
margin: 0em 0em 0em 1em;
|
|
}
|
|
/* Menu */
|
|
.ui.menu .dropdown.item .menu {
|
|
left: 0px;
|
|
min-width: calc(100% - 1px);
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
background: #FFFFFF;
|
|
margin: 0em 0px 0px;
|
|
-webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
|
|
box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
|
|
-webkit-box-orient: vertical !important;
|
|
-webkit-box-direction: normal !important;
|
|
-ms-flex-direction: column !important;
|
|
flex-direction: column !important;
|
|
}
|
|
/* Menu Items */
|
|
.ui.menu .ui.dropdown .menu > .item {
|
|
margin: 0;
|
|
text-align: left;
|
|
font-size: 1em !important;
|
|
padding: 0.78571429em 1.14285714em !important;
|
|
background: transparent !important;
|
|
color: rgba(0, 0, 0, 0.87) !important;
|
|
text-transform: none !important;
|
|
font-weight: normal !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
-webkit-transition: none !important;
|
|
transition: none !important;
|
|
}
|
|
.ui.menu .ui.dropdown .menu > .item:hover {
|
|
background: rgba(0, 0, 0, 0.05) !important;
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
.ui.menu .ui.dropdown .menu > .selected.item {
|
|
background: rgba(0, 0, 0, 0.05) !important;
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
.ui.menu .ui.dropdown .menu > .active.item {
|
|
background: rgba(0, 0, 0, 0.03) !important;
|
|
font-weight: bold !important;
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
.ui.menu .ui.dropdown.item .menu .item:not(.filtered) {
|
|
display: block;
|
|
}
|
|
.ui.menu .ui.dropdown .menu > .item .icon:not(.dropdown) {
|
|
display: inline-block;
|
|
font-size: 1em !important;
|
|
float: none;
|
|
margin: 0em 0.75em 0em 0em;
|
|
}
|
|
/* Secondary */
|
|
.ui.secondary.menu .dropdown.item > .menu,
|
|
.ui.text.menu .dropdown.item > .menu {
|
|
border-radius: 0.28571429rem;
|
|
margin-top: 0.35714286em;
|
|
}
|
|
/* Pointing */
|
|
.ui.menu .pointing.dropdown.item .menu {
|
|
margin-top: 0.75em;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.menu .search.dropdown.item > .search,
|
|
.ui.inverted.menu .search.dropdown.item > .text {
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
/* Vertical */
|
|
.ui.vertical.menu .dropdown.item > .icon {
|
|
float: right;
|
|
content: "\f0da";
|
|
margin-left: 1em;
|
|
}
|
|
.ui.vertical.menu .dropdown.item .menu {
|
|
left: 100%;
|
|
min-width: 0;
|
|
margin: 0em 0em 0em 0em;
|
|
-webkit-box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.08);
|
|
box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.08);
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0.28571429rem;
|
|
}
|
|
.ui.vertical.menu .dropdown.item.upward .menu {
|
|
bottom: 0;
|
|
}
|
|
.ui.vertical.menu .dropdown.item:not(.upward) .menu {
|
|
top: 0;
|
|
}
|
|
.ui.vertical.menu .active.dropdown.item {
|
|
border-top-right-radius: 0em;
|
|
border-bottom-right-radius: 0em;
|
|
}
|
|
.ui.vertical.menu .dropdown.active.item {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Evenly Divided */
|
|
.ui.item.menu .dropdown .menu .item {
|
|
width: 100%;
|
|
}
|
|
/*--------------
|
|
Labels
|
|
---------------*/
|
|
.ui.menu .item > .label {
|
|
background: #999999;
|
|
color: #FFFFFF;
|
|
margin-left: 1em;
|
|
padding: 0.3em 0.78571429em;
|
|
}
|
|
.ui.vertical.menu .item > .label {
|
|
background: #999999;
|
|
color: #FFFFFF;
|
|
margin-top: -0.15em;
|
|
margin-bottom: -0.15em;
|
|
padding: 0.3em 0.78571429em;
|
|
}
|
|
.ui.menu .item > .floating.label {
|
|
padding: 0.3em 0.78571429em;
|
|
}
|
|
/*--------------
|
|
Images
|
|
---------------*/
|
|
.ui.menu .item > img:not(.ui) {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
margin: -0.3em 0em;
|
|
width: 2.5em;
|
|
}
|
|
.ui.vertical.menu .item > img:not(.ui):only-child {
|
|
display: block;
|
|
max-width: 100%;
|
|
width: auto;
|
|
}
|
|
/*******************************
|
|
Coupling
|
|
*******************************/
|
|
/*--------------
|
|
Sidebar
|
|
---------------*/
|
|
/* Show vertical dividers below last */
|
|
.ui.vertical.sidebar.menu > .item:first-child:before {
|
|
display: block !important;
|
|
}
|
|
.ui.vertical.sidebar.menu > .item::before {
|
|
top: auto;
|
|
bottom: 0px;
|
|
}
|
|
/*--------------
|
|
Container
|
|
---------------*/
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.menu > .ui.container {
|
|
width: 100% !important;
|
|
margin-left: 0em !important;
|
|
margin-right: 0em !important;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 768px) {
|
|
.ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .item:not(.right):not(.borderless):first-child {
|
|
border-left: 1px solid rgba(34, 36, 38, 0.1);
|
|
}
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Hover
|
|
---------------*/
|
|
.ui.link.menu .item:hover,
|
|
.ui.menu .dropdown.item:hover,
|
|
.ui.menu .link.item:hover,
|
|
.ui.menu a.item:hover {
|
|
cursor: pointer;
|
|
background: rgba(0, 0, 0, 0.03);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Pressed
|
|
---------------*/
|
|
.ui.link.menu .item:active,
|
|
.ui.menu .link.item:active,
|
|
.ui.menu a.item:active {
|
|
background: rgba(0, 0, 0, 0.03);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Active
|
|
---------------*/
|
|
.ui.menu .active.item {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
font-weight: normal;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.menu .active.item > i.icon {
|
|
opacity: 1;
|
|
}
|
|
/*--------------
|
|
Active Hover
|
|
---------------*/
|
|
.ui.menu .active.item:hover,
|
|
.ui.vertical.menu .active.item:hover {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Disabled
|
|
---------------*/
|
|
.ui.menu .item.disabled,
|
|
.ui.menu .item.disabled:hover {
|
|
cursor: default;
|
|
background-color: transparent !important;
|
|
color: rgba(40, 40, 40, 0.3);
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*------------------
|
|
Floated Menu / Item
|
|
-------------------*/
|
|
/* Left Floated */
|
|
.ui.menu:not(.vertical) .left.item,
|
|
.ui.menu:not(.vertical) .left.menu {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
margin-right: auto !important;
|
|
}
|
|
/* Right Floated */
|
|
.ui.menu:not(.vertical) .right.item,
|
|
.ui.menu:not(.vertical) .right.menu {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
margin-left: auto !important;
|
|
}
|
|
/* Swapped Borders */
|
|
.ui.menu .right.item::before,
|
|
.ui.menu .right.menu > .item::before {
|
|
right: auto;
|
|
left: 0;
|
|
}
|
|
/*--------------
|
|
Vertical
|
|
---------------*/
|
|
.ui.vertical.menu {
|
|
display: block;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
}
|
|
/*--- Item ---*/
|
|
.ui.vertical.menu .item {
|
|
display: block;
|
|
background: none;
|
|
border-top: none;
|
|
border-right: none;
|
|
}
|
|
.ui.vertical.menu > .item:first-child {
|
|
border-radius: 0.28571429rem 0.28571429rem 0px 0px;
|
|
}
|
|
.ui.vertical.menu > .item:last-child {
|
|
border-radius: 0px 0px 0.28571429rem 0.28571429rem;
|
|
}
|
|
/*--- Label ---*/
|
|
.ui.vertical.menu .item > .label {
|
|
float: right;
|
|
text-align: center;
|
|
}
|
|
/*--- Icon ---*/
|
|
.ui.vertical.menu .item > i.icon {
|
|
width: 1.18em;
|
|
float: right;
|
|
margin: 0em 0em 0em 0.5em;
|
|
}
|
|
.ui.vertical.menu .item > .label + i.icon {
|
|
float: none;
|
|
margin: 0em 0.5em 0em 0em;
|
|
}
|
|
/*--- Border ---*/
|
|
.ui.vertical.menu .item:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 0%;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 1px;
|
|
background: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.vertical.menu .item:first-child:before {
|
|
display: none !important;
|
|
}
|
|
/*--- Sub Menu ---*/
|
|
.ui.vertical.menu .item > .menu {
|
|
margin: 0.5em -1.14285714em 0em;
|
|
}
|
|
.ui.vertical.menu .menu .item {
|
|
background: none;
|
|
padding: 0.5em 1.33333333em;
|
|
font-size: 0.85714286em;
|
|
color: rgba(0, 0, 0, 0.5);
|
|
}
|
|
.ui.vertical.menu .item .menu a.item:hover,
|
|
.ui.vertical.menu .item .menu .link.item:hover {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
.ui.vertical.menu .menu .item:before {
|
|
display: none;
|
|
}
|
|
/* Vertical Active */
|
|
.ui.vertical.menu .active.item {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
border-radius: 0em;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.vertical.menu > .active.item:first-child {
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.vertical.menu > .active.item:last-child {
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
.ui.vertical.menu > .active.item:only-child {
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
.ui.vertical.menu .active.item .menu .active.item {
|
|
border-left: none;
|
|
}
|
|
.ui.vertical.menu .item .menu .active.item {
|
|
background-color: transparent;
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Tabular
|
|
---------------*/
|
|
.ui.tabular.menu {
|
|
border-radius: 0em;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
border: none;
|
|
background: none transparent;
|
|
border-bottom: 1px solid #D4D4D5;
|
|
}
|
|
.ui.tabular.fluid.menu {
|
|
width: calc(100% + 2px ) !important;
|
|
}
|
|
.ui.tabular.menu .item {
|
|
background: transparent;
|
|
border-bottom: none;
|
|
border-left: 1px solid transparent;
|
|
border-right: 1px solid transparent;
|
|
border-top: 2px solid transparent;
|
|
padding: 0.92857143em 1.42857143em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.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 {
|
|
background: none #FFFFFF;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
border-top-width: 1px;
|
|
border-color: #D4D4D5;
|
|
font-weight: bold;
|
|
margin-bottom: -1px;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-radius: 0.28571429rem 0.28571429rem 0px 0px !important;
|
|
}
|
|
/* Coupling with segment for attachment */
|
|
.ui.tabular.menu + .attached:not(.top).segment,
|
|
.ui.tabular.menu + .attached:not(.top).segment + .attached:not(.top).segment {
|
|
border-top: none;
|
|
margin-left: 0px;
|
|
margin-top: 0px;
|
|
margin-right: 0px;
|
|
width: 100%;
|
|
}
|
|
.top.attached.segment + .ui.bottom.tabular.menu {
|
|
position: relative;
|
|
width: calc(100% + 2px );
|
|
left: -1px;
|
|
}
|
|
/* Bottom Vertical Tabular */
|
|
.ui.bottom.tabular.menu {
|
|
background: none transparent;
|
|
border-radius: 0em;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
border-bottom: none;
|
|
border-top: 1px solid #D4D4D5;
|
|
}
|
|
.ui.bottom.tabular.menu .item {
|
|
background: none;
|
|
border-left: 1px solid transparent;
|
|
border-right: 1px solid transparent;
|
|
border-bottom: 1px solid transparent;
|
|
border-top: none;
|
|
}
|
|
.ui.bottom.tabular.menu .active.item {
|
|
background: none #FFFFFF;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
border-color: #D4D4D5;
|
|
margin: -1px 0px 0px 0px;
|
|
border-radius: 0px 0px 0.28571429rem 0.28571429rem !important;
|
|
}
|
|
/* Vertical Tabular (Left) */
|
|
.ui.vertical.tabular.menu {
|
|
background: none transparent;
|
|
border-radius: 0em;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
border-bottom: none;
|
|
border-right: 1px solid #D4D4D5;
|
|
}
|
|
.ui.vertical.tabular.menu .item {
|
|
background: none;
|
|
border-left: 1px solid transparent;
|
|
border-bottom: 1px solid transparent;
|
|
border-top: 1px solid transparent;
|
|
border-right: none;
|
|
}
|
|
.ui.vertical.tabular.menu .active.item {
|
|
background: none #FFFFFF;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
border-color: #D4D4D5;
|
|
margin: 0px -1px 0px 0px;
|
|
border-radius: 0.28571429rem 0px 0px 0.28571429rem !important;
|
|
}
|
|
/* Vertical Right Tabular */
|
|
.ui.vertical.right.tabular.menu {
|
|
background: none transparent;
|
|
border-radius: 0em;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
border-bottom: none;
|
|
border-right: none;
|
|
border-left: 1px solid #D4D4D5;
|
|
}
|
|
.ui.vertical.right.tabular.menu .item {
|
|
background: none;
|
|
border-right: 1px solid transparent;
|
|
border-bottom: 1px solid transparent;
|
|
border-top: 1px solid transparent;
|
|
border-left: none;
|
|
}
|
|
.ui.vertical.right.tabular.menu .active.item {
|
|
background: none #FFFFFF;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
border-color: #D4D4D5;
|
|
margin: 0px 0px 0px -1px;
|
|
border-radius: 0px 0.28571429rem 0.28571429rem 0px !important;
|
|
}
|
|
/* Dropdown */
|
|
.ui.tabular.menu .active.dropdown.item {
|
|
margin-bottom: 0px;
|
|
border-left: 1px solid transparent;
|
|
border-right: 1px solid transparent;
|
|
border-top: 2px solid transparent;
|
|
border-bottom: none;
|
|
}
|
|
/*--------------
|
|
Pagination
|
|
---------------*/
|
|
.ui.pagination.menu {
|
|
margin: 0em;
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
vertical-align: middle;
|
|
}
|
|
.ui.pagination.menu .item:last-child {
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
}
|
|
.ui.compact.menu .item:last-child {
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
}
|
|
.ui.pagination.menu .item:last-child:before {
|
|
display: none;
|
|
}
|
|
.ui.pagination.menu .item {
|
|
min-width: 3em;
|
|
text-align: center;
|
|
}
|
|
.ui.pagination.menu .icon.item i.icon {
|
|
vertical-align: top;
|
|
}
|
|
/* Active */
|
|
.ui.pagination.menu .active.item {
|
|
border-top: none;
|
|
padding-top: 0.92857143em;
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/*--------------
|
|
Secondary
|
|
---------------*/
|
|
.ui.secondary.menu {
|
|
background: none;
|
|
margin-left: -0.35714286em;
|
|
margin-right: -0.35714286em;
|
|
border-radius: 0em;
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Item */
|
|
.ui.secondary.menu .item {
|
|
-ms-flex-item-align: center;
|
|
align-self: center;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: none;
|
|
padding: 0.78571429em 0.92857143em;
|
|
margin: 0em 0.35714286em;
|
|
background: none;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/* No Divider */
|
|
.ui.secondary.menu .item:before {
|
|
display: none !important;
|
|
}
|
|
/* Header */
|
|
.ui.secondary.menu .header.item {
|
|
border-radius: 0em;
|
|
border-right: none;
|
|
background: none transparent;
|
|
}
|
|
/* Image */
|
|
.ui.secondary.menu .item > img:not(.ui) {
|
|
margin: 0em;
|
|
}
|
|
/* Hover */
|
|
.ui.secondary.menu .dropdown.item:hover,
|
|
.ui.secondary.menu .link.item:hover,
|
|
.ui.secondary.menu a.item:hover {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Active */
|
|
.ui.secondary.menu .active.item {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/* Active Hover */
|
|
.ui.secondary.menu .active.item:hover {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Inverted */
|
|
.ui.secondary.inverted.menu .link.item,
|
|
.ui.secondary.inverted.menu a.item {
|
|
color: rgba(255, 255, 255, 0.7) !important;
|
|
}
|
|
.ui.secondary.inverted.menu .dropdown.item:hover,
|
|
.ui.secondary.inverted.menu .link.item:hover,
|
|
.ui.secondary.inverted.menu a.item:hover {
|
|
background: rgba(255, 255, 255, 0.08);
|
|
color: #ffffff !important;
|
|
}
|
|
.ui.secondary.inverted.menu .active.item {
|
|
background: rgba(255, 255, 255, 0.15);
|
|
color: #ffffff !important;
|
|
}
|
|
/* Fix item margins */
|
|
.ui.secondary.item.menu {
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
}
|
|
.ui.secondary.item.menu .item:last-child {
|
|
margin-right: 0em;
|
|
}
|
|
.ui.secondary.attached.menu {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Sub Menu */
|
|
.ui.vertical.secondary.menu .item:not(.dropdown) > .menu {
|
|
margin: 0em -0.92857143em;
|
|
}
|
|
.ui.vertical.secondary.menu .item:not(.dropdown) > .menu > .item {
|
|
margin: 0em;
|
|
padding: 0.5em 1.33333333em;
|
|
}
|
|
/*---------------------
|
|
Secondary Vertical
|
|
-----------------------*/
|
|
.ui.secondary.vertical.menu > .item {
|
|
border: none;
|
|
margin: 0em 0em 0.35714286em;
|
|
border-radius: 0.28571429rem !important;
|
|
}
|
|
.ui.secondary.vertical.menu > .header.item {
|
|
border-radius: 0em;
|
|
}
|
|
/* Sub Menu */
|
|
.ui.vertical.secondary.menu .item > .menu .item {
|
|
background-color: transparent;
|
|
}
|
|
/* Inverted */
|
|
.ui.secondary.inverted.menu {
|
|
background-color: transparent;
|
|
}
|
|
/*---------------------
|
|
Secondary Pointing
|
|
-----------------------*/
|
|
.ui.secondary.pointing.menu {
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
border-bottom: 2px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.secondary.pointing.menu .item {
|
|
border-bottom-color: transparent;
|
|
border-bottom-style: solid;
|
|
border-radius: 0em;
|
|
-ms-flex-item-align: end;
|
|
align-self: flex-end;
|
|
margin: 0em 0em -2px;
|
|
padding: 0.85714286em 1.14285714em;
|
|
border-bottom-width: 2px;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
/* Item Types */
|
|
.ui.secondary.pointing.menu .header.item {
|
|
color: rgba(0, 0, 0, 0.85) !important;
|
|
}
|
|
.ui.secondary.pointing.menu .text.item {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.ui.secondary.pointing.menu .item:after {
|
|
display: none;
|
|
}
|
|
/* Hover */
|
|
.ui.secondary.pointing.menu .dropdown.item:hover,
|
|
.ui.secondary.pointing.menu .link.item:hover,
|
|
.ui.secondary.pointing.menu a.item:hover {
|
|
background-color: transparent;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/* Pressed */
|
|
.ui.secondary.pointing.menu .dropdown.item:active,
|
|
.ui.secondary.pointing.menu .link.item:active,
|
|
.ui.secondary.pointing.menu a.item:active {
|
|
background-color: transparent;
|
|
border-color: rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Active */
|
|
.ui.secondary.pointing.menu .active.item {
|
|
background-color: transparent;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-color: #1B1C1D;
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Active Hover */
|
|
.ui.secondary.pointing.menu .active.item:hover {
|
|
border-color: #1B1C1D;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Active Dropdown */
|
|
.ui.secondary.pointing.menu .active.dropdown.item {
|
|
border-color: transparent;
|
|
}
|
|
/* Vertical Pointing */
|
|
.ui.secondary.vertical.pointing.menu {
|
|
border-bottom-width: 0px;
|
|
border-right-width: 2px;
|
|
border-right-style: solid;
|
|
border-right-color: rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.secondary.vertical.pointing.menu .item {
|
|
border-bottom: none;
|
|
border-right-style: solid;
|
|
border-right-color: transparent;
|
|
border-radius: 0em !important;
|
|
margin: 0em -2px 0em 0em;
|
|
border-right-width: 2px;
|
|
}
|
|
/* Vertical Active */
|
|
.ui.secondary.vertical.pointing.menu .active.item {
|
|
border-color: #1B1C1D;
|
|
}
|
|
/* Inverted */
|
|
.ui.secondary.inverted.pointing.menu {
|
|
border-color: rgba(255, 255, 255, 0.1);
|
|
}
|
|
.ui.secondary.inverted.pointing.menu {
|
|
border-width: 2px;
|
|
border-color: rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.secondary.inverted.pointing.menu .item {
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
.ui.secondary.inverted.pointing.menu .header.item {
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Hover */
|
|
.ui.secondary.inverted.pointing.menu .link.item:hover,
|
|
.ui.secondary.inverted.pointing.menu a.item:hover {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Active */
|
|
.ui.secondary.inverted.pointing.menu .active.item {
|
|
border-color: #FFFFFF;
|
|
color: #ffffff;
|
|
}
|
|
/*--------------
|
|
Text Menu
|
|
---------------*/
|
|
.ui.text.menu {
|
|
background: none transparent;
|
|
border-radius: 0px;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: none;
|
|
margin: 1em -0.5em;
|
|
}
|
|
.ui.text.menu .item {
|
|
border-radius: 0px;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
-ms-flex-item-align: center;
|
|
align-self: center;
|
|
margin: 0em 0em;
|
|
padding: 0.35714286em 0.5em;
|
|
font-weight: normal;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
-webkit-transition: opacity 0.1s ease;
|
|
transition: opacity 0.1s ease;
|
|
}
|
|
/* Border */
|
|
.ui.text.menu .item:before,
|
|
.ui.text.menu .menu .item:before {
|
|
display: none !important;
|
|
}
|
|
/* Header */
|
|
.ui.text.menu .header.item {
|
|
background-color: transparent;
|
|
opacity: 1;
|
|
color: rgba(0, 0, 0, 0.85);
|
|
font-size: 0.92857143em;
|
|
text-transform: uppercase;
|
|
font-weight: bold;
|
|
}
|
|
/* Image */
|
|
.ui.text.menu .item > img:not(.ui) {
|
|
margin: 0em;
|
|
}
|
|
/*--- fluid text ---*/
|
|
.ui.text.item.menu .item {
|
|
margin: 0em;
|
|
}
|
|
/*--- vertical text ---*/
|
|
.ui.vertical.text.menu {
|
|
margin: 1em 0em;
|
|
}
|
|
.ui.vertical.text.menu:first-child {
|
|
margin-top: 0rem;
|
|
}
|
|
.ui.vertical.text.menu:last-child {
|
|
margin-bottom: 0rem;
|
|
}
|
|
.ui.vertical.text.menu .item {
|
|
margin: 0.57142857em 0em;
|
|
padding-left: 0em;
|
|
padding-right: 0em;
|
|
}
|
|
.ui.vertical.text.menu .item > i.icon {
|
|
float: none;
|
|
margin: 0em 0.35714286em 0em 0em;
|
|
}
|
|
.ui.vertical.text.menu .header.item {
|
|
margin: 0.57142857em 0em 0.71428571em;
|
|
}
|
|
/* Vertical Sub Menu */
|
|
.ui.vertical.text.menu .item:not(.dropdown) > .menu {
|
|
margin: 0em;
|
|
}
|
|
.ui.vertical.text.menu .item:not(.dropdown) > .menu > .item {
|
|
margin: 0em;
|
|
padding: 0.5em 0em;
|
|
}
|
|
/*--- hover ---*/
|
|
.ui.text.menu .item:hover {
|
|
opacity: 1;
|
|
background-color: transparent;
|
|
}
|
|
/*--- active ---*/
|
|
.ui.text.menu .active.item {
|
|
background-color: transparent;
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
font-weight: normal;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--- active hover ---*/
|
|
.ui.text.menu .active.item:hover {
|
|
background-color: transparent;
|
|
}
|
|
/* Disable Bariations */
|
|
.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;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.text.menu,
|
|
.ui.inverted.text.menu .item,
|
|
.ui.inverted.text.menu .item:hover,
|
|
.ui.inverted.text.menu .active.item {
|
|
background-color: transparent !important;
|
|
}
|
|
/* Fluid */
|
|
.ui.fluid.text.menu {
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
}
|
|
/*--------------
|
|
Icon Only
|
|
---------------*/
|
|
/* Vertical Menu */
|
|
.ui.vertical.icon.menu {
|
|
display: inline-block;
|
|
width: auto;
|
|
}
|
|
/* Item */
|
|
.ui.icon.menu .item {
|
|
height: auto;
|
|
text-align: center;
|
|
color: #1B1C1D;
|
|
}
|
|
/* Icon */
|
|
.ui.icon.menu .item > .icon:not(.dropdown) {
|
|
margin: 0;
|
|
opacity: 1;
|
|
}
|
|
/* Icon Gylph */
|
|
.ui.icon.menu .icon:before {
|
|
opacity: 1;
|
|
}
|
|
/* (x) Item Icon */
|
|
.ui.menu .icon.item > .icon {
|
|
width: auto;
|
|
margin: 0em auto;
|
|
}
|
|
/* Vertical Icon */
|
|
.ui.vertical.icon.menu .item > .icon:not(.dropdown) {
|
|
display: block;
|
|
opacity: 1;
|
|
margin: 0em auto;
|
|
float: none;
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.icon.menu .item {
|
|
color: #FFFFFF;
|
|
}
|
|
/*--------------
|
|
Labeled Icon
|
|
---------------*/
|
|
/* Menu */
|
|
.ui.labeled.icon.menu {
|
|
text-align: center;
|
|
}
|
|
/* Item */
|
|
.ui.labeled.icon.menu .item {
|
|
min-width: 6em;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
/* Icon */
|
|
.ui.labeled.icon.menu .item > .icon:not(.dropdown) {
|
|
height: 1em;
|
|
display: block;
|
|
font-size: 1.71428571em !important;
|
|
margin: 0em auto 0.5rem !important;
|
|
}
|
|
/* Fluid */
|
|
.ui.fluid.labeled.icon.menu > .item {
|
|
min-width: 0em;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Stackable
|
|
---------------*/
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.stackable.menu {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
.ui.stackable.menu .item {
|
|
width: 100% !important;
|
|
}
|
|
.ui.stackable.menu .item:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: auto;
|
|
bottom: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 1px;
|
|
background: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.stackable.menu .left.menu,
|
|
.ui.stackable.menu .left.item {
|
|
margin-right: 0 !important;
|
|
}
|
|
.ui.stackable.menu .right.menu,
|
|
.ui.stackable.menu .right.item {
|
|
margin-left: 0 !important;
|
|
}
|
|
}
|
|
/*--------------
|
|
Colors
|
|
---------------*/
|
|
/*--- Standard Colors ---*/
|
|
.ui.menu .red.active.item,
|
|
.ui.red.menu .active.item {
|
|
border-color: #EF767A !important;
|
|
color: #EF767A !important;
|
|
}
|
|
.ui.menu .orange.active.item,
|
|
.ui.orange.menu .active.item {
|
|
border-color: #ff8b27 !important;
|
|
color: #ff8b27 !important;
|
|
}
|
|
.ui.menu .yellow.active.item,
|
|
.ui.yellow.menu .active.item {
|
|
border-color: #FDE74C !important;
|
|
color: #FDE74C !important;
|
|
}
|
|
.ui.menu .olive.active.item,
|
|
.ui.olive.menu .active.item {
|
|
border-color: #B5CC18 !important;
|
|
color: #B5CC18 !important;
|
|
}
|
|
.ui.menu .green.active.item,
|
|
.ui.green.menu .active.item {
|
|
border-color: #00ED00 !important;
|
|
color: #00ED00 !important;
|
|
}
|
|
.ui.menu .teal.active.item,
|
|
.ui.teal.menu .active.item {
|
|
border-color: #3891A6 !important;
|
|
color: #3891A6 !important;
|
|
}
|
|
.ui.menu .blue.active.item,
|
|
.ui.blue.menu .active.item {
|
|
border-color: #3454D1 !important;
|
|
color: #3454D1 !important;
|
|
}
|
|
.ui.menu .violet.active.item,
|
|
.ui.violet.menu .active.item {
|
|
border-color: #B4009E !important;
|
|
color: #B4009E !important;
|
|
}
|
|
.ui.menu .purple.active.item,
|
|
.ui.purple.menu .active.item {
|
|
border-color: #6633cc !important;
|
|
color: #6633cc !important;
|
|
}
|
|
.ui.menu .pink.active.item,
|
|
.ui.pink.menu .active.item {
|
|
border-color: #F46197 !important;
|
|
color: #F46197 !important;
|
|
}
|
|
.ui.menu .brown.active.item,
|
|
.ui.brown.menu .active.item {
|
|
border-color: #00BCF2 !important;
|
|
color: #00BCF2 !important;
|
|
}
|
|
.ui.menu .grey.active.item,
|
|
.ui.grey.menu .active.item {
|
|
border-color: #95a5a6 !important;
|
|
color: #95a5a6 !important;
|
|
}
|
|
/*--------------
|
|
Inverted
|
|
---------------*/
|
|
.ui.inverted.menu {
|
|
border: 0px solid transparent;
|
|
background: #3454D1;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Menu Item */
|
|
.ui.inverted.menu .item,
|
|
.ui.inverted.menu .item > a:not(.ui) {
|
|
background: transparent;
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
.ui.inverted.menu .item.menu {
|
|
background: transparent;
|
|
}
|
|
/*--- Border ---*/
|
|
.ui.inverted.menu .item:before {
|
|
background: rgba(255, 255, 255, 0.08);
|
|
}
|
|
.ui.vertical.inverted.menu .item:before {
|
|
background: rgba(255, 255, 255, 0.08);
|
|
}
|
|
/* Sub Menu */
|
|
.ui.vertical.inverted.menu .menu .item,
|
|
.ui.vertical.inverted.menu .menu .item a:not(.ui) {
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
/* Header */
|
|
.ui.inverted.menu .header.item {
|
|
margin: 0em;
|
|
background: transparent;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Disabled */
|
|
.ui.inverted.menu .item.disabled,
|
|
.ui.inverted.menu .item.disabled:hover {
|
|
color: rgba(225, 225, 225, 0.3);
|
|
}
|
|
/*--- Hover ---*/
|
|
.ui.link.inverted.menu .item:hover,
|
|
.ui.inverted.menu .dropdown.item:hover,
|
|
.ui.inverted.menu .link.item:hover,
|
|
.ui.inverted.menu a.item:hover {
|
|
background: rgba(255, 255, 255, 0.08);
|
|
color: #ffffff;
|
|
}
|
|
.ui.vertical.inverted.menu .item .menu a.item:hover,
|
|
.ui.vertical.inverted.menu .item .menu .link.item:hover {
|
|
background: transparent;
|
|
color: #ffffff;
|
|
}
|
|
/*--- Pressed ---*/
|
|
.ui.inverted.menu a.item:active,
|
|
.ui.inverted.menu .link.item:active {
|
|
background: rgba(255, 255, 255, 0.08);
|
|
color: #ffffff;
|
|
}
|
|
/*--- Active ---*/
|
|
.ui.inverted.menu .active.item {
|
|
background: rgba(255, 255, 255, 0.15);
|
|
color: #ffffff !important;
|
|
}
|
|
.ui.inverted.vertical.menu .item .menu .active.item {
|
|
background: transparent;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.pointing.menu .active.item:after {
|
|
background: #3D3E3F !important;
|
|
margin: 0em !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
border: none !important;
|
|
}
|
|
/*--- Active Hover ---*/
|
|
.ui.inverted.menu .active.item:hover {
|
|
background: rgba(255, 255, 255, 0.15);
|
|
color: #FFFFFF !important;
|
|
}
|
|
.ui.inverted.pointing.menu .active.item:hover:after {
|
|
background: #3D3E3F !important;
|
|
}
|
|
/*--------------
|
|
Floated
|
|
---------------*/
|
|
.ui.floated.menu {
|
|
float: left;
|
|
margin: 0rem 0.5rem 0rem 0rem;
|
|
}
|
|
.ui.floated.menu .item:last-child:before {
|
|
display: none;
|
|
}
|
|
.ui.right.floated.menu {
|
|
float: right;
|
|
margin: 0rem 0rem 0rem 0.5rem;
|
|
}
|
|
/*--------------
|
|
Inverted
|
|
---------------*/
|
|
/* Red */
|
|
.ui.inverted.menu .red.active.item,
|
|
.ui.inverted.red.menu {
|
|
background-color: #EF767A;
|
|
}
|
|
.ui.inverted.red.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.red.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Orange */
|
|
.ui.inverted.menu .orange.active.item,
|
|
.ui.inverted.orange.menu {
|
|
background-color: #ff8b27;
|
|
}
|
|
.ui.inverted.orange.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.orange.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Yellow */
|
|
.ui.inverted.menu .yellow.active.item,
|
|
.ui.inverted.yellow.menu {
|
|
background-color: #FDE74C;
|
|
}
|
|
.ui.inverted.yellow.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.yellow.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Olive */
|
|
.ui.inverted.menu .olive.active.item,
|
|
.ui.inverted.olive.menu {
|
|
background-color: #B5CC18;
|
|
}
|
|
.ui.inverted.olive.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.olive.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Green */
|
|
.ui.inverted.menu .green.active.item,
|
|
.ui.inverted.green.menu {
|
|
background-color: #00ED00;
|
|
}
|
|
.ui.inverted.green.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.green.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Teal */
|
|
.ui.inverted.menu .teal.active.item,
|
|
.ui.inverted.teal.menu {
|
|
background-color: #3891A6;
|
|
}
|
|
.ui.inverted.teal.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.teal.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Blue */
|
|
.ui.inverted.menu .blue.active.item,
|
|
.ui.inverted.blue.menu {
|
|
background-color: #3454D1;
|
|
}
|
|
.ui.inverted.blue.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.blue.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Violet */
|
|
.ui.inverted.menu .violet.active.item,
|
|
.ui.inverted.violet.menu {
|
|
background-color: #B4009E;
|
|
}
|
|
.ui.inverted.violet.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.violet.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Purple */
|
|
.ui.inverted.menu .purple.active.item,
|
|
.ui.inverted.purple.menu {
|
|
background-color: #6633cc;
|
|
}
|
|
.ui.inverted.purple.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.purple.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Pink */
|
|
.ui.inverted.menu .pink.active.item,
|
|
.ui.inverted.pink.menu {
|
|
background-color: #F46197;
|
|
}
|
|
.ui.inverted.pink.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.pink.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Brown */
|
|
.ui.inverted.menu .brown.active.item,
|
|
.ui.inverted.brown.menu {
|
|
background-color: #00BCF2;
|
|
}
|
|
.ui.inverted.brown.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.brown.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/* Grey */
|
|
.ui.inverted.menu .grey.active.item,
|
|
.ui.inverted.grey.menu {
|
|
background-color: #95a5a6;
|
|
}
|
|
.ui.inverted.grey.menu .item:before {
|
|
background-color: rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.inverted.grey.menu .active.item {
|
|
background-color: rgba(0, 0, 0, 0.1) !important;
|
|
}
|
|
/*--------------
|
|
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.92857143em;
|
|
padding-bottom: 0.92857143em;
|
|
}
|
|
.ui.vertically.fitted.menu .item,
|
|
.ui.vertically.fitted.menu .item .menu .item,
|
|
.ui.menu .vertically.fitted.item {
|
|
padding-left: 1.14285714em;
|
|
padding-right: 1.14285714em;
|
|
}
|
|
/*--------------
|
|
Borderless
|
|
---------------*/
|
|
.ui.borderless.menu .item:before,
|
|
.ui.borderless.menu .item .menu .item:before,
|
|
.ui.menu .borderless.item:before {
|
|
background: none !important;
|
|
}
|
|
/*-------------------
|
|
Compact
|
|
--------------------*/
|
|
.ui.compact.menu {
|
|
display: -webkit-inline-box;
|
|
display: -ms-inline-flexbox;
|
|
display: inline-flex;
|
|
margin: 0em;
|
|
vertical-align: middle;
|
|
}
|
|
.ui.compact.vertical.menu {
|
|
display: inline-block;
|
|
}
|
|
.ui.compact.menu .item:last-child {
|
|
border-radius: 0em 0.28571429rem 0.28571429rem 0em;
|
|
}
|
|
.ui.compact.menu .item:last-child:before {
|
|
display: none;
|
|
}
|
|
.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 {
|
|
width: 100% !important;
|
|
}
|
|
/*-------------------
|
|
Evenly Sized
|
|
--------------------*/
|
|
.ui.item.menu,
|
|
.ui.item.menu .item {
|
|
width: 100%;
|
|
padding-left: 0em !important;
|
|
padding-right: 0em !important;
|
|
margin-left: 0em !important;
|
|
margin-right: 0em !important;
|
|
text-align: center;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
}
|
|
.ui.item.menu .item:last-child:before {
|
|
display: none;
|
|
}
|
|
.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: 101;
|
|
margin: 0em;
|
|
width: 100%;
|
|
}
|
|
.ui.menu.fixed,
|
|
.ui.menu.fixed .item:first-child,
|
|
.ui.menu.fixed .item:last-child {
|
|
border-radius: 0px !important;
|
|
}
|
|
.ui.fixed.menu,
|
|
.ui[class*="top fixed"].menu {
|
|
top: 0px;
|
|
left: 0px;
|
|
right: auto;
|
|
bottom: auto;
|
|
}
|
|
.ui[class*="top fixed"].menu {
|
|
border-top: none;
|
|
border-left: none;
|
|
border-right: none;
|
|
}
|
|
.ui[class*="right fixed"].menu {
|
|
border-top: none;
|
|
border-bottom: none;
|
|
border-right: none;
|
|
top: 0px;
|
|
right: 0px;
|
|
left: auto;
|
|
bottom: auto;
|
|
width: auto;
|
|
height: 100%;
|
|
}
|
|
.ui[class*="bottom fixed"].menu {
|
|
border-bottom: none;
|
|
border-left: none;
|
|
border-right: none;
|
|
bottom: 0px;
|
|
left: 0px;
|
|
top: auto;
|
|
right: auto;
|
|
}
|
|
.ui[class*="left fixed"].menu {
|
|
border-top: none;
|
|
border-bottom: none;
|
|
border-left: none;
|
|
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 .item:after {
|
|
visibility: hidden;
|
|
position: absolute;
|
|
content: '';
|
|
top: 100%;
|
|
left: 50%;
|
|
-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
|
|
transform: translateX(-50%) translateY(-50%) rotate(45deg);
|
|
background: none;
|
|
margin: 0.5px 0em 0em;
|
|
width: 0.57142857em;
|
|
height: 0.57142857em;
|
|
border: none;
|
|
border-bottom: 1px solid #D4D4D5;
|
|
border-right: 1px solid #D4D4D5;
|
|
z-index: 2;
|
|
-webkit-transition: background 0.1s ease;
|
|
transition: background 0.1s ease;
|
|
}
|
|
.ui.vertical.pointing.menu .item:after {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 0%;
|
|
bottom: auto;
|
|
left: auto;
|
|
-webkit-transform: translateX(50%) translateY(-50%) rotate(45deg);
|
|
transform: translateX(50%) translateY(-50%) rotate(45deg);
|
|
margin: 0em -0.5px 0em 0em;
|
|
border: none;
|
|
border-top: 1px solid #D4D4D5;
|
|
border-right: 1px solid #D4D4D5;
|
|
}
|
|
/* Active */
|
|
.ui.pointing.menu .active.item:after {
|
|
visibility: visible;
|
|
}
|
|
.ui.pointing.menu .active.dropdown.item:after {
|
|
visibility: hidden;
|
|
}
|
|
/* Don't double up pointers */
|
|
.ui.pointing.menu .dropdown.active.item:after,
|
|
.ui.pointing.menu .active.item .menu .active.item:after {
|
|
display: none;
|
|
}
|
|
/* Colors */
|
|
.ui.pointing.menu .active.item:hover:after {
|
|
background-color: #F2F2F2;
|
|
}
|
|
.ui.pointing.menu .active.item:after {
|
|
background-color: #F2F2F2;
|
|
}
|
|
.ui.pointing.menu .active.item:hover:after {
|
|
background-color: #F2F2F2;
|
|
}
|
|
.ui.vertical.pointing.menu .active.item:hover:after {
|
|
background-color: #F2F2F2;
|
|
}
|
|
.ui.vertical.pointing.menu .active.item:after {
|
|
background-color: #F2F2F2;
|
|
}
|
|
.ui.vertical.pointing.menu .menu .active.item:after {
|
|
background-color: #FFFFFF;
|
|
}
|
|
/*--------------
|
|
Attached
|
|
---------------*/
|
|
/* Middle */
|
|
.ui.attached.menu {
|
|
top: 0px;
|
|
bottom: 0px;
|
|
border-radius: 0px;
|
|
margin: 0em -1px;
|
|
width: calc(100% + 2px );
|
|
max-width: calc(100% + 2px );
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.attached + .ui.attached.menu:not(.top) {
|
|
border-top: none;
|
|
}
|
|
/* Top */
|
|
.ui[class*="top attached"].menu {
|
|
bottom: 0px;
|
|
margin-bottom: 0em;
|
|
top: 0px;
|
|
margin-top: 1rem;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.menu[class*="top attached"]:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
/* Bottom */
|
|
.ui[class*="bottom attached"].menu {
|
|
bottom: 0px;
|
|
margin-top: 0em;
|
|
top: 0px;
|
|
margin-bottom: 1rem;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), none;
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
.ui[class*="bottom attached"].menu:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/* Attached Menu Item */
|
|
.ui.top.attached.menu > .item:first-child {
|
|
border-radius: 0.28571429rem 0em 0em 0em;
|
|
}
|
|
.ui.bottom.attached.menu > .item:first-child {
|
|
border-radius: 0em 0em 0em 0.28571429rem;
|
|
}
|
|
/* Tabular Attached */
|
|
.ui.attached.menu:not(.tabular) {
|
|
border: 1px solid #D4D4D5;
|
|
}
|
|
.ui.attached.inverted.menu {
|
|
border: none;
|
|
}
|
|
.ui.attached.tabular.menu {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
width: 100%;
|
|
}
|
|
/*--------------
|
|
Sizes
|
|
---------------*/
|
|
/* Mini */
|
|
.ui.mini.menu {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.mini.vertical.menu {
|
|
width: 9rem;
|
|
}
|
|
/* Tiny */
|
|
.ui.tiny.menu {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.tiny.vertical.menu {
|
|
width: 11rem;
|
|
}
|
|
/* Small */
|
|
.ui.small.menu {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.small.vertical.menu {
|
|
width: 13rem;
|
|
}
|
|
/* Medium */
|
|
.ui.menu {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.vertical.menu {
|
|
width: 15rem;
|
|
}
|
|
/* Large */
|
|
.ui.large.menu {
|
|
font-size: 1.07142857rem;
|
|
}
|
|
.ui.large.vertical.menu {
|
|
width: 18rem;
|
|
}
|
|
/* Huge */
|
|
.ui.huge.menu {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.huge.vertical.menu {
|
|
width: 20rem;
|
|
}
|
|
/* Big */
|
|
.ui.big.menu {
|
|
font-size: 1.21428571rem;
|
|
}
|
|
.ui.big.vertical.menu {
|
|
width: 22rem;
|
|
}
|
|
/* Massive */
|
|
.ui.massive.menu {
|
|
font-size: 1.28571429rem;
|
|
}
|
|
.ui.massive.vertical.menu {
|
|
width: 25rem;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
#menubar {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
right: 0;
|
|
}
|
|
#menubar .ui.menu {
|
|
height: 4.5rem;
|
|
min-height: 4.5rem !important;
|
|
}
|
|
#menubar .item > .button {
|
|
margin-right: 0.25rem;
|
|
padding: 0.6rem;
|
|
}
|
|
@media only screen and (max-width: 991px) {
|
|
#menubar .ui.menu {
|
|
height: 3.5rem !important;
|
|
min-height: 3.5rem !important;
|
|
}
|
|
#menubar .left.menu > .item.icon:not(.logo),
|
|
#menubar .right.menu > .item.icon:not(.logo) {
|
|
width: 48px;
|
|
}
|
|
.sandbox #menubar .ui.menu {
|
|
height: 3rem !important;
|
|
min-height: 3rem !important;
|
|
}
|
|
.ui.menu .item > i.icon {
|
|
margin: 0;
|
|
}
|
|
}
|
|
.ui.inverted.menu .active.item {
|
|
background: rgba(255, 255, 255, 0.3);
|
|
}
|
|
/* Tutorial mode */
|
|
.tutorial .ui.inverted.menu {
|
|
background: #ff8b27 !important;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Message
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Message
|
|
*******************************/
|
|
/*-------------------
|
|
Elements
|
|
--------------------*/
|
|
/* Header */
|
|
/* Paragraph */
|
|
/* List */
|
|
/* Icon */
|
|
/* Close Icon */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Icon Message */
|
|
/* Attached */
|
|
/* Floating */
|
|
/* Colors */
|
|
/* Warning / Positive / Negative / Info */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Message
|
|
*******************************/
|
|
/*-------------------
|
|
Elements
|
|
--------------------*/
|
|
/* Header */
|
|
/* Paragraph */
|
|
/* List */
|
|
/* Icon */
|
|
/* Close Icon */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Icon Message */
|
|
/* Attached */
|
|
/* Floating */
|
|
/* Colors */
|
|
/* Warning / Positive / Negative / Info */
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Message
|
|
*******************************/
|
|
.ui.message {
|
|
position: relative;
|
|
min-height: 1em;
|
|
margin: 1em 0em;
|
|
background: #F8F8F9;
|
|
padding: 1em 1.5em;
|
|
line-height: 1.4285em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
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-shadow 0.1s ease;
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.22) inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.22) inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.message:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.message:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*--------------
|
|
Content
|
|
---------------*/
|
|
/* Header */
|
|
.ui.message .header {
|
|
display: block;
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-weight: bold;
|
|
margin: -0.14285em 0em 0rem 0em;
|
|
}
|
|
/* Default font size */
|
|
.ui.message .header:not(.ui) {
|
|
font-size: 1.14285714em;
|
|
}
|
|
/* Paragraph */
|
|
.ui.message p {
|
|
opacity: 0.85;
|
|
margin: 0.75em 0em;
|
|
}
|
|
.ui.message p:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.message p:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.message .header + p {
|
|
margin-top: 0.25em;
|
|
}
|
|
/* List */
|
|
.ui.message .list:not(.ui) {
|
|
text-align: left;
|
|
padding: 0em;
|
|
opacity: 0.85;
|
|
list-style-position: inside;
|
|
margin: 0.5em 0em 0em;
|
|
}
|
|
.ui.message .list:not(.ui):first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.message .list:not(.ui):last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
.ui.message .list:not(.ui) li {
|
|
position: relative;
|
|
list-style-type: none;
|
|
margin: 0em 0em 0.3em 1em;
|
|
padding: 0em;
|
|
}
|
|
.ui.message .list:not(.ui) li:before {
|
|
position: absolute;
|
|
content: '•';
|
|
left: -1em;
|
|
height: 100%;
|
|
vertical-align: baseline;
|
|
}
|
|
.ui.message .list:not(.ui) li:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/* Icon */
|
|
.ui.message > .icon {
|
|
margin-right: 0.6em;
|
|
}
|
|
/* Close Icon */
|
|
.ui.message > .close.icon {
|
|
cursor: pointer;
|
|
position: absolute;
|
|
margin: 0em;
|
|
top: 0.78575em;
|
|
right: 0.5em;
|
|
opacity: 0.7;
|
|
-webkit-transition: opacity 0.1s ease;
|
|
transition: opacity 0.1s ease;
|
|
}
|
|
.ui.message > .close.icon:hover {
|
|
opacity: 1;
|
|
}
|
|
/* First / Last Element */
|
|
.ui.message > :first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.message > :last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*******************************
|
|
Coupling
|
|
*******************************/
|
|
.ui.dropdown .menu > .message {
|
|
margin: 0px -1px;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Visible
|
|
---------------*/
|
|
.ui.visible.visible.visible.visible.message {
|
|
display: block;
|
|
}
|
|
.ui.icon.visible.visible.visible.visible.message {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
/*--------------
|
|
Hidden
|
|
---------------*/
|
|
.ui.hidden.hidden.hidden.hidden.message {
|
|
display: none;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Compact
|
|
---------------*/
|
|
.ui.compact.message {
|
|
display: inline-block;
|
|
}
|
|
/*--------------
|
|
Attached
|
|
---------------*/
|
|
.ui.attached.message {
|
|
margin-bottom: -1px;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
-webkit-box-shadow: 0em 0em 0em 1px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0em 0em 0em 1px rgba(34, 36, 38, 0.15) inset;
|
|
margin-left: -1px;
|
|
margin-right: -1px;
|
|
}
|
|
.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.28571429rem 0.28571429rem;
|
|
-webkit-box-shadow: 0em 0em 0em 1px rgba(34, 36, 38, 0.15) inset, 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0em 0em 0em 1px rgba(34, 36, 38, 0.15) inset, 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.bottom.attached.message:not(:last-child) {
|
|
margin-bottom: 1em;
|
|
}
|
|
.ui.attached.icon.message {
|
|
width: auto;
|
|
}
|
|
/*--------------
|
|
Icon
|
|
---------------*/
|
|
.ui.icon.message {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
width: 100%;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
}
|
|
.ui.icon.message > .icon:not(.close) {
|
|
display: block;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 0 auto;
|
|
flex: 0 0 auto;
|
|
width: auto;
|
|
line-height: 1;
|
|
vertical-align: middle;
|
|
font-size: 3em;
|
|
opacity: 0.8;
|
|
}
|
|
.ui.icon.message > .content {
|
|
display: block;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1 1 auto;
|
|
flex: 1 1 auto;
|
|
vertical-align: middle;
|
|
}
|
|
.ui.icon.message .icon:not(.close) + .content {
|
|
padding-left: 0rem;
|
|
}
|
|
.ui.icon.message .circular.icon {
|
|
width: 1em;
|
|
}
|
|
/*--------------
|
|
Floating
|
|
---------------*/
|
|
.ui.floating.message {
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.22) inset, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.22) inset, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/*--------------
|
|
Colors
|
|
---------------*/
|
|
.ui.black.message {
|
|
background-color: #1B1C1D;
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
/*--------------
|
|
Types
|
|
---------------*/
|
|
/* Positive */
|
|
.ui.positive.message {
|
|
background-color: #FCFFF5;
|
|
color: #2C662D;
|
|
}
|
|
.ui.positive.message,
|
|
.ui.attached.positive.message {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #A3C293 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #A3C293 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.positive.message .header {
|
|
color: #1A531B;
|
|
}
|
|
/* Negative */
|
|
.ui.negative.message {
|
|
background-color: #FFF6F6;
|
|
color: #9F3A38;
|
|
}
|
|
.ui.negative.message,
|
|
.ui.attached.negative.message {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #E0B4B4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #E0B4B4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.negative.message .header {
|
|
color: #912D2B;
|
|
}
|
|
/* Info */
|
|
.ui.info.message {
|
|
background-color: #F8FFFF;
|
|
color: #276F86;
|
|
}
|
|
.ui.info.message,
|
|
.ui.attached.info.message {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #A9D5DE inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #A9D5DE inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.info.message .header {
|
|
color: #0E566C;
|
|
}
|
|
/* Warning */
|
|
.ui.warning.message {
|
|
background-color: #FFFAF3;
|
|
color: #573A08;
|
|
}
|
|
.ui.warning.message,
|
|
.ui.attached.warning.message {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #C9BA9B inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #C9BA9B inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.warning.message .header {
|
|
color: #794B02;
|
|
}
|
|
/* Error */
|
|
.ui.error.message {
|
|
background-color: #FFF6F6;
|
|
color: #9F3A38;
|
|
}
|
|
.ui.error.message,
|
|
.ui.attached.error.message {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #E0B4B4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #E0B4B4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.error.message .header {
|
|
color: #912D2B;
|
|
}
|
|
/* Success */
|
|
.ui.success.message {
|
|
background-color: #FCFFF5;
|
|
color: #2C662D;
|
|
}
|
|
.ui.success.message,
|
|
.ui.attached.success.message {
|
|
-webkit-box-shadow: 0px 0px 0px 1px #A3C293 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #A3C293 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.success.message .header {
|
|
color: #1A531B;
|
|
}
|
|
/* Colors */
|
|
.ui.inverted.message,
|
|
.ui.black.message {
|
|
background-color: #1B1C1D;
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
.ui.red.message {
|
|
background-color: #FFE8E6;
|
|
color: #EF767A;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #EF767A inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #EF767A inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.red.message .header {
|
|
color: #ec5f64;
|
|
}
|
|
.ui.orange.message {
|
|
background-color: #FFEDDE;
|
|
color: #ff8b27;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #ff8b27 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #ff8b27 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.orange.message .header {
|
|
color: #ff7d0d;
|
|
}
|
|
.ui.yellow.message {
|
|
background-color: #FFF8DB;
|
|
color: #B58105;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #B58105 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #B58105 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.yellow.message .header {
|
|
color: #9c6f04;
|
|
}
|
|
.ui.olive.message {
|
|
background-color: #FBFDEF;
|
|
color: #8ABC1E;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #8ABC1E inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #8ABC1E inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.olive.message .header {
|
|
color: #7aa61a;
|
|
}
|
|
.ui.green.message {
|
|
background-color: #E5F9E7;
|
|
color: #1EBC30;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #1EBC30 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #1EBC30 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.green.message .header {
|
|
color: #1aa62a;
|
|
}
|
|
.ui.teal.message {
|
|
background-color: #E1F7F7;
|
|
color: #10A3A3;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #10A3A3 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #10A3A3 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.teal.message .header {
|
|
color: #0e8c8c;
|
|
}
|
|
.ui.blue.message {
|
|
background-color: #DFF0FF;
|
|
color: #3454D1;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #3454D1 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #3454D1 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.blue.message .header {
|
|
color: #2c4ac0;
|
|
}
|
|
.ui.violet.message {
|
|
background-color: #EAE7FF;
|
|
color: #6435C9;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #6435C9 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #6435C9 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.violet.message .header {
|
|
color: #5a30b5;
|
|
}
|
|
.ui.purple.message {
|
|
background-color: #F6E7FF;
|
|
color: #6633cc;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #6633cc inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #6633cc inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.purple.message .header {
|
|
color: #5c2eb8;
|
|
}
|
|
.ui.pink.message {
|
|
background-color: #FFE3FB;
|
|
color: #F46197;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #F46197 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #F46197 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.pink.message .header {
|
|
color: #f24987;
|
|
}
|
|
.ui.brown.message {
|
|
background-color: #F1E2D3;
|
|
color: #A5673F;
|
|
-webkit-box-shadow: 0px 0px 0px 1px #A5673F inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
box-shadow: 0px 0px 0px 1px #A5673F inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
|
|
}
|
|
.ui.brown.message .header {
|
|
color: #935b38;
|
|
}
|
|
/*--------------
|
|
Sizes
|
|
---------------*/
|
|
.ui.mini.message {
|
|
font-size: 0.78571429em;
|
|
}
|
|
.ui.tiny.message {
|
|
font-size: 0.85714286em;
|
|
}
|
|
.ui.small.message {
|
|
font-size: 0.92857143em;
|
|
}
|
|
.ui.message {
|
|
font-size: 1em;
|
|
}
|
|
.ui.large.message {
|
|
font-size: 1.14285714em;
|
|
}
|
|
.ui.big.message {
|
|
font-size: 1.28571429em;
|
|
}
|
|
.ui.huge.message {
|
|
font-size: 1.42857143em;
|
|
}
|
|
.ui.massive.message {
|
|
font-size: 1.71428571em;
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Table
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Table
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*--------------
|
|
Parts
|
|
---------------*/
|
|
/* Table Row */
|
|
/* Table Cell */
|
|
/* Table Header */
|
|
/* Table Footer */
|
|
/* Responsive Size */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Definition */
|
|
/*--------------
|
|
Couplings
|
|
---------------*/
|
|
/*--------------
|
|
States
|
|
---------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Error */
|
|
/* Warning */
|
|
/* Active */
|
|
/*--------------
|
|
Types
|
|
---------------*/
|
|
/* Attached */
|
|
/* Striped */
|
|
/* Selectable */
|
|
/* Sortable */
|
|
/* Colors */
|
|
/* Inverted */
|
|
/* Basic */
|
|
/* Padded */
|
|
/* Compact */
|
|
/* Sizes */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Table
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*--------------
|
|
Parts
|
|
---------------*/
|
|
/* Table Row */
|
|
/* Table Cell */
|
|
/* Table Header */
|
|
/* Table Footer */
|
|
/* Responsive Size */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Definition */
|
|
/*--------------
|
|
Couplings
|
|
---------------*/
|
|
/*--------------
|
|
States
|
|
---------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Error */
|
|
/* Warning */
|
|
/* Active */
|
|
/*--------------
|
|
Types
|
|
---------------*/
|
|
/* Attached */
|
|
/* Striped */
|
|
/* Selectable */
|
|
/* Sortable */
|
|
/* Colors */
|
|
/* Inverted */
|
|
/* Basic */
|
|
/* Padded */
|
|
/* Compact */
|
|
/* Sizes */
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Table
|
|
*******************************/
|
|
/* Prototype */
|
|
.ui.table {
|
|
width: 100%;
|
|
background: #FFFFFF;
|
|
margin: 1em 0em;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-radius: 0.28571429rem;
|
|
text-align: left;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
border-collapse: separate;
|
|
border-spacing: 0px;
|
|
}
|
|
.ui.table:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.table:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*******************************
|
|
Parts
|
|
*******************************/
|
|
/* Table Content */
|
|
.ui.table th,
|
|
.ui.table td {
|
|
-webkit-transition: background 0.1s ease, color 0.1s ease;
|
|
transition: background 0.1s ease, color 0.1s ease;
|
|
}
|
|
/* Headers */
|
|
.ui.table thead {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.table thead th {
|
|
cursor: auto;
|
|
background: #F9FAFB;
|
|
text-align: inherit;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
padding: 0.92857143em 0.78571429em;
|
|
vertical-align: inherit;
|
|
font-style: none;
|
|
font-weight: bold;
|
|
text-transform: none;
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.1);
|
|
border-left: none;
|
|
}
|
|
.ui.table thead tr > th:first-child {
|
|
border-left: none;
|
|
}
|
|
.ui.table thead tr:first-child > th:first-child {
|
|
border-radius: 0.28571429rem 0em 0em 0em;
|
|
}
|
|
.ui.table thead tr:first-child > th:last-child {
|
|
border-radius: 0em 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.table thead tr:first-child > th:only-child {
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
/* Footer */
|
|
.ui.table tfoot {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.table tfoot th {
|
|
cursor: auto;
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
background: #F9FAFB;
|
|
text-align: inherit;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
padding: 0.78571429em 0.78571429em;
|
|
vertical-align: middle;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
text-transform: none;
|
|
}
|
|
.ui.table tfoot tr > th:first-child {
|
|
border-left: none;
|
|
}
|
|
.ui.table tfoot tr:first-child > th:first-child {
|
|
border-radius: 0em 0em 0em 0.28571429rem;
|
|
}
|
|
.ui.table tfoot tr:first-child > th:last-child {
|
|
border-radius: 0em 0em 0.28571429rem 0em;
|
|
}
|
|
.ui.table tfoot tr:first-child > th:only-child {
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
/* Table Row */
|
|
.ui.table tr td {
|
|
border-top: 1px solid rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.table tr:first-child td {
|
|
border-top: none;
|
|
}
|
|
/* Table Cells */
|
|
.ui.table td {
|
|
padding: 0.78571429em 0.78571429em;
|
|
text-align: inherit;
|
|
}
|
|
/* Icons */
|
|
.ui.table > .icon {
|
|
vertical-align: baseline;
|
|
}
|
|
.ui.table > .icon:only-child {
|
|
margin: 0em;
|
|
}
|
|
/* Table Segment */
|
|
.ui.table.segment {
|
|
padding: 0em;
|
|
}
|
|
.ui.table.segment:after {
|
|
display: none;
|
|
}
|
|
.ui.table.segment.stacked:after {
|
|
display: block;
|
|
}
|
|
/* Responsive */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.table:not(.unstackable) {
|
|
width: 100%;
|
|
}
|
|
.ui.table:not(.unstackable) tbody,
|
|
.ui.table:not(.unstackable) tr,
|
|
.ui.table:not(.unstackable) tr > th,
|
|
.ui.table:not(.unstackable) tr > td {
|
|
width: auto !important;
|
|
display: block !important;
|
|
}
|
|
.ui.table:not(.unstackable) {
|
|
padding: 0em;
|
|
}
|
|
.ui.table:not(.unstackable) thead {
|
|
display: block;
|
|
}
|
|
.ui.table:not(.unstackable) tfoot {
|
|
display: block;
|
|
}
|
|
.ui.table:not(.unstackable) tr {
|
|
padding-top: 1em;
|
|
padding-bottom: 1em;
|
|
-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;
|
|
}
|
|
.ui.table:not(.unstackable) tr > th,
|
|
.ui.table:not(.unstackable) tr > td {
|
|
background: none;
|
|
border: none !important;
|
|
padding: 0.25em 0.75em !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.ui.table:not(.unstackable) th:first-child,
|
|
.ui.table:not(.unstackable) td:first-child {
|
|
font-weight: bold;
|
|
}
|
|
/* Definition Table */
|
|
.ui.definition.table:not(.unstackable) thead th:first-child {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
}
|
|
/*******************************
|
|
Coupling
|
|
*******************************/
|
|
/* UI Image */
|
|
.ui.table th .image,
|
|
.ui.table th .image img,
|
|
.ui.table td .image,
|
|
.ui.table td .image img {
|
|
max-width: none;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Complex
|
|
---------------*/
|
|
.ui.structured.table {
|
|
border-collapse: collapse;
|
|
}
|
|
.ui.structured.table thead th {
|
|
border-left: none;
|
|
border-right: none;
|
|
}
|
|
.ui.structured.sortable.table thead th {
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
border-right: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.structured.basic.table th {
|
|
border-left: none;
|
|
border-right: none;
|
|
}
|
|
.ui.structured.celled.table tr th,
|
|
.ui.structured.celled.table tr td {
|
|
border-left: 1px solid rgba(34, 36, 38, 0.1);
|
|
border-right: 1px solid rgba(34, 36, 38, 0.1);
|
|
}
|
|
/*--------------
|
|
Definition
|
|
---------------*/
|
|
.ui.definition.table thead:not(.full-width) th:first-child {
|
|
pointer-events: none;
|
|
background: transparent;
|
|
font-weight: normal;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
-webkit-box-shadow: -1px -1px 0px 1px #FFFFFF;
|
|
box-shadow: -1px -1px 0px 1px #FFFFFF;
|
|
}
|
|
.ui.definition.table tfoot:not(.full-width) th:first-child {
|
|
pointer-events: none;
|
|
background: transparent;
|
|
font-weight: rgba(0, 0, 0, 0.4);
|
|
color: normal;
|
|
-webkit-box-shadow: 1px 1px 0px 1px #FFFFFF;
|
|
box-shadow: 1px 1px 0px 1px #FFFFFF;
|
|
}
|
|
/* Remove Border */
|
|
.ui.celled.definition.table thead:not(.full-width) th:first-child {
|
|
-webkit-box-shadow: 0px -1px 0px 1px #FFFFFF;
|
|
box-shadow: 0px -1px 0px 1px #FFFFFF;
|
|
}
|
|
.ui.celled.definition.table tfoot:not(.full-width) th:first-child {
|
|
-webkit-box-shadow: 0px 1px 0px 1px #FFFFFF;
|
|
box-shadow: 0px 1px 0px 1px #FFFFFF;
|
|
}
|
|
/* Highlight Defining Column */
|
|
.ui.definition.table tr td:first-child:not(.ignored),
|
|
.ui.definition.table tr td.definition {
|
|
background: rgba(0, 0, 0, 0.03);
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
text-transform: '';
|
|
-webkit-box-shadow: '';
|
|
box-shadow: '';
|
|
text-align: '';
|
|
font-size: 1em;
|
|
padding-left: '';
|
|
padding-right: '';
|
|
}
|
|
/* Fix 2nd Column */
|
|
.ui.definition.table thead:not(.full-width) th:nth-child(2) {
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.definition.table tfoot:not(.full-width) th:nth-child(2) {
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.definition.table td:nth-child(2) {
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Positive
|
|
---------------*/
|
|
.ui.table tr.positive,
|
|
.ui.table td.positive {
|
|
-webkit-box-shadow: 0px 0px 0px #A3C293 inset;
|
|
box-shadow: 0px 0px 0px #A3C293 inset;
|
|
}
|
|
.ui.table tr.positive,
|
|
.ui.table td.positive {
|
|
background: #FCFFF5 !important;
|
|
color: #2C662D !important;
|
|
}
|
|
/*--------------
|
|
Negative
|
|
---------------*/
|
|
.ui.table tr.negative,
|
|
.ui.table td.negative {
|
|
-webkit-box-shadow: 0px 0px 0px #E0B4B4 inset;
|
|
box-shadow: 0px 0px 0px #E0B4B4 inset;
|
|
}
|
|
.ui.table tr.negative,
|
|
.ui.table td.negative {
|
|
background: #FFF6F6 !important;
|
|
color: #9F3A38 !important;
|
|
}
|
|
/*--------------
|
|
Error
|
|
---------------*/
|
|
.ui.table tr.error,
|
|
.ui.table td.error {
|
|
-webkit-box-shadow: 0px 0px 0px #E0B4B4 inset;
|
|
box-shadow: 0px 0px 0px #E0B4B4 inset;
|
|
}
|
|
.ui.table tr.error,
|
|
.ui.table td.error {
|
|
background: #FFF6F6 !important;
|
|
color: #9F3A38 !important;
|
|
}
|
|
/*--------------
|
|
Warning
|
|
---------------*/
|
|
.ui.table tr.warning,
|
|
.ui.table td.warning {
|
|
-webkit-box-shadow: 0px 0px 0px #C9BA9B inset;
|
|
box-shadow: 0px 0px 0px #C9BA9B inset;
|
|
}
|
|
.ui.table tr.warning,
|
|
.ui.table td.warning {
|
|
background: #FFFAF3 !important;
|
|
color: #573A08 !important;
|
|
}
|
|
/*--------------
|
|
Active
|
|
---------------*/
|
|
.ui.table tr.active,
|
|
.ui.table td.active {
|
|
-webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.87) inset;
|
|
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.87) inset;
|
|
}
|
|
.ui.table tr.active,
|
|
.ui.table td.active {
|
|
background: #E0E0E0 !important;
|
|
color: rgba(0, 0, 0, 0.87) !important;
|
|
}
|
|
/*--------------
|
|
Disabled
|
|
---------------*/
|
|
.ui.table tr.disabled td,
|
|
.ui.table tr td.disabled,
|
|
.ui.table tr.disabled:hover,
|
|
.ui.table tr:hover td.disabled {
|
|
pointer-events: none;
|
|
color: rgba(40, 40, 40, 0.3);
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Stackable
|
|
---------------*/
|
|
@media only screen and (max-width: 991px) {
|
|
.ui[class*="tablet stackable"].table,
|
|
.ui[class*="tablet stackable"].table tbody,
|
|
.ui[class*="tablet stackable"].table tr,
|
|
.ui[class*="tablet stackable"].table tr > th,
|
|
.ui[class*="tablet stackable"].table tr > td {
|
|
width: 100% !important;
|
|
display: block !important;
|
|
}
|
|
.ui[class*="tablet stackable"].table {
|
|
padding: 0em;
|
|
}
|
|
.ui[class*="tablet stackable"].table thead {
|
|
display: block;
|
|
}
|
|
.ui[class*="tablet stackable"].table tfoot {
|
|
display: block;
|
|
}
|
|
.ui[class*="tablet stackable"].table tr {
|
|
padding-top: 1em;
|
|
padding-bottom: 1em;
|
|
-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;
|
|
}
|
|
.ui[class*="tablet stackable"].table tr > th,
|
|
.ui[class*="tablet stackable"].table tr > td {
|
|
background: none;
|
|
border: none !important;
|
|
padding: 0.25em 0.75em;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
/* Definition Table */
|
|
.ui.definition[class*="tablet stackable"].table thead th:first-child {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
}
|
|
/*--------------
|
|
Text Alignment
|
|
---------------*/
|
|
.ui.table[class*="left aligned"],
|
|
.ui.table [class*="left aligned"] {
|
|
text-align: left;
|
|
}
|
|
.ui.table[class*="center aligned"],
|
|
.ui.table [class*="center aligned"] {
|
|
text-align: center;
|
|
}
|
|
.ui.table[class*="right aligned"],
|
|
.ui.table [class*="right aligned"] {
|
|
text-align: right;
|
|
}
|
|
/*------------------
|
|
Vertical Alignment
|
|
------------------*/
|
|
.ui.table[class*="top aligned"],
|
|
.ui.table [class*="top aligned"] {
|
|
vertical-align: top;
|
|
}
|
|
.ui.table[class*="middle aligned"],
|
|
.ui.table [class*="middle aligned"] {
|
|
vertical-align: middle;
|
|
}
|
|
.ui.table[class*="bottom aligned"],
|
|
.ui.table [class*="bottom aligned"] {
|
|
vertical-align: bottom;
|
|
}
|
|
/*--------------
|
|
Collapsing
|
|
---------------*/
|
|
.ui.table th.collapsing,
|
|
.ui.table td.collapsing {
|
|
width: 1px;
|
|
white-space: nowrap;
|
|
}
|
|
/*--------------
|
|
Fixed
|
|
---------------*/
|
|
.ui.fixed.table {
|
|
table-layout: fixed;
|
|
}
|
|
.ui.fixed.table th,
|
|
.ui.fixed.table td {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
/*--------------
|
|
Selectable
|
|
---------------*/
|
|
.ui.selectable.table tbody tr:hover,
|
|
.ui.table tbody tr td.selectable:hover {
|
|
background: rgba(0, 0, 0, 0.05) !important;
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
.ui.selectable.inverted.table tbody tr:hover,
|
|
.ui.inverted.table tbody tr td.selectable:hover {
|
|
background: rgba(255, 255, 255, 0.08) !important;
|
|
color: #ffffff !important;
|
|
}
|
|
/* Selectable Cell Link */
|
|
.ui.table tbody tr td.selectable {
|
|
padding: 0em;
|
|
}
|
|
.ui.table tbody tr td.selectable > a:not(.ui) {
|
|
display: block;
|
|
color: inherit;
|
|
padding: 0.78571429em 0.78571429em;
|
|
}
|
|
/* Other States */
|
|
.ui.selectable.table tr.error:hover,
|
|
.ui.table tr td.selectable.error:hover,
|
|
.ui.selectable.table tr:hover td.error {
|
|
background: #ffe7e7 !important;
|
|
color: #943634 !important;
|
|
}
|
|
.ui.selectable.table tr.warning:hover,
|
|
.ui.table tr td.selectable.warning:hover,
|
|
.ui.selectable.table tr:hover td.warning {
|
|
background: #fff4e4 !important;
|
|
color: #493107 !important;
|
|
}
|
|
.ui.selectable.table tr.active:hover,
|
|
.ui.table tr td.selectable.active:hover,
|
|
.ui.selectable.table tr:hover td.active {
|
|
background: #E0E0E0 !important;
|
|
color: rgba(0, 0, 0, 0.87) !important;
|
|
}
|
|
.ui.selectable.table tr.positive:hover,
|
|
.ui.table tr td.selectable.positive:hover,
|
|
.ui.selectable.table tr:hover td.positive {
|
|
background: #f7ffe6 !important;
|
|
color: #275b28 !important;
|
|
}
|
|
.ui.selectable.table tr.negative:hover,
|
|
.ui.table tr td.selectable.negative:hover,
|
|
.ui.selectable.table tr:hover td.negative {
|
|
background: #ffe7e7 !important;
|
|
color: #943634 !important;
|
|
}
|
|
/*-------------------
|
|
Attached
|
|
--------------------*/
|
|
/* Middle */
|
|
.ui.attached.table {
|
|
top: 0px;
|
|
bottom: 0px;
|
|
border-radius: 0px;
|
|
margin: 0em -1px;
|
|
width: calc(100% + 2px );
|
|
max-width: calc(100% + 2px );
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: 1px solid #D4D4D5;
|
|
}
|
|
.ui.attached + .ui.attached.table:not(.top) {
|
|
border-top: none;
|
|
}
|
|
/* Top */
|
|
.ui[class*="top attached"].table {
|
|
bottom: 0px;
|
|
margin-bottom: 0em;
|
|
top: 0px;
|
|
margin-top: 1em;
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.table[class*="top attached"]:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
/* Bottom */
|
|
.ui[class*="bottom attached"].table {
|
|
bottom: 0px;
|
|
margin-top: 0em;
|
|
top: 0px;
|
|
margin-bottom: 1em;
|
|
-webkit-box-shadow: none, none;
|
|
box-shadow: none, none;
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
.ui[class*="bottom attached"].table:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*--------------
|
|
Striped
|
|
---------------*/
|
|
/* Table Striping */
|
|
.ui.striped.table > tr:nth-child(2n),
|
|
.ui.striped.table tbody tr:nth-child(2n) {
|
|
background-color: rgba(0, 0, 50, 0.02);
|
|
}
|
|
/* Stripes */
|
|
.ui.inverted.striped.table > tr:nth-child(2n),
|
|
.ui.inverted.striped.table tbody tr:nth-child(2n) {
|
|
background-color: rgba(255, 255, 255, 0.05);
|
|
}
|
|
/* Allow striped active hover */
|
|
.ui.striped.selectable.selectable.selectable.table tbody tr.active:hover {
|
|
background: #EFEFEF !important;
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
/*--------------
|
|
Single Line
|
|
---------------*/
|
|
.ui.table[class*="single line"],
|
|
.ui.table [class*="single line"] {
|
|
white-space: nowrap;
|
|
}
|
|
.ui.table[class*="single line"],
|
|
.ui.table [class*="single line"] {
|
|
white-space: nowrap;
|
|
}
|
|
/*-------------------
|
|
Colors
|
|
--------------------*/
|
|
/* Red */
|
|
.ui.red.table {
|
|
border-top: 0.2em solid #EF767A;
|
|
}
|
|
.ui.inverted.red.table {
|
|
background-color: #EF767A !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Orange */
|
|
.ui.orange.table {
|
|
border-top: 0.2em solid #ff8b27;
|
|
}
|
|
.ui.inverted.orange.table {
|
|
background-color: #ff8b27 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Yellow */
|
|
.ui.yellow.table {
|
|
border-top: 0.2em solid #FDE74C;
|
|
}
|
|
.ui.inverted.yellow.table {
|
|
background-color: #FDE74C !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Olive */
|
|
.ui.olive.table {
|
|
border-top: 0.2em solid #B5CC18;
|
|
}
|
|
.ui.inverted.olive.table {
|
|
background-color: #B5CC18 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Green */
|
|
.ui.green.table {
|
|
border-top: 0.2em solid #00ED00;
|
|
}
|
|
.ui.inverted.green.table {
|
|
background-color: #00ED00 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Teal */
|
|
.ui.teal.table {
|
|
border-top: 0.2em solid #3891A6;
|
|
}
|
|
.ui.inverted.teal.table {
|
|
background-color: #3891A6 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Blue */
|
|
.ui.blue.table {
|
|
border-top: 0.2em solid #3454D1;
|
|
}
|
|
.ui.inverted.blue.table {
|
|
background-color: #3454D1 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Violet */
|
|
.ui.violet.table {
|
|
border-top: 0.2em solid #6435C9;
|
|
}
|
|
.ui.inverted.violet.table {
|
|
background-color: #6435C9 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Purple */
|
|
.ui.purple.table {
|
|
border-top: 0.2em solid #6633cc;
|
|
}
|
|
.ui.inverted.purple.table {
|
|
background-color: #6633cc !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Pink */
|
|
.ui.pink.table {
|
|
border-top: 0.2em solid #F46197;
|
|
}
|
|
.ui.inverted.pink.table {
|
|
background-color: #F46197 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Brown */
|
|
.ui.brown.table {
|
|
border-top: 0.2em solid #A5673F;
|
|
}
|
|
.ui.inverted.brown.table {
|
|
background-color: #A5673F !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Grey */
|
|
.ui.grey.table {
|
|
border-top: 0.2em solid #95a5a6;
|
|
}
|
|
.ui.inverted.grey.table {
|
|
background-color: #95a5a6 !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/* Black */
|
|
.ui.black.table {
|
|
border-top: 0.2em solid #1B1C1D;
|
|
}
|
|
.ui.inverted.black.table {
|
|
background-color: #1B1C1D !important;
|
|
color: #FFFFFF !important;
|
|
}
|
|
/*--------------
|
|
Column Count
|
|
---------------*/
|
|
/* Grid Based */
|
|
.ui.one.column.table td {
|
|
width: 100%;
|
|
}
|
|
.ui.two.column.table td {
|
|
width: 50%;
|
|
}
|
|
.ui.three.column.table td {
|
|
width: 33.33333333%;
|
|
}
|
|
.ui.four.column.table td {
|
|
width: 25%;
|
|
}
|
|
.ui.five.column.table td {
|
|
width: 20%;
|
|
}
|
|
.ui.six.column.table td {
|
|
width: 16.66666667%;
|
|
}
|
|
.ui.seven.column.table td {
|
|
width: 14.28571429%;
|
|
}
|
|
.ui.eight.column.table td {
|
|
width: 12.5%;
|
|
}
|
|
.ui.nine.column.table td {
|
|
width: 11.11111111%;
|
|
}
|
|
.ui.ten.column.table td {
|
|
width: 10%;
|
|
}
|
|
.ui.eleven.column.table td {
|
|
width: 9.09090909%;
|
|
}
|
|
.ui.twelve.column.table td {
|
|
width: 8.33333333%;
|
|
}
|
|
.ui.thirteen.column.table td {
|
|
width: 7.69230769%;
|
|
}
|
|
.ui.fourteen.column.table td {
|
|
width: 7.14285714%;
|
|
}
|
|
.ui.fifteen.column.table td {
|
|
width: 6.66666667%;
|
|
}
|
|
.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%;
|
|
}
|
|
/*--------------
|
|
Sortable
|
|
---------------*/
|
|
.ui.sortable.table thead th {
|
|
cursor: pointer;
|
|
white-space: nowrap;
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.sortable.table thead th:first-child {
|
|
border-left: none;
|
|
}
|
|
.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: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
text-decoration: inherit;
|
|
content: '';
|
|
height: 1em;
|
|
width: auto;
|
|
opacity: 0.8;
|
|
margin: 0em 0em 0em 0.5em;
|
|
font-family: 'Icons';
|
|
}
|
|
.ui.sortable.table thead th.ascending:after {
|
|
content: '\f0d8';
|
|
}
|
|
.ui.sortable.table thead th.descending:after {
|
|
content: '\f0d7';
|
|
}
|
|
/* Hover */
|
|
.ui.sortable.table th.disabled:hover {
|
|
cursor: auto;
|
|
color: rgba(40, 40, 40, 0.3);
|
|
}
|
|
.ui.sortable.table thead th:hover {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
/* Sorted */
|
|
.ui.sortable.table thead th.sorted {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
.ui.sortable.table thead th.sorted:after {
|
|
display: inline-block;
|
|
}
|
|
/* Sorted Hover */
|
|
.ui.sortable.table thead th.sorted:hover {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Inverted */
|
|
.ui.inverted.sortable.table thead th.sorted {
|
|
background: rgba(255, 255, 255, 0.15) -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
|
|
background: rgba(255, 255, 255, 0.15) linear-gradient(transparent, rgba(0, 0, 0, 0.05));
|
|
color: #ffffff;
|
|
}
|
|
.ui.inverted.sortable.table thead th:hover {
|
|
background: rgba(255, 255, 255, 0.08) -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
|
|
background: rgba(255, 255, 255, 0.08) linear-gradient(transparent, rgba(0, 0, 0, 0.05));
|
|
color: #ffffff;
|
|
}
|
|
.ui.inverted.sortable.table thead th {
|
|
border-left-color: transparent;
|
|
border-right-color: transparent;
|
|
}
|
|
/*--------------
|
|
Inverted
|
|
---------------*/
|
|
/* Text Color */
|
|
.ui.inverted.table {
|
|
background: #333333;
|
|
color: rgba(255, 255, 255, 0.9);
|
|
border: none;
|
|
}
|
|
.ui.inverted.table th {
|
|
background-color: rgba(0, 0, 0, 0.15);
|
|
border-color: rgba(255, 255, 255, 0.1) !important;
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
.ui.inverted.table tr td {
|
|
border-color: rgba(255, 255, 255, 0.1) !important;
|
|
}
|
|
.ui.inverted.table tr.disabled td,
|
|
.ui.inverted.table tr td.disabled,
|
|
.ui.inverted.table tr.disabled:hover td,
|
|
.ui.inverted.table tr:hover td.disabled {
|
|
pointer-events: none;
|
|
color: rgba(225, 225, 225, 0.3);
|
|
}
|
|
/* Definition */
|
|
.ui.inverted.definition.table tfoot:not(.full-width) th:first-child,
|
|
.ui.inverted.definition.table thead:not(.full-width) th:first-child {
|
|
background: #FFFFFF;
|
|
}
|
|
.ui.inverted.definition.table tr td:first-child {
|
|
background: rgba(255, 255, 255, 0.02);
|
|
color: #ffffff;
|
|
}
|
|
/*--------------
|
|
Collapsing
|
|
---------------*/
|
|
.ui.collapsing.table {
|
|
width: auto;
|
|
}
|
|
/*--------------
|
|
Basic
|
|
---------------*/
|
|
.ui.basic.table {
|
|
background: transparent;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.basic.table thead,
|
|
.ui.basic.table tfoot {
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.basic.table th {
|
|
background: transparent;
|
|
border-left: none;
|
|
}
|
|
.ui.basic.table tbody tr {
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
}
|
|
.ui.basic.table td {
|
|
background: transparent;
|
|
}
|
|
.ui.basic.striped.table tbody tr:nth-child(2n) {
|
|
background-color: rgba(0, 0, 0, 0.05) !important;
|
|
}
|
|
/* Very Basic */
|
|
.ui[class*="very basic"].table {
|
|
border: none;
|
|
}
|
|
.ui[class*="very basic"].table:not(.sortable):not(.striped) th,
|
|
.ui[class*="very basic"].table:not(.sortable):not(.striped) td {
|
|
padding: '';
|
|
}
|
|
.ui[class*="very basic"].table:not(.sortable):not(.striped) th:first-child,
|
|
.ui[class*="very basic"].table:not(.sortable):not(.striped) td:first-child {
|
|
padding-left: 0em;
|
|
}
|
|
.ui[class*="very basic"].table:not(.sortable):not(.striped) th:last-child,
|
|
.ui[class*="very basic"].table:not(.sortable):not(.striped) td:last-child {
|
|
padding-right: 0em;
|
|
}
|
|
.ui[class*="very basic"].table:not(.sortable):not(.striped) thead tr:first-child th {
|
|
padding-top: 0em;
|
|
}
|
|
/*--------------
|
|
Celled
|
|
---------------*/
|
|
.ui.celled.table tr th,
|
|
.ui.celled.table tr td {
|
|
border-left: 1px solid rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.celled.table tr th:first-child,
|
|
.ui.celled.table tr td:first-child {
|
|
border-left: none;
|
|
}
|
|
/*--------------
|
|
Padded
|
|
---------------*/
|
|
.ui.padded.table th {
|
|
padding-left: 1em;
|
|
padding-right: 1em;
|
|
}
|
|
.ui.padded.table th,
|
|
.ui.padded.table td {
|
|
padding: 1em 1em;
|
|
}
|
|
/* Very */
|
|
.ui[class*="very padded"].table th {
|
|
padding-left: 1.5em;
|
|
padding-right: 1.5em;
|
|
}
|
|
.ui[class*="very padded"].table td {
|
|
padding: 1.5em 1.5em;
|
|
}
|
|
/*--------------
|
|
Compact
|
|
---------------*/
|
|
.ui.compact.table th {
|
|
padding-left: 0.7em;
|
|
padding-right: 0.7em;
|
|
}
|
|
.ui.compact.table td {
|
|
padding: 0.5em 0.7em;
|
|
}
|
|
/* Very */
|
|
.ui[class*="very compact"].table th {
|
|
padding-left: 0.6em;
|
|
padding-right: 0.6em;
|
|
}
|
|
.ui[class*="very compact"].table td {
|
|
padding: 0.4em 0.6em;
|
|
}
|
|
/*--------------
|
|
Sizes
|
|
---------------*/
|
|
/* Small */
|
|
.ui.small.table {
|
|
font-size: 0.9em;
|
|
}
|
|
/* Standard */
|
|
.ui.table {
|
|
font-size: 1em;
|
|
}
|
|
/* Large */
|
|
.ui.large.table {
|
|
font-size: 1.1em;
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/* Views */
|
|
/*!
|
|
* # Semantic UI - Item
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Card
|
|
*******************************/
|
|
/*-------------------
|
|
View
|
|
--------------------*/
|
|
/* Shadow */
|
|
/* Card */
|
|
/* Card Group */
|
|
/* Consecutive Cards */
|
|
/*-------------------
|
|
Content
|
|
--------------------*/
|
|
/* Image */
|
|
/* Content */
|
|
/* Header */
|
|
/* Metadata */
|
|
/* Icons */
|
|
/* Links */
|
|
/* Description */
|
|
/* Content Image */
|
|
/* Avatar Image */
|
|
/* Paragraph */
|
|
/* Dimmer */
|
|
/* Additional Content */
|
|
/* Extra Links */
|
|
/* Buttons */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Link */
|
|
/* Raised */
|
|
/* Card Count */
|
|
/* Stackable */
|
|
/* Sizes */
|
|
/* Colored */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Standard
|
|
*******************************/
|
|
/*--------------
|
|
Card
|
|
---------------*/
|
|
.ui.cards > .card,
|
|
.ui.card {
|
|
max-width: 100%;
|
|
position: relative;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
width: 290px;
|
|
min-height: 0px;
|
|
background: #FFFFFF;
|
|
padding: 0em;
|
|
border: none;
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0px 1px 3px 0px #e9eef2, 0px 0px 0px 2px #e9eef2;
|
|
box-shadow: 0px 1px 3px 0px #e9eef2, 0px 0px 0px 2px #e9eef2;
|
|
-webkit-transition: -webkit-box-shadow 0.1s ease, -webkit-transform 0.1s ease;
|
|
transition: -webkit-box-shadow 0.1s ease, -webkit-transform 0.1s ease;
|
|
transition: box-shadow 0.1s ease, transform 0.1s ease;
|
|
transition: box-shadow 0.1s ease, transform 0.1s ease, -webkit-box-shadow 0.1s ease, -webkit-transform 0.1s ease;
|
|
z-index: '';
|
|
}
|
|
.ui.card {
|
|
margin: 1em 0em;
|
|
}
|
|
.ui.cards > .card a,
|
|
.ui.card a {
|
|
cursor: pointer;
|
|
}
|
|
.ui.card:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.card:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*--------------
|
|
Cards
|
|
---------------*/
|
|
.ui.cards {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
margin: -0.875em -0.5em;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
}
|
|
.ui.cards > .card {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
margin: 0.875em 0.5em;
|
|
float: none;
|
|
}
|
|
/* Clearing */
|
|
.ui.cards:after,
|
|
.ui.card:after {
|
|
display: block;
|
|
content: ' ';
|
|
height: 0px;
|
|
clear: both;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
}
|
|
/* Consecutive Card Groups Preserve Row Spacing */
|
|
.ui.cards ~ .ui.cards {
|
|
margin-top: 0.875em;
|
|
}
|
|
/*--------------
|
|
Rounded Edges
|
|
---------------*/
|
|
.ui.cards > .card > :first-child,
|
|
.ui.card > :first-child {
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em !important;
|
|
border-top: none !important;
|
|
}
|
|
.ui.cards > .card > :last-child,
|
|
.ui.card > :last-child {
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem !important;
|
|
}
|
|
.ui.cards > .card > :only-child,
|
|
.ui.card > :only-child {
|
|
border-radius: 0.28571429rem !important;
|
|
}
|
|
/*--------------
|
|
Images
|
|
---------------*/
|
|
.ui.cards > .card > .image,
|
|
.ui.card > .image {
|
|
position: relative;
|
|
display: block;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 0 auto;
|
|
flex: 0 0 auto;
|
|
padding: 0em;
|
|
background: rgba(0, 0, 0, 0.05);
|
|
}
|
|
.ui.cards > .card > .image > img,
|
|
.ui.card > .image > img {
|
|
display: block;
|
|
width: 100%;
|
|
height: auto;
|
|
border-radius: inherit;
|
|
}
|
|
.ui.cards > .card > .image:not(.ui) > img,
|
|
.ui.card > .image:not(.ui) > img {
|
|
border: none;
|
|
}
|
|
/*--------------
|
|
Content
|
|
---------------*/
|
|
.ui.cards > .card > .content,
|
|
.ui.card > .content {
|
|
-webkit-box-flex: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
border: none;
|
|
border-top: 2px solid rgba(34, 36, 38, 0.1);
|
|
background: none;
|
|
margin: 0em;
|
|
padding: 1em 1em;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
font-size: 1em;
|
|
border-radius: 0em;
|
|
}
|
|
.ui.cards > .card > .content:after,
|
|
.ui.card > .content:after {
|
|
display: block;
|
|
content: ' ';
|
|
height: 0px;
|
|
clear: both;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
}
|
|
.ui.cards > .card > .content > .header,
|
|
.ui.card > .content > .header {
|
|
display: block;
|
|
margin: '';
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
/* Default Header Size */
|
|
.ui.cards > .card > .content > .header:not(.ui),
|
|
.ui.card > .content > .header:not(.ui) {
|
|
font-weight: bold;
|
|
font-size: 1.28571429em;
|
|
margin-top: -0.21425em;
|
|
line-height: 1.2857em;
|
|
}
|
|
.ui.cards > .card > .content > .meta + .description,
|
|
.ui.cards > .card > .content > .header + .description,
|
|
.ui.card > .content > .meta + .description,
|
|
.ui.card > .content > .header + .description {
|
|
margin-top: 0.5em;
|
|
}
|
|
/*----------------
|
|
Floated Content
|
|
-----------------*/
|
|
.ui.cards > .card [class*="left floated"],
|
|
.ui.card [class*="left floated"] {
|
|
float: left;
|
|
}
|
|
.ui.cards > .card [class*="right floated"],
|
|
.ui.card [class*="right floated"] {
|
|
float: right;
|
|
}
|
|
/*--------------
|
|
Aligned
|
|
---------------*/
|
|
.ui.cards > .card [class*="left aligned"],
|
|
.ui.card [class*="left aligned"] {
|
|
text-align: left;
|
|
}
|
|
.ui.cards > .card [class*="center aligned"],
|
|
.ui.card [class*="center aligned"] {
|
|
text-align: center;
|
|
}
|
|
.ui.cards > .card [class*="right aligned"],
|
|
.ui.card [class*="right aligned"] {
|
|
text-align: right;
|
|
}
|
|
/*--------------
|
|
Content Image
|
|
---------------*/
|
|
.ui.cards > .card .content img,
|
|
.ui.card .content img {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
width: '';
|
|
}
|
|
.ui.cards > .card img.avatar,
|
|
.ui.cards > .card .avatar img,
|
|
.ui.card img.avatar,
|
|
.ui.card .avatar img {
|
|
width: 2em;
|
|
height: 2em;
|
|
border-radius: 500rem;
|
|
}
|
|
/*--------------
|
|
Description
|
|
---------------*/
|
|
.ui.cards > .card > .content > .description,
|
|
.ui.card > .content > .description {
|
|
clear: both;
|
|
color: rgba(0, 0, 0, 0.68);
|
|
}
|
|
/*--------------
|
|
Paragraph
|
|
---------------*/
|
|
.ui.cards > .card > .content p,
|
|
.ui.card > .content p {
|
|
margin: 0em 0em 0.5em;
|
|
}
|
|
.ui.cards > .card > .content p:last-child,
|
|
.ui.card > .content p:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*--------------
|
|
Meta
|
|
---------------*/
|
|
.ui.cards > .card .meta,
|
|
.ui.card .meta {
|
|
font-size: 1em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
.ui.cards > .card .meta *,
|
|
.ui.card .meta * {
|
|
margin-right: 0.3em;
|
|
}
|
|
.ui.cards > .card .meta :last-child,
|
|
.ui.card .meta :last-child {
|
|
margin-right: 0em;
|
|
}
|
|
.ui.cards > .card .meta [class*="right floated"],
|
|
.ui.card .meta [class*="right floated"] {
|
|
margin-right: 0em;
|
|
margin-left: 0.3em;
|
|
}
|
|
/*--------------
|
|
Links
|
|
---------------*/
|
|
/* Generic */
|
|
.ui.cards > .card > .content a:not(.ui),
|
|
.ui.card > .content a:not(.ui) {
|
|
color: '';
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
.ui.cards > .card > .content a:not(.ui):hover,
|
|
.ui.card > .content a:not(.ui):hover {
|
|
color: '';
|
|
}
|
|
/* Header */
|
|
.ui.cards > .card > .content > a.header,
|
|
.ui.card > .content > a.header {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
.ui.cards > .card > .content > a.header:hover,
|
|
.ui.card > .content > a.header:hover {
|
|
color: #1e70bf;
|
|
}
|
|
/* Meta */
|
|
.ui.cards > .card .meta > a:not(.ui),
|
|
.ui.card .meta > a:not(.ui) {
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
.ui.cards > .card .meta > a:not(.ui):hover,
|
|
.ui.card .meta > a:not(.ui):hover {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/*--------------
|
|
Buttons
|
|
---------------*/
|
|
.ui.cards > .card > .buttons,
|
|
.ui.card > .buttons,
|
|
.ui.cards > .card > .button,
|
|
.ui.card > .button {
|
|
margin: 0px -2px;
|
|
width: calc(100% + 4px );
|
|
}
|
|
/*--------------
|
|
Dimmer
|
|
---------------*/
|
|
.ui.cards > .card .dimmer,
|
|
.ui.card .dimmer {
|
|
background-color: '';
|
|
z-index: 10;
|
|
}
|
|
/*--------------
|
|
Labels
|
|
---------------*/
|
|
/*-----Star----- */
|
|
/* Icon */
|
|
.ui.cards > .card > .content .star.icon,
|
|
.ui.card > .content .star.icon {
|
|
cursor: pointer;
|
|
opacity: 0.75;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
.ui.cards > .card > .content .star.icon:hover,
|
|
.ui.card > .content .star.icon:hover {
|
|
opacity: 1;
|
|
color: #FFB70A;
|
|
}
|
|
.ui.cards > .card > .content .active.star.icon,
|
|
.ui.card > .content .active.star.icon {
|
|
color: #FFE623;
|
|
}
|
|
/*-----Like----- */
|
|
/* Icon */
|
|
.ui.cards > .card > .content .like.icon,
|
|
.ui.card > .content .like.icon {
|
|
cursor: pointer;
|
|
opacity: 0.75;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
.ui.cards > .card > .content .like.icon:hover,
|
|
.ui.card > .content .like.icon:hover {
|
|
opacity: 1;
|
|
color: #FF2733;
|
|
}
|
|
.ui.cards > .card > .content .active.like.icon,
|
|
.ui.card > .content .active.like.icon {
|
|
color: #FF2733;
|
|
}
|
|
/*----------------
|
|
Extra Content
|
|
-----------------*/
|
|
.ui.cards > .card > .extra,
|
|
.ui.card > .extra {
|
|
max-width: 100%;
|
|
min-height: 0em !important;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
|
|
position: static;
|
|
background: none;
|
|
width: auto;
|
|
margin: 0em 0em;
|
|
padding: 0.75em 1em;
|
|
top: 0em;
|
|
left: 0em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
.ui.cards > .card > .extra a:not(.ui),
|
|
.ui.card > .extra a:not(.ui) {
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
.ui.cards > .card > .extra a:not(.ui):hover,
|
|
.ui.card > .extra a:not(.ui):hover {
|
|
color: #1e70bf;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Raised
|
|
--------------------*/
|
|
.ui.raised.cards > .card,
|
|
.ui.raised.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.raised.cards a.card:hover,
|
|
.ui.link.cards .raised.card:hover,
|
|
a.ui.raised.card:hover,
|
|
.ui.link.raised.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 4px 0px rgba(34, 36, 38, 0.15), 0px 2px 10px 0px rgba(34, 36, 38, 0.25);
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 4px 0px rgba(34, 36, 38, 0.15), 0px 2px 10px 0px rgba(34, 36, 38, 0.25);
|
|
}
|
|
.ui.raised.cards > .card,
|
|
.ui.raised.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/*-------------------
|
|
Centered
|
|
--------------------*/
|
|
.ui.centered.cards {
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
}
|
|
.ui.centered.card {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
/*-------------------
|
|
Fluid
|
|
--------------------*/
|
|
.ui.fluid.card {
|
|
width: 100%;
|
|
max-width: 9999px;
|
|
}
|
|
/*-------------------
|
|
Link
|
|
--------------------*/
|
|
.ui.cards a.card,
|
|
.ui.link.cards .card,
|
|
a.ui.card,
|
|
.ui.link.card {
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
.ui.cards a.card:hover,
|
|
.ui.link.cards .card:hover,
|
|
a.ui.card:hover,
|
|
.ui.link.card:hover {
|
|
cursor: pointer;
|
|
z-index: 5;
|
|
background: #FFFFFF;
|
|
border: none;
|
|
-webkit-box-shadow: 0px 1px 3px 0px #BCBDBD, 0px 0px 0px 2px #3454D1;
|
|
box-shadow: 0px 1px 3px 0px #BCBDBD, 0px 0px 0px 2px #3454D1;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
/*-------------------
|
|
Colors
|
|
--------------------*/
|
|
/* Red */
|
|
.ui.red.cards > .card,
|
|
.ui.cards > .red.card,
|
|
.ui.red.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #EF767A, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #EF767A, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.red.cards > .card:hover,
|
|
.ui.cards > .red.card:hover,
|
|
.ui.red.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #f3585d, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #f3585d, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Orange */
|
|
.ui.orange.cards > .card,
|
|
.ui.cards > .orange.card,
|
|
.ui.orange.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #ff8b27, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #ff8b27, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.orange.cards > .card:hover,
|
|
.ui.cards > .orange.card:hover,
|
|
.ui.orange.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #ff7d0d, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #ff7d0d, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Yellow */
|
|
.ui.yellow.cards > .card,
|
|
.ui.cards > .yellow.card,
|
|
.ui.yellow.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #FDE74C, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #FDE74C, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.yellow.cards > .card:hover,
|
|
.ui.cards > .yellow.card:hover,
|
|
.ui.yellow.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #ffe531, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #ffe531, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Olive */
|
|
.ui.olive.cards > .card,
|
|
.ui.cards > .olive.card,
|
|
.ui.olive.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #B5CC18, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #B5CC18, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.olive.cards > .card:hover,
|
|
.ui.cards > .olive.card:hover,
|
|
.ui.olive.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #a7bd0d, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #a7bd0d, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Green */
|
|
.ui.green.cards > .card,
|
|
.ui.cards > .green.card,
|
|
.ui.green.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #00ED00, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #00ED00, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.green.cards > .card:hover,
|
|
.ui.cards > .green.card:hover,
|
|
.ui.green.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #00d400, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #00d400, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Teal */
|
|
.ui.teal.cards > .card,
|
|
.ui.cards > .teal.card,
|
|
.ui.teal.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #3891A6, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #3891A6, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.teal.cards > .card:hover,
|
|
.ui.cards > .teal.card:hover,
|
|
.ui.teal.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #2d8398, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #2d8398, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Blue */
|
|
.ui.blue.cards > .card,
|
|
.ui.cards > .blue.card,
|
|
.ui.blue.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #3454D1, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #3454D1, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.blue.cards > .card:hover,
|
|
.ui.cards > .blue.card:hover,
|
|
.ui.blue.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #2445c7, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #2445c7, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Violet */
|
|
.ui.violet.cards > .card,
|
|
.ui.cards > .violet.card,
|
|
.ui.violet.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #B4009E, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #B4009E, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.violet.cards > .card:hover,
|
|
.ui.cards > .violet.card:hover,
|
|
.ui.violet.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #9b0088, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #9b0088, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Purple */
|
|
.ui.purple.cards > .card,
|
|
.ui.cards > .purple.card,
|
|
.ui.purple.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #6633cc, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #6633cc, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.purple.cards > .card:hover,
|
|
.ui.cards > .purple.card:hover,
|
|
.ui.purple.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #5a27be, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #5a27be, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Pink */
|
|
.ui.pink.cards > .card,
|
|
.ui.cards > .pink.card,
|
|
.ui.pink.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #F46197, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #F46197, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.pink.cards > .card:hover,
|
|
.ui.cards > .pink.card:hover,
|
|
.ui.pink.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #fb4185, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #fb4185, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Brown */
|
|
.ui.brown.cards > .card,
|
|
.ui.cards > .brown.card,
|
|
.ui.brown.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #00BCF2, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #00BCF2, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.brown.cards > .card:hover,
|
|
.ui.cards > .brown.card:hover,
|
|
.ui.brown.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #00a8d9, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #00a8d9, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Grey */
|
|
.ui.grey.cards > .card,
|
|
.ui.cards > .grey.card,
|
|
.ui.grey.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #95a5a6, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #95a5a6, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.grey.cards > .card:hover,
|
|
.ui.cards > .grey.card:hover,
|
|
.ui.grey.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #a3b1b2, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #a3b1b2, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/* Black */
|
|
.ui.black.cards > .card,
|
|
.ui.cards > .black.card,
|
|
.ui.black.card {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #1B1C1D, 0px 1px 3px 0px #e9eef2;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #1B1C1D, 0px 1px 3px 0px #e9eef2;
|
|
}
|
|
.ui.black.cards > .card:hover,
|
|
.ui.cards > .black.card:hover,
|
|
.ui.black.card:hover {
|
|
-webkit-box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #27292a, 0px 1px 3px 0px #BCBDBD;
|
|
box-shadow: 0px 0px 0px 2px #e9eef2, 0px 2px 0px 0px #27292a, 0px 1px 3px 0px #BCBDBD;
|
|
}
|
|
/*--------------
|
|
Card Count
|
|
---------------*/
|
|
.ui.one.cards {
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
}
|
|
.ui.one.cards > .card {
|
|
width: 100%;
|
|
}
|
|
.ui.two.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.two.cards > .card {
|
|
width: calc( 50% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.three.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.three.cards > .card {
|
|
width: calc( 33.33333333% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.four.cards {
|
|
margin-left: -0.75em;
|
|
margin-right: -0.75em;
|
|
}
|
|
.ui.four.cards > .card {
|
|
width: calc( 25% - 1.5em );
|
|
margin-left: 0.75em;
|
|
margin-right: 0.75em;
|
|
}
|
|
.ui.five.cards {
|
|
margin-left: -0.75em;
|
|
margin-right: -0.75em;
|
|
}
|
|
.ui.five.cards > .card {
|
|
width: calc( 20% - 1.5em );
|
|
margin-left: 0.75em;
|
|
margin-right: 0.75em;
|
|
}
|
|
.ui.six.cards {
|
|
margin-left: -0.75em;
|
|
margin-right: -0.75em;
|
|
}
|
|
.ui.six.cards > .card {
|
|
width: calc( 16.66666667% - 1.5em );
|
|
margin-left: 0.75em;
|
|
margin-right: 0.75em;
|
|
}
|
|
.ui.seven.cards {
|
|
margin-left: -0.5em;
|
|
margin-right: -0.5em;
|
|
}
|
|
.ui.seven.cards > .card {
|
|
width: calc( 14.28571429% - 1em );
|
|
margin-left: 0.5em;
|
|
margin-right: 0.5em;
|
|
}
|
|
.ui.eight.cards {
|
|
margin-left: -0.5em;
|
|
margin-right: -0.5em;
|
|
}
|
|
.ui.eight.cards > .card {
|
|
width: calc( 12.5% - 1em );
|
|
margin-left: 0.5em;
|
|
margin-right: 0.5em;
|
|
font-size: 11px;
|
|
}
|
|
.ui.nine.cards {
|
|
margin-left: -0.5em;
|
|
margin-right: -0.5em;
|
|
}
|
|
.ui.nine.cards > .card {
|
|
width: calc( 11.11111111% - 1em );
|
|
margin-left: 0.5em;
|
|
margin-right: 0.5em;
|
|
font-size: 10px;
|
|
}
|
|
.ui.ten.cards {
|
|
margin-left: -0.5em;
|
|
margin-right: -0.5em;
|
|
}
|
|
.ui.ten.cards > .card {
|
|
width: calc( 10% - 1em );
|
|
margin-left: 0.5em;
|
|
margin-right: 0.5em;
|
|
}
|
|
/*-------------------
|
|
Doubling
|
|
--------------------*/
|
|
/* Mobile Only */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.two.doubling.cards {
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
}
|
|
.ui.two.doubling.cards .card {
|
|
width: 100%;
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
}
|
|
.ui.three.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.three.doubling.cards .card {
|
|
width: calc( 50% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.four.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.four.doubling.cards .card {
|
|
width: calc( 50% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.five.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.five.doubling.cards .card {
|
|
width: calc( 50% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.six.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.six.doubling.cards .card {
|
|
width: calc( 50% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.seven.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.seven.doubling.cards .card {
|
|
width: calc( 33.33333333% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.eight.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.eight.doubling.cards .card {
|
|
width: calc( 33.33333333% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.nine.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.nine.doubling.cards .card {
|
|
width: calc( 33.33333333% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.ten.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.ten.doubling.cards .card {
|
|
width: calc( 33.33333333% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
}
|
|
/* Tablet Only */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui.two.doubling.cards {
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
}
|
|
.ui.two.doubling.cards .card {
|
|
width: 100%;
|
|
margin-left: 0em;
|
|
margin-right: 0em;
|
|
}
|
|
.ui.three.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.three.doubling.cards .card {
|
|
width: calc( 50% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.four.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.four.doubling.cards .card {
|
|
width: calc( 50% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.five.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.five.doubling.cards .card {
|
|
width: calc( 33.33333333% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.six.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.six.doubling.cards .card {
|
|
width: calc( 33.33333333% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.eight.doubling.cards {
|
|
margin-left: -1em;
|
|
margin-right: -1em;
|
|
}
|
|
.ui.eight.doubling.cards .card {
|
|
width: calc( 33.33333333% - 2em );
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
.ui.eight.doubling.cards {
|
|
margin-left: -0.75em;
|
|
margin-right: -0.75em;
|
|
}
|
|
.ui.eight.doubling.cards .card {
|
|
width: calc( 25% - 1.5em );
|
|
margin-left: 0.75em;
|
|
margin-right: 0.75em;
|
|
}
|
|
.ui.nine.doubling.cards {
|
|
margin-left: -0.75em;
|
|
margin-right: -0.75em;
|
|
}
|
|
.ui.nine.doubling.cards .card {
|
|
width: calc( 25% - 1.5em );
|
|
margin-left: 0.75em;
|
|
margin-right: 0.75em;
|
|
}
|
|
.ui.ten.doubling.cards {
|
|
margin-left: -0.75em;
|
|
margin-right: -0.75em;
|
|
}
|
|
.ui.ten.doubling.cards .card {
|
|
width: calc( 20% - 1.5em );
|
|
margin-left: 0.75em;
|
|
margin-right: 0.75em;
|
|
}
|
|
}
|
|
/*-------------------
|
|
Stackable
|
|
--------------------*/
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.stackable.cards {
|
|
display: block !important;
|
|
}
|
|
.ui.stackable.cards .card:first-child {
|
|
margin-top: 0em !important;
|
|
}
|
|
.ui.stackable.cards > .card {
|
|
display: block !important;
|
|
height: auto !important;
|
|
margin: 1em 1em;
|
|
padding: 0 !important;
|
|
width: calc( 100% - 2em ) !important;
|
|
}
|
|
}
|
|
/*--------------
|
|
Size
|
|
---------------*/
|
|
.ui.cards > .card {
|
|
font-size: 1em;
|
|
}
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
.ui.card .ui.button.massive {
|
|
border-bottom-left-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Item
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Item
|
|
*******************************/
|
|
/*-------------------
|
|
View
|
|
--------------------*/
|
|
/* Group */
|
|
/* Item */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Content
|
|
--------------------*/
|
|
/* Image */
|
|
/* Content */
|
|
/* Header */
|
|
/* Metadata */
|
|
/* Icons */
|
|
/* Actions */
|
|
/* Links */
|
|
/* Description */
|
|
/* Content Image */
|
|
/* Avatar Image */
|
|
/* Paragraph */
|
|
/* Additional Content */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Relaxed */
|
|
/* Divided */
|
|
/* Sizes */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Item
|
|
*******************************/
|
|
/*-------------------
|
|
View
|
|
--------------------*/
|
|
/* Group */
|
|
/* Item */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Content
|
|
--------------------*/
|
|
/* Image */
|
|
/* Content */
|
|
/* Header */
|
|
/* Metadata */
|
|
/* Icons */
|
|
/* Actions */
|
|
/* Links */
|
|
/* Description */
|
|
/* Content Image */
|
|
/* Avatar Image */
|
|
/* Paragraph */
|
|
/* Additional Content */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Relaxed */
|
|
/* Divided */
|
|
/* Sizes */
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Standard
|
|
*******************************/
|
|
/*--------------
|
|
Item
|
|
---------------*/
|
|
.ui.items > .item {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
margin: 1em 0em;
|
|
width: 100%;
|
|
min-height: 0px;
|
|
background: transparent;
|
|
padding: 0em;
|
|
border: none;
|
|
border-radius: 0rem;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
-webkit-transition: -webkit-box-shadow 0.1s ease;
|
|
transition: -webkit-box-shadow 0.1s ease;
|
|
transition: box-shadow 0.1s ease;
|
|
transition: box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
z-index: '';
|
|
}
|
|
.ui.items > .item a {
|
|
cursor: pointer;
|
|
}
|
|
/*--------------
|
|
Items
|
|
---------------*/
|
|
.ui.items {
|
|
margin: 1.5em 0em;
|
|
}
|
|
.ui.items:first-child {
|
|
margin-top: 0em !important;
|
|
}
|
|
.ui.items:last-child {
|
|
margin-bottom: 0em !important;
|
|
}
|
|
/*--------------
|
|
Item
|
|
---------------*/
|
|
.ui.items > .item:after {
|
|
display: block;
|
|
content: ' ';
|
|
height: 0px;
|
|
clear: both;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
}
|
|
.ui.items > .item:first-child {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.items > .item:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*--------------
|
|
Images
|
|
---------------*/
|
|
.ui.items > .item > .image {
|
|
position: relative;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 0 auto;
|
|
flex: 0 0 auto;
|
|
display: block;
|
|
float: none;
|
|
margin: 0em;
|
|
padding: 0em;
|
|
max-height: '';
|
|
-ms-flex-item-align: top;
|
|
align-self: top;
|
|
}
|
|
.ui.items > .item > .image > img {
|
|
display: block;
|
|
width: 100%;
|
|
height: auto;
|
|
border-radius: 0.125rem;
|
|
border: none;
|
|
}
|
|
.ui.items > .item > .image:only-child > img {
|
|
border-radius: 0rem;
|
|
}
|
|
/*--------------
|
|
Content
|
|
---------------*/
|
|
.ui.items > .item > .content {
|
|
display: block;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1 1 auto;
|
|
flex: 1 1 auto;
|
|
background: none;
|
|
margin: 0em;
|
|
padding: 0em;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
font-size: 1em;
|
|
border: none;
|
|
border-radius: 0em;
|
|
}
|
|
.ui.items > .item > .content:after {
|
|
display: block;
|
|
content: ' ';
|
|
height: 0px;
|
|
clear: both;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
}
|
|
.ui.items > .item > .image + .content {
|
|
min-width: 0;
|
|
width: auto;
|
|
display: block;
|
|
margin-left: 0em;
|
|
-ms-flex-item-align: top;
|
|
align-self: top;
|
|
padding-left: 1.5em;
|
|
}
|
|
.ui.items > .item > .content > .header {
|
|
display: inline-block;
|
|
margin: -0.21425em 0em 0em;
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
/* Default Header Size */
|
|
.ui.items > .item > .content > .header:not(.ui) {
|
|
font-size: 1.28571429em;
|
|
}
|
|
/*--------------
|
|
Floated
|
|
---------------*/
|
|
.ui.items > .item [class*="left floated"] {
|
|
float: left;
|
|
}
|
|
.ui.items > .item [class*="right floated"] {
|
|
float: right;
|
|
}
|
|
/*--------------
|
|
Content Image
|
|
---------------*/
|
|
.ui.items > .item .content img {
|
|
-ms-flex-item-align: middle;
|
|
align-self: middle;
|
|
width: '';
|
|
}
|
|
.ui.items > .item img.avatar,
|
|
.ui.items > .item .avatar img {
|
|
width: '';
|
|
height: '';
|
|
border-radius: 500rem;
|
|
}
|
|
/*--------------
|
|
Description
|
|
---------------*/
|
|
.ui.items > .item > .content > .description {
|
|
margin-top: 0.6em;
|
|
max-width: auto;
|
|
font-size: 1em;
|
|
line-height: 1.4285em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/*--------------
|
|
Paragraph
|
|
---------------*/
|
|
.ui.items > .item > .content p {
|
|
margin: 0em 0em 0.5em;
|
|
}
|
|
.ui.items > .item > .content p:last-child {
|
|
margin-bottom: 0em;
|
|
}
|
|
/*--------------
|
|
Meta
|
|
---------------*/
|
|
.ui.items > .item .meta {
|
|
margin: 0.5em 0em 0.5em;
|
|
font-size: 1em;
|
|
line-height: 1em;
|
|
color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
.ui.items > .item .meta * {
|
|
margin-right: 0.3em;
|
|
}
|
|
.ui.items > .item .meta :last-child {
|
|
margin-right: 0em;
|
|
}
|
|
.ui.items > .item .meta [class*="right floated"] {
|
|
margin-right: 0em;
|
|
margin-left: 0.3em;
|
|
}
|
|
/*--------------
|
|
Links
|
|
---------------*/
|
|
/* Generic */
|
|
.ui.items > .item > .content a:not(.ui) {
|
|
color: '';
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
.ui.items > .item > .content a:not(.ui):hover {
|
|
color: '';
|
|
}
|
|
/* Header */
|
|
.ui.items > .item > .content > a.header {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
.ui.items > .item > .content > a.header:hover {
|
|
color: #1e70bf;
|
|
}
|
|
/* Meta */
|
|
.ui.items > .item .meta > a:not(.ui) {
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
.ui.items > .item .meta > a:not(.ui):hover {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/*--------------
|
|
Labels
|
|
---------------*/
|
|
/*-----Star----- */
|
|
/* Icon */
|
|
.ui.items > .item > .content .favorite.icon {
|
|
cursor: pointer;
|
|
opacity: 0.75;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
.ui.items > .item > .content .favorite.icon:hover {
|
|
opacity: 1;
|
|
color: #FFB70A;
|
|
}
|
|
.ui.items > .item > .content .active.favorite.icon {
|
|
color: #FFE623;
|
|
}
|
|
/*-----Like----- */
|
|
/* Icon */
|
|
.ui.items > .item > .content .like.icon {
|
|
cursor: pointer;
|
|
opacity: 0.75;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
.ui.items > .item > .content .like.icon:hover {
|
|
opacity: 1;
|
|
color: #FF2733;
|
|
}
|
|
.ui.items > .item > .content .active.like.icon {
|
|
color: #FF2733;
|
|
}
|
|
/*----------------
|
|
Extra Content
|
|
-----------------*/
|
|
.ui.items > .item .extra {
|
|
display: block;
|
|
position: relative;
|
|
background: none;
|
|
margin: 0.5rem 0em 0em;
|
|
width: 100%;
|
|
padding: 0em 0em 0em;
|
|
top: 0em;
|
|
left: 0em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
border-top: none;
|
|
}
|
|
.ui.items > .item .extra > * {
|
|
margin: 0.25rem 0.5rem 0.25rem 0em;
|
|
}
|
|
.ui.items > .item .extra > [class*="right floated"] {
|
|
margin: 0.25rem 0em 0.25rem 0.5rem;
|
|
}
|
|
.ui.items > .item .extra:after {
|
|
display: block;
|
|
content: ' ';
|
|
height: 0px;
|
|
clear: both;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
}
|
|
/*******************************
|
|
Responsive
|
|
*******************************/
|
|
/* Default Image Width */
|
|
.ui.items > .item > .image:not(.ui) {
|
|
width: 175px;
|
|
}
|
|
/* Tablet Only */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui.items > .item {
|
|
margin: 1em 0em;
|
|
}
|
|
.ui.items > .item > .image:not(.ui) {
|
|
width: 150px;
|
|
}
|
|
.ui.items > .item > .image + .content {
|
|
display: block;
|
|
padding: 0em 0em 0em 1em;
|
|
}
|
|
}
|
|
/* Mobile Only */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.items > .item {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
margin: 2em 0em;
|
|
}
|
|
.ui.items > .item > .image {
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.ui.items > .item > .image,
|
|
.ui.items > .item > .image > img {
|
|
max-width: 100% !important;
|
|
width: auto !important;
|
|
max-height: 250px !important;
|
|
}
|
|
.ui.items > .item > .image + .content {
|
|
display: block;
|
|
padding: 1.5em 0em 0em;
|
|
}
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Aligned
|
|
--------------------*/
|
|
.ui.items > .item > .image + [class*="top aligned"].content {
|
|
-ms-flex-item-align: start;
|
|
align-self: flex-start;
|
|
}
|
|
.ui.items > .item > .image + [class*="middle aligned"].content {
|
|
-ms-flex-item-align: center;
|
|
align-self: center;
|
|
}
|
|
.ui.items > .item > .image + [class*="bottom aligned"].content {
|
|
-ms-flex-item-align: end;
|
|
align-self: flex-end;
|
|
}
|
|
/*--------------
|
|
Relaxed
|
|
---------------*/
|
|
.ui.relaxed.items > .item {
|
|
margin: 1.5em 0em;
|
|
}
|
|
.ui[class*="very relaxed"].items > .item {
|
|
margin: 2em 0em;
|
|
}
|
|
/*-------------------
|
|
Divided
|
|
--------------------*/
|
|
.ui.divided.items > .item {
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
margin: 0em;
|
|
padding: 1em 0em;
|
|
}
|
|
.ui.divided.items > .item:first-child {
|
|
border-top: none;
|
|
margin-top: 0em !important;
|
|
padding-top: 0em !important;
|
|
}
|
|
.ui.divided.items > .item:last-child {
|
|
margin-bottom: 0em !important;
|
|
padding-bottom: 0em !important;
|
|
}
|
|
/* Relaxed Divided */
|
|
.ui.relaxed.divided.items > .item {
|
|
margin: 0em;
|
|
padding: 1.5em 0em;
|
|
}
|
|
.ui[class*="very relaxed"].divided.items > .item {
|
|
margin: 0em;
|
|
padding: 2em 0em;
|
|
}
|
|
/*-------------------
|
|
Link
|
|
--------------------*/
|
|
.ui.items a.item:hover,
|
|
.ui.link.items > .item:hover {
|
|
cursor: pointer;
|
|
}
|
|
.ui.items a.item:hover .content .header,
|
|
.ui.link.items > .item:hover .content .header {
|
|
color: #1e70bf;
|
|
}
|
|
/*--------------
|
|
Size
|
|
---------------*/
|
|
.ui.items > .item {
|
|
font-size: 1em;
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Modules */
|
|
/*!
|
|
* # Semantic UI - Accordion
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Accordion
|
|
*******************************/
|
|
/* Title */
|
|
/* Icon */
|
|
/* Child Accordion */
|
|
/* Content */
|
|
/*-------------------
|
|
Coupling
|
|
--------------------*/
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Styled */
|
|
/* Content */
|
|
/* Child Content */
|
|
/* Styled Title */
|
|
/* Styled Title States */
|
|
/* Styled Child Title States */
|
|
/* Inverted */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Accordion
|
|
*******************************/
|
|
/* Title */
|
|
/* Icon */
|
|
/* Child Accordion */
|
|
/* Content */
|
|
/*-------------------
|
|
Coupling
|
|
--------------------*/
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Styled */
|
|
/* Content */
|
|
/* Child Content */
|
|
/* Styled Title */
|
|
/* Styled Title States */
|
|
/* Styled Child Title States */
|
|
/* Inverted */
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Accordion
|
|
*******************************/
|
|
.ui.accordion,
|
|
.ui.accordion .accordion {
|
|
max-width: 100%;
|
|
}
|
|
.ui.accordion .accordion {
|
|
margin: 1em 0em 0em;
|
|
padding: 0em;
|
|
}
|
|
/* Title */
|
|
.ui.accordion .title,
|
|
.ui.accordion .accordion .title {
|
|
cursor: pointer;
|
|
}
|
|
/* Default Styling */
|
|
.ui.accordion .title:not(.ui) {
|
|
padding: 0.5em 0em;
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-size: 1em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/* Content */
|
|
.ui.accordion .title ~ .content,
|
|
.ui.accordion .accordion .title ~ .content {
|
|
display: none;
|
|
}
|
|
/* Default Styling */
|
|
.ui.accordion:not(.styled) .title ~ .content:not(.ui),
|
|
.ui.accordion:not(.styled) .accordion .title ~ .content:not(.ui) {
|
|
margin: '';
|
|
padding: 0.5em 0em 1em;
|
|
}
|
|
.ui.accordion:not(.styled) .title ~ .content:not(.ui):last-child {
|
|
padding-bottom: 0em;
|
|
}
|
|
/* Arrow */
|
|
.ui.accordion .title .dropdown.icon,
|
|
.ui.accordion .accordion .title .dropdown.icon {
|
|
display: inline-block;
|
|
float: none;
|
|
opacity: 1;
|
|
width: 1.25em;
|
|
height: 1em;
|
|
margin: 0em 0.25rem 0em 0rem;
|
|
padding: 0em;
|
|
font-size: 1em;
|
|
-webkit-transition: opacity 0.1s ease, -webkit-transform 0.1s ease;
|
|
transition: opacity 0.1s ease, -webkit-transform 0.1s ease;
|
|
transition: transform 0.1s ease, opacity 0.1s ease;
|
|
transition: transform 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease;
|
|
vertical-align: baseline;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
/*--------------
|
|
Coupling
|
|
---------------*/
|
|
/* Menu */
|
|
.ui.accordion.menu .item .title {
|
|
display: block;
|
|
padding: 0em;
|
|
}
|
|
.ui.accordion.menu .item .title > .dropdown.icon {
|
|
float: right;
|
|
margin: 0.21425em 0em 0em 1em;
|
|
-webkit-transform: rotate(180deg);
|
|
transform: rotate(180deg);
|
|
}
|
|
/* Header */
|
|
.ui.accordion .ui.header .dropdown.icon {
|
|
font-size: 1em;
|
|
margin: 0em 0.25rem 0em 0rem;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
.ui.accordion .active.title .dropdown.icon,
|
|
.ui.accordion .accordion .active.title .dropdown.icon {
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg);
|
|
}
|
|
.ui.accordion.menu .item .active.title > .dropdown.icon {
|
|
-webkit-transform: rotate(90deg);
|
|
transform: rotate(90deg);
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Styled
|
|
---------------*/
|
|
.ui.styled.accordion {
|
|
width: 600px;
|
|
}
|
|
.ui.styled.accordion,
|
|
.ui.styled.accordion .accordion {
|
|
border-radius: 0.28571429rem;
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), 0px 0px 0px 1px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), 0px 0px 0px 1px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.styled.accordion .title,
|
|
.ui.styled.accordion .accordion .title {
|
|
margin: 0em;
|
|
padding: 0.75em 1em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
font-weight: bold;
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
-webkit-transition: background 0.1s ease, color 0.1s ease;
|
|
transition: background 0.1s ease, color 0.1s ease;
|
|
}
|
|
.ui.styled.accordion > .title:first-child,
|
|
.ui.styled.accordion .accordion .title:first-child {
|
|
border-top: none;
|
|
}
|
|
/* Content */
|
|
.ui.styled.accordion .content,
|
|
.ui.styled.accordion .accordion .content {
|
|
margin: 0em;
|
|
padding: 0.5em 1em 1.5em;
|
|
}
|
|
.ui.styled.accordion .accordion .content {
|
|
padding: 0em;
|
|
padding: 0.5em 1em 1.5em;
|
|
}
|
|
/* Hover */
|
|
.ui.styled.accordion .title:hover,
|
|
.ui.styled.accordion .active.title,
|
|
.ui.styled.accordion .accordion .title:hover,
|
|
.ui.styled.accordion .accordion .active.title {
|
|
background: transparent;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.styled.accordion .accordion .title:hover,
|
|
.ui.styled.accordion .accordion .active.title {
|
|
background: transparent;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/* Active */
|
|
.ui.styled.accordion .active.title {
|
|
background: transparent;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
.ui.styled.accordion .accordion .active.title {
|
|
background: transparent;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Active
|
|
---------------*/
|
|
.ui.accordion .active.content,
|
|
.ui.accordion .accordion .active.content {
|
|
display: block;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Fluid
|
|
---------------*/
|
|
.ui.fluid.accordion,
|
|
.ui.fluid.accordion .accordion {
|
|
width: 100%;
|
|
}
|
|
/*--------------
|
|
Inverted
|
|
---------------*/
|
|
.ui.inverted.accordion .title:not(.ui) {
|
|
color: rgba(255, 255, 255, 0.9);
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
@font-face {
|
|
font-family: 'Accordion';
|
|
src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggjB5AAAAC8AAAAYGNtYXAPfOIKAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zryj6HgAAAFwAAAAyGhlYWT/0IhHAAACOAAAADZoaGVhApkB5wAAAnAAAAAkaG10eAJuABIAAAKUAAAAGGxvY2EAjABWAAACrAAAAA5tYXhwAAgAFgAAArwAAAAgbmFtZfC1n04AAALcAAABPHBvc3QAAwAAAAAEGAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDZ//3//wAB/+MPKwADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQASAEkAtwFuABMAADc0PwE2FzYXFh0BFAcGJwYvASY1EgaABQgHBQYGBQcIBYAG2wcGfwcBAQcECf8IBAcBAQd/BgYAAAAAAQAAAEkApQFuABMAADcRNDc2MzIfARYVFA8BBiMiJyY1AAUGBwgFgAYGgAUIBwYFWwEACAUGBoAFCAcFgAYGBQcAAAABAAAAAQAAqWYls18PPPUACwIAAAAAAM/9o+4AAAAAz/2j7gAAAAAAtwFuAAAACAACAAAAAAAAAAEAAAHg/+AAAAIAAAAAAAC3AAEAAAAAAAAAAAAAAAAAAAAGAAAAAAAAAAAAAAAAAQAAAAC3ABIAtwAAAAAAAAAKABQAHgBCAGQAAAABAAAABgAUAAEAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEADAAAAAEAAAAAAAIADgBAAAEAAAAAAAMADAAiAAEAAAAAAAQADABOAAEAAAAAAAUAFgAMAAEAAAAAAAYABgAuAAEAAAAAAAoANABaAAMAAQQJAAEADAAAAAMAAQQJAAIADgBAAAMAAQQJAAMADAAiAAMAAQQJAAQADABOAAMAAQQJAAUAFgAMAAMAAQQJAAYADAA0AAMAAQQJAAoANABaAHIAYQB0AGkAbgBnAFYAZQByAHMAaQBvAG4AIAAxAC4AMAByAGEAdABpAG4AZ3JhdGluZwByAGEAdABpAG4AZwBSAGUAZwB1AGwAYQByAHIAYQB0AGkAbgBnAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAASwAAoAAAAABGgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAS0AAAEtFpovuE9TLzIAAAIkAAAAYAAAAGAIIweQY21hcAAAAoQAAABMAAAATA984gpnYXNwAAAC0AAAAAgAAAAIAAAAEGhlYWQAAALYAAAANgAAADb/0IhHaGhlYQAAAxAAAAAkAAAAJAKZAedobXR4AAADNAAAABgAAAAYAm4AEm1heHAAAANMAAAABgAAAAYABlAAbmFtZQAAA1QAAAE8AAABPPC1n05wb3N0AAAEkAAAACAAAAAgAAMAAAEABAQAAQEBB3JhdGluZwABAgABADr4HAL4GwP4GAQeCgAZU/+Lix4KABlT/4uLDAeLa/iU+HQFHQAAAHkPHQAAAH4RHQAAAAkdAAABJBIABwEBBw0PERQZHnJhdGluZ3JhdGluZ3UwdTF1MjB1RjBEOXVGMERBAAACAYkABAAGAQEEBwoNVp38lA78lA78lA77lA773Z33bxWLkI2Qj44I9xT3FAWOj5CNkIuQi4+JjoePiI2Gi4YIi/uUBYuGiYeHiIiHh4mGi4aLho2Ijwj7FPcUBYeOiY+LkAgO+92L5hWL95QFi5CNkI6Oj4+PjZCLkIuQiY6HCPcU+xQFj4iNhouGi4aJh4eICPsU+xQFiIeGiYaLhouHjYePiI6Jj4uQCA74lBT4lBWLDAoAAAAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDZ//3//wAB/+MPKwADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAEAADfYOJZfDzz1AAsCAAAAAADP/aPuAAAAAM/9o+4AAAAAALcBbgAAAAgAAgAAAAAAAAABAAAB4P/gAAACAAAAAAAAtwABAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAAAAAAAAEAAAAAtwASALcAAAAAUAAABgAAAAAADgCuAAEAAAAAAAEADAAAAAEAAAAAAAIADgBAAAEAAAAAAAMADAAiAAEAAAAAAAQADABOAAEAAAAAAAUAFgAMAAEAAAAAAAYABgAuAAEAAAAAAAoANABaAAMAAQQJAAEADAAAAAMAAQQJAAIADgBAAAMAAQQJAAMADAAiAAMAAQQJAAQADABOAAMAAQQJAAUAFgAMAAMAAQQJAAYADAA0AAMAAQQJAAoANABaAHIAYQB0AGkAbgBnAFYAZQByAHMAaQBvAG4AIAAxAC4AMAByAGEAdABpAG4AZ3JhdGluZwByAGEAdABpAG4AZwBSAGUAZwB1AGwAYQByAHIAYQB0AGkAbgBnAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('woff');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
/* Dropdown Icon */
|
|
.ui.accordion .title .dropdown.icon,
|
|
.ui.accordion .accordion .title .dropdown.icon {
|
|
font-family: Accordion;
|
|
line-height: 1;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
text-align: center;
|
|
}
|
|
.ui.accordion .title .dropdown.icon:before,
|
|
.ui.accordion .accordion .title .dropdown.icon:before {
|
|
content: '\f0da' /*rtl:'\f0d9'*/;
|
|
}
|
|
/*******************************
|
|
User Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Checkbox
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Checkbox
|
|
*******************************/
|
|
/* Label */
|
|
/* 26px @ 14/em */
|
|
/* Checkbox */
|
|
/* Checkmark */
|
|
/* Label */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Hover */
|
|
/* Pressed */
|
|
/* Focus */
|
|
/* Active */
|
|
/* Active Focus */
|
|
/* Indeterminate */
|
|
/* Disabled */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Radio */
|
|
/* Uses px to avoid rounding issues with circles */
|
|
/* 7px as unitless value from radio size */
|
|
/* Slider & Toggle Handle */
|
|
/* Slider */
|
|
/* Slider States */
|
|
/* Toggle */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Checkbox
|
|
*******************************/
|
|
/* Label */
|
|
/* 26px @ 14/em */
|
|
/* Checkbox */
|
|
/* Checkmark */
|
|
/* Label */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Hover */
|
|
/* Pressed */
|
|
/* Focus */
|
|
/* Active */
|
|
/* Active Focus */
|
|
/* Indeterminate */
|
|
/* Disabled */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Radio */
|
|
/* Uses px to avoid rounding issues with circles */
|
|
/* 7px as unitless value from radio size */
|
|
/* Slider & Toggle Handle */
|
|
/* Slider */
|
|
/* Slider States */
|
|
/* Toggle */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Checkbox
|
|
*******************************/
|
|
/*--------------
|
|
Content
|
|
---------------*/
|
|
.ui.checkbox {
|
|
position: relative;
|
|
display: inline-block;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
outline: none;
|
|
vertical-align: baseline;
|
|
font-style: normal;
|
|
min-height: 17px;
|
|
font-size: 1rem;
|
|
line-height: 17px;
|
|
min-width: 17px;
|
|
}
|
|
/* HTML Checkbox */
|
|
.ui.checkbox input[type="checkbox"],
|
|
.ui.checkbox input[type="radio"] {
|
|
cursor: pointer;
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
opacity: 0 !important;
|
|
outline: none;
|
|
z-index: 3;
|
|
width: 17px;
|
|
height: 17px;
|
|
}
|
|
/*--------------
|
|
Box
|
|
---------------*/
|
|
.ui.checkbox .box,
|
|
.ui.checkbox label {
|
|
cursor: auto;
|
|
position: relative;
|
|
display: block;
|
|
padding-left: 1.85714em;
|
|
outline: none;
|
|
font-size: 1em;
|
|
}
|
|
.ui.checkbox .box:before,
|
|
.ui.checkbox label:before {
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 17px;
|
|
height: 17px;
|
|
content: '';
|
|
background: #FFFFFF;
|
|
border-radius: 0.21428571rem;
|
|
-webkit-transition: border 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: border 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: border 0.1s ease, opacity 0.1s ease, transform 0.1s ease, box-shadow 0.1s ease;
|
|
transition: border 0.1s ease, opacity 0.1s ease, transform 0.1s ease, box-shadow 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
border: 1px solid #D4D4D5;
|
|
}
|
|
/*--------------
|
|
Checkmark
|
|
---------------*/
|
|
.ui.checkbox .box:after,
|
|
.ui.checkbox label:after {
|
|
position: absolute;
|
|
font-size: 14px;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 17px;
|
|
height: 17px;
|
|
text-align: center;
|
|
opacity: 0;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-transition: border 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: border 0.1s ease, opacity 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: border 0.1s ease, opacity 0.1s ease, transform 0.1s ease, box-shadow 0.1s ease;
|
|
transition: border 0.1s ease, opacity 0.1s ease, transform 0.1s ease, box-shadow 0.1s ease, -webkit-transform 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
}
|
|
/*--------------
|
|
Label
|
|
---------------*/
|
|
/* Inside */
|
|
.ui.checkbox label,
|
|
.ui.checkbox + label {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-transition: color 0.1s ease;
|
|
transition: color 0.1s ease;
|
|
}
|
|
/* Outside */
|
|
.ui.checkbox + label {
|
|
vertical-align: middle;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Hover
|
|
---------------*/
|
|
.ui.checkbox .box:hover::before,
|
|
.ui.checkbox label:hover::before {
|
|
background: #FFFFFF;
|
|
border-color: rgba(34, 36, 38, 0.35);
|
|
}
|
|
.ui.checkbox label:hover,
|
|
.ui.checkbox + label:hover {
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
/*--------------
|
|
Down
|
|
---------------*/
|
|
.ui.checkbox .box:active::before,
|
|
.ui.checkbox label:active::before {
|
|
background: #F9FAFB;
|
|
border-color: rgba(34, 36, 38, 0.35);
|
|
}
|
|
.ui.checkbox .box:active::after,
|
|
.ui.checkbox label:active::after {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
.ui.checkbox input:active ~ label {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Focus
|
|
---------------*/
|
|
.ui.checkbox input:focus ~ .box:before,
|
|
.ui.checkbox input:focus ~ label:before {
|
|
background: #FFFFFF;
|
|
border-color: #96C8DA;
|
|
}
|
|
.ui.checkbox input:focus ~ .box:after,
|
|
.ui.checkbox input:focus ~ label:after {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
.ui.checkbox input:focus ~ label {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Active
|
|
---------------*/
|
|
.ui.checkbox input:checked ~ .box:before,
|
|
.ui.checkbox input:checked ~ label:before {
|
|
background: #FFFFFF;
|
|
border-color: rgba(34, 36, 38, 0.35);
|
|
}
|
|
.ui.checkbox input:checked ~ .box:after,
|
|
.ui.checkbox input:checked ~ label:after {
|
|
opacity: 1;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Indeterminate
|
|
---------------*/
|
|
.ui.checkbox input:not([type=radio]):indeterminate ~ .box:before,
|
|
.ui.checkbox input:not([type=radio]):indeterminate ~ label:before {
|
|
background: #FFFFFF;
|
|
border-color: rgba(34, 36, 38, 0.35);
|
|
}
|
|
.ui.checkbox input:not([type=radio]):indeterminate ~ .box:after,
|
|
.ui.checkbox input:not([type=radio]):indeterminate ~ label:after {
|
|
opacity: 1;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Active Focus
|
|
---------------*/
|
|
.ui.checkbox input:not([type=radio]):indeterminate:focus ~ .box:before,
|
|
.ui.checkbox input:not([type=radio]):indeterminate:focus ~ label:before,
|
|
.ui.checkbox input:checked:focus ~ .box:before,
|
|
.ui.checkbox input:checked:focus ~ label:before {
|
|
background: #FFFFFF;
|
|
border-color: #96C8DA;
|
|
}
|
|
.ui.checkbox input:not([type=radio]):indeterminate:focus ~ .box:after,
|
|
.ui.checkbox input:not([type=radio]):indeterminate:focus ~ label:after,
|
|
.ui.checkbox input:checked:focus ~ .box:after,
|
|
.ui.checkbox input:checked:focus ~ label:after {
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Read-Only
|
|
---------------*/
|
|
.ui.read-only.checkbox,
|
|
.ui.read-only.checkbox label {
|
|
cursor: default;
|
|
}
|
|
/*--------------
|
|
Disabled
|
|
---------------*/
|
|
.ui.disabled.checkbox .box:after,
|
|
.ui.disabled.checkbox label,
|
|
.ui.checkbox input[disabled] ~ .box:after,
|
|
.ui.checkbox input[disabled] ~ label {
|
|
cursor: default !important;
|
|
opacity: 0.5;
|
|
color: #000000;
|
|
}
|
|
/*--------------
|
|
Hidden
|
|
---------------*/
|
|
/* Initialized checkbox moves input below element
|
|
to prevent manually triggering */
|
|
.ui.checkbox input.hidden {
|
|
z-index: -1;
|
|
}
|
|
/* Selectable Label */
|
|
.ui.checkbox input.hidden + label {
|
|
cursor: pointer;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Radio
|
|
---------------*/
|
|
.ui.radio.checkbox {
|
|
min-height: 15px;
|
|
}
|
|
.ui.radio.checkbox .box,
|
|
.ui.radio.checkbox label {
|
|
padding-left: 1.85714em;
|
|
}
|
|
/* Box */
|
|
.ui.radio.checkbox .box:before,
|
|
.ui.radio.checkbox label:before {
|
|
content: '';
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
width: 15px;
|
|
height: 15px;
|
|
border-radius: 500rem;
|
|
top: 1px;
|
|
left: 0px;
|
|
}
|
|
/* Bullet */
|
|
.ui.radio.checkbox .box:after,
|
|
.ui.radio.checkbox label:after {
|
|
border: none;
|
|
content: '' !important;
|
|
width: 15px;
|
|
height: 15px;
|
|
line-height: 15px;
|
|
}
|
|
/* Radio Checkbox */
|
|
.ui.radio.checkbox .box:after,
|
|
.ui.radio.checkbox label:after {
|
|
top: 1px;
|
|
left: 0px;
|
|
width: 15px;
|
|
height: 15px;
|
|
border-radius: 500rem;
|
|
-webkit-transform: scale(0.46666667);
|
|
transform: scale(0.46666667);
|
|
background-color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/* Focus */
|
|
.ui.radio.checkbox input:focus ~ .box:before,
|
|
.ui.radio.checkbox input:focus ~ label:before {
|
|
background-color: #FFFFFF;
|
|
}
|
|
.ui.radio.checkbox input:focus ~ .box:after,
|
|
.ui.radio.checkbox input:focus ~ label:after {
|
|
background-color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Indeterminate */
|
|
.ui.radio.checkbox input:indeterminate ~ .box:after,
|
|
.ui.radio.checkbox input:indeterminate ~ label:after {
|
|
opacity: 0;
|
|
}
|
|
/* Active */
|
|
.ui.radio.checkbox input:checked ~ .box:before,
|
|
.ui.radio.checkbox input:checked ~ label:before {
|
|
background-color: #FFFFFF;
|
|
}
|
|
.ui.radio.checkbox input:checked ~ .box:after,
|
|
.ui.radio.checkbox input:checked ~ label:after {
|
|
background-color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/* Active Focus */
|
|
.ui.radio.checkbox input:focus:checked ~ .box:before,
|
|
.ui.radio.checkbox input:focus:checked ~ label:before {
|
|
background-color: #FFFFFF;
|
|
}
|
|
.ui.radio.checkbox input:focus:checked ~ .box:after,
|
|
.ui.radio.checkbox input:focus:checked ~ label:after {
|
|
background-color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------
|
|
Slider
|
|
---------------*/
|
|
.ui.slider.checkbox {
|
|
min-height: 1.25rem;
|
|
}
|
|
/* Input */
|
|
.ui.slider.checkbox input {
|
|
width: 3.5rem;
|
|
height: 1.25rem;
|
|
}
|
|
/* Label */
|
|
.ui.slider.checkbox .box,
|
|
.ui.slider.checkbox label {
|
|
padding-left: 4.5rem;
|
|
line-height: 1rem;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
/* Line */
|
|
.ui.slider.checkbox .box:before,
|
|
.ui.slider.checkbox label:before {
|
|
display: block;
|
|
position: absolute;
|
|
content: '';
|
|
border: none !important;
|
|
left: 0em;
|
|
z-index: 1;
|
|
top: 0.4rem;
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
width: 3.5rem;
|
|
height: 0.21428571rem;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
border-radius: 500rem;
|
|
-webkit-transition: background 0.3s ease;
|
|
transition: background 0.3s ease;
|
|
}
|
|
/* Handle */
|
|
.ui.slider.checkbox .box:after,
|
|
.ui.slider.checkbox label:after {
|
|
background: #FFFFFF -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
|
|
background: #FFFFFF linear-gradient(transparent, rgba(0, 0, 0, 0.05));
|
|
position: absolute;
|
|
content: '' !important;
|
|
opacity: 1;
|
|
z-index: 2;
|
|
border: none;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
|
|
width: 1.5rem;
|
|
height: 1.5rem;
|
|
top: -0.25rem;
|
|
left: 0em;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
border-radius: 500rem;
|
|
-webkit-transition: left 0.3s ease;
|
|
transition: left 0.3s ease;
|
|
}
|
|
/* Focus */
|
|
.ui.slider.checkbox input:focus ~ .box:before,
|
|
.ui.slider.checkbox input:focus ~ label:before {
|
|
background-color: rgba(0, 0, 0, 0.15);
|
|
border: none;
|
|
}
|
|
/* Hover */
|
|
.ui.slider.checkbox .box:hover,
|
|
.ui.slider.checkbox label:hover {
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
.ui.slider.checkbox .box:hover::before,
|
|
.ui.slider.checkbox label:hover::before {
|
|
background: rgba(0, 0, 0, 0.15);
|
|
}
|
|
/* Active */
|
|
.ui.slider.checkbox input:checked ~ .box,
|
|
.ui.slider.checkbox input:checked ~ label {
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
.ui.slider.checkbox input:checked ~ .box:before,
|
|
.ui.slider.checkbox input:checked ~ label:before {
|
|
background-color: #545454 !important;
|
|
}
|
|
.ui.slider.checkbox input:checked ~ .box:after,
|
|
.ui.slider.checkbox input:checked ~ label:after {
|
|
left: 2rem;
|
|
}
|
|
/* Active Focus */
|
|
.ui.slider.checkbox input:focus:checked ~ .box,
|
|
.ui.slider.checkbox input:focus:checked ~ label {
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
.ui.slider.checkbox input:focus:checked ~ .box:before,
|
|
.ui.slider.checkbox input:focus:checked ~ label:before {
|
|
background-color: #000000 !important;
|
|
}
|
|
/*--------------
|
|
Toggle
|
|
---------------*/
|
|
.ui.toggle.checkbox {
|
|
min-height: 1.5rem;
|
|
}
|
|
/* Input */
|
|
.ui.toggle.checkbox input {
|
|
width: 3.5rem;
|
|
height: 1.5rem;
|
|
}
|
|
/* Label */
|
|
.ui.toggle.checkbox .box,
|
|
.ui.toggle.checkbox label {
|
|
min-height: 1.5rem;
|
|
padding-left: 4.5rem;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.toggle.checkbox label {
|
|
padding-top: 0.15em;
|
|
}
|
|
/* Switch */
|
|
.ui.toggle.checkbox .box:before,
|
|
.ui.toggle.checkbox label:before {
|
|
display: block;
|
|
position: absolute;
|
|
content: '';
|
|
z-index: 1;
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
border: none;
|
|
top: 0rem;
|
|
background: rgba(0, 0, 0, 0.05);
|
|
width: 3.5rem;
|
|
height: 1.5rem;
|
|
border-radius: 500rem;
|
|
}
|
|
/* Handle */
|
|
.ui.toggle.checkbox .box:after,
|
|
.ui.toggle.checkbox label:after {
|
|
background: #FFFFFF -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
|
|
background: #FFFFFF linear-gradient(transparent, rgba(0, 0, 0, 0.05));
|
|
position: absolute;
|
|
content: '' !important;
|
|
opacity: 1;
|
|
z-index: 2;
|
|
border: none;
|
|
-webkit-box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 1px 2px 0 rgba(34, 36, 38, 0.15), 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
|
|
width: 1.5rem;
|
|
height: 1.5rem;
|
|
top: 0rem;
|
|
left: 0em;
|
|
border-radius: 500rem;
|
|
-webkit-transition: background 0.3s ease, left 0.3s ease;
|
|
transition: background 0.3s ease, left 0.3s ease;
|
|
}
|
|
.ui.toggle.checkbox input ~ .box:after,
|
|
.ui.toggle.checkbox input ~ label:after {
|
|
left: -0.05rem;
|
|
}
|
|
/* Focus */
|
|
.ui.toggle.checkbox input:focus ~ .box:before,
|
|
.ui.toggle.checkbox input:focus ~ label:before {
|
|
background-color: rgba(0, 0, 0, 0.15);
|
|
border: none;
|
|
}
|
|
/* Hover */
|
|
.ui.toggle.checkbox .box:hover::before,
|
|
.ui.toggle.checkbox label:hover::before {
|
|
background-color: rgba(0, 0, 0, 0.15);
|
|
border: none;
|
|
}
|
|
/* Active */
|
|
.ui.toggle.checkbox input:checked ~ .box,
|
|
.ui.toggle.checkbox input:checked ~ label {
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
.ui.toggle.checkbox input:checked ~ .box:before,
|
|
.ui.toggle.checkbox input:checked ~ label:before {
|
|
background-color: #6633cc !important;
|
|
}
|
|
.ui.toggle.checkbox input:checked ~ .box:after,
|
|
.ui.toggle.checkbox input:checked ~ label:after {
|
|
left: 2.15rem;
|
|
}
|
|
/* Active Focus */
|
|
.ui.toggle.checkbox input:focus:checked ~ .box,
|
|
.ui.toggle.checkbox input:focus:checked ~ label {
|
|
color: rgba(0, 0, 0, 0.95) !important;
|
|
}
|
|
.ui.toggle.checkbox input:focus:checked ~ .box:before,
|
|
.ui.toggle.checkbox input:focus:checked ~ label:before {
|
|
background-color: #511eb8 !important;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Fitted
|
|
---------------*/
|
|
.ui.fitted.checkbox .box,
|
|
.ui.fitted.checkbox label {
|
|
padding-left: 0em !important;
|
|
}
|
|
.ui.fitted.toggle.checkbox,
|
|
.ui.fitted.toggle.checkbox {
|
|
width: 3.5rem;
|
|
}
|
|
.ui.fitted.slider.checkbox,
|
|
.ui.fitted.slider.checkbox {
|
|
width: 3.5rem;
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
@font-face {
|
|
font-family: 'Checkbox';
|
|
src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBD8AAAC8AAAAYGNtYXAYVtCJAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5Zn4huwUAAAF4AAABYGhlYWQGPe1ZAAAC2AAAADZoaGVhB30DyAAAAxAAAAAkaG10eBBKAEUAAAM0AAAAHGxvY2EAmgESAAADUAAAABBtYXhwAAkALwAAA2AAAAAgbmFtZSC8IugAAAOAAAABknBvc3QAAwAAAAAFFAAAACAAAwMTAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADoAgPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg6AL//f//AAAAAAAg6AD//f//AAH/4xgEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAEUAUQO7AvgAGgAAARQHAQYjIicBJjU0PwE2MzIfAQE2MzIfARYVA7sQ/hQQFhcQ/uMQEE4QFxcQqAF2EBcXEE4QAnMWEP4UEBABHRAXFhBOEBCoAXcQEE4QFwAAAAABAAABbgMlAkkAFAAAARUUBwYjISInJj0BNDc2MyEyFxYVAyUQEBf9SRcQEBAQFwK3FxAQAhJtFxAQEBAXbRcQEBAQFwAAAAABAAAASQMlA24ALAAAARUUBwYrARUUBwYrASInJj0BIyInJj0BNDc2OwE1NDc2OwEyFxYdATMyFxYVAyUQEBfuEBAXbhYQEO4XEBAQEBfuEBAWbhcQEO4XEBACEm0XEBDuFxAQEBAX7hAQF20XEBDuFxAQEBAX7hAQFwAAAQAAAAIAAHRSzT9fDzz1AAsEAAAAAADRsdR3AAAAANGx1HcAAAAAA7sDbgAAAAgAAgAAAAAAAAABAAADwP/AAAAEAAAAAAADuwABAAAAAAAAAAAAAAAAAAAABwQAAAAAAAAAAAAAAAIAAAAEAABFAyUAAAMlAAAAAAAAAAoAFAAeAE4AcgCwAAEAAAAHAC0AAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAIAAAAAQAAAAAAAgAHAGkAAQAAAAAAAwAIADkAAQAAAAAABAAIAH4AAQAAAAAABQALABgAAQAAAAAABgAIAFEAAQAAAAAACgAaAJYAAwABBAkAAQAQAAgAAwABBAkAAgAOAHAAAwABBAkAAwAQAEEAAwABBAkABAAQAIYAAwABBAkABQAWACMAAwABBAkABgAQAFkAAwABBAkACgA0ALBDaGVja2JveABDAGgAZQBjAGsAYgBvAHhWZXJzaW9uIDIuMABWAGUAcgBzAGkAbwBuACAAMgAuADBDaGVja2JveABDAGgAZQBjAGsAYgBvAHhDaGVja2JveABDAGgAZQBjAGsAYgBvAHhSZWd1bGFyAFIAZQBnAHUAbABhAHJDaGVja2JveABDAGgAZQBjAGsAYgBvAHhGb250IGdlbmVyYXRlZCBieSBJY29Nb29uLgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype');
|
|
}
|
|
/* Checkmark */
|
|
.ui.checkbox label:after,
|
|
.ui.checkbox .box:after {
|
|
font-family: 'Checkbox';
|
|
}
|
|
/* Checked */
|
|
.ui.checkbox input:checked ~ .box:after,
|
|
.ui.checkbox input:checked ~ label:after {
|
|
content: '\e800';
|
|
}
|
|
/* Indeterminate */
|
|
.ui.checkbox input:indeterminate ~ .box:after,
|
|
.ui.checkbox input:indeterminate ~ label:after {
|
|
font-size: 12px;
|
|
content: '\e801';
|
|
}
|
|
/* UTF Reference
|
|
.check:before { content: '\e800'; }
|
|
.dash:before { content: '\e801'; }
|
|
.plus:before { content: '\e802'; }
|
|
*/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Dimmer
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Dimmer
|
|
*******************************/
|
|
/* Hidden (Default) */
|
|
/* Content */
|
|
/* Visible */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Page Dimmer*/
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Inverted */
|
|
/* Simple */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Dimmer
|
|
*******************************/
|
|
.dimmable:not(.body) {
|
|
position: relative;
|
|
}
|
|
.ui.dimmer {
|
|
display: none;
|
|
position: absolute;
|
|
top: 0em !important;
|
|
left: 0em !important;
|
|
width: 100%;
|
|
height: 100%;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
background-color: rgba(0, 0, 0, 0.85);
|
|
opacity: 0;
|
|
line-height: 1;
|
|
-webkit-animation-fill-mode: both;
|
|
animation-fill-mode: both;
|
|
-webkit-animation-duration: 0.5s;
|
|
animation-duration: 0.5s;
|
|
-webkit-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;
|
|
will-change: opacity;
|
|
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 > * {
|
|
display: table-cell;
|
|
vertical-align: middle;
|
|
color: #FFFFFF;
|
|
}
|
|
/* Loose Coupling */
|
|
.ui.segment > .ui.dimmer {
|
|
border-radius: inherit !important;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
.animating.dimmable:not(body),
|
|
.dimmed.dimmable:not(body) {
|
|
overflow: hidden;
|
|
}
|
|
.dimmed.dimmable > .ui.animating.dimmer,
|
|
.dimmed.dimmable > .ui.visible.dimmer,
|
|
.ui.active.dimmer {
|
|
display: block;
|
|
opacity: 1;
|
|
}
|
|
.ui.disabled.dimmer {
|
|
width: 0 !important;
|
|
height: 0 !important;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Page
|
|
---------------*/
|
|
.ui.page.dimmer {
|
|
position: fixed;
|
|
-webkit-transform-style: '';
|
|
transform-style: '';
|
|
-webkit-perspective: 2000px;
|
|
perspective: 2000px;
|
|
-webkit-transform-origin: center center;
|
|
transform-origin: center center;
|
|
}
|
|
body.animating.in.dimmable,
|
|
body.dimmed.dimmable {
|
|
overflow: hidden;
|
|
}
|
|
body.dimmable > .dimmer {
|
|
position: fixed;
|
|
}
|
|
/*--------------
|
|
Blurring
|
|
---------------*/
|
|
.blurring.dimmable > :not(.dimmer) {
|
|
-webkit-filter: blur(0px) grayscale(0);
|
|
filter: blur(0px) grayscale(0);
|
|
-webkit-transition: 800ms -webkit-filter ease;
|
|
transition: 800ms -webkit-filter ease;
|
|
transition: 800ms filter ease;
|
|
transition: 800ms filter ease, 800ms -webkit-filter ease;
|
|
}
|
|
.blurring.dimmed.dimmable > :not(.dimmer) {
|
|
-webkit-filter: blur(5px) grayscale(0.7);
|
|
filter: blur(5px) grayscale(0.7);
|
|
}
|
|
/* Dimmer Color */
|
|
.blurring.dimmable > .dimmer {
|
|
background-color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
.blurring.dimmable > .inverted.dimmer {
|
|
background-color: rgba(255, 255, 255, 0.6);
|
|
}
|
|
/*--------------
|
|
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: #FFFFFF;
|
|
}
|
|
/*--------------
|
|
Simple
|
|
---------------*/
|
|
/* Displays without javascript */
|
|
.ui.simple.dimmer {
|
|
display: block;
|
|
overflow: hidden;
|
|
opacity: 1;
|
|
width: 0%;
|
|
height: 0%;
|
|
z-index: -100;
|
|
background-color: rgba(0, 0, 0, 0);
|
|
}
|
|
.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);
|
|
}
|
|
.dimmed.dimmable > .ui.simple.inverted.dimmer {
|
|
background-color: rgba(255, 255, 255, 0.85);
|
|
}
|
|
/*******************************
|
|
User Overrides
|
|
*******************************/
|
|
/*******************************
|
|
User Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Dropdown
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Dropdown
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*-------------------
|
|
Content
|
|
--------------------*/
|
|
/* Icon */
|
|
/* Current Text */
|
|
/* Menu */
|
|
/* Text */
|
|
/* Menu Item */
|
|
/* Sub Menu */
|
|
/* Menu Header */
|
|
/* Menu Divider */
|
|
/* Menu Input */
|
|
/* Menu Image */
|
|
/* Item Sub-Element */
|
|
/* Sub-Menu Dropdown Icon */
|
|
/* Description */
|
|
/* Message */
|
|
/* Floated Content */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/*------------
|
|
Selection
|
|
--------------*/
|
|
/* <select> */
|
|
/* Responsive */
|
|
/* Derived */
|
|
/* 1px / em size */
|
|
/* Hover */
|
|
/* Focus */
|
|
/* Visible */
|
|
/* Visible Hover */
|
|
/*--------------
|
|
Search
|
|
--------------*/
|
|
/* Search Selection */
|
|
/* Inline */
|
|
/*--------------
|
|
Multiple
|
|
--------------*/
|
|
/* Split Actual Padding Between Child and Parent (allows for label spacing) */
|
|
/* Child Elements */
|
|
/* Dropdown Icon */
|
|
/* Selection Label */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Hovered */
|
|
/* Default Text */
|
|
/* Loading */
|
|
/* Active Menu Item */
|
|
/* Selected */
|
|
/* Error */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Scrolling */
|
|
/* 0px / em size */
|
|
/* Upward */
|
|
/* Flyout Direction */
|
|
/* Left */
|
|
/* Simple */
|
|
/* Floating */
|
|
/* Pointing */
|
|
/* Pointing Upward */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Dropdown
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*-------------------
|
|
Content
|
|
--------------------*/
|
|
/* Icon */
|
|
/* Current Text */
|
|
/* Menu */
|
|
/* Text */
|
|
/* Menu Item */
|
|
/* Sub Menu */
|
|
/* Menu Header */
|
|
/* Menu Divider */
|
|
/* Menu Input */
|
|
/* Menu Image */
|
|
/* Item Sub-Element */
|
|
/* Sub-Menu Dropdown Icon */
|
|
/* Description */
|
|
/* Message */
|
|
/* Floated Content */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/*------------
|
|
Selection
|
|
--------------*/
|
|
/* <select> */
|
|
/* Responsive */
|
|
/* Derived */
|
|
/* 1px / em size */
|
|
/* Hover */
|
|
/* Focus */
|
|
/* Visible */
|
|
/* Visible Hover */
|
|
/*--------------
|
|
Search
|
|
--------------*/
|
|
/* Search Selection */
|
|
/* Inline */
|
|
/*--------------
|
|
Multiple
|
|
--------------*/
|
|
/* Split Actual Padding Between Child and Parent (allows for label spacing) */
|
|
/* Child Elements */
|
|
/* Dropdown Icon */
|
|
/* Selection Label */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Hovered */
|
|
/* Default Text */
|
|
/* Loading */
|
|
/* Active Menu Item */
|
|
/* Selected */
|
|
/* Error */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Scrolling */
|
|
/* 0px / em size */
|
|
/* Upward */
|
|
/* Flyout Direction */
|
|
/* Left */
|
|
/* Simple */
|
|
/* Floating */
|
|
/* Pointing */
|
|
/* Pointing Upward */
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Dropdown
|
|
*******************************/
|
|
.ui.dropdown {
|
|
cursor: pointer;
|
|
position: relative;
|
|
display: inline-block;
|
|
outline: none;
|
|
text-align: left;
|
|
-webkit-transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: box-shadow 0.1s ease, width 0.1s ease;
|
|
transition: box-shadow 0.1s ease, width 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
}
|
|
/*******************************
|
|
Content
|
|
*******************************/
|
|
/*--------------
|
|
Menu
|
|
---------------*/
|
|
.ui.dropdown .menu {
|
|
cursor: auto;
|
|
position: absolute;
|
|
display: none;
|
|
outline: none;
|
|
top: 100%;
|
|
min-width: -webkit-max-content;
|
|
min-width: -moz-max-content;
|
|
min-width: max-content;
|
|
margin: 0em;
|
|
padding: 0em 0em;
|
|
background: #FFFFFF;
|
|
font-size: 1em;
|
|
text-shadow: none;
|
|
text-align: left;
|
|
-webkit-box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
border-radius: 0.28571429rem;
|
|
-webkit-transition: opacity 0.1s ease;
|
|
transition: opacity 0.1s ease;
|
|
z-index: 11;
|
|
will-change: transform, opacity;
|
|
}
|
|
.ui.dropdown .menu > * {
|
|
white-space: nowrap;
|
|
}
|
|
/*--------------
|
|
Hidden Input
|
|
---------------*/
|
|
.ui.dropdown > input:not(.search):first-child,
|
|
.ui.dropdown > select {
|
|
display: none !important;
|
|
}
|
|
/*--------------
|
|
Dropdown Icon
|
|
---------------*/
|
|
.ui.dropdown > .dropdown.icon {
|
|
position: relative;
|
|
width: auto;
|
|
font-size: 0.85714286em;
|
|
margin: 0em 0em 0em 1em;
|
|
}
|
|
.ui.dropdown .menu > .item .dropdown.icon {
|
|
width: auto;
|
|
float: right;
|
|
margin: 0em 0em 0em 1em;
|
|
}
|
|
.ui.dropdown .menu > .item .dropdown.icon + .text {
|
|
margin-right: 1em;
|
|
}
|
|
/*--------------
|
|
Text
|
|
---------------*/
|
|
.ui.dropdown > .text {
|
|
display: inline-block;
|
|
-webkit-transition: none;
|
|
transition: none;
|
|
}
|
|
/*--------------
|
|
Menu Item
|
|
---------------*/
|
|
.ui.dropdown .menu > .item {
|
|
position: relative;
|
|
cursor: pointer;
|
|
display: block;
|
|
border: none;
|
|
height: auto;
|
|
text-align: left;
|
|
border-top: none;
|
|
line-height: 1em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
padding: 0.78571429rem 1.14285714rem !important;
|
|
font-size: 1rem;
|
|
text-transform: none;
|
|
font-weight: normal;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
-webkit-touch-callout: none;
|
|
}
|
|
.ui.dropdown .menu > .item:first-child {
|
|
border-top-width: 0px;
|
|
}
|
|
/*--------------
|
|
Floated Content
|
|
---------------*/
|
|
.ui.dropdown > .text > [class*="right floated"],
|
|
.ui.dropdown .menu .item > [class*="right floated"] {
|
|
float: right !important;
|
|
margin-right: 0em !important;
|
|
margin-left: 1em !important;
|
|
}
|
|
.ui.dropdown > .text > [class*="left floated"],
|
|
.ui.dropdown .menu .item > [class*="left floated"] {
|
|
float: left !important;
|
|
margin-left: 0em !important;
|
|
margin-right: 1em !important;
|
|
}
|
|
.ui.dropdown .menu .item > .icon.floated,
|
|
.ui.dropdown .menu .item > .flag.floated,
|
|
.ui.dropdown .menu .item > .image.floated,
|
|
.ui.dropdown .menu .item > img.floated {
|
|
margin-top: 0em;
|
|
}
|
|
/*--------------
|
|
Menu Divider
|
|
---------------*/
|
|
.ui.dropdown .menu > .header {
|
|
margin: 1rem 0rem 0.75rem;
|
|
padding: 0em 1.14285714rem;
|
|
color: rgba(0, 0, 0, 0.85);
|
|
font-size: 0.78571429em;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
.ui.dropdown .menu > .divider {
|
|
border-top: 1px solid rgba(34, 36, 38, 0.1);
|
|
height: 0em;
|
|
margin: 0.5em 0em;
|
|
}
|
|
.ui.dropdown .menu > .input {
|
|
width: auto;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
margin: 1.14285714rem 0.78571429rem;
|
|
min-width: 10rem;
|
|
}
|
|
.ui.dropdown .menu > .header + .input {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.dropdown .menu > .input:not(.transparent) input {
|
|
padding: 0.5em 1em;
|
|
}
|
|
.ui.dropdown .menu > .input:not(.transparent) .button,
|
|
.ui.dropdown .menu > .input:not(.transparent) .icon,
|
|
.ui.dropdown .menu > .input:not(.transparent) .label {
|
|
padding-top: 0.5em;
|
|
padding-bottom: 0.5em;
|
|
}
|
|
/*-----------------
|
|
Item Description
|
|
-------------------*/
|
|
.ui.dropdown > .text > .description,
|
|
.ui.dropdown .menu > .item > .description {
|
|
float: right;
|
|
margin: 0em 0em 0em 1em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
/*-----------------
|
|
Message
|
|
-------------------*/
|
|
.ui.dropdown .menu > .message {
|
|
padding: 0.78571429rem 1.14285714rem;
|
|
font-weight: normal;
|
|
}
|
|
.ui.dropdown .menu > .message:not(.ui) {
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
/*--------------
|
|
Sub Menu
|
|
---------------*/
|
|
.ui.dropdown .menu .menu {
|
|
top: 0% !important;
|
|
left: 100% !important;
|
|
right: auto !important;
|
|
margin: 0em 0em 0em -0.5em !important;
|
|
border-radius: 0.28571429rem !important;
|
|
z-index: 21 !important;
|
|
}
|
|
/* Hide Arrow */
|
|
.ui.dropdown .menu .menu:after {
|
|
display: none;
|
|
}
|
|
/*--------------
|
|
Sub Elements
|
|
---------------*/
|
|
/* Icons / Flags / Labels / Image */
|
|
.ui.dropdown > .text > .icon,
|
|
.ui.dropdown > .text > .label,
|
|
.ui.dropdown > .text > .flag,
|
|
.ui.dropdown > .text > img,
|
|
.ui.dropdown > .text > .image {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.dropdown .menu > .item > .icon,
|
|
.ui.dropdown .menu > .item > .label,
|
|
.ui.dropdown .menu > .item > .flag,
|
|
.ui.dropdown .menu > .item > .image,
|
|
.ui.dropdown .menu > .item > img {
|
|
margin-top: 0em;
|
|
}
|
|
.ui.dropdown > .text > .icon,
|
|
.ui.dropdown > .text > .label,
|
|
.ui.dropdown > .text > .flag,
|
|
.ui.dropdown > .text > img,
|
|
.ui.dropdown > .text > .image,
|
|
.ui.dropdown .menu > .item > .icon,
|
|
.ui.dropdown .menu > .item > .label,
|
|
.ui.dropdown .menu > .item > .flag,
|
|
.ui.dropdown .menu > .item > .image,
|
|
.ui.dropdown .menu > .item > img {
|
|
margin-left: 0em;
|
|
float: none;
|
|
margin-right: 0.78571429rem;
|
|
}
|
|
/*--------------
|
|
Image
|
|
---------------*/
|
|
.ui.dropdown > .text > img,
|
|
.ui.dropdown > .text > .image,
|
|
.ui.dropdown .menu > .item > .image,
|
|
.ui.dropdown .menu > .item > img {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
width: auto;
|
|
max-height: 2em;
|
|
}
|
|
/*******************************
|
|
Coupling
|
|
*******************************/
|
|
/*--------------
|
|
Menu
|
|
---------------*/
|
|
/* Remove Menu Item Divider */
|
|
.ui.dropdown .ui.menu > .item:before,
|
|
.ui.menu .ui.dropdown .menu > .item:before {
|
|
display: none;
|
|
}
|
|
/* Prevent Menu Item Border */
|
|
.ui.menu .ui.dropdown .menu .active.item {
|
|
border-left: none;
|
|
}
|
|
/* Automatically float dropdown menu right on last menu item */
|
|
.ui.menu .right.menu .dropdown:last-child .menu,
|
|
.ui.menu .right.dropdown.item .menu,
|
|
.ui.buttons > .ui.dropdown:last-child .menu {
|
|
left: auto;
|
|
right: 0em;
|
|
}
|
|
/*--------------
|
|
Label
|
|
---------------*/
|
|
/* Dropdown Menu */
|
|
.ui.label.dropdown .menu {
|
|
min-width: 100%;
|
|
}
|
|
/*--------------
|
|
Button
|
|
---------------*/
|
|
/* No Margin On Icon Button */
|
|
.ui.dropdown.icon.button > .dropdown.icon {
|
|
margin: 0em;
|
|
}
|
|
.ui.button.dropdown .menu {
|
|
min-width: 100%;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Selection
|
|
---------------*/
|
|
/* Displays like a select box */
|
|
.ui.selection.dropdown {
|
|
cursor: pointer;
|
|
word-wrap: break-word;
|
|
line-height: 1em;
|
|
white-space: normal;
|
|
outline: 0;
|
|
-webkit-transform: rotateZ(0deg);
|
|
transform: rotateZ(0deg);
|
|
min-width: 14em;
|
|
min-height: 2.7142em;
|
|
background: #FFFFFF;
|
|
display: inline-block;
|
|
padding: 0.78571429em 2.1em 0.78571429em 1em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
border-radius: 0.28571429rem;
|
|
-webkit-transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: box-shadow 0.1s ease, width 0.1s ease;
|
|
transition: box-shadow 0.1s ease, width 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
}
|
|
.ui.selection.dropdown.visible,
|
|
.ui.selection.dropdown.active {
|
|
z-index: 10;
|
|
}
|
|
select.ui.dropdown {
|
|
height: 38px;
|
|
padding: 0.5em;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
visibility: visible;
|
|
}
|
|
.ui.selection.dropdown > .search.icon,
|
|
.ui.selection.dropdown > .delete.icon,
|
|
.ui.selection.dropdown > .dropdown.icon {
|
|
cursor: pointer;
|
|
position: absolute;
|
|
width: auto;
|
|
height: auto;
|
|
line-height: 1.2142em;
|
|
top: 0.78571429em;
|
|
right: 1em;
|
|
z-index: 3;
|
|
margin: -0.78571429em;
|
|
padding: 0.78571429em;
|
|
opacity: 0.8;
|
|
-webkit-transition: opacity 0.1s ease;
|
|
transition: opacity 0.1s ease;
|
|
}
|
|
/* Compact */
|
|
.ui.compact.selection.dropdown {
|
|
min-width: 0px;
|
|
}
|
|
/* Selection Menu */
|
|
.ui.selection.dropdown .menu {
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
-webkit-overflow-scrolling: touch;
|
|
border-top-width: 0px !important;
|
|
width: auto;
|
|
outline: none;
|
|
margin: 0px -1px;
|
|
min-width: calc(100% + 2px );
|
|
width: calc(100% + 2px );
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
-webkit-box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
-webkit-transition: opacity 0.1s ease;
|
|
transition: opacity 0.1s ease;
|
|
}
|
|
.ui.selection.dropdown .menu:after,
|
|
.ui.selection.dropdown .menu:before {
|
|
display: none;
|
|
}
|
|
/*--------------
|
|
Message
|
|
---------------*/
|
|
.ui.selection.dropdown .menu > .message {
|
|
padding: 0.78571429rem 1.14285714rem;
|
|
}
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.selection.dropdown .menu {
|
|
max-height: 8.01428571rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 768px) {
|
|
.ui.selection.dropdown .menu {
|
|
max-height: 10.68571429rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 992px) {
|
|
.ui.selection.dropdown .menu {
|
|
max-height: 16.02857143rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui.selection.dropdown .menu {
|
|
max-height: 21.37142857rem;
|
|
}
|
|
}
|
|
/* Menu Item */
|
|
.ui.selection.dropdown .menu > .item {
|
|
border-top: 1px solid #FAFAFA;
|
|
padding: 0.78571429rem 1.14285714rem !important;
|
|
white-space: normal;
|
|
word-wrap: normal;
|
|
}
|
|
/* User Item */
|
|
.ui.selection.dropdown .menu > .hidden.addition.item {
|
|
display: none;
|
|
}
|
|
/* Hover */
|
|
.ui.selection.dropdown:hover {
|
|
border-color: rgba(34, 36, 38, 0.35);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Active */
|
|
.ui.selection.active.dropdown {
|
|
border-color: #96C8DA;
|
|
-webkit-box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.selection.active.dropdown .menu {
|
|
border-color: #96C8DA;
|
|
-webkit-box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Focus */
|
|
.ui.selection.dropdown:focus {
|
|
border-color: #96C8DA;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.selection.dropdown:focus .menu {
|
|
border-color: #96C8DA;
|
|
-webkit-box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Visible */
|
|
.ui.selection.visible.dropdown > .text:not(.default) {
|
|
font-weight: normal;
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
/* Visible Hover */
|
|
.ui.selection.active.dropdown:hover {
|
|
border-color: #96C8DA;
|
|
-webkit-box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.selection.active.dropdown:hover .menu {
|
|
border-color: #96C8DA;
|
|
-webkit-box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 3px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Dropdown Icon */
|
|
.ui.active.selection.dropdown > .dropdown.icon,
|
|
.ui.visible.selection.dropdown > .dropdown.icon {
|
|
opacity: 1;
|
|
z-index: 3;
|
|
}
|
|
/* Connecting Border */
|
|
.ui.active.selection.dropdown {
|
|
border-bottom-left-radius: 0em !important;
|
|
border-bottom-right-radius: 0em !important;
|
|
}
|
|
/* Empty Connecting Border */
|
|
.ui.active.empty.selection.dropdown {
|
|
border-radius: 0.28571429rem !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
.ui.active.empty.selection.dropdown .menu {
|
|
border: none !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
/*--------------
|
|
Searchable
|
|
---------------*/
|
|
/* Search Selection */
|
|
.ui.search.dropdown {
|
|
min-width: '';
|
|
}
|
|
/* Search Dropdown */
|
|
.ui.search.dropdown > input.search {
|
|
background: none transparent !important;
|
|
border: none !important;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
cursor: text;
|
|
top: 0em;
|
|
left: 1px;
|
|
width: 100%;
|
|
outline: none;
|
|
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
|
|
padding: inherit;
|
|
}
|
|
/* Text Layering */
|
|
.ui.search.dropdown > input.search {
|
|
position: absolute;
|
|
z-index: 2;
|
|
}
|
|
.ui.search.dropdown > .text {
|
|
cursor: text;
|
|
position: relative;
|
|
left: 1px;
|
|
z-index: 3;
|
|
}
|
|
/* Search Selection */
|
|
.ui.search.selection.dropdown > input.search {
|
|
line-height: 1.2142em;
|
|
padding: 0.67861429em 2.1em 0.67861429em 1em;
|
|
}
|
|
/* Used to size multi select input to character width */
|
|
.ui.search.selection.dropdown > span.sizer {
|
|
line-height: 1.2142em;
|
|
padding: 0.67861429em 2.1em 0.67861429em 1em;
|
|
display: none;
|
|
white-space: pre;
|
|
}
|
|
/* Active/Visible Search */
|
|
.ui.search.dropdown.active > input.search,
|
|
.ui.search.dropdown.visible > input.search {
|
|
cursor: auto;
|
|
}
|
|
.ui.search.dropdown.active > .text,
|
|
.ui.search.dropdown.visible > .text {
|
|
pointer-events: none;
|
|
}
|
|
/* Filtered Text */
|
|
.ui.active.search.dropdown input.search:focus + .text .icon,
|
|
.ui.active.search.dropdown input.search:focus + .text .flag {
|
|
opacity: 0.45;
|
|
}
|
|
.ui.active.search.dropdown input.search:focus + .text {
|
|
color: rgba(115, 115, 115, 0.87) !important;
|
|
}
|
|
/* Search Menu */
|
|
.ui.search.dropdown .menu {
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.search.dropdown .menu {
|
|
max-height: 8.01428571rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 768px) {
|
|
.ui.search.dropdown .menu {
|
|
max-height: 10.68571429rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 992px) {
|
|
.ui.search.dropdown .menu {
|
|
max-height: 16.02857143rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui.search.dropdown .menu {
|
|
max-height: 21.37142857rem;
|
|
}
|
|
}
|
|
/*--------------
|
|
Multiple
|
|
---------------*/
|
|
/* Multiple Selection */
|
|
.ui.multiple.dropdown {
|
|
padding: 0.22620476em 2.1em 0.22620476em 0.35714286em;
|
|
}
|
|
.ui.multiple.dropdown .menu {
|
|
cursor: auto;
|
|
}
|
|
/* Multiple Search Selection */
|
|
.ui.multiple.search.dropdown,
|
|
.ui.multiple.search.dropdown > input.search {
|
|
cursor: text;
|
|
}
|
|
/* Selection Label */
|
|
.ui.multiple.dropdown > .label {
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
white-space: normal;
|
|
font-size: 1em;
|
|
padding: 0.35714286em 0.78571429em;
|
|
margin: 0.14285714rem 0.28571429rem 0.14285714rem 0em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
|
|
box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
|
|
}
|
|
/* Dropdown Icon */
|
|
.ui.multiple.dropdown .dropdown.icon {
|
|
margin: '';
|
|
padding: '';
|
|
}
|
|
/* Text */
|
|
.ui.multiple.dropdown > .text {
|
|
position: static;
|
|
padding: 0;
|
|
max-width: 100%;
|
|
margin: 0.45240952em 0em 0.45240952em 0.64285714em;
|
|
line-height: 1.21428571em;
|
|
}
|
|
.ui.multiple.dropdown > .label ~ input.search {
|
|
margin-left: 0.14285714em !important;
|
|
}
|
|
.ui.multiple.dropdown > .label ~ .text {
|
|
display: none;
|
|
}
|
|
/*-----------------
|
|
Multiple Search
|
|
-----------------*/
|
|
/* Prompt Text */
|
|
.ui.multiple.search.dropdown > .text {
|
|
display: inline-block;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
padding: inherit;
|
|
margin: 0.45240952em 0em 0.45240952em 0.64285714em;
|
|
line-height: 1.21428571em;
|
|
}
|
|
.ui.multiple.search.dropdown > .label ~ .text {
|
|
display: none;
|
|
}
|
|
/* Search */
|
|
.ui.multiple.search.dropdown > input.search {
|
|
position: static;
|
|
padding: 0;
|
|
max-width: 100%;
|
|
margin: 0.45240952em 0em 0.45240952em 0.64285714em;
|
|
width: 2.2em;
|
|
line-height: 1.21428571em;
|
|
}
|
|
/*--------------
|
|
Inline
|
|
---------------*/
|
|
.ui.inline.dropdown {
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
color: inherit;
|
|
}
|
|
.ui.inline.dropdown .dropdown.icon {
|
|
margin: 0em 0.5em 0em 0.21428571em;
|
|
vertical-align: baseline;
|
|
}
|
|
.ui.inline.dropdown > .text {
|
|
font-weight: bold;
|
|
}
|
|
.ui.inline.dropdown .menu {
|
|
cursor: auto;
|
|
margin-top: 0.21428571em;
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------------
|
|
Active
|
|
----------------------*/
|
|
/* Menu Item Active */
|
|
.ui.dropdown .menu .active.item {
|
|
background: transparent;
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
z-index: 12;
|
|
}
|
|
/*--------------------
|
|
Hover
|
|
----------------------*/
|
|
/* Menu Item Hover */
|
|
.ui.dropdown .menu > .item:hover {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
z-index: 13;
|
|
}
|
|
/*--------------------
|
|
Loading
|
|
---------------------*/
|
|
.ui.loading.dropdown > i.icon {
|
|
height: 1em !important;
|
|
padding: 1.14285714em 1.07142857em !important;
|
|
}
|
|
.ui.loading.dropdown > i.icon:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -0.64285714em 0em 0em -0.64285714em;
|
|
width: 1.28571429em;
|
|
height: 1.28571429em;
|
|
border-radius: 500rem;
|
|
border: 0.2em solid rgba(0, 0, 0, 0.1);
|
|
}
|
|
.ui.loading.dropdown > i.icon:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent;
|
|
box-shadow: 0px 0px 0px 1px transparent;
|
|
margin: -0.64285714em 0em 0em -0.64285714em;
|
|
width: 1.28571429em;
|
|
height: 1.28571429em;
|
|
-webkit-animation: dropdown-spin 0.6s linear;
|
|
animation: dropdown-spin 0.6s linear;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
border-radius: 500rem;
|
|
border-color: #95a5a6 transparent transparent;
|
|
border-style: solid;
|
|
border-width: 0.2em;
|
|
}
|
|
/* Coupling */
|
|
.ui.loading.dropdown.button > i.icon:before,
|
|
.ui.loading.dropdown.button > i.icon:after {
|
|
display: none;
|
|
}
|
|
@-webkit-keyframes dropdown-spin {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes dropdown-spin {
|
|
from {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
/*--------------------
|
|
Default Text
|
|
----------------------*/
|
|
.ui.dropdown:not(.button) > .default.text,
|
|
.ui.default.dropdown:not(.button) > .text {
|
|
color: rgba(191, 191, 191, 0.87);
|
|
}
|
|
.ui.dropdown:not(.button) > input:focus + .default.text,
|
|
.ui.default.dropdown:not(.button) > input:focus + .text {
|
|
color: rgba(115, 115, 115, 0.87);
|
|
}
|
|
/*--------------------
|
|
Loading
|
|
----------------------*/
|
|
.ui.loading.dropdown > .text {
|
|
-webkit-transition: none;
|
|
transition: none;
|
|
}
|
|
/* Used To Check Position */
|
|
.ui.dropdown .loading.menu {
|
|
display: block;
|
|
visibility: hidden;
|
|
z-index: -1;
|
|
}
|
|
/*--------------------
|
|
Keyboard Select
|
|
----------------------*/
|
|
/* Selected Item */
|
|
.ui.dropdown.selected,
|
|
.ui.dropdown .menu .selected.item {
|
|
background: rgba(0, 0, 0, 0.03);
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------------
|
|
Search Filtered
|
|
----------------------*/
|
|
/* Filtered Item */
|
|
.ui.dropdown > .filtered.text {
|
|
visibility: hidden;
|
|
}
|
|
.ui.dropdown .filtered.item {
|
|
display: none !important;
|
|
}
|
|
/*--------------------
|
|
Error
|
|
----------------------*/
|
|
.ui.dropdown.error,
|
|
.ui.dropdown.error > .text,
|
|
.ui.dropdown.error > .default.text {
|
|
color: #9F3A38;
|
|
}
|
|
.ui.selection.dropdown.error {
|
|
background: #FFF6F6;
|
|
border-color: #E0B4B4;
|
|
}
|
|
.ui.selection.dropdown.error:hover {
|
|
border-color: #E0B4B4;
|
|
}
|
|
.ui.dropdown.error > .menu,
|
|
.ui.dropdown.error > .menu .menu {
|
|
border-color: #E0B4B4;
|
|
}
|
|
.ui.dropdown.error > .menu > .item {
|
|
color: #9F3A38;
|
|
}
|
|
.ui.multiple.selection.error.dropdown > .label {
|
|
border-color: #E0B4B4;
|
|
}
|
|
/* Item Hover */
|
|
.ui.dropdown.error > .menu > .item:hover {
|
|
background-color: #FFF2F2;
|
|
}
|
|
/* Item Active */
|
|
.ui.dropdown.error > .menu .active.item {
|
|
background-color: #FDCFCF;
|
|
}
|
|
/*--------------------
|
|
Disabled
|
|
----------------------*/
|
|
/* Disabled */
|
|
.ui.disabled.dropdown,
|
|
.ui.dropdown .menu > .disabled.item {
|
|
cursor: default;
|
|
pointer-events: none;
|
|
opacity: 0.45;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Direction
|
|
---------------*/
|
|
/* Flyout Direction */
|
|
.ui.dropdown .menu {
|
|
left: 0px;
|
|
}
|
|
/* Default Side (Right) */
|
|
.ui.dropdown .right.menu > .menu,
|
|
.ui.dropdown .menu .right.menu {
|
|
left: 100% !important;
|
|
right: auto !important;
|
|
border-radius: 0.28571429rem !important;
|
|
}
|
|
/* Left Flyout Menu */
|
|
.ui.dropdown > .left.menu .menu,
|
|
.ui.dropdown .menu .left.menu {
|
|
left: auto !important;
|
|
right: 100% !important;
|
|
border-radius: 0.28571429rem !important;
|
|
}
|
|
.ui.dropdown .item .left.dropdown.icon,
|
|
.ui.dropdown .left.menu .item .dropdown.icon {
|
|
width: auto;
|
|
float: left;
|
|
margin: 0em 0.78571429rem 0em 0em;
|
|
}
|
|
.ui.dropdown .item .left.dropdown.icon,
|
|
.ui.dropdown .left.menu .item .dropdown.icon {
|
|
width: auto;
|
|
float: left;
|
|
margin: 0em 0.78571429rem 0em 0em;
|
|
}
|
|
.ui.dropdown .item .left.dropdown.icon + .text,
|
|
.ui.dropdown .left.menu .item .dropdown.icon + .text {
|
|
margin-left: 1em;
|
|
}
|
|
/*--------------
|
|
Upward
|
|
---------------*/
|
|
/* Upward Main Menu */
|
|
.ui.upward.dropdown > .menu {
|
|
top: auto;
|
|
bottom: 100%;
|
|
-webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.08);
|
|
box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.08);
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
/* Upward Sub Menu */
|
|
.ui.dropdown .upward.menu {
|
|
top: auto !important;
|
|
bottom: 0 !important;
|
|
}
|
|
/* Active Upward */
|
|
.ui.simple.upward.active.dropdown,
|
|
.ui.simple.upward.dropdown:hover {
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em !important;
|
|
}
|
|
.ui.upward.dropdown.button:not(.pointing):not(.floating).active {
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
/* Selection */
|
|
.ui.upward.selection.dropdown .menu {
|
|
border-top-width: 1px !important;
|
|
border-bottom-width: 0px !important;
|
|
-webkit-box-shadow: 0px -2px 3px 0px rgba(0, 0, 0, 0.08);
|
|
box-shadow: 0px -2px 3px 0px rgba(0, 0, 0, 0.08);
|
|
}
|
|
.ui.upward.selection.dropdown:hover {
|
|
-webkit-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.05);
|
|
box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.05);
|
|
}
|
|
/* Active Upward */
|
|
.ui.active.upward.selection.dropdown {
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem !important;
|
|
}
|
|
/* Visible Upward */
|
|
.ui.upward.selection.dropdown.visible {
|
|
-webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.08);
|
|
box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.08);
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem !important;
|
|
}
|
|
/* Visible Hover Upward */
|
|
.ui.upward.active.selection.dropdown:hover {
|
|
-webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.05);
|
|
box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.05);
|
|
}
|
|
.ui.upward.active.selection.dropdown:hover .menu {
|
|
-webkit-box-shadow: 0px -2px 3px 0px rgba(0, 0, 0, 0.08);
|
|
box-shadow: 0px -2px 3px 0px rgba(0, 0, 0, 0.08);
|
|
}
|
|
/*--------------
|
|
Simple
|
|
---------------*/
|
|
/* Selection Menu */
|
|
.ui.scrolling.dropdown .menu,
|
|
.ui.dropdown .scrolling.menu {
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
}
|
|
.ui.scrolling.dropdown .menu {
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
-webkit-overflow-scrolling: touch;
|
|
min-width: 100% !important;
|
|
width: auto !important;
|
|
}
|
|
.ui.dropdown .scrolling.menu {
|
|
position: static;
|
|
overflow-y: auto;
|
|
border: none;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
border-radius: 0 !important;
|
|
margin: 0 !important;
|
|
min-width: 100% !important;
|
|
width: auto !important;
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.scrolling.dropdown .menu .item.item.item,
|
|
.ui.dropdown .scrolling.menu > .item.item.item {
|
|
border-top: none;
|
|
padding-right: calc( 1.14285714rem + 17px ) !important;
|
|
}
|
|
.ui.scrolling.dropdown .menu .item:first-child,
|
|
.ui.dropdown .scrolling.menu .item:first-child {
|
|
border-top: none;
|
|
}
|
|
.ui.dropdown > .animating.menu .scrolling.menu,
|
|
.ui.dropdown > .visible.menu .scrolling.menu {
|
|
display: block;
|
|
}
|
|
/* Scrollbar in IE */
|
|
@media all and (-ms-high-contrast: none) {
|
|
.ui.scrolling.dropdown .menu,
|
|
.ui.dropdown .scrolling.menu {
|
|
min-width: calc(100% - 17px );
|
|
}
|
|
}
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.scrolling.dropdown .menu,
|
|
.ui.dropdown .scrolling.menu {
|
|
max-height: 10.28571429rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 768px) {
|
|
.ui.scrolling.dropdown .menu,
|
|
.ui.dropdown .scrolling.menu {
|
|
max-height: 15.42857143rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 992px) {
|
|
.ui.scrolling.dropdown .menu,
|
|
.ui.dropdown .scrolling.menu {
|
|
max-height: 20.57142857rem;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui.scrolling.dropdown .menu,
|
|
.ui.dropdown .scrolling.menu {
|
|
max-height: 20.57142857rem;
|
|
}
|
|
}
|
|
/*--------------
|
|
Simple
|
|
---------------*/
|
|
/* Displays without javascript */
|
|
.ui.simple.dropdown .menu:before,
|
|
.ui.simple.dropdown .menu:after {
|
|
display: none;
|
|
}
|
|
.ui.simple.dropdown .menu {
|
|
position: absolute;
|
|
display: block;
|
|
overflow: hidden;
|
|
top: -9999px !important;
|
|
opacity: 0;
|
|
width: 0;
|
|
height: 0;
|
|
-webkit-transition: opacity 0.1s ease;
|
|
transition: opacity 0.1s ease;
|
|
}
|
|
.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;
|
|
}
|
|
/* Visible */
|
|
.ui.simple.visible.dropdown > .menu {
|
|
display: block;
|
|
}
|
|
/*--------------
|
|
Fluid
|
|
---------------*/
|
|
.ui.fluid.dropdown {
|
|
display: block;
|
|
width: 100%;
|
|
min-width: 0em;
|
|
}
|
|
.ui.fluid.dropdown > .dropdown.icon {
|
|
float: right;
|
|
}
|
|
/*--------------
|
|
Floating
|
|
---------------*/
|
|
.ui.floating.dropdown .menu {
|
|
left: 0;
|
|
right: auto;
|
|
-webkit-box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15) !important;
|
|
box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15) !important;
|
|
border-radius: 0.28571429rem !important;
|
|
}
|
|
.ui.floating.dropdown > .menu {
|
|
margin-top: 0.5em !important;
|
|
border-radius: 0.28571429rem !important;
|
|
}
|
|
/*--------------
|
|
Pointing
|
|
---------------*/
|
|
.ui.pointing.dropdown > .menu {
|
|
top: 100%;
|
|
margin-top: 0.78571429rem;
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
.ui.pointing.dropdown > .menu:after {
|
|
display: block;
|
|
position: absolute;
|
|
pointer-events: none;
|
|
content: '';
|
|
visibility: visible;
|
|
-webkit-transform: rotate(45deg);
|
|
transform: rotate(45deg);
|
|
width: 0.5em;
|
|
height: 0.5em;
|
|
-webkit-box-shadow: -1px -1px 0px 1px rgba(34, 36, 38, 0.15);
|
|
box-shadow: -1px -1px 0px 1px rgba(34, 36, 38, 0.15);
|
|
background: #FFFFFF;
|
|
z-index: 2;
|
|
}
|
|
.ui.pointing.dropdown > .menu:after {
|
|
top: -0.25em;
|
|
left: 50%;
|
|
margin: 0em 0em 0em -0.25em;
|
|
}
|
|
/* Top Left Pointing */
|
|
.ui.top.left.pointing.dropdown > .menu {
|
|
top: 100%;
|
|
bottom: auto;
|
|
left: 0%;
|
|
right: auto;
|
|
margin: 1em 0em 0em;
|
|
}
|
|
.ui.top.left.pointing.dropdown > .menu {
|
|
top: 100%;
|
|
bottom: auto;
|
|
left: 0%;
|
|
right: auto;
|
|
margin: 1em 0em 0em;
|
|
}
|
|
.ui.top.left.pointing.dropdown > .menu:after {
|
|
top: -0.25em;
|
|
left: 1em;
|
|
right: auto;
|
|
margin: 0em;
|
|
-webkit-transform: rotate(45deg);
|
|
transform: rotate(45deg);
|
|
}
|
|
/* Top Right Pointing */
|
|
.ui.top.right.pointing.dropdown > .menu {
|
|
top: 100%;
|
|
bottom: auto;
|
|
right: 0%;
|
|
left: auto;
|
|
margin: 1em 0em 0em;
|
|
}
|
|
.ui.top.right.pointing.dropdown > .menu:after {
|
|
top: -0.25em;
|
|
left: auto;
|
|
right: 1em;
|
|
margin: 0em;
|
|
-webkit-transform: rotate(45deg);
|
|
transform: rotate(45deg);
|
|
}
|
|
/* Left Pointing */
|
|
.ui.left.pointing.dropdown > .menu {
|
|
top: 0%;
|
|
left: 100%;
|
|
right: auto;
|
|
margin: 0em 0em 0em 1em;
|
|
}
|
|
.ui.left.pointing.dropdown > .menu:after {
|
|
top: 1em;
|
|
left: -0.25em;
|
|
margin: 0em 0em 0em 0em;
|
|
-webkit-transform: rotate(-45deg);
|
|
transform: rotate(-45deg);
|
|
}
|
|
/* Right Pointing */
|
|
.ui.right.pointing.dropdown > .menu {
|
|
top: 0%;
|
|
left: auto;
|
|
right: 100%;
|
|
margin: 0em 1em 0em 0em;
|
|
}
|
|
.ui.right.pointing.dropdown > .menu:after {
|
|
top: 1em;
|
|
left: auto;
|
|
right: -0.25em;
|
|
margin: 0em 0em 0em 0em;
|
|
-webkit-transform: rotate(135deg);
|
|
transform: rotate(135deg);
|
|
}
|
|
/* Bottom Pointing */
|
|
.ui.bottom.pointing.dropdown > .menu {
|
|
top: auto;
|
|
bottom: 100%;
|
|
left: 0%;
|
|
right: auto;
|
|
margin: 0em 0em 1em;
|
|
}
|
|
.ui.bottom.pointing.dropdown > .menu:after {
|
|
top: auto;
|
|
bottom: -0.25em;
|
|
right: auto;
|
|
margin: 0em;
|
|
-webkit-transform: rotate(-135deg);
|
|
transform: rotate(-135deg);
|
|
}
|
|
/* Reverse Sub-Menu Direction */
|
|
.ui.bottom.pointing.dropdown > .menu .menu {
|
|
top: auto !important;
|
|
bottom: 0px !important;
|
|
}
|
|
/* Bottom Left */
|
|
.ui.bottom.left.pointing.dropdown > .menu {
|
|
left: 0%;
|
|
right: auto;
|
|
}
|
|
.ui.bottom.left.pointing.dropdown > .menu:after {
|
|
left: 1em;
|
|
right: auto;
|
|
}
|
|
/* Bottom Right */
|
|
.ui.bottom.right.pointing.dropdown > .menu {
|
|
right: 0%;
|
|
left: auto;
|
|
}
|
|
.ui.bottom.right.pointing.dropdown > .menu:after {
|
|
left: auto;
|
|
right: 1em;
|
|
}
|
|
/* Upward pointing */
|
|
.ui.upward.pointing.dropdown > .menu,
|
|
.ui.upward.top.pointing.dropdown > .menu {
|
|
top: auto;
|
|
bottom: 100%;
|
|
margin: 0em 0em 0.78571429rem;
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
.ui.upward.pointing.dropdown > .menu:after,
|
|
.ui.upward.top.pointing.dropdown > .menu:after {
|
|
top: 100%;
|
|
bottom: auto;
|
|
-webkit-box-shadow: 1px 1px 0px 1px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 1px 1px 0px 1px rgba(34, 36, 38, 0.15);
|
|
margin: -0.25em 0em 0em;
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/* Dropdown Carets */
|
|
@font-face {
|
|
font-family: 'Dropdown';
|
|
src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggjB5AAAAC8AAAAYGNtYXAPfuIIAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zjo82LgAAAFwAAABVGhlYWQAQ88bAAACxAAAADZoaGVhAwcB6QAAAvwAAAAkaG10eAS4ABIAAAMgAAAAIGxvY2EBNgDeAAADQAAAABJtYXhwAAoAFgAAA1QAAAAgbmFtZVcZpu4AAAN0AAABRXBvc3QAAwAAAAAEvAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDX//3//wAB/+MPLQADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAIABJQElABMAABM0NzY3BTYXFhUUDwEGJwYvASY1AAUGBwEACAUGBoAFCAcGgAUBEgcGBQEBAQcECQYHfwYBAQZ/BwYAAQAAAG4BJQESABMAADc0PwE2MzIfARYVFAcGIyEiJyY1AAWABgcIBYAGBgUI/wAHBgWABwaABQWABgcHBgUFBgcAAAABABIASQC3AW4AEwAANzQ/ATYXNhcWHQEUBwYnBi8BJjUSBoAFCAcFBgYFBwgFgAbbBwZ/BwEBBwQJ/wgEBwEBB38GBgAAAAABAAAASQClAW4AEwAANxE0NzYzMh8BFhUUDwEGIyInJjUABQYHCAWABgaABQgHBgVbAQAIBQYGgAUIBwWABgYFBwAAAAEAAAABAADZuaKOXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAAAAACgAUAB4AQgBkAIgAqgAAAAEAAAAIABQAAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAOAAAAAQAAAAAAAgAOAEcAAQAAAAAAAwAOACQAAQAAAAAABAAOAFUAAQAAAAAABQAWAA4AAQAAAAAABgAHADIAAQAAAAAACgA0AGMAAwABBAkAAQAOAAAAAwABBAkAAgAOAEcAAwABBAkAAwAOACQAAwABBAkABAAOAFUAAwABBAkABQAWAA4AAwABBAkABgAOADkAAwABBAkACgA0AGMAaQBjAG8AbQBvAG8AbgBWAGUAcgBzAGkAbwBuACAAMQAuADAAaQBjAG8AbQBvAG8Abmljb21vb24AaQBjAG8AbQBvAG8AbgBSAGUAZwB1AGwAYQByAGkAYwBvAG0AbwBvAG4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAAVwAAoAAAAABSgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAdkAAAHZLDXE/09TLzIAAALQAAAAYAAAAGAIIweQY21hcAAAAzAAAABMAAAATA9+4ghnYXNwAAADfAAAAAgAAAAIAAAAEGhlYWQAAAOEAAAANgAAADYAQ88baGhlYQAAA7wAAAAkAAAAJAMHAelobXR4AAAD4AAAACAAAAAgBLgAEm1heHAAAAQAAAAABgAAAAYACFAAbmFtZQAABAgAAAFFAAABRVcZpu5wb3N0AAAFUAAAACAAAAAgAAMAAAEABAQAAQEBCGljb21vb24AAQIAAQA6+BwC+BsD+BgEHgoAGVP/i4seCgAZU/+LiwwHi2v4lPh0BR0AAACIDx0AAACNER0AAAAJHQAAAdASAAkBAQgPERMWGyAlKmljb21vb25pY29tb29udTB1MXUyMHVGMEQ3dUYwRDh1RjBEOXVGMERBAAACAYkABgAIAgABAAQABwAKAA0AVgCfAOgBL/yUDvyUDvyUDvuUDvtvi/emFYuQjZCOjo+Pj42Qiwj3lIsFkIuQiY6Hj4iNhouGi4aJh4eHCPsU+xQFiIiGiYaLhouHjYeOCPsU9xQFiI+Jj4uQCA77b4v3FBWLkI2Pjo8I9xT3FAWPjo+NkIuQi5CJjogI9xT7FAWPh42Hi4aLhomHh4eIiIaJhosI+5SLBYaLh42HjoiPiY+LkAgO+92d928Vi5CNkI+OCPcU9xQFjo+QjZCLkIuPiY6Hj4iNhouGCIv7lAWLhomHh4iIh4eJhouGi4aNiI8I+xT3FAWHjomPi5AIDvvdi+YVi/eUBYuQjZCOjo+Pj42Qi5CLkImOhwj3FPsUBY+IjYaLhouGiYeHiAj7FPsUBYiHhomGi4aLh42Hj4iOiY+LkAgO+JQU+JQViwwKAAAAAAMCAAGQAAUAAAFMAWYAAABHAUwBZgAAAPUAGQCEAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA8NoB4P/g/+AB4AAgAAAAAQAAAAAAAAAAAAAAIAAAAAAAAgAAAAMAAAAUAAMAAQAAABQABAA4AAAACgAIAAIAAgABACDw2v/9//8AAAAAACDw1//9//8AAf/jDy0AAwABAAAAAAAAAAAAAAABAAH//wAPAAEAAAABAAA5emozXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAUAAACAAAAAAADgCuAAEAAAAAAAEADgAAAAEAAAAAAAIADgBHAAEAAAAAAAMADgAkAAEAAAAAAAQADgBVAAEAAAAAAAUAFgAOAAEAAAAAAAYABwAyAAEAAAAAAAoANABjAAMAAQQJAAEADgAAAAMAAQQJAAIADgBHAAMAAQQJAAMADgAkAAMAAQQJAAQADgBVAAMAAQQJAAUAFgAOAAMAAQQJAAYADgA5AAMAAQQJAAoANABjAGkAYwBvAG0AbwBvAG4AVgBlAHIAcwBpAG8AbgAgADEALgAwAGkAYwBvAG0AbwBvAG5pY29tb29uAGkAYwBvAG0AbwBvAG4AUgBlAGcAdQBsAGEAcgBpAGMAbwBtAG8AbwBuAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('woff');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
.ui.dropdown > .dropdown.icon {
|
|
font-family: 'Dropdown';
|
|
line-height: 1;
|
|
height: 1em;
|
|
width: 1.23em;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
text-align: center;
|
|
}
|
|
.ui.dropdown > .dropdown.icon {
|
|
width: auto;
|
|
}
|
|
.ui.dropdown > .dropdown.icon:before {
|
|
content: '\f0d7';
|
|
}
|
|
/* Sub Menu */
|
|
.ui.dropdown .menu .item .dropdown.icon:before {
|
|
content: '\f0da' /*rtl:'\f0d9'*/;
|
|
}
|
|
.ui.dropdown .item .left.dropdown.icon:before,
|
|
.ui.dropdown .left.menu .item .dropdown.icon:before {
|
|
content: "\f0d9" /*rtl:"\f0da"*/;
|
|
}
|
|
/* Vertical Menu Dropdown */
|
|
.ui.vertical.menu .dropdown.item > .dropdown.icon:before {
|
|
content: "\f0da" /*rtl:"\f0d9"*/;
|
|
}
|
|
/* Icons for Reference
|
|
.dropdown.down.icon {
|
|
content: "\f0d7";
|
|
}
|
|
.dropdown.up.icon {
|
|
content: "\f0d8";
|
|
}
|
|
.dropdown.left.icon {
|
|
content: "\f0d9";
|
|
}
|
|
.dropdown.icon.icon {
|
|
content: "\f0da";
|
|
}
|
|
*/
|
|
/*******************************
|
|
User Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Video
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Video
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/* Simple */
|
|
/* Placeholder */
|
|
/* Placeholder Overlayed Background */
|
|
/* Icon */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Hover */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Aspect Ratios */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Video
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/* Simple */
|
|
/* Placeholder */
|
|
/* Placeholder Overlayed Background */
|
|
/* Icon */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/* Hover */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Aspect Ratios */
|
|
/* Site Theme */
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
.ui.embed {
|
|
position: relative;
|
|
max-width: 100%;
|
|
height: 0px;
|
|
overflow: hidden;
|
|
background: #DCDDDE;
|
|
padding-bottom: 56.25%;
|
|
}
|
|
/*-----------------
|
|
Embedded Content
|
|
------------------*/
|
|
.ui.embed iframe,
|
|
.ui.embed embed,
|
|
.ui.embed object {
|
|
position: absolute;
|
|
border: none;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0px;
|
|
left: 0px;
|
|
margin: 0em;
|
|
padding: 0em;
|
|
}
|
|
/*-----------------
|
|
Embed
|
|
------------------*/
|
|
.ui.embed > .embed {
|
|
display: none;
|
|
}
|
|
/*--------------
|
|
Placeholder
|
|
---------------*/
|
|
.ui.embed > .placeholder {
|
|
position: absolute;
|
|
cursor: pointer;
|
|
top: 0px;
|
|
left: 0px;
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: radial-gradient(transparent 45%, rgba(0, 0, 0, 0.3));
|
|
}
|
|
/*--------------
|
|
Icon
|
|
---------------*/
|
|
.ui.embed > .icon {
|
|
cursor: pointer;
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 2;
|
|
}
|
|
.ui.embed > .icon:after {
|
|
position: absolute;
|
|
top: 0%;
|
|
left: 0%;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 3;
|
|
content: '';
|
|
background: radial-gradient(transparent 45%, rgba(0, 0, 0, 0.3));
|
|
opacity: 0.5;
|
|
-webkit-transition: opacity 0.5s ease;
|
|
transition: opacity 0.5s ease;
|
|
}
|
|
.ui.embed > .icon:before {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
z-index: 4;
|
|
-webkit-transform: translateX(-50%) translateY(-50%);
|
|
transform: translateX(-50%) translateY(-50%);
|
|
color: #FFFFFF;
|
|
font-size: 6rem;
|
|
text-shadow: 0px 2px 10px rgba(34, 36, 38, 0.2);
|
|
-webkit-transition: opacity 0.5s ease, color 0.5s ease;
|
|
transition: opacity 0.5s ease, color 0.5s ease;
|
|
z-index: 10;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Hover
|
|
---------------*/
|
|
.ui.embed .icon:hover:after {
|
|
background: radial-gradient(transparent 45%, rgba(0, 0, 0, 0.3));
|
|
opacity: 1;
|
|
}
|
|
.ui.embed .icon:hover:before {
|
|
color: #FFFFFF;
|
|
}
|
|
/*--------------
|
|
Active
|
|
---------------*/
|
|
.ui.active.embed > .icon,
|
|
.ui.active.embed > .placeholder {
|
|
display: none;
|
|
}
|
|
.ui.active.embed > .embed {
|
|
display: block;
|
|
}
|
|
/*******************************
|
|
Video Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
.ui.square.embed {
|
|
padding-bottom: 100%;
|
|
}
|
|
.ui[class*="4:3"].embed {
|
|
padding-bottom: 75%;
|
|
}
|
|
.ui[class*="16:9"].embed {
|
|
padding-bottom: 56.25%;
|
|
}
|
|
.ui[class*="21:9"].embed {
|
|
padding-bottom: 42.85714286%;
|
|
}
|
|
/*!
|
|
* # Semantic UI - Modal
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Modal
|
|
*******************************/
|
|
/* Close Icon */
|
|
/* Header */
|
|
/* Content */
|
|
/* Image / Description */
|
|
/* Modal Actions */
|
|
/* Inner Close Position (Tablet/Mobile) */
|
|
/* Mobile Positions */
|
|
/* Responsive Widths */
|
|
/* Coupling */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Basic */
|
|
/* Scrolling Margin */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Size Widths */
|
|
/* Derived Responsive Sizes */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Modal
|
|
*******************************/
|
|
.ui.modal {
|
|
display: none;
|
|
position: fixed;
|
|
z-index: 1001;
|
|
top: 50%;
|
|
left: 50%;
|
|
text-align: left;
|
|
background: #FFFFFF;
|
|
border: none;
|
|
-webkit-box-shadow: 1px 3px 3px 0px rgba(0, 0, 0, 0.2), 1px 3px 15px 2px rgba(0, 0, 0, 0.2);
|
|
box-shadow: 1px 3px 3px 0px rgba(0, 0, 0, 0.2), 1px 3px 15px 2px rgba(0, 0, 0, 0.2);
|
|
-webkit-transform-origin: 50% 25%;
|
|
transform-origin: 50% 25%;
|
|
border-radius: 0.28571429rem;
|
|
-webkit-user-select: text;
|
|
-moz-user-select: text;
|
|
-ms-user-select: text;
|
|
user-select: text;
|
|
will-change: top, left, margin, transform, opacity;
|
|
}
|
|
.ui.modal > :first-child:not(.icon),
|
|
.ui.modal > .icon:first-child + * {
|
|
border-top-left-radius: 0.28571429rem;
|
|
border-top-right-radius: 0.28571429rem;
|
|
}
|
|
.ui.modal > :last-child {
|
|
border-bottom-left-radius: 0.28571429rem;
|
|
border-bottom-right-radius: 0.28571429rem;
|
|
}
|
|
/*******************************
|
|
Content
|
|
*******************************/
|
|
/*--------------
|
|
Close
|
|
---------------*/
|
|
.ui.modal > .close {
|
|
cursor: pointer;
|
|
position: absolute;
|
|
top: -2.5rem;
|
|
right: -2.5rem;
|
|
z-index: 1;
|
|
opacity: 0.8;
|
|
font-size: 1.25em;
|
|
color: #FFFFFF;
|
|
width: 2.25rem;
|
|
height: 2.25rem;
|
|
padding: 0.625rem 0rem 0rem 0rem;
|
|
}
|
|
.ui.modal > .close:hover {
|
|
opacity: 1;
|
|
}
|
|
/*--------------
|
|
Header
|
|
---------------*/
|
|
.ui.modal > .header {
|
|
display: block;
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
background: #FFFFFF;
|
|
margin: 0em;
|
|
padding: 1.25rem 1.5rem;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
color: rgba(0, 0, 0, 0.85);
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.modal > .header:not(.ui) {
|
|
font-size: 1.42857143rem;
|
|
line-height: 1.2857em;
|
|
font-weight: bold;
|
|
}
|
|
/*--------------
|
|
Content
|
|
---------------*/
|
|
.ui.modal > .content {
|
|
display: block;
|
|
width: 100%;
|
|
font-size: 1em;
|
|
line-height: 1.4;
|
|
padding: 1.5rem;
|
|
background: #FFFFFF;
|
|
}
|
|
.ui.modal > .image.content {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
}
|
|
/* Image */
|
|
.ui.modal > .content > .image {
|
|
display: block;
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 1 auto;
|
|
flex: 0 1 auto;
|
|
width: '';
|
|
-ms-flex-item-align: top;
|
|
align-self: top;
|
|
}
|
|
.ui.modal > [class*="top aligned"] {
|
|
-ms-flex-item-align: top;
|
|
align-self: top;
|
|
}
|
|
.ui.modal > [class*="middle aligned"] {
|
|
-ms-flex-item-align: middle;
|
|
align-self: middle;
|
|
}
|
|
.ui.modal > [class*="stretched"] {
|
|
-ms-flex-item-align: stretch;
|
|
align-self: stretch;
|
|
}
|
|
/* Description */
|
|
.ui.modal > .content > .description {
|
|
display: block;
|
|
-webkit-box-flex: 1;
|
|
-ms-flex: 1 0 auto;
|
|
flex: 1 0 auto;
|
|
min-width: 0px;
|
|
-ms-flex-item-align: top;
|
|
align-self: top;
|
|
}
|
|
.ui.modal > .content > .icon + .description,
|
|
.ui.modal > .content > .image + .description {
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 1 auto;
|
|
flex: 0 1 auto;
|
|
min-width: '';
|
|
width: auto;
|
|
padding-left: 2em;
|
|
}
|
|
/*rtl:ignore*/
|
|
.ui.modal > .content > .image > i.icon {
|
|
margin: 0em;
|
|
opacity: 1;
|
|
width: auto;
|
|
line-height: 1;
|
|
font-size: 8rem;
|
|
}
|
|
/*--------------
|
|
Actions
|
|
---------------*/
|
|
.ui.modal > .actions {
|
|
background: #F9FAFB;
|
|
padding: 1rem 1rem;
|
|
border-top: 1px solid rgba(34, 36, 38, 0.15);
|
|
text-align: right;
|
|
}
|
|
.ui.modal .actions > .button {
|
|
margin-left: 0.75em;
|
|
}
|
|
/*-------------------
|
|
Responsive
|
|
--------------------*/
|
|
/* Modal Width */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.modal {
|
|
width: 95%;
|
|
margin: 0em 0em 0em -47.5%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 768px) {
|
|
.ui.modal {
|
|
width: 88%;
|
|
margin: 0em 0em 0em -44%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 992px) {
|
|
.ui.modal {
|
|
width: 850px;
|
|
margin: 0em 0em 0em -425px;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1200px) {
|
|
.ui.modal {
|
|
width: 900px;
|
|
margin: 0em 0em 0em -450px;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui.modal {
|
|
width: 950px;
|
|
margin: 0em 0em 0em -475px;
|
|
}
|
|
}
|
|
/* Tablet and Mobile */
|
|
@media only screen and (max-width: 991px) {
|
|
.ui.modal > .header {
|
|
padding-right: 2.25rem;
|
|
}
|
|
.ui.modal > .close {
|
|
top: 1.0535rem;
|
|
right: 1rem;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
}
|
|
/* Mobile */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.modal > .header {
|
|
padding: 0.75rem 1rem !important;
|
|
padding-right: 2.25rem !important;
|
|
}
|
|
.ui.modal > .content {
|
|
display: block;
|
|
padding: 1rem !important;
|
|
}
|
|
.ui.modal > .close {
|
|
top: 0.5rem !important;
|
|
right: 0.5rem !important;
|
|
}
|
|
/*rtl:ignore*/
|
|
.ui.modal .image.content {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
.ui.modal .content > .image {
|
|
display: block;
|
|
max-width: 100%;
|
|
margin: 0em auto !important;
|
|
text-align: center;
|
|
padding: 0rem 0rem 1rem !important;
|
|
}
|
|
.ui.modal > .content > .image > i.icon {
|
|
font-size: 5rem;
|
|
text-align: center;
|
|
}
|
|
/*rtl:ignore*/
|
|
.ui.modal .content > .description {
|
|
display: block;
|
|
width: 100% !important;
|
|
margin: 0em !important;
|
|
padding: 1rem 0rem !important;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
/* Let Buttons Stack */
|
|
.ui.modal > .actions {
|
|
padding: 1rem 1rem 0rem !important;
|
|
}
|
|
.ui.modal .actions > .buttons,
|
|
.ui.modal .actions > .button {
|
|
margin-bottom: 1rem;
|
|
}
|
|
}
|
|
/*--------------
|
|
Coupling
|
|
---------------*/
|
|
.ui.inverted.dimmer > .ui.modal {
|
|
-webkit-box-shadow: 1px 3px 10px 2px rgba(0, 0, 0, 0.2);
|
|
box-shadow: 1px 3px 10px 2px rgba(0, 0, 0, 0.2);
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
.ui.basic.modal {
|
|
background-color: transparent;
|
|
border: none;
|
|
border-radius: 0em;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.basic.modal > .header,
|
|
.ui.basic.modal > .content,
|
|
.ui.basic.modal > .actions {
|
|
background-color: transparent;
|
|
}
|
|
.ui.basic.modal > .header {
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.basic.modal > .close {
|
|
top: 1rem;
|
|
right: 1.5rem;
|
|
}
|
|
.ui.inverted.dimmer > .basic.modal {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.inverted.dimmer > .ui.basic.modal > .header {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
/* Tablet and Mobile */
|
|
@media only screen and (max-width: 991px) {
|
|
.ui.basic.modal > .close {
|
|
color: #FFFFFF;
|
|
}
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
.ui.active.modal {
|
|
display: block;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Scrolling
|
|
---------------*/
|
|
/* A modal that cannot fit on the page */
|
|
.scrolling.dimmable.dimmed {
|
|
overflow: hidden;
|
|
}
|
|
.scrolling.dimmable.dimmed > .dimmer {
|
|
overflow: auto;
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
.scrolling.dimmable > .dimmer {
|
|
position: fixed;
|
|
}
|
|
.modals.dimmer .ui.scrolling.modal {
|
|
position: static !important;
|
|
margin: 3.5rem auto !important;
|
|
}
|
|
/* undetached scrolling */
|
|
.scrolling.undetached.dimmable.dimmed {
|
|
overflow: auto;
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
.scrolling.undetached.dimmable.dimmed > .dimmer {
|
|
overflow: hidden;
|
|
}
|
|
.scrolling.undetached.dimmable .ui.scrolling.modal {
|
|
position: absolute;
|
|
left: 50%;
|
|
margin-top: 3.5rem !important;
|
|
}
|
|
/* Coupling with Sidebar */
|
|
.undetached.dimmable.dimmed > .pusher {
|
|
z-index: auto;
|
|
}
|
|
@media only screen and (max-width: 991px) {
|
|
.modals.dimmer .ui.scrolling.modal {
|
|
margin-top: 1rem !important;
|
|
margin-bottom: 1rem !important;
|
|
}
|
|
}
|
|
/*--------------
|
|
Full Screen
|
|
---------------*/
|
|
.ui.fullscreen.modal {
|
|
width: 95% !important;
|
|
left: 2.5% !important;
|
|
margin: 1em auto;
|
|
}
|
|
.ui.fullscreen.scrolling.modal {
|
|
left: 0em !important;
|
|
}
|
|
.ui.fullscreen.modal > .header {
|
|
padding-right: 2.25rem;
|
|
}
|
|
.ui.fullscreen.modal > .close {
|
|
top: 1.0535rem;
|
|
right: 1rem;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/*--------------
|
|
Size
|
|
---------------*/
|
|
.ui.modal {
|
|
font-size: 1rem;
|
|
}
|
|
/* Small */
|
|
.ui.small.modal > .header:not(.ui) {
|
|
font-size: 1.3em;
|
|
}
|
|
/* Small Modal Width */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.small.modal {
|
|
width: 95%;
|
|
margin: 0em 0em 0em -47.5%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 768px) {
|
|
.ui.small.modal {
|
|
width: 70.4%;
|
|
margin: 0em 0em 0em -35.2%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 992px) {
|
|
.ui.small.modal {
|
|
width: 680px;
|
|
margin: 0em 0em 0em -340px;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1200px) {
|
|
.ui.small.modal {
|
|
width: 720px;
|
|
margin: 0em 0em 0em -360px;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui.small.modal {
|
|
width: 760px;
|
|
margin: 0em 0em 0em -380px;
|
|
}
|
|
}
|
|
/* Large Modal Width */
|
|
.ui.large.modal > .header {
|
|
font-size: 1.6em;
|
|
}
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.large.modal {
|
|
width: 95%;
|
|
margin: 0em 0em 0em -47.5%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 768px) {
|
|
.ui.large.modal {
|
|
width: 88%;
|
|
margin: 0em 0em 0em -44%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 992px) {
|
|
.ui.large.modal {
|
|
width: 1020px;
|
|
margin: 0em 0em 0em -510px;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1200px) {
|
|
.ui.large.modal {
|
|
width: 1080px;
|
|
margin: 0em 0em 0em -540px;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 1920px) {
|
|
.ui.large.modal {
|
|
width: 1140px;
|
|
margin: 0em 0em 0em -570px;
|
|
}
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Popup
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Popup
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*-------------------
|
|
Parts
|
|
--------------------*/
|
|
/* Placement */
|
|
/* Header */
|
|
/* Content Border */
|
|
/* Arrow */
|
|
/* Arrow color by position */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Tooltip */
|
|
/* Inverted */
|
|
/* Arrow */
|
|
/*-------------------
|
|
Coupling
|
|
--------------------*/
|
|
/* Grid Inside Popup */
|
|
/* (padding * @medium) */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Wide */
|
|
/* Inverted */
|
|
/* Arrow color by position */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Popup
|
|
*******************************/
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
/*-------------------
|
|
Parts
|
|
--------------------*/
|
|
/* Placement */
|
|
/* Header */
|
|
/* Content Border */
|
|
/* Arrow */
|
|
/* Arrow color by position */
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
/* Tooltip */
|
|
/* Inverted */
|
|
/* Arrow */
|
|
/*-------------------
|
|
Coupling
|
|
--------------------*/
|
|
/* Grid Inside Popup */
|
|
/* (padding * @medium) */
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Wide */
|
|
/* Inverted */
|
|
/* Arrow color by position */
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Popup
|
|
*******************************/
|
|
.ui.popup {
|
|
display: none;
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 0px;
|
|
/* Fixes content being squished when inline (moz only) */
|
|
min-width: -webkit-min-content;
|
|
min-width: -moz-min-content;
|
|
min-width: min-content;
|
|
z-index: 1900;
|
|
border: 1px solid #D4D4D5;
|
|
line-height: 1.4285em;
|
|
max-width: 250px;
|
|
background: #FFFFFF;
|
|
padding: 0.833em 1em;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.popup > .header {
|
|
padding: 0em;
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-size: 1.14285714em;
|
|
line-height: 1.2;
|
|
font-weight: bold;
|
|
}
|
|
.ui.popup > .header + .content {
|
|
padding-top: 0.5em;
|
|
}
|
|
.ui.popup:before {
|
|
position: absolute;
|
|
content: '';
|
|
width: 0.71428571em;
|
|
height: 0.71428571em;
|
|
background: #FFFFFF;
|
|
-webkit-transform: rotate(45deg);
|
|
transform: rotate(45deg);
|
|
z-index: 2;
|
|
-webkit-box-shadow: 1px 1px 0px 0px #bababc;
|
|
box-shadow: 1px 1px 0px 0px #bababc;
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Tooltip
|
|
---------------*/
|
|
/* Content */
|
|
[data-tooltip] {
|
|
position: relative;
|
|
}
|
|
/* Arrow */
|
|
[data-tooltip]:before {
|
|
pointer-events: none;
|
|
position: absolute;
|
|
content: '';
|
|
font-size: 1rem;
|
|
width: 0.71428571em;
|
|
height: 0.71428571em;
|
|
background: #FFFFFF;
|
|
-webkit-transform: rotate(45deg);
|
|
transform: rotate(45deg);
|
|
z-index: 2;
|
|
-webkit-box-shadow: 1px 1px 0px 0px #bababc;
|
|
box-shadow: 1px 1px 0px 0px #bababc;
|
|
}
|
|
/* Popup */
|
|
[data-tooltip]:after {
|
|
pointer-events: none;
|
|
content: attr(data-tooltip);
|
|
position: absolute;
|
|
text-transform: none;
|
|
text-align: left;
|
|
white-space: nowrap;
|
|
font-size: 1rem;
|
|
border: 1px solid #D4D4D5;
|
|
line-height: 1.4285em;
|
|
max-width: none;
|
|
background: #FFFFFF;
|
|
padding: 0.833em 1em;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
z-index: 1;
|
|
}
|
|
/* Default Position (Top Center) */
|
|
[data-tooltip]:not([data-position]):before {
|
|
top: auto;
|
|
right: auto;
|
|
bottom: 100%;
|
|
left: 50%;
|
|
background: #FFFFFF;
|
|
margin-left: -0.07142857rem;
|
|
margin-bottom: 0.14285714rem;
|
|
}
|
|
[data-tooltip]:not([data-position]):after {
|
|
left: 50%;
|
|
-webkit-transform: translateX(-50%);
|
|
transform: translateX(-50%);
|
|
bottom: 100%;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
/* Animation */
|
|
[data-tooltip]:before,
|
|
[data-tooltip]:after {
|
|
pointer-events: none;
|
|
visibility: hidden;
|
|
}
|
|
[data-tooltip]:before {
|
|
opacity: 0;
|
|
-webkit-transform: rotate(45deg) scale(0) !important;
|
|
transform: rotate(45deg) scale(0) !important;
|
|
-webkit-transform-origin: center top;
|
|
transform-origin: center top;
|
|
-webkit-transition: all 0.1s ease;
|
|
transition: all 0.1s ease;
|
|
}
|
|
[data-tooltip]:after {
|
|
opacity: 1;
|
|
-webkit-transform-origin: center bottom;
|
|
transform-origin: center bottom;
|
|
-webkit-transition: all 0.1s ease;
|
|
transition: all 0.1s ease;
|
|
}
|
|
[data-tooltip]:hover:before,
|
|
[data-tooltip]:hover:after {
|
|
visibility: visible;
|
|
pointer-events: auto;
|
|
}
|
|
[data-tooltip]:hover:before {
|
|
-webkit-transform: rotate(45deg) scale(1) !important;
|
|
transform: rotate(45deg) scale(1) !important;
|
|
opacity: 1;
|
|
}
|
|
/* Animation Position */
|
|
[data-tooltip]:after,
|
|
[data-tooltip][data-position="top center"]:after,
|
|
[data-tooltip][data-position="bottom center"]:after {
|
|
-webkit-transform: translateX(-50%) scale(0) !important;
|
|
transform: translateX(-50%) scale(0) !important;
|
|
}
|
|
[data-tooltip]:hover:after,
|
|
[data-tooltip][data-position="bottom center"]:hover:after {
|
|
-webkit-transform: translateX(-50%) scale(1) !important;
|
|
transform: translateX(-50%) scale(1) !important;
|
|
}
|
|
[data-tooltip][data-position="left center"]:after,
|
|
[data-tooltip][data-position="right center"]:after {
|
|
-webkit-transform: translateY(-50%) scale(0) !important;
|
|
transform: translateY(-50%) scale(0) !important;
|
|
}
|
|
[data-tooltip][data-position="left center"]:hover:after,
|
|
[data-tooltip][data-position="right center"]:hover:after {
|
|
-webkit-transform: translateY(-50%) scale(1) !important;
|
|
transform: translateY(-50%) scale(1) !important;
|
|
}
|
|
[data-tooltip][data-position="top left"]:after,
|
|
[data-tooltip][data-position="top right"]:after,
|
|
[data-tooltip][data-position="bottom left"]:after,
|
|
[data-tooltip][data-position="bottom right"]:after {
|
|
-webkit-transform: scale(0) !important;
|
|
transform: scale(0) !important;
|
|
}
|
|
[data-tooltip][data-position="top left"]:hover:after,
|
|
[data-tooltip][data-position="top right"]:hover:after,
|
|
[data-tooltip][data-position="bottom left"]:hover:after,
|
|
[data-tooltip][data-position="bottom right"]:hover:after {
|
|
-webkit-transform: scale(1) !important;
|
|
transform: scale(1) !important;
|
|
}
|
|
/*--------------
|
|
Inverted
|
|
---------------*/
|
|
/* Arrow */
|
|
[data-tooltip][data-inverted]:before {
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
/* Arrow Position */
|
|
[data-tooltip][data-inverted]:before {
|
|
background: #1B1C1D;
|
|
}
|
|
/* Popup */
|
|
[data-tooltip][data-inverted]:after {
|
|
background: #1B1C1D;
|
|
color: #FFFFFF;
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
[data-tooltip][data-inverted]:after .header {
|
|
background-color: none;
|
|
color: #FFFFFF;
|
|
}
|
|
/*--------------
|
|
Position
|
|
---------------*/
|
|
/* Top Center */
|
|
[data-position="top center"][data-tooltip]:after {
|
|
top: auto;
|
|
right: auto;
|
|
left: 50%;
|
|
bottom: 100%;
|
|
-webkit-transform: translateX(-50%);
|
|
transform: translateX(-50%);
|
|
margin-bottom: 0.5em;
|
|
}
|
|
[data-position="top center"][data-tooltip]:before {
|
|
top: auto;
|
|
right: auto;
|
|
bottom: 100%;
|
|
left: 50%;
|
|
background: #FFFFFF;
|
|
margin-left: -0.07142857rem;
|
|
margin-bottom: 0.14285714rem;
|
|
}
|
|
/* Top Left */
|
|
[data-position="top left"][data-tooltip]:after {
|
|
top: auto;
|
|
right: auto;
|
|
left: 0;
|
|
bottom: 100%;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
[data-position="top left"][data-tooltip]:before {
|
|
top: auto;
|
|
right: auto;
|
|
bottom: 100%;
|
|
left: 1em;
|
|
margin-left: -0.07142857rem;
|
|
margin-bottom: 0.14285714rem;
|
|
}
|
|
/* Top Right */
|
|
[data-position="top right"][data-tooltip]:after {
|
|
top: auto;
|
|
left: auto;
|
|
right: 0;
|
|
bottom: 100%;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
[data-position="top right"][data-tooltip]:before {
|
|
top: auto;
|
|
left: auto;
|
|
bottom: 100%;
|
|
right: 1em;
|
|
margin-left: -0.07142857rem;
|
|
margin-bottom: 0.14285714rem;
|
|
}
|
|
/* Bottom Center */
|
|
[data-position="bottom center"][data-tooltip]:after {
|
|
bottom: auto;
|
|
right: auto;
|
|
left: 50%;
|
|
top: 100%;
|
|
-webkit-transform: translateX(-50%);
|
|
transform: translateX(-50%);
|
|
margin-top: 0.5em;
|
|
}
|
|
[data-position="bottom center"][data-tooltip]:before {
|
|
bottom: auto;
|
|
right: auto;
|
|
top: 100%;
|
|
left: 50%;
|
|
margin-left: -0.07142857rem;
|
|
margin-top: 0.14285714rem;
|
|
}
|
|
/* Bottom Left */
|
|
[data-position="bottom left"][data-tooltip]:after {
|
|
left: 0;
|
|
top: 100%;
|
|
margin-top: 0.5em;
|
|
}
|
|
[data-position="bottom left"][data-tooltip]:before {
|
|
bottom: auto;
|
|
right: auto;
|
|
top: 100%;
|
|
left: 1em;
|
|
margin-left: -0.07142857rem;
|
|
margin-top: 0.14285714rem;
|
|
}
|
|
/* Bottom Right */
|
|
[data-position="bottom right"][data-tooltip]:after {
|
|
right: 0;
|
|
top: 100%;
|
|
margin-top: 0.5em;
|
|
}
|
|
[data-position="bottom right"][data-tooltip]:before {
|
|
bottom: auto;
|
|
left: auto;
|
|
top: 100%;
|
|
right: 1em;
|
|
margin-left: -0.14285714rem;
|
|
margin-top: 0.07142857rem;
|
|
}
|
|
/* Left Center */
|
|
[data-position="left center"][data-tooltip]:after {
|
|
right: 100%;
|
|
top: 50%;
|
|
margin-right: 0.5em;
|
|
-webkit-transform: translateY(-50%);
|
|
transform: translateY(-50%);
|
|
}
|
|
[data-position="left center"][data-tooltip]:before {
|
|
right: 100%;
|
|
top: 50%;
|
|
margin-top: -0.14285714rem;
|
|
margin-right: -0.07142857rem;
|
|
}
|
|
/* Right Center */
|
|
[data-position="right center"][data-tooltip]:after {
|
|
left: 100%;
|
|
top: 50%;
|
|
margin-left: 0.5em;
|
|
-webkit-transform: translateY(-50%);
|
|
transform: translateY(-50%);
|
|
}
|
|
[data-position="right center"][data-tooltip]:before {
|
|
left: 100%;
|
|
top: 50%;
|
|
margin-top: -0.07142857rem;
|
|
margin-left: 0.14285714rem;
|
|
}
|
|
/* Arrow */
|
|
[data-position~="bottom"][data-tooltip]:before {
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: -1px -1px 0px 0px #bababc;
|
|
box-shadow: -1px -1px 0px 0px #bababc;
|
|
}
|
|
[data-position="left center"][data-tooltip]:before {
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: 1px -1px 0px 0px #bababc;
|
|
box-shadow: 1px -1px 0px 0px #bababc;
|
|
}
|
|
[data-position="right center"][data-tooltip]:before {
|
|
background: #FFFFFF;
|
|
-webkit-box-shadow: -1px 1px 0px 0px #bababc;
|
|
box-shadow: -1px 1px 0px 0px #bababc;
|
|
}
|
|
[data-position~="top"][data-tooltip]:before {
|
|
background: #FFFFFF;
|
|
}
|
|
/* Inverted Arrow Color */
|
|
[data-inverted][data-position~="bottom"][data-tooltip]:before {
|
|
background: #1B1C1D;
|
|
-webkit-box-shadow: -1px -1px 0px 0px #bababc;
|
|
box-shadow: -1px -1px 0px 0px #bababc;
|
|
}
|
|
[data-inverted][data-position="left center"][data-tooltip]:before {
|
|
background: #1B1C1D;
|
|
-webkit-box-shadow: 1px -1px 0px 0px #bababc;
|
|
box-shadow: 1px -1px 0px 0px #bababc;
|
|
}
|
|
[data-inverted][data-position="right center"][data-tooltip]:before {
|
|
background: #1B1C1D;
|
|
-webkit-box-shadow: -1px 1px 0px 0px #bababc;
|
|
box-shadow: -1px 1px 0px 0px #bababc;
|
|
}
|
|
[data-inverted][data-position~="top"][data-tooltip]:before {
|
|
background: #1B1C1D;
|
|
}
|
|
[data-position~="bottom"][data-tooltip]:before {
|
|
-webkit-transform-origin: center bottom;
|
|
transform-origin: center bottom;
|
|
}
|
|
[data-position~="bottom"][data-tooltip]:after {
|
|
-webkit-transform-origin: center top;
|
|
transform-origin: center top;
|
|
}
|
|
[data-position="left center"][data-tooltip]:before {
|
|
-webkit-transform-origin: top center;
|
|
transform-origin: top center;
|
|
}
|
|
[data-position="left center"][data-tooltip]:after {
|
|
-webkit-transform-origin: right center;
|
|
transform-origin: right center;
|
|
}
|
|
[data-position="right center"][data-tooltip]:before {
|
|
-webkit-transform-origin: right center;
|
|
transform-origin: right center;
|
|
}
|
|
[data-position="right center"][data-tooltip]:after {
|
|
-webkit-transform-origin: left center;
|
|
transform-origin: left center;
|
|
}
|
|
/*--------------
|
|
Spacing
|
|
---------------*/
|
|
.ui.popup {
|
|
margin: 0em;
|
|
}
|
|
/* Extending from Top */
|
|
.ui.top.popup {
|
|
margin: 0em 0em 0.71428571em;
|
|
}
|
|
.ui.top.left.popup {
|
|
-webkit-transform-origin: left bottom;
|
|
transform-origin: left bottom;
|
|
}
|
|
.ui.top.center.popup {
|
|
-webkit-transform-origin: center bottom;
|
|
transform-origin: center bottom;
|
|
}
|
|
.ui.top.right.popup {
|
|
-webkit-transform-origin: right bottom;
|
|
transform-origin: right bottom;
|
|
}
|
|
/* Extending from Vertical Center */
|
|
.ui.left.center.popup {
|
|
margin: 0em 0.71428571em 0em 0em;
|
|
-webkit-transform-origin: right 50%;
|
|
transform-origin: right 50%;
|
|
}
|
|
.ui.right.center.popup {
|
|
margin: 0em 0em 0em 0.71428571em;
|
|
-webkit-transform-origin: left 50%;
|
|
transform-origin: left 50%;
|
|
}
|
|
/* Extending from Bottom */
|
|
.ui.bottom.popup {
|
|
margin: 0.71428571em 0em 0em;
|
|
}
|
|
.ui.bottom.left.popup {
|
|
-webkit-transform-origin: left top;
|
|
transform-origin: left top;
|
|
}
|
|
.ui.bottom.center.popup {
|
|
-webkit-transform-origin: center top;
|
|
transform-origin: center top;
|
|
}
|
|
.ui.bottom.right.popup {
|
|
-webkit-transform-origin: right top;
|
|
transform-origin: right top;
|
|
}
|
|
/*--------------
|
|
Pointer
|
|
---------------*/
|
|
/*--- Below ---*/
|
|
.ui.bottom.center.popup:before {
|
|
margin-left: -0.30714286em;
|
|
top: -0.30714286em;
|
|
left: 50%;
|
|
right: auto;
|
|
bottom: auto;
|
|
-webkit-box-shadow: -1px -1px 0px 0px #bababc;
|
|
box-shadow: -1px -1px 0px 0px #bababc;
|
|
}
|
|
.ui.bottom.left.popup {
|
|
margin-left: 0em;
|
|
}
|
|
/*rtl:rename*/
|
|
.ui.bottom.left.popup:before {
|
|
top: -0.30714286em;
|
|
left: 1em;
|
|
right: auto;
|
|
bottom: auto;
|
|
margin-left: 0em;
|
|
-webkit-box-shadow: -1px -1px 0px 0px #bababc;
|
|
box-shadow: -1px -1px 0px 0px #bababc;
|
|
}
|
|
.ui.bottom.right.popup {
|
|
margin-right: 0em;
|
|
}
|
|
/*rtl:rename*/
|
|
.ui.bottom.right.popup:before {
|
|
top: -0.30714286em;
|
|
right: 1em;
|
|
bottom: auto;
|
|
left: auto;
|
|
margin-left: 0em;
|
|
-webkit-box-shadow: -1px -1px 0px 0px #bababc;
|
|
box-shadow: -1px -1px 0px 0px #bababc;
|
|
}
|
|
/*--- Above ---*/
|
|
.ui.top.center.popup:before {
|
|
top: auto;
|
|
right: auto;
|
|
bottom: -0.30714286em;
|
|
left: 50%;
|
|
margin-left: -0.30714286em;
|
|
}
|
|
.ui.top.left.popup {
|
|
margin-left: 0em;
|
|
}
|
|
/*rtl:rename*/
|
|
.ui.top.left.popup:before {
|
|
bottom: -0.30714286em;
|
|
left: 1em;
|
|
top: auto;
|
|
right: auto;
|
|
margin-left: 0em;
|
|
}
|
|
.ui.top.right.popup {
|
|
margin-right: 0em;
|
|
}
|
|
/*rtl:rename*/
|
|
.ui.top.right.popup:before {
|
|
bottom: -0.30714286em;
|
|
right: 1em;
|
|
top: auto;
|
|
left: auto;
|
|
margin-left: 0em;
|
|
}
|
|
/*--- Left Center ---*/
|
|
/*rtl:rename*/
|
|
.ui.left.center.popup:before {
|
|
top: 50%;
|
|
right: -0.30714286em;
|
|
bottom: auto;
|
|
left: auto;
|
|
margin-top: -0.30714286em;
|
|
-webkit-box-shadow: 1px -1px 0px 0px #bababc;
|
|
box-shadow: 1px -1px 0px 0px #bababc;
|
|
}
|
|
/*--- Right Center ---*/
|
|
/*rtl:rename*/
|
|
.ui.right.center.popup:before {
|
|
top: 50%;
|
|
left: -0.30714286em;
|
|
bottom: auto;
|
|
right: auto;
|
|
margin-top: -0.30714286em;
|
|
-webkit-box-shadow: -1px 1px 0px 0px #bababc;
|
|
box-shadow: -1px 1px 0px 0px #bababc;
|
|
}
|
|
/* Arrow Color By Location */
|
|
.ui.bottom.popup:before {
|
|
background: #FFFFFF;
|
|
}
|
|
.ui.right.center.popup:before,
|
|
.ui.left.center.popup:before {
|
|
background: #FFFFFF;
|
|
}
|
|
.ui.top.popup:before {
|
|
background: #FFFFFF;
|
|
}
|
|
/* Inverted Arrow Color */
|
|
.ui.inverted.bottom.popup:before {
|
|
background: #1B1C1D;
|
|
}
|
|
.ui.inverted.right.center.popup:before,
|
|
.ui.inverted.left.center.popup:before {
|
|
background: #1B1C1D;
|
|
}
|
|
.ui.inverted.top.popup:before {
|
|
background: #1B1C1D;
|
|
}
|
|
/*******************************
|
|
Coupling
|
|
*******************************/
|
|
/* Immediate Nested Grid */
|
|
.ui.popup > .ui.grid:not(.padded) {
|
|
width: calc(100% + 1.75rem);
|
|
margin: -0.7rem -0.875rem;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
.ui.loading.popup {
|
|
display: block;
|
|
visibility: hidden;
|
|
z-index: -1;
|
|
}
|
|
.ui.animating.popup,
|
|
.ui.visible.popup {
|
|
display: block;
|
|
}
|
|
.ui.visible.popup {
|
|
-webkit-transform: translateZ(0px);
|
|
transform: translateZ(0px);
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Basic
|
|
---------------*/
|
|
.ui.basic.popup:before {
|
|
display: none;
|
|
}
|
|
/*--------------
|
|
Wide
|
|
---------------*/
|
|
.ui.wide.popup {
|
|
max-width: 350px;
|
|
}
|
|
.ui[class*="very wide"].popup {
|
|
max-width: 550px;
|
|
}
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.wide.popup,
|
|
.ui[class*="very wide"].popup {
|
|
max-width: 250px;
|
|
}
|
|
}
|
|
/*--------------
|
|
Fluid
|
|
---------------*/
|
|
.ui.fluid.popup {
|
|
width: 100%;
|
|
max-width: none;
|
|
}
|
|
/*--------------
|
|
Colors
|
|
---------------*/
|
|
/* Inverted colors */
|
|
.ui.inverted.popup {
|
|
background: #1B1C1D;
|
|
color: #FFFFFF;
|
|
border: none;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.inverted.popup .header {
|
|
background-color: none;
|
|
color: #FFFFFF;
|
|
}
|
|
.ui.inverted.popup:before {
|
|
background-color: #1B1C1D;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
/*--------------
|
|
Flowing
|
|
---------------*/
|
|
.ui.flowing.popup {
|
|
max-width: none;
|
|
}
|
|
/*--------------
|
|
Sizes
|
|
---------------*/
|
|
.ui.mini.popup {
|
|
font-size: 0.78571429rem;
|
|
}
|
|
.ui.tiny.popup {
|
|
font-size: 0.85714286rem;
|
|
}
|
|
.ui.small.popup {
|
|
font-size: 0.92857143rem;
|
|
}
|
|
.ui.popup {
|
|
font-size: 1rem;
|
|
}
|
|
.ui.large.popup {
|
|
font-size: 1.14285714rem;
|
|
}
|
|
.ui.huge.popup {
|
|
font-size: 1.42857143rem;
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/*******************************
|
|
User Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Search
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Search
|
|
*******************************/
|
|
/* Search Prompt */
|
|
/* Result Box */
|
|
/* Result */
|
|
/* Result Image */
|
|
/* Result Content */
|
|
/* Description */
|
|
/* Price */
|
|
/* Special Message */
|
|
/* All Results Link */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/* Focus */
|
|
/* Hover */
|
|
/* Loading */
|
|
/* Active Category */
|
|
/* Active Result */
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/* Selection */
|
|
/* Category */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Search
|
|
*******************************/
|
|
/* Search Prompt */
|
|
/* Result Box */
|
|
/* Result */
|
|
/* Result Image */
|
|
/* Result Content */
|
|
/* Description */
|
|
/* Price */
|
|
/* Special Message */
|
|
/* All Results Link */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/* Focus */
|
|
/* Hover */
|
|
/* Loading */
|
|
/* Active Category */
|
|
/* Active Result */
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/* Selection */
|
|
/* Category */
|
|
/* Site Theme */
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Search
|
|
*******************************/
|
|
.ui.search {
|
|
position: relative;
|
|
}
|
|
.ui.search > .prompt {
|
|
margin: 0em;
|
|
outline: none;
|
|
-webkit-appearance: none;
|
|
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
|
|
text-shadow: none;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
line-height: 1.2142em;
|
|
padding: 0.67861429em 1em;
|
|
font-size: 1em;
|
|
background: #FFFFFF;
|
|
border: 1px solid rgba(34, 36, 38, 0.15);
|
|
color: rgba(0, 0, 0, 0.87);
|
|
-webkit-box-shadow: 0em 0em 0em 0em transparent inset;
|
|
box-shadow: 0em 0em 0em 0em transparent inset;
|
|
-webkit-transition: background-color 0.1s ease, color 0.1s ease, border-color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: background-color 0.1s ease, color 0.1s ease, border-color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
transition: background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, border-color 0.1s ease;
|
|
transition: background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, border-color 0.1s ease, -webkit-box-shadow 0.1s ease;
|
|
}
|
|
.ui.search .prompt {
|
|
border-radius: 500rem;
|
|
}
|
|
/*--------------
|
|
Icon
|
|
---------------*/
|
|
.ui.search .prompt ~ .search.icon {
|
|
cursor: pointer;
|
|
}
|
|
/*--------------
|
|
Results
|
|
---------------*/
|
|
.ui.search > .results {
|
|
display: none;
|
|
position: absolute;
|
|
top: 100%;
|
|
left: 0%;
|
|
-webkit-transform-origin: center top;
|
|
transform-origin: center top;
|
|
white-space: normal;
|
|
background: #FFFFFF;
|
|
margin-top: 0.5em;
|
|
width: 18em;
|
|
border-radius: 0.28571429rem;
|
|
-webkit-box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
|
|
border: 1px solid #D4D4D5;
|
|
z-index: 998;
|
|
}
|
|
.ui.search > .results > :first-child {
|
|
border-radius: 0.28571429rem 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.search > .results > :last-child {
|
|
border-radius: 0em 0em 0.28571429rem 0.28571429rem;
|
|
}
|
|
/*--------------
|
|
Result
|
|
---------------*/
|
|
.ui.search > .results .result {
|
|
cursor: pointer;
|
|
display: block;
|
|
overflow: hidden;
|
|
font-size: 1em;
|
|
padding: 0.85714286em 1.14285714em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
line-height: 1.33;
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.1);
|
|
}
|
|
.ui.search > .results .result:last-child {
|
|
border-bottom: none !important;
|
|
}
|
|
/* Image */
|
|
.ui.search > .results .result .image {
|
|
float: right;
|
|
overflow: hidden;
|
|
background: none;
|
|
width: 5em;
|
|
height: 3em;
|
|
border-radius: 0.25em;
|
|
}
|
|
.ui.search > .results .result .image img {
|
|
display: block;
|
|
width: auto;
|
|
height: 100%;
|
|
}
|
|
/*--------------
|
|
Info
|
|
---------------*/
|
|
.ui.search > .results .result .image + .content {
|
|
margin: 0em 6em 0em 0em;
|
|
}
|
|
.ui.search > .results .result .title {
|
|
margin: -0.14285em 0em 0em;
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-weight: bold;
|
|
font-size: 1em;
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
.ui.search > .results .result .description {
|
|
margin-top: 0;
|
|
font-size: 0.92857143em;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
.ui.search > .results .result .price {
|
|
float: right;
|
|
color: #00ED00;
|
|
}
|
|
/*--------------
|
|
Message
|
|
---------------*/
|
|
.ui.search > .results > .message {
|
|
padding: 1em 1em;
|
|
}
|
|
.ui.search > .results > .message .header {
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-size: 1rem;
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.search > .results > .message .description {
|
|
margin-top: 0.25rem;
|
|
font-size: 1em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
/* View All Results */
|
|
.ui.search > .results > .action {
|
|
display: block;
|
|
border-top: none;
|
|
background: #F3F4F5;
|
|
padding: 0.92857143em 1em;
|
|
color: rgba(0, 0, 0, 0.87);
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------------
|
|
Focus
|
|
---------------------*/
|
|
.ui.search > .prompt:focus {
|
|
border-color: rgba(34, 36, 38, 0.35);
|
|
background: #FFFFFF;
|
|
color: rgba(0, 0, 0, 0.95);
|
|
}
|
|
/*--------------------
|
|
Loading
|
|
---------------------*/
|
|
.ui.loading.search .input > i.icon:before {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -0.64285714em 0em 0em -0.64285714em;
|
|
width: 1.28571429em;
|
|
height: 1.28571429em;
|
|
border-radius: 500rem;
|
|
border: 0.2em solid rgba(0, 0, 0, 0.1);
|
|
}
|
|
.ui.loading.search .input > i.icon:after {
|
|
position: absolute;
|
|
content: '';
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -0.64285714em 0em 0em -0.64285714em;
|
|
width: 1.28571429em;
|
|
height: 1.28571429em;
|
|
-webkit-animation: button-spin 0.6s linear;
|
|
animation: button-spin 0.6s linear;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
border-radius: 500rem;
|
|
border-color: #95a5a6 transparent transparent;
|
|
border-style: solid;
|
|
border-width: 0.2em;
|
|
-webkit-box-shadow: 0px 0px 0px 1px transparent;
|
|
box-shadow: 0px 0px 0px 1px transparent;
|
|
}
|
|
/*--------------
|
|
Hover
|
|
---------------*/
|
|
.ui.search > .results .result:hover,
|
|
.ui.category.search > .results .category .result:hover {
|
|
background: #F9FAFB;
|
|
}
|
|
.ui.search .action:hover {
|
|
background: #E0E0E0;
|
|
}
|
|
/*--------------
|
|
Active
|
|
---------------*/
|
|
.ui.category.search > .results .category.active {
|
|
background: #F3F4F5;
|
|
}
|
|
.ui.category.search > .results .category.active > .name {
|
|
color: rgba(0, 0, 0, 0.87);
|
|
}
|
|
.ui.search > .results .result.active,
|
|
.ui.category.search > .results .category .result.active {
|
|
position: relative;
|
|
border-left-color: rgba(34, 36, 38, 0.1);
|
|
background: #F3F4F5;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
.ui.search > .results .result.active .title {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
.ui.search > .results .result.active .description {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
/*******************************
|
|
Types
|
|
*******************************/
|
|
/*--------------
|
|
Selection
|
|
---------------*/
|
|
.ui.search.selection .prompt {
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
/* Remove input */
|
|
.ui.search.selection > .icon.input > .remove.icon {
|
|
pointer-events: none;
|
|
position: absolute;
|
|
left: auto;
|
|
opacity: 0;
|
|
color: '';
|
|
top: 0em;
|
|
right: 0em;
|
|
-webkit-transition: color 0.1s ease, opacity 0.1s ease;
|
|
transition: color 0.1s ease, opacity 0.1s ease;
|
|
}
|
|
.ui.search.selection > .icon.input > .active.remove.icon {
|
|
cursor: pointer;
|
|
opacity: 0.8;
|
|
pointer-events: auto;
|
|
}
|
|
.ui.search.selection > .icon.input:not([class*="left icon"]) > .icon ~ .remove.icon {
|
|
right: 1.85714em;
|
|
}
|
|
.ui.search.selection > .icon.input > .remove.icon:hover {
|
|
opacity: 1;
|
|
color: #EF767A;
|
|
}
|
|
/*--------------
|
|
Category
|
|
---------------*/
|
|
.ui.category.search .results {
|
|
width: 28em;
|
|
}
|
|
/* Category */
|
|
.ui.category.search > .results .category {
|
|
background: #F3F4F5;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.1);
|
|
-webkit-transition: background 0.1s ease, border-color 0.1s ease;
|
|
transition: background 0.1s ease, border-color 0.1s ease;
|
|
}
|
|
/* Last Category */
|
|
.ui.category.search > .results .category:last-child {
|
|
border-bottom: none;
|
|
}
|
|
/* First / Last */
|
|
.ui.category.search > .results .category:first-child .name + .result {
|
|
border-radius: 0em 0.28571429rem 0em 0em;
|
|
}
|
|
.ui.category.search > .results .category:last-child .result:last-child {
|
|
border-radius: 0em 0em 0.28571429rem 0em;
|
|
}
|
|
/* Category Result */
|
|
.ui.category.search > .results .category .result {
|
|
background: #FFFFFF;
|
|
margin-left: 100px;
|
|
border-left: 1px solid rgba(34, 36, 38, 0.15);
|
|
border-bottom: 1px solid rgba(34, 36, 38, 0.1);
|
|
-webkit-transition: background 0.1s ease, border-color 0.1s ease;
|
|
transition: background 0.1s ease, border-color 0.1s ease;
|
|
padding: 0.85714286em 1.14285714em;
|
|
}
|
|
.ui.category.search > .results .category:last-child .result:last-child {
|
|
border-bottom: none;
|
|
}
|
|
/* Category Result Name */
|
|
.ui.category.search > .results .category > .name {
|
|
width: 100px;
|
|
background: transparent;
|
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
font-size: 1em;
|
|
float: 1em;
|
|
float: left;
|
|
padding: 0.4em 1em;
|
|
font-weight: bold;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*-------------------
|
|
Left / Right
|
|
--------------------*/
|
|
.ui[class*="left aligned"].search > .results {
|
|
right: auto;
|
|
left: 0%;
|
|
}
|
|
.ui[class*="right aligned"].search > .results {
|
|
right: 0%;
|
|
left: auto;
|
|
}
|
|
/*--------------
|
|
Fluid
|
|
---------------*/
|
|
.ui.fluid.search .results {
|
|
width: 100%;
|
|
}
|
|
/*--------------
|
|
Sizes
|
|
---------------*/
|
|
.ui.mini.search {
|
|
font-size: 0.78571429em;
|
|
}
|
|
.ui.small.search {
|
|
font-size: 0.92857143em;
|
|
}
|
|
.ui.search {
|
|
font-size: 1em;
|
|
}
|
|
.ui.large.search {
|
|
font-size: 1.14285714em;
|
|
}
|
|
.ui.big.search {
|
|
font-size: 1.28571429em;
|
|
}
|
|
.ui.huge.search {
|
|
font-size: 1.42857143em;
|
|
}
|
|
.ui.massive.search {
|
|
font-size: 1.71428571em;
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Sidebar
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Sidebar
|
|
*******************************/
|
|
/*-------------------
|
|
Content
|
|
--------------------*/
|
|
/* Animation */
|
|
/* Dimmer */
|
|
/* Color below page */
|
|
/* Shadow */
|
|
/* Layering */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Width */
|
|
/* Height */
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Sidebar
|
|
*******************************/
|
|
/*-------------------
|
|
Content
|
|
--------------------*/
|
|
/* Animation */
|
|
/* Dimmer */
|
|
/* Color below page */
|
|
/* Shadow */
|
|
/* Layering */
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
/* Width */
|
|
/* Height */
|
|
/* Site Theme */
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Sidebar
|
|
*******************************/
|
|
/* Sidebar Menu */
|
|
.ui.sidebar {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
-webkit-transition: none;
|
|
transition: none;
|
|
will-change: transform;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
visibility: hidden;
|
|
-webkit-overflow-scrolling: touch;
|
|
height: 100% !important;
|
|
max-height: 100%;
|
|
border-radius: 0em !important;
|
|
margin: 0em !important;
|
|
overflow-y: auto !important;
|
|
z-index: 102;
|
|
}
|
|
/* GPU Layers for Child Elements */
|
|
.ui.sidebar > * {
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
}
|
|
/*--------------
|
|
Direction
|
|
---------------*/
|
|
.ui.left.sidebar {
|
|
right: auto;
|
|
left: 0px;
|
|
-webkit-transform: translate3d(-100%, 0, 0);
|
|
transform: translate3d(-100%, 0, 0);
|
|
}
|
|
.ui.right.sidebar {
|
|
right: 0px !important;
|
|
left: auto !important;
|
|
-webkit-transform: translate3d(100%, 0%, 0);
|
|
transform: translate3d(100%, 0%, 0);
|
|
}
|
|
.ui.top.sidebar,
|
|
.ui.bottom.sidebar {
|
|
width: 100% !important;
|
|
height: auto !important;
|
|
}
|
|
.ui.top.sidebar {
|
|
top: 0px !important;
|
|
bottom: auto !important;
|
|
-webkit-transform: translate3d(0, -100%, 0);
|
|
transform: translate3d(0, -100%, 0);
|
|
}
|
|
.ui.bottom.sidebar {
|
|
top: auto !important;
|
|
bottom: 0px !important;
|
|
-webkit-transform: translate3d(0, 100%, 0);
|
|
transform: translate3d(0, 100%, 0);
|
|
}
|
|
/*--------------
|
|
Pushable
|
|
---------------*/
|
|
.pushable {
|
|
height: 100%;
|
|
overflow-x: hidden;
|
|
padding: 0em !important;
|
|
}
|
|
/* Whole Page */
|
|
body.pushable {
|
|
background: #545454 !important;
|
|
}
|
|
/* Page Context */
|
|
.pushable:not(body) {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
.pushable:not(body) > .ui.sidebar,
|
|
.pushable:not(body) > .fixed,
|
|
.pushable:not(body) > .pusher:after {
|
|
position: absolute;
|
|
}
|
|
/*--------------
|
|
Fixed
|
|
---------------*/
|
|
.pushable > .fixed {
|
|
position: fixed;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
will-change: transform;
|
|
z-index: 101;
|
|
}
|
|
/*--------------
|
|
Page
|
|
---------------*/
|
|
.pushable > .pusher {
|
|
position: relative;
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
overflow: hidden;
|
|
min-height: 100%;
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
z-index: 2;
|
|
}
|
|
body.pushable > .pusher {
|
|
background: #fff;
|
|
}
|
|
/* Pusher should inherit background from context */
|
|
.pushable > .pusher {
|
|
background: inherit;
|
|
}
|
|
/*--------------
|
|
Dimmer
|
|
---------------*/
|
|
.pushable > .pusher:after {
|
|
position: fixed;
|
|
top: 0px;
|
|
right: 0px;
|
|
content: '';
|
|
background-color: rgba(0, 0, 0, 0.4);
|
|
overflow: hidden;
|
|
opacity: 0;
|
|
-webkit-transition: opacity 500ms;
|
|
transition: opacity 500ms;
|
|
will-change: opacity;
|
|
z-index: 1000;
|
|
}
|
|
/*--------------
|
|
Coupling
|
|
---------------*/
|
|
.ui.sidebar.menu .item {
|
|
border-radius: 0em !important;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*--------------
|
|
Dimmed
|
|
---------------*/
|
|
.pushable > .pusher.dimmed:after {
|
|
width: 100% !important;
|
|
height: 100% !important;
|
|
opacity: 1 !important;
|
|
}
|
|
/*--------------
|
|
Animating
|
|
---------------*/
|
|
.ui.animating.sidebar {
|
|
visibility: visible;
|
|
}
|
|
/*--------------
|
|
Visible
|
|
---------------*/
|
|
.ui.visible.sidebar {
|
|
visibility: visible;
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
/* Shadow Direction */
|
|
.ui.left.visible.sidebar,
|
|
.ui.right.visible.sidebar {
|
|
-webkit-box-shadow: 0px 0px 20px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 0px 20px rgba(34, 36, 38, 0.15);
|
|
}
|
|
.ui.top.visible.sidebar,
|
|
.ui.bottom.visible.sidebar {
|
|
-webkit-box-shadow: 0px 0px 20px rgba(34, 36, 38, 0.15);
|
|
box-shadow: 0px 0px 20px rgba(34, 36, 38, 0.15);
|
|
}
|
|
/* Visible On Load */
|
|
.ui.visible.left.sidebar ~ .fixed,
|
|
.ui.visible.left.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(260px, 0, 0);
|
|
transform: translate3d(260px, 0, 0);
|
|
}
|
|
.ui.visible.right.sidebar ~ .fixed,
|
|
.ui.visible.right.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(-260px, 0, 0);
|
|
transform: translate3d(-260px, 0, 0);
|
|
}
|
|
.ui.visible.top.sidebar ~ .fixed,
|
|
.ui.visible.top.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(0, 36px, 0);
|
|
transform: translate3d(0, 36px, 0);
|
|
}
|
|
.ui.visible.bottom.sidebar ~ .fixed,
|
|
.ui.visible.bottom.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(0, -36px, 0);
|
|
transform: translate3d(0, -36px, 0);
|
|
}
|
|
/* opposite sides visible forces content overlay */
|
|
.ui.visible.left.sidebar ~ .ui.visible.right.sidebar ~ .fixed,
|
|
.ui.visible.left.sidebar ~ .ui.visible.right.sidebar ~ .pusher,
|
|
.ui.visible.right.sidebar ~ .ui.visible.left.sidebar ~ .fixed,
|
|
.ui.visible.right.sidebar ~ .ui.visible.left.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
/*--------------
|
|
iOS
|
|
---------------*/
|
|
/*
|
|
iOS incorrectly sizes document when content
|
|
is presented outside of view with 2Dtranslate
|
|
*/
|
|
html.ios {
|
|
overflow-x: hidden;
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
html.ios,
|
|
html.ios body {
|
|
height: initial !important;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
/*--------------
|
|
Width
|
|
---------------*/
|
|
/* Left / Right */
|
|
.ui.thin.left.sidebar,
|
|
.ui.thin.right.sidebar {
|
|
width: 150px;
|
|
}
|
|
.ui[class*="very thin"].left.sidebar,
|
|
.ui[class*="very thin"].right.sidebar {
|
|
width: 60px;
|
|
}
|
|
.ui.left.sidebar,
|
|
.ui.right.sidebar {
|
|
width: 260px;
|
|
}
|
|
.ui.wide.left.sidebar,
|
|
.ui.wide.right.sidebar {
|
|
width: 350px;
|
|
}
|
|
.ui[class*="very wide"].left.sidebar,
|
|
.ui[class*="very wide"].right.sidebar {
|
|
width: 475px;
|
|
}
|
|
/* Left Visible */
|
|
.ui.visible.thin.left.sidebar ~ .fixed,
|
|
.ui.visible.thin.left.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(150px, 0, 0);
|
|
transform: translate3d(150px, 0, 0);
|
|
}
|
|
.ui.visible[class*="very thin"].left.sidebar ~ .fixed,
|
|
.ui.visible[class*="very thin"].left.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(60px, 0, 0);
|
|
transform: translate3d(60px, 0, 0);
|
|
}
|
|
.ui.visible.wide.left.sidebar ~ .fixed,
|
|
.ui.visible.wide.left.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(350px, 0, 0);
|
|
transform: translate3d(350px, 0, 0);
|
|
}
|
|
.ui.visible[class*="very wide"].left.sidebar ~ .fixed,
|
|
.ui.visible[class*="very wide"].left.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(475px, 0, 0);
|
|
transform: translate3d(475px, 0, 0);
|
|
}
|
|
/* Right Visible */
|
|
.ui.visible.thin.right.sidebar ~ .fixed,
|
|
.ui.visible.thin.right.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(-150px, 0, 0);
|
|
transform: translate3d(-150px, 0, 0);
|
|
}
|
|
.ui.visible[class*="very thin"].right.sidebar ~ .fixed,
|
|
.ui.visible[class*="very thin"].right.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(-60px, 0, 0);
|
|
transform: translate3d(-60px, 0, 0);
|
|
}
|
|
.ui.visible.wide.right.sidebar ~ .fixed,
|
|
.ui.visible.wide.right.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(-350px, 0, 0);
|
|
transform: translate3d(-350px, 0, 0);
|
|
}
|
|
.ui.visible[class*="very wide"].right.sidebar ~ .fixed,
|
|
.ui.visible[class*="very wide"].right.sidebar ~ .pusher {
|
|
-webkit-transform: translate3d(-475px, 0, 0);
|
|
transform: translate3d(-475px, 0, 0);
|
|
}
|
|
/*******************************
|
|
Animations
|
|
*******************************/
|
|
/*--------------
|
|
Overlay
|
|
---------------*/
|
|
/* Set-up */
|
|
.ui.overlay.sidebar {
|
|
z-index: 102;
|
|
}
|
|
/* Initial */
|
|
.ui.left.overlay.sidebar {
|
|
-webkit-transform: translate3d(-100%, 0%, 0);
|
|
transform: translate3d(-100%, 0%, 0);
|
|
}
|
|
.ui.right.overlay.sidebar {
|
|
-webkit-transform: translate3d(100%, 0%, 0);
|
|
transform: translate3d(100%, 0%, 0);
|
|
}
|
|
.ui.top.overlay.sidebar {
|
|
-webkit-transform: translate3d(0%, -100%, 0);
|
|
transform: translate3d(0%, -100%, 0);
|
|
}
|
|
.ui.bottom.overlay.sidebar {
|
|
-webkit-transform: translate3d(0%, 100%, 0);
|
|
transform: translate3d(0%, 100%, 0);
|
|
}
|
|
/* Animation */
|
|
.animating.ui.overlay.sidebar,
|
|
.ui.visible.overlay.sidebar {
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
}
|
|
/* End - Sidebar */
|
|
.ui.visible.left.overlay.sidebar {
|
|
-webkit-transform: translate3d(0%, 0%, 0);
|
|
transform: translate3d(0%, 0%, 0);
|
|
}
|
|
.ui.visible.right.overlay.sidebar {
|
|
-webkit-transform: translate3d(0%, 0%, 0);
|
|
transform: translate3d(0%, 0%, 0);
|
|
}
|
|
.ui.visible.top.overlay.sidebar {
|
|
-webkit-transform: translate3d(0%, 0%, 0);
|
|
transform: translate3d(0%, 0%, 0);
|
|
}
|
|
.ui.visible.bottom.overlay.sidebar {
|
|
-webkit-transform: translate3d(0%, 0%, 0);
|
|
transform: translate3d(0%, 0%, 0);
|
|
}
|
|
/* End - Pusher */
|
|
.ui.visible.overlay.sidebar ~ .fixed,
|
|
.ui.visible.overlay.sidebar ~ .pusher {
|
|
-webkit-transform: none !important;
|
|
transform: none !important;
|
|
}
|
|
/*--------------
|
|
Push
|
|
---------------*/
|
|
/* Initial */
|
|
.ui.push.sidebar {
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
z-index: 102;
|
|
}
|
|
/* Sidebar - Initial */
|
|
.ui.left.push.sidebar {
|
|
-webkit-transform: translate3d(-100%, 0, 0);
|
|
transform: translate3d(-100%, 0, 0);
|
|
}
|
|
.ui.right.push.sidebar {
|
|
-webkit-transform: translate3d(100%, 0, 0);
|
|
transform: translate3d(100%, 0, 0);
|
|
}
|
|
.ui.top.push.sidebar {
|
|
-webkit-transform: translate3d(0%, -100%, 0);
|
|
transform: translate3d(0%, -100%, 0);
|
|
}
|
|
.ui.bottom.push.sidebar {
|
|
-webkit-transform: translate3d(0%, 100%, 0);
|
|
transform: translate3d(0%, 100%, 0);
|
|
}
|
|
/* End */
|
|
.ui.visible.push.sidebar {
|
|
-webkit-transform: translate3d(0%, 0, 0);
|
|
transform: translate3d(0%, 0, 0);
|
|
}
|
|
/*--------------
|
|
Uncover
|
|
---------------*/
|
|
/* Initial */
|
|
.ui.uncover.sidebar {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
z-index: 1;
|
|
}
|
|
/* End */
|
|
.ui.visible.uncover.sidebar {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
}
|
|
/*--------------
|
|
Slide Along
|
|
---------------*/
|
|
/* Initial */
|
|
.ui.slide.along.sidebar {
|
|
z-index: 1;
|
|
}
|
|
/* Sidebar - Initial */
|
|
.ui.left.slide.along.sidebar {
|
|
-webkit-transform: translate3d(-50%, 0, 0);
|
|
transform: translate3d(-50%, 0, 0);
|
|
}
|
|
.ui.right.slide.along.sidebar {
|
|
-webkit-transform: translate3d(50%, 0, 0);
|
|
transform: translate3d(50%, 0, 0);
|
|
}
|
|
.ui.top.slide.along.sidebar {
|
|
-webkit-transform: translate3d(0, -50%, 0);
|
|
transform: translate3d(0, -50%, 0);
|
|
}
|
|
.ui.bottom.slide.along.sidebar {
|
|
-webkit-transform: translate3d(0%, 50%, 0);
|
|
transform: translate3d(0%, 50%, 0);
|
|
}
|
|
/* Animation */
|
|
.ui.animating.slide.along.sidebar {
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
}
|
|
/* End */
|
|
.ui.visible.slide.along.sidebar {
|
|
-webkit-transform: translate3d(0%, 0, 0);
|
|
transform: translate3d(0%, 0, 0);
|
|
}
|
|
/*--------------
|
|
Slide Out
|
|
---------------*/
|
|
/* Initial */
|
|
.ui.slide.out.sidebar {
|
|
z-index: 1;
|
|
}
|
|
/* Sidebar - Initial */
|
|
.ui.left.slide.out.sidebar {
|
|
-webkit-transform: translate3d(50%, 0, 0);
|
|
transform: translate3d(50%, 0, 0);
|
|
}
|
|
.ui.right.slide.out.sidebar {
|
|
-webkit-transform: translate3d(-50%, 0, 0);
|
|
transform: translate3d(-50%, 0, 0);
|
|
}
|
|
.ui.top.slide.out.sidebar {
|
|
-webkit-transform: translate3d(0%, 50%, 0);
|
|
transform: translate3d(0%, 50%, 0);
|
|
}
|
|
.ui.bottom.slide.out.sidebar {
|
|
-webkit-transform: translate3d(0%, -50%, 0);
|
|
transform: translate3d(0%, -50%, 0);
|
|
}
|
|
/* Animation */
|
|
.ui.animating.slide.out.sidebar {
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
}
|
|
/* End */
|
|
.ui.visible.slide.out.sidebar {
|
|
-webkit-transform: translate3d(0%, 0, 0);
|
|
transform: translate3d(0%, 0, 0);
|
|
}
|
|
/*--------------
|
|
Scale Down
|
|
---------------*/
|
|
/* Initial */
|
|
.ui.scale.down.sidebar {
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
z-index: 102;
|
|
}
|
|
/* Sidebar - Initial */
|
|
.ui.left.scale.down.sidebar {
|
|
-webkit-transform: translate3d(-100%, 0, 0);
|
|
transform: translate3d(-100%, 0, 0);
|
|
}
|
|
.ui.right.scale.down.sidebar {
|
|
-webkit-transform: translate3d(100%, 0, 0);
|
|
transform: translate3d(100%, 0, 0);
|
|
}
|
|
.ui.top.scale.down.sidebar {
|
|
-webkit-transform: translate3d(0%, -100%, 0);
|
|
transform: translate3d(0%, -100%, 0);
|
|
}
|
|
.ui.bottom.scale.down.sidebar {
|
|
-webkit-transform: translate3d(0%, 100%, 0);
|
|
transform: translate3d(0%, 100%, 0);
|
|
}
|
|
/* Pusher - Initial */
|
|
.ui.scale.down.left.sidebar ~ .pusher {
|
|
-webkit-transform-origin: 75% 50%;
|
|
transform-origin: 75% 50%;
|
|
}
|
|
.ui.scale.down.right.sidebar ~ .pusher {
|
|
-webkit-transform-origin: 25% 50%;
|
|
transform-origin: 25% 50%;
|
|
}
|
|
.ui.scale.down.top.sidebar ~ .pusher {
|
|
-webkit-transform-origin: 50% 75%;
|
|
transform-origin: 50% 75%;
|
|
}
|
|
.ui.scale.down.bottom.sidebar ~ .pusher {
|
|
-webkit-transform-origin: 50% 25%;
|
|
transform-origin: 50% 25%;
|
|
}
|
|
/* Animation */
|
|
.ui.animating.scale.down > .visible.ui.sidebar {
|
|
-webkit-transition: -webkit-transform 500ms ease;
|
|
transition: -webkit-transform 500ms ease;
|
|
transition: transform 500ms ease;
|
|
transition: transform 500ms ease, -webkit-transform 500ms ease;
|
|
}
|
|
.ui.visible.scale.down.sidebar ~ .pusher,
|
|
.ui.animating.scale.down.sidebar ~ .pusher {
|
|
display: block !important;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden !important;
|
|
}
|
|
/* End */
|
|
.ui.visible.scale.down.sidebar {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
.ui.visible.scale.down.sidebar ~ .pusher {
|
|
-webkit-transform: scale(0.75);
|
|
transform: scale(0.75);
|
|
}
|
|
/*******************************
|
|
Theme Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/*!
|
|
* # Semantic UI - Transition
|
|
* http://github.com/semantic-org/semantic-ui/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/
|
|
/*******************************
|
|
Theme
|
|
*******************************/
|
|
/*
|
|
|
|
████████╗██╗ ██╗███████╗███╗ ███╗███████╗███████╗
|
|
╚══██╔══╝██║ ██║██╔════╝████╗ ████║██╔════╝██╔════╝
|
|
██║ ███████║█████╗ ██╔████╔██║█████╗ ███████╗
|
|
██║ ██╔══██║██╔══╝ ██║╚██╔╝██║██╔══╝ ╚════██║
|
|
██║ ██║ ██║███████╗██║ ╚═╝ ██║███████╗███████║
|
|
╚═╝ ╚═╝ ╚═╝╚══════╝╚═╝ ╚═╝╚══════╝╚══════╝
|
|
|
|
*/
|
|
/*******************************
|
|
Theme Selection
|
|
*******************************/
|
|
/* To override a theme for an individual element
|
|
specify theme name below
|
|
*/
|
|
/* Global */
|
|
/* Elements */
|
|
/* Collections */
|
|
/* Modules */
|
|
/* Views */
|
|
/*******************************
|
|
Folders
|
|
*******************************/
|
|
/* Path to theme packages */
|
|
/* Path to site override folder */
|
|
/*******************************
|
|
Import Theme
|
|
*******************************/
|
|
/*******************************
|
|
Import Directives
|
|
*******************************/
|
|
/*------------------
|
|
Theme
|
|
-------------------*/
|
|
/*--------------------
|
|
Site Variables
|
|
---------------------*/
|
|
/* Default site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Packaged site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/* Component's site.variables */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/* Site theme site.variables */
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Component Variables
|
|
---------------------*/
|
|
/* Default */
|
|
/*******************************
|
|
Transition
|
|
*******************************/
|
|
/* Packaged Theme */
|
|
/*******************************
|
|
Transition
|
|
*******************************/
|
|
/* Site Theme */
|
|
/*******************************
|
|
User Variable Overrides
|
|
*******************************/
|
|
/*******************************
|
|
Mix-ins
|
|
*******************************/
|
|
/*------------------
|
|
Fonts
|
|
-------------------*/
|
|
/*------------------
|
|
Overrides
|
|
-------------------*/
|
|
/*
|
|
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
|
*/
|
|
/* End Config */
|
|
/*******************************
|
|
Transitions
|
|
*******************************/
|
|
.transition {
|
|
-webkit-animation-iteration-count: 1;
|
|
animation-iteration-count: 1;
|
|
-webkit-animation-duration: 300ms;
|
|
animation-duration: 300ms;
|
|
-webkit-animation-timing-function: ease;
|
|
animation-timing-function: ease;
|
|
-webkit-animation-fill-mode: both;
|
|
animation-fill-mode: both;
|
|
}
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/* Animating */
|
|
.animating.transition {
|
|
-webkit-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
visibility: visible !important;
|
|
}
|
|
/* Loading */
|
|
.loading.transition {
|
|
position: absolute;
|
|
top: -99999px;
|
|
left: -99999px;
|
|
}
|
|
/* Hidden */
|
|
.hidden.transition {
|
|
display: none;
|
|
visibility: hidden;
|
|
}
|
|
/* Visible */
|
|
.visible.transition {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
/* backface-visibility: @backfaceVisibility;
|
|
transform: @use3DAcceleration;*/
|
|
}
|
|
/* Disabled */
|
|
.disabled.transition {
|
|
-webkit-animation-play-state: paused;
|
|
animation-play-state: paused;
|
|
}
|
|
/*******************************
|
|
Variations
|
|
*******************************/
|
|
.looping.transition {
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
}
|
|
/*******************************
|
|
Transitions
|
|
*******************************/
|
|
/*
|
|
Some transitions adapted from Animate CSS
|
|
https://github.com/daneden/animate.css
|
|
|
|
Additional transitions adapted from Glide
|
|
by Nick Pettit - https://github.com/nickpettit/glide
|
|
*/
|
|
/*--------------
|
|
Browse
|
|
---------------*/
|
|
.transition.browse {
|
|
-webkit-animation-duration: 500ms;
|
|
animation-duration: 500ms;
|
|
}
|
|
.transition.browse.in {
|
|
-webkit-animation-name: browseIn;
|
|
animation-name: browseIn;
|
|
}
|
|
.transition.browse.out,
|
|
.transition.browse.left.out {
|
|
-webkit-animation-name: browseOutLeft;
|
|
animation-name: browseOutLeft;
|
|
}
|
|
.transition.browse.right.out {
|
|
-webkit-animation-name: browseOutRight;
|
|
animation-name: browseOutRight;
|
|
}
|
|
/* In */
|
|
@-webkit-keyframes browseIn {
|
|
0% {
|
|
-webkit-transform: scale(0.8) translateZ(0px);
|
|
transform: scale(0.8) translateZ(0px);
|
|
z-index: -1;
|
|
}
|
|
10% {
|
|
-webkit-transform: scale(0.8) translateZ(0px);
|
|
transform: scale(0.8) translateZ(0px);
|
|
z-index: -1;
|
|
opacity: 0.7;
|
|
}
|
|
80% {
|
|
-webkit-transform: scale(1.05) translateZ(0px);
|
|
transform: scale(1.05) translateZ(0px);
|
|
opacity: 1;
|
|
z-index: 999;
|
|
}
|
|
100% {
|
|
-webkit-transform: scale(1) translateZ(0px);
|
|
transform: scale(1) translateZ(0px);
|
|
z-index: 999;
|
|
}
|
|
}
|
|
@keyframes browseIn {
|
|
0% {
|
|
-webkit-transform: scale(0.8) translateZ(0px);
|
|
transform: scale(0.8) translateZ(0px);
|
|
z-index: -1;
|
|
}
|
|
10% {
|
|
-webkit-transform: scale(0.8) translateZ(0px);
|
|
transform: scale(0.8) translateZ(0px);
|
|
z-index: -1;
|
|
opacity: 0.7;
|
|
}
|
|
80% {
|
|
-webkit-transform: scale(1.05) translateZ(0px);
|
|
transform: scale(1.05) translateZ(0px);
|
|
opacity: 1;
|
|
z-index: 999;
|
|
}
|
|
100% {
|
|
-webkit-transform: scale(1) translateZ(0px);
|
|
transform: scale(1) translateZ(0px);
|
|
z-index: 999;
|
|
}
|
|
}
|
|
/* Out */
|
|
@-webkit-keyframes browseOutLeft {
|
|
0% {
|
|
z-index: 999;
|
|
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
|
|
transform: translateX(0%) rotateY(0deg) rotateX(0deg);
|
|
}
|
|
50% {
|
|
z-index: -1;
|
|
-webkit-transform: translateX(-105%) rotateY(35deg) rotateX(10deg) translateZ(-10px);
|
|
transform: translateX(-105%) rotateY(35deg) rotateX(10deg) translateZ(-10px);
|
|
}
|
|
80% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
z-index: -1;
|
|
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg) translateZ(-10px);
|
|
transform: translateX(0%) rotateY(0deg) rotateX(0deg) translateZ(-10px);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes browseOutLeft {
|
|
0% {
|
|
z-index: 999;
|
|
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
|
|
transform: translateX(0%) rotateY(0deg) rotateX(0deg);
|
|
}
|
|
50% {
|
|
z-index: -1;
|
|
-webkit-transform: translateX(-105%) rotateY(35deg) rotateX(10deg) translateZ(-10px);
|
|
transform: translateX(-105%) rotateY(35deg) rotateX(10deg) translateZ(-10px);
|
|
}
|
|
80% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
z-index: -1;
|
|
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg) translateZ(-10px);
|
|
transform: translateX(0%) rotateY(0deg) rotateX(0deg) translateZ(-10px);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@-webkit-keyframes browseOutRight {
|
|
0% {
|
|
z-index: 999;
|
|
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
|
|
transform: translateX(0%) rotateY(0deg) rotateX(0deg);
|
|
}
|
|
50% {
|
|
z-index: 1;
|
|
-webkit-transform: translateX(105%) rotateY(35deg) rotateX(10deg) translateZ(-10px);
|
|
transform: translateX(105%) rotateY(35deg) rotateX(10deg) translateZ(-10px);
|
|
}
|
|
80% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
z-index: 1;
|
|
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg) translateZ(-10px);
|
|
transform: translateX(0%) rotateY(0deg) rotateX(0deg) translateZ(-10px);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes browseOutRight {
|
|
0% {
|
|
z-index: 999;
|
|
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
|
|
transform: translateX(0%) rotateY(0deg) rotateX(0deg);
|
|
}
|
|
50% {
|
|
z-index: 1;
|
|
-webkit-transform: translateX(105%) rotateY(35deg) rotateX(10deg) translateZ(-10px);
|
|
transform: translateX(105%) rotateY(35deg) rotateX(10deg) translateZ(-10px);
|
|
}
|
|
80% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
z-index: 1;
|
|
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg) translateZ(-10px);
|
|
transform: translateX(0%) rotateY(0deg) rotateX(0deg) translateZ(-10px);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
/*--------------
|
|
Drop
|
|
---------------*/
|
|
.drop.transition {
|
|
-webkit-transform-origin: top center;
|
|
transform-origin: top center;
|
|
-webkit-animation-duration: 400ms;
|
|
animation-duration: 400ms;
|
|
-webkit-animation-timing-function: cubic-bezier(0.34, 1.61, 0.7, 1);
|
|
animation-timing-function: cubic-bezier(0.34, 1.61, 0.7, 1);
|
|
}
|
|
.drop.transition.in {
|
|
-webkit-animation-name: dropIn;
|
|
animation-name: dropIn;
|
|
}
|
|
.drop.transition.out {
|
|
-webkit-animation-name: dropOut;
|
|
animation-name: dropOut;
|
|
}
|
|
/* Drop */
|
|
@-webkit-keyframes dropIn {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scale(0);
|
|
transform: scale(0);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
@keyframes dropIn {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scale(0);
|
|
transform: scale(0);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
@-webkit-keyframes dropOut {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scale(0);
|
|
transform: scale(0);
|
|
}
|
|
}
|
|
@keyframes dropOut {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scale(0);
|
|
transform: scale(0);
|
|
}
|
|
}
|
|
/*--------------
|
|
Fade
|
|
---------------*/
|
|
.transition.fade.in {
|
|
-webkit-animation-name: fadeIn;
|
|
animation-name: fadeIn;
|
|
}
|
|
.transition[class*="fade up"].in {
|
|
-webkit-animation-name: fadeInUp;
|
|
animation-name: fadeInUp;
|
|
}
|
|
.transition[class*="fade down"].in {
|
|
-webkit-animation-name: fadeInDown;
|
|
animation-name: fadeInDown;
|
|
}
|
|
.transition[class*="fade left"].in {
|
|
-webkit-animation-name: fadeInLeft;
|
|
animation-name: fadeInLeft;
|
|
}
|
|
.transition[class*="fade right"].in {
|
|
-webkit-animation-name: fadeInRight;
|
|
animation-name: fadeInRight;
|
|
}
|
|
.transition.fade.out {
|
|
-webkit-animation-name: fadeOut;
|
|
animation-name: fadeOut;
|
|
}
|
|
.transition[class*="fade up"].out {
|
|
-webkit-animation-name: fadeOutUp;
|
|
animation-name: fadeOutUp;
|
|
}
|
|
.transition[class*="fade down"].out {
|
|
-webkit-animation-name: fadeOutDown;
|
|
animation-name: fadeOutDown;
|
|
}
|
|
.transition[class*="fade left"].out {
|
|
-webkit-animation-name: fadeOutLeft;
|
|
animation-name: fadeOutLeft;
|
|
}
|
|
.transition[class*="fade right"].out {
|
|
-webkit-animation-name: fadeOutRight;
|
|
animation-name: fadeOutRight;
|
|
}
|
|
/* In */
|
|
@-webkit-keyframes fadeIn {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@keyframes fadeIn {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@-webkit-keyframes fadeInUp {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(10%);
|
|
transform: translateY(10%);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
}
|
|
}
|
|
@keyframes fadeInUp {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(10%);
|
|
transform: translateY(10%);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
}
|
|
}
|
|
@-webkit-keyframes fadeInDown {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(-10%);
|
|
transform: translateY(-10%);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
}
|
|
}
|
|
@keyframes fadeInDown {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(-10%);
|
|
transform: translateY(-10%);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
}
|
|
}
|
|
@-webkit-keyframes fadeInLeft {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateX(10%);
|
|
transform: translateX(10%);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateX(0%);
|
|
transform: translateX(0%);
|
|
}
|
|
}
|
|
@keyframes fadeInLeft {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateX(10%);
|
|
transform: translateX(10%);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateX(0%);
|
|
transform: translateX(0%);
|
|
}
|
|
}
|
|
@-webkit-keyframes fadeInRight {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateX(-10%);
|
|
transform: translateX(-10%);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateX(0%);
|
|
transform: translateX(0%);
|
|
}
|
|
}
|
|
@keyframes fadeInRight {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translateX(-10%);
|
|
transform: translateX(-10%);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: translateX(0%);
|
|
transform: translateX(0%);
|
|
}
|
|
}
|
|
/* Out */
|
|
@-webkit-keyframes fadeOut {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes fadeOut {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@-webkit-keyframes fadeOutUp {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(5%);
|
|
transform: translateY(5%);
|
|
}
|
|
}
|
|
@keyframes fadeOutUp {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(5%);
|
|
transform: translateY(5%);
|
|
}
|
|
}
|
|
@-webkit-keyframes fadeOutDown {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(-5%);
|
|
transform: translateY(-5%);
|
|
}
|
|
}
|
|
@keyframes fadeOutDown {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateY(0%);
|
|
transform: translateY(0%);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateY(-5%);
|
|
transform: translateY(-5%);
|
|
}
|
|
}
|
|
@-webkit-keyframes fadeOutLeft {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateX(0%);
|
|
transform: translateX(0%);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateX(5%);
|
|
transform: translateX(5%);
|
|
}
|
|
}
|
|
@keyframes fadeOutLeft {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateX(0%);
|
|
transform: translateX(0%);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateX(5%);
|
|
transform: translateX(5%);
|
|
}
|
|
}
|
|
@-webkit-keyframes fadeOutRight {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateX(0%);
|
|
transform: translateX(0%);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateX(-5%);
|
|
transform: translateX(-5%);
|
|
}
|
|
}
|
|
@keyframes fadeOutRight {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: translateX(0%);
|
|
transform: translateX(0%);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translateX(-5%);
|
|
transform: translateX(-5%);
|
|
}
|
|
}
|
|
/*--------------
|
|
Flips
|
|
---------------*/
|
|
.flip.transition.in,
|
|
.flip.transition.out {
|
|
-webkit-animation-duration: 600ms;
|
|
animation-duration: 600ms;
|
|
}
|
|
.horizontal.flip.transition.in {
|
|
-webkit-animation-name: horizontalFlipIn;
|
|
animation-name: horizontalFlipIn;
|
|
}
|
|
.horizontal.flip.transition.out {
|
|
-webkit-animation-name: horizontalFlipOut;
|
|
animation-name: horizontalFlipOut;
|
|
}
|
|
.vertical.flip.transition.in {
|
|
-webkit-animation-name: verticalFlipIn;
|
|
animation-name: verticalFlipIn;
|
|
}
|
|
.vertical.flip.transition.out {
|
|
-webkit-animation-name: verticalFlipOut;
|
|
animation-name: verticalFlipOut;
|
|
}
|
|
/* In */
|
|
@-webkit-keyframes horizontalFlipIn {
|
|
0% {
|
|
-webkit-transform: perspective(2000px) rotateY(-90deg);
|
|
transform: perspective(2000px) rotateY(-90deg);
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(2000px) rotateY(0deg);
|
|
transform: perspective(2000px) rotateY(0deg);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@keyframes horizontalFlipIn {
|
|
0% {
|
|
-webkit-transform: perspective(2000px) rotateY(-90deg);
|
|
transform: perspective(2000px) rotateY(-90deg);
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(2000px) rotateY(0deg);
|
|
transform: perspective(2000px) rotateY(0deg);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@-webkit-keyframes verticalFlipIn {
|
|
0% {
|
|
-webkit-transform: perspective(2000px) rotateX(-90deg);
|
|
transform: perspective(2000px) rotateX(-90deg);
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(2000px) rotateX(0deg);
|
|
transform: perspective(2000px) rotateX(0deg);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
@keyframes verticalFlipIn {
|
|
0% {
|
|
-webkit-transform: perspective(2000px) rotateX(-90deg);
|
|
transform: perspective(2000px) rotateX(-90deg);
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(2000px) rotateX(0deg);
|
|
transform: perspective(2000px) rotateX(0deg);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
/* Out */
|
|
@-webkit-keyframes horizontalFlipOut {
|
|
0% {
|
|
-webkit-transform: perspective(2000px) rotateY(0deg);
|
|
transform: perspective(2000px) rotateY(0deg);
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(2000px) rotateY(90deg);
|
|
transform: perspective(2000px) rotateY(90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes horizontalFlipOut {
|
|
0% {
|
|
-webkit-transform: perspective(2000px) rotateY(0deg);
|
|
transform: perspective(2000px) rotateY(0deg);
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(2000px) rotateY(90deg);
|
|
transform: perspective(2000px) rotateY(90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@-webkit-keyframes verticalFlipOut {
|
|
0% {
|
|
-webkit-transform: perspective(2000px) rotateX(0deg);
|
|
transform: perspective(2000px) rotateX(0deg);
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(2000px) rotateX(-90deg);
|
|
transform: perspective(2000px) rotateX(-90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes verticalFlipOut {
|
|
0% {
|
|
-webkit-transform: perspective(2000px) rotateX(0deg);
|
|
transform: perspective(2000px) rotateX(0deg);
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(2000px) rotateX(-90deg);
|
|
transform: perspective(2000px) rotateX(-90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
/*--------------
|
|
Scale
|
|
---------------*/
|
|
.scale.transition.in {
|
|
-webkit-animation-name: scaleIn;
|
|
animation-name: scaleIn;
|
|
}
|
|
.scale.transition.out {
|
|
-webkit-animation-name: scaleOut;
|
|
animation-name: scaleOut;
|
|
}
|
|
@-webkit-keyframes scaleIn {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scale(0.8);
|
|
transform: scale(0.8);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
@keyframes scaleIn {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scale(0.8);
|
|
transform: scale(0.8);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
/* Out */
|
|
@-webkit-keyframes scaleOut {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scale(0.9);
|
|
transform: scale(0.9);
|
|
}
|
|
}
|
|
@keyframes scaleOut {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scale(0.9);
|
|
transform: scale(0.9);
|
|
}
|
|
}
|
|
/*--------------
|
|
Fly
|
|
---------------*/
|
|
/* Inward */
|
|
.transition.fly {
|
|
-webkit-animation-duration: 0.6s;
|
|
animation-duration: 0.6s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
}
|
|
.transition.fly.in {
|
|
-webkit-animation-name: flyIn;
|
|
animation-name: flyIn;
|
|
}
|
|
.transition[class*="fly up"].in {
|
|
-webkit-animation-name: flyInUp;
|
|
animation-name: flyInUp;
|
|
}
|
|
.transition[class*="fly down"].in {
|
|
-webkit-animation-name: flyInDown;
|
|
animation-name: flyInDown;
|
|
}
|
|
.transition[class*="fly left"].in {
|
|
-webkit-animation-name: flyInLeft;
|
|
animation-name: flyInLeft;
|
|
}
|
|
.transition[class*="fly right"].in {
|
|
-webkit-animation-name: flyInRight;
|
|
animation-name: flyInRight;
|
|
}
|
|
/* Outward */
|
|
.transition.fly.out {
|
|
-webkit-animation-name: flyOut;
|
|
animation-name: flyOut;
|
|
}
|
|
.transition[class*="fly up"].out {
|
|
-webkit-animation-name: flyOutUp;
|
|
animation-name: flyOutUp;
|
|
}
|
|
.transition[class*="fly down"].out {
|
|
-webkit-animation-name: flyOutDown;
|
|
animation-name: flyOutDown;
|
|
}
|
|
.transition[class*="fly left"].out {
|
|
-webkit-animation-name: flyOutLeft;
|
|
animation-name: flyOutLeft;
|
|
}
|
|
.transition[class*="fly right"].out {
|
|
-webkit-animation-name: flyOutRight;
|
|
animation-name: flyOutRight;
|
|
}
|
|
/* In */
|
|
@-webkit-keyframes flyIn {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scale3d(0.3, 0.3, 0.3);
|
|
transform: scale3d(0.3, 0.3, 0.3);
|
|
}
|
|
20% {
|
|
-webkit-transform: scale3d(1.1, 1.1, 1.1);
|
|
transform: scale3d(1.1, 1.1, 1.1);
|
|
}
|
|
40% {
|
|
-webkit-transform: scale3d(0.9, 0.9, 0.9);
|
|
transform: scale3d(0.9, 0.9, 0.9);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: scale3d(1.03, 1.03, 1.03);
|
|
transform: scale3d(1.03, 1.03, 1.03);
|
|
}
|
|
80% {
|
|
-webkit-transform: scale3d(0.97, 0.97, 0.97);
|
|
transform: scale3d(0.97, 0.97, 0.97);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scale3d(1, 1, 1);
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
}
|
|
@keyframes flyIn {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scale3d(0.3, 0.3, 0.3);
|
|
transform: scale3d(0.3, 0.3, 0.3);
|
|
}
|
|
20% {
|
|
-webkit-transform: scale3d(1.1, 1.1, 1.1);
|
|
transform: scale3d(1.1, 1.1, 1.1);
|
|
}
|
|
40% {
|
|
-webkit-transform: scale3d(0.9, 0.9, 0.9);
|
|
transform: scale3d(0.9, 0.9, 0.9);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: scale3d(1.03, 1.03, 1.03);
|
|
transform: scale3d(1.03, 1.03, 1.03);
|
|
}
|
|
80% {
|
|
-webkit-transform: scale3d(0.97, 0.97, 0.97);
|
|
transform: scale3d(0.97, 0.97, 0.97);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scale3d(1, 1, 1);
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
}
|
|
@-webkit-keyframes flyInUp {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, 1500px, 0);
|
|
transform: translate3d(0, 1500px, 0);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(0, -20px, 0);
|
|
transform: translate3d(0, -20px, 0);
|
|
}
|
|
75% {
|
|
-webkit-transform: translate3d(0, 10px, 0);
|
|
transform: translate3d(0, 10px, 0);
|
|
}
|
|
90% {
|
|
-webkit-transform: translate3d(0, -5px, 0);
|
|
transform: translate3d(0, -5px, 0);
|
|
}
|
|
100% {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
}
|
|
@keyframes flyInUp {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, 1500px, 0);
|
|
transform: translate3d(0, 1500px, 0);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(0, -20px, 0);
|
|
transform: translate3d(0, -20px, 0);
|
|
}
|
|
75% {
|
|
-webkit-transform: translate3d(0, 10px, 0);
|
|
transform: translate3d(0, 10px, 0);
|
|
}
|
|
90% {
|
|
-webkit-transform: translate3d(0, -5px, 0);
|
|
transform: translate3d(0, -5px, 0);
|
|
}
|
|
100% {
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
}
|
|
@-webkit-keyframes flyInDown {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, -1500px, 0);
|
|
transform: translate3d(0, -1500px, 0);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(0, 25px, 0);
|
|
transform: translate3d(0, 25px, 0);
|
|
}
|
|
75% {
|
|
-webkit-transform: translate3d(0, -10px, 0);
|
|
transform: translate3d(0, -10px, 0);
|
|
}
|
|
90% {
|
|
-webkit-transform: translate3d(0, 5px, 0);
|
|
transform: translate3d(0, 5px, 0);
|
|
}
|
|
100% {
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
@keyframes flyInDown {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, -1500px, 0);
|
|
transform: translate3d(0, -1500px, 0);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(0, 25px, 0);
|
|
transform: translate3d(0, 25px, 0);
|
|
}
|
|
75% {
|
|
-webkit-transform: translate3d(0, -10px, 0);
|
|
transform: translate3d(0, -10px, 0);
|
|
}
|
|
90% {
|
|
-webkit-transform: translate3d(0, 5px, 0);
|
|
transform: translate3d(0, 5px, 0);
|
|
}
|
|
100% {
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
@-webkit-keyframes flyInLeft {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(1500px, 0, 0);
|
|
transform: translate3d(1500px, 0, 0);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(-25px, 0, 0);
|
|
transform: translate3d(-25px, 0, 0);
|
|
}
|
|
75% {
|
|
-webkit-transform: translate3d(10px, 0, 0);
|
|
transform: translate3d(10px, 0, 0);
|
|
}
|
|
90% {
|
|
-webkit-transform: translate3d(-5px, 0, 0);
|
|
transform: translate3d(-5px, 0, 0);
|
|
}
|
|
100% {
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
@keyframes flyInLeft {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(1500px, 0, 0);
|
|
transform: translate3d(1500px, 0, 0);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(-25px, 0, 0);
|
|
transform: translate3d(-25px, 0, 0);
|
|
}
|
|
75% {
|
|
-webkit-transform: translate3d(10px, 0, 0);
|
|
transform: translate3d(10px, 0, 0);
|
|
}
|
|
90% {
|
|
-webkit-transform: translate3d(-5px, 0, 0);
|
|
transform: translate3d(-5px, 0, 0);
|
|
}
|
|
100% {
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
@-webkit-keyframes flyInRight {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(-1500px, 0, 0);
|
|
transform: translate3d(-1500px, 0, 0);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(25px, 0, 0);
|
|
transform: translate3d(25px, 0, 0);
|
|
}
|
|
75% {
|
|
-webkit-transform: translate3d(-10px, 0, 0);
|
|
transform: translate3d(-10px, 0, 0);
|
|
}
|
|
90% {
|
|
-webkit-transform: translate3d(5px, 0, 0);
|
|
transform: translate3d(5px, 0, 0);
|
|
}
|
|
100% {
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
@keyframes flyInRight {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(-1500px, 0, 0);
|
|
transform: translate3d(-1500px, 0, 0);
|
|
}
|
|
60% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(25px, 0, 0);
|
|
transform: translate3d(25px, 0, 0);
|
|
}
|
|
75% {
|
|
-webkit-transform: translate3d(-10px, 0, 0);
|
|
transform: translate3d(-10px, 0, 0);
|
|
}
|
|
90% {
|
|
-webkit-transform: translate3d(5px, 0, 0);
|
|
transform: translate3d(5px, 0, 0);
|
|
}
|
|
100% {
|
|
-webkit-transform: none;
|
|
transform: none;
|
|
}
|
|
}
|
|
/* Out */
|
|
@-webkit-keyframes flyOut {
|
|
20% {
|
|
-webkit-transform: scale3d(0.9, 0.9, 0.9);
|
|
transform: scale3d(0.9, 0.9, 0.9);
|
|
}
|
|
50%,
|
|
55% {
|
|
opacity: 1;
|
|
-webkit-transform: scale3d(1.1, 1.1, 1.1);
|
|
transform: scale3d(1.1, 1.1, 1.1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scale3d(0.3, 0.3, 0.3);
|
|
transform: scale3d(0.3, 0.3, 0.3);
|
|
}
|
|
}
|
|
@keyframes flyOut {
|
|
20% {
|
|
-webkit-transform: scale3d(0.9, 0.9, 0.9);
|
|
transform: scale3d(0.9, 0.9, 0.9);
|
|
}
|
|
50%,
|
|
55% {
|
|
opacity: 1;
|
|
-webkit-transform: scale3d(1.1, 1.1, 1.1);
|
|
transform: scale3d(1.1, 1.1, 1.1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scale3d(0.3, 0.3, 0.3);
|
|
transform: scale3d(0.3, 0.3, 0.3);
|
|
}
|
|
}
|
|
@-webkit-keyframes flyOutUp {
|
|
20% {
|
|
-webkit-transform: translate3d(0, 10px, 0);
|
|
transform: translate3d(0, 10px, 0);
|
|
}
|
|
40%,
|
|
45% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(0, -20px, 0);
|
|
transform: translate3d(0, -20px, 0);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, 2000px, 0);
|
|
transform: translate3d(0, 2000px, 0);
|
|
}
|
|
}
|
|
@keyframes flyOutUp {
|
|
20% {
|
|
-webkit-transform: translate3d(0, 10px, 0);
|
|
transform: translate3d(0, 10px, 0);
|
|
}
|
|
40%,
|
|
45% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(0, -20px, 0);
|
|
transform: translate3d(0, -20px, 0);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, 2000px, 0);
|
|
transform: translate3d(0, 2000px, 0);
|
|
}
|
|
}
|
|
@-webkit-keyframes flyOutDown {
|
|
20% {
|
|
-webkit-transform: translate3d(0, -10px, 0);
|
|
transform: translate3d(0, -10px, 0);
|
|
}
|
|
40%,
|
|
45% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(0, 20px, 0);
|
|
transform: translate3d(0, 20px, 0);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, -2000px, 0);
|
|
transform: translate3d(0, -2000px, 0);
|
|
}
|
|
}
|
|
@keyframes flyOutDown {
|
|
20% {
|
|
-webkit-transform: translate3d(0, -10px, 0);
|
|
transform: translate3d(0, -10px, 0);
|
|
}
|
|
40%,
|
|
45% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(0, 20px, 0);
|
|
transform: translate3d(0, 20px, 0);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(0, -2000px, 0);
|
|
transform: translate3d(0, -2000px, 0);
|
|
}
|
|
}
|
|
@-webkit-keyframes flyOutRight {
|
|
20% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(20px, 0, 0);
|
|
transform: translate3d(20px, 0, 0);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(-2000px, 0, 0);
|
|
transform: translate3d(-2000px, 0, 0);
|
|
}
|
|
}
|
|
@keyframes flyOutRight {
|
|
20% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(20px, 0, 0);
|
|
transform: translate3d(20px, 0, 0);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(-2000px, 0, 0);
|
|
transform: translate3d(-2000px, 0, 0);
|
|
}
|
|
}
|
|
@-webkit-keyframes flyOutLeft {
|
|
20% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(-20px, 0, 0);
|
|
transform: translate3d(-20px, 0, 0);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(2000px, 0, 0);
|
|
transform: translate3d(2000px, 0, 0);
|
|
}
|
|
}
|
|
@keyframes flyOutLeft {
|
|
20% {
|
|
opacity: 1;
|
|
-webkit-transform: translate3d(-20px, 0, 0);
|
|
transform: translate3d(-20px, 0, 0);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: translate3d(2000px, 0, 0);
|
|
transform: translate3d(2000px, 0, 0);
|
|
}
|
|
}
|
|
/*--------------
|
|
Slide
|
|
---------------*/
|
|
.transition.slide.in,
|
|
.transition[class*="slide down"].in {
|
|
-webkit-animation-name: slideInY;
|
|
animation-name: slideInY;
|
|
-webkit-transform-origin: top center;
|
|
transform-origin: top center;
|
|
}
|
|
.transition[class*="slide up"].in {
|
|
-webkit-animation-name: slideInY;
|
|
animation-name: slideInY;
|
|
-webkit-transform-origin: bottom center;
|
|
transform-origin: bottom center;
|
|
}
|
|
.transition[class*="slide left"].in {
|
|
-webkit-animation-name: slideInX;
|
|
animation-name: slideInX;
|
|
-webkit-transform-origin: center right;
|
|
transform-origin: center right;
|
|
}
|
|
.transition[class*="slide right"].in {
|
|
-webkit-animation-name: slideInX;
|
|
animation-name: slideInX;
|
|
-webkit-transform-origin: center left;
|
|
transform-origin: center left;
|
|
}
|
|
.transition.slide.out,
|
|
.transition[class*="slide down"].out {
|
|
-webkit-animation-name: slideOutY;
|
|
animation-name: slideOutY;
|
|
-webkit-transform-origin: top center;
|
|
transform-origin: top center;
|
|
}
|
|
.transition[class*="slide up"].out {
|
|
-webkit-animation-name: slideOutY;
|
|
animation-name: slideOutY;
|
|
-webkit-transform-origin: bottom center;
|
|
transform-origin: bottom center;
|
|
}
|
|
.transition[class*="slide left"].out {
|
|
-webkit-animation-name: slideOutX;
|
|
animation-name: slideOutX;
|
|
-webkit-transform-origin: center right;
|
|
transform-origin: center right;
|
|
}
|
|
.transition[class*="slide right"].out {
|
|
-webkit-animation-name: slideOutX;
|
|
animation-name: slideOutX;
|
|
-webkit-transform-origin: center left;
|
|
transform-origin: center left;
|
|
}
|
|
/* In */
|
|
@-webkit-keyframes slideInY {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scaleY(0);
|
|
transform: scaleY(0);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scaleY(1);
|
|
transform: scaleY(1);
|
|
}
|
|
}
|
|
@keyframes slideInY {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scaleY(0);
|
|
transform: scaleY(0);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scaleY(1);
|
|
transform: scaleY(1);
|
|
}
|
|
}
|
|
@-webkit-keyframes slideInX {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scaleX(0);
|
|
transform: scaleX(0);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scaleX(1);
|
|
transform: scaleX(1);
|
|
}
|
|
}
|
|
@keyframes slideInX {
|
|
0% {
|
|
opacity: 0;
|
|
-webkit-transform: scaleX(0);
|
|
transform: scaleX(0);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scaleX(1);
|
|
transform: scaleX(1);
|
|
}
|
|
}
|
|
/* Out */
|
|
@-webkit-keyframes slideOutY {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: scaleY(1);
|
|
transform: scaleY(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scaleY(0);
|
|
transform: scaleY(0);
|
|
}
|
|
}
|
|
@keyframes slideOutY {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: scaleY(1);
|
|
transform: scaleY(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scaleY(0);
|
|
transform: scaleY(0);
|
|
}
|
|
}
|
|
@-webkit-keyframes slideOutX {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: scaleX(1);
|
|
transform: scaleX(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scaleX(0);
|
|
transform: scaleX(0);
|
|
}
|
|
}
|
|
@keyframes slideOutX {
|
|
0% {
|
|
opacity: 1;
|
|
-webkit-transform: scaleX(1);
|
|
transform: scaleX(1);
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
-webkit-transform: scaleX(0);
|
|
transform: scaleX(0);
|
|
}
|
|
}
|
|
/*--------------
|
|
Swing
|
|
---------------*/
|
|
.transition.swing {
|
|
-webkit-animation-duration: 800ms;
|
|
animation-duration: 800ms;
|
|
}
|
|
.transition[class*="swing down"].in {
|
|
-webkit-animation-name: swingInX;
|
|
animation-name: swingInX;
|
|
-webkit-transform-origin: top center;
|
|
transform-origin: top center;
|
|
}
|
|
.transition[class*="swing up"].in {
|
|
-webkit-animation-name: swingInX;
|
|
animation-name: swingInX;
|
|
-webkit-transform-origin: bottom center;
|
|
transform-origin: bottom center;
|
|
}
|
|
.transition[class*="swing left"].in {
|
|
-webkit-animation-name: swingInY;
|
|
animation-name: swingInY;
|
|
-webkit-transform-origin: center right;
|
|
transform-origin: center right;
|
|
}
|
|
.transition[class*="swing right"].in {
|
|
-webkit-animation-name: swingInY;
|
|
animation-name: swingInY;
|
|
-webkit-transform-origin: center left;
|
|
transform-origin: center left;
|
|
}
|
|
.transition.swing.out,
|
|
.transition[class*="swing down"].out {
|
|
-webkit-animation-name: swingOutX;
|
|
animation-name: swingOutX;
|
|
-webkit-transform-origin: top center;
|
|
transform-origin: top center;
|
|
}
|
|
.transition[class*="swing up"].out {
|
|
-webkit-animation-name: swingOutX;
|
|
animation-name: swingOutX;
|
|
-webkit-transform-origin: bottom center;
|
|
transform-origin: bottom center;
|
|
}
|
|
.transition[class*="swing left"].out {
|
|
-webkit-animation-name: swingOutY;
|
|
animation-name: swingOutY;
|
|
-webkit-transform-origin: center right;
|
|
transform-origin: center right;
|
|
}
|
|
.transition[class*="swing right"].out {
|
|
-webkit-animation-name: swingOutY;
|
|
animation-name: swingOutY;
|
|
-webkit-transform-origin: center left;
|
|
transform-origin: center left;
|
|
}
|
|
/* In */
|
|
@-webkit-keyframes swingInX {
|
|
0% {
|
|
-webkit-transform: perspective(1000px) rotateX(90deg);
|
|
transform: perspective(1000px) rotateX(90deg);
|
|
opacity: 0;
|
|
}
|
|
40% {
|
|
-webkit-transform: perspective(1000px) rotateX(-30deg);
|
|
transform: perspective(1000px) rotateX(-30deg);
|
|
opacity: 1;
|
|
}
|
|
60% {
|
|
-webkit-transform: perspective(1000px) rotateX(15deg);
|
|
transform: perspective(1000px) rotateX(15deg);
|
|
}
|
|
80% {
|
|
-webkit-transform: perspective(1000px) rotateX(-7.5deg);
|
|
transform: perspective(1000px) rotateX(-7.5deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(1000px) rotateX(0deg);
|
|
transform: perspective(1000px) rotateX(0deg);
|
|
}
|
|
}
|
|
@keyframes swingInX {
|
|
0% {
|
|
-webkit-transform: perspective(1000px) rotateX(90deg);
|
|
transform: perspective(1000px) rotateX(90deg);
|
|
opacity: 0;
|
|
}
|
|
40% {
|
|
-webkit-transform: perspective(1000px) rotateX(-30deg);
|
|
transform: perspective(1000px) rotateX(-30deg);
|
|
opacity: 1;
|
|
}
|
|
60% {
|
|
-webkit-transform: perspective(1000px) rotateX(15deg);
|
|
transform: perspective(1000px) rotateX(15deg);
|
|
}
|
|
80% {
|
|
-webkit-transform: perspective(1000px) rotateX(-7.5deg);
|
|
transform: perspective(1000px) rotateX(-7.5deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(1000px) rotateX(0deg);
|
|
transform: perspective(1000px) rotateX(0deg);
|
|
}
|
|
}
|
|
@-webkit-keyframes swingInY {
|
|
0% {
|
|
-webkit-transform: perspective(1000px) rotateY(-90deg);
|
|
transform: perspective(1000px) rotateY(-90deg);
|
|
opacity: 0;
|
|
}
|
|
40% {
|
|
-webkit-transform: perspective(1000px) rotateY(30deg);
|
|
transform: perspective(1000px) rotateY(30deg);
|
|
opacity: 1;
|
|
}
|
|
60% {
|
|
-webkit-transform: perspective(1000px) rotateY(-17.5deg);
|
|
transform: perspective(1000px) rotateY(-17.5deg);
|
|
}
|
|
80% {
|
|
-webkit-transform: perspective(1000px) rotateY(7.5deg);
|
|
transform: perspective(1000px) rotateY(7.5deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(1000px) rotateY(0deg);
|
|
transform: perspective(1000px) rotateY(0deg);
|
|
}
|
|
}
|
|
@keyframes swingInY {
|
|
0% {
|
|
-webkit-transform: perspective(1000px) rotateY(-90deg);
|
|
transform: perspective(1000px) rotateY(-90deg);
|
|
opacity: 0;
|
|
}
|
|
40% {
|
|
-webkit-transform: perspective(1000px) rotateY(30deg);
|
|
transform: perspective(1000px) rotateY(30deg);
|
|
opacity: 1;
|
|
}
|
|
60% {
|
|
-webkit-transform: perspective(1000px) rotateY(-17.5deg);
|
|
transform: perspective(1000px) rotateY(-17.5deg);
|
|
}
|
|
80% {
|
|
-webkit-transform: perspective(1000px) rotateY(7.5deg);
|
|
transform: perspective(1000px) rotateY(7.5deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(1000px) rotateY(0deg);
|
|
transform: perspective(1000px) rotateY(0deg);
|
|
}
|
|
}
|
|
/* Out */
|
|
@-webkit-keyframes swingOutX {
|
|
0% {
|
|
-webkit-transform: perspective(1000px) rotateX(0deg);
|
|
transform: perspective(1000px) rotateX(0deg);
|
|
}
|
|
40% {
|
|
-webkit-transform: perspective(1000px) rotateX(-7.5deg);
|
|
transform: perspective(1000px) rotateX(-7.5deg);
|
|
}
|
|
60% {
|
|
-webkit-transform: perspective(1000px) rotateX(17.5deg);
|
|
transform: perspective(1000px) rotateX(17.5deg);
|
|
}
|
|
80% {
|
|
-webkit-transform: perspective(1000px) rotateX(-30deg);
|
|
transform: perspective(1000px) rotateX(-30deg);
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(1000px) rotateX(90deg);
|
|
transform: perspective(1000px) rotateX(90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes swingOutX {
|
|
0% {
|
|
-webkit-transform: perspective(1000px) rotateX(0deg);
|
|
transform: perspective(1000px) rotateX(0deg);
|
|
}
|
|
40% {
|
|
-webkit-transform: perspective(1000px) rotateX(-7.5deg);
|
|
transform: perspective(1000px) rotateX(-7.5deg);
|
|
}
|
|
60% {
|
|
-webkit-transform: perspective(1000px) rotateX(17.5deg);
|
|
transform: perspective(1000px) rotateX(17.5deg);
|
|
}
|
|
80% {
|
|
-webkit-transform: perspective(1000px) rotateX(-30deg);
|
|
transform: perspective(1000px) rotateX(-30deg);
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(1000px) rotateX(90deg);
|
|
transform: perspective(1000px) rotateX(90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@-webkit-keyframes swingOutY {
|
|
0% {
|
|
-webkit-transform: perspective(1000px) rotateY(0deg);
|
|
transform: perspective(1000px) rotateY(0deg);
|
|
}
|
|
40% {
|
|
-webkit-transform: perspective(1000px) rotateY(7.5deg);
|
|
transform: perspective(1000px) rotateY(7.5deg);
|
|
}
|
|
60% {
|
|
-webkit-transform: perspective(1000px) rotateY(-10deg);
|
|
transform: perspective(1000px) rotateY(-10deg);
|
|
}
|
|
80% {
|
|
-webkit-transform: perspective(1000px) rotateY(30deg);
|
|
transform: perspective(1000px) rotateY(30deg);
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(1000px) rotateY(-90deg);
|
|
transform: perspective(1000px) rotateY(-90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes swingOutY {
|
|
0% {
|
|
-webkit-transform: perspective(1000px) rotateY(0deg);
|
|
transform: perspective(1000px) rotateY(0deg);
|
|
}
|
|
40% {
|
|
-webkit-transform: perspective(1000px) rotateY(7.5deg);
|
|
transform: perspective(1000px) rotateY(7.5deg);
|
|
}
|
|
60% {
|
|
-webkit-transform: perspective(1000px) rotateY(-10deg);
|
|
transform: perspective(1000px) rotateY(-10deg);
|
|
}
|
|
80% {
|
|
-webkit-transform: perspective(1000px) rotateY(30deg);
|
|
transform: perspective(1000px) rotateY(30deg);
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
-webkit-transform: perspective(1000px) rotateY(-90deg);
|
|
transform: perspective(1000px) rotateY(-90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
/*******************************
|
|
Static Animations
|
|
*******************************/
|
|
/*--------------
|
|
Emphasis
|
|
---------------*/
|
|
.flash.transition {
|
|
-webkit-animation-duration: 750ms;
|
|
animation-duration: 750ms;
|
|
-webkit-animation-name: flash;
|
|
animation-name: flash;
|
|
}
|
|
.shake.transition {
|
|
-webkit-animation-duration: 750ms;
|
|
animation-duration: 750ms;
|
|
-webkit-animation-name: shake;
|
|
animation-name: shake;
|
|
}
|
|
.bounce.transition {
|
|
-webkit-animation-duration: 750ms;
|
|
animation-duration: 750ms;
|
|
-webkit-animation-name: bounce;
|
|
animation-name: bounce;
|
|
}
|
|
.tada.transition {
|
|
-webkit-animation-duration: 750ms;
|
|
animation-duration: 750ms;
|
|
-webkit-animation-name: tada;
|
|
animation-name: tada;
|
|
}
|
|
.pulse.transition {
|
|
-webkit-animation-duration: 500ms;
|
|
animation-duration: 500ms;
|
|
-webkit-animation-name: pulse;
|
|
animation-name: pulse;
|
|
}
|
|
.jiggle.transition {
|
|
-webkit-animation-duration: 750ms;
|
|
animation-duration: 750ms;
|
|
-webkit-animation-name: jiggle;
|
|
animation-name: jiggle;
|
|
}
|
|
/* Flash */
|
|
@-webkit-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);
|
|
}
|
|
}
|
|
@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);
|
|
}
|
|
}
|
|
/* 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);
|
|
}
|
|
}
|
|
@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);
|
|
}
|
|
}
|
|
/* 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);
|
|
}
|
|
}
|
|
@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);
|
|
}
|
|
}
|
|
/* 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;
|
|
}
|
|
}
|
|
@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;
|
|
}
|
|
}
|
|
/* Rubberband */
|
|
@-webkit-keyframes jiggle {
|
|
0% {
|
|
-webkit-transform: scale3d(1, 1, 1);
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
30% {
|
|
-webkit-transform: scale3d(1.25, 0.75, 1);
|
|
transform: scale3d(1.25, 0.75, 1);
|
|
}
|
|
40% {
|
|
-webkit-transform: scale3d(0.75, 1.25, 1);
|
|
transform: scale3d(0.75, 1.25, 1);
|
|
}
|
|
50% {
|
|
-webkit-transform: scale3d(1.15, 0.85, 1);
|
|
transform: scale3d(1.15, 0.85, 1);
|
|
}
|
|
65% {
|
|
-webkit-transform: scale3d(0.95, 1.05, 1);
|
|
transform: scale3d(0.95, 1.05, 1);
|
|
}
|
|
75% {
|
|
-webkit-transform: scale3d(1.05, 0.95, 1);
|
|
transform: scale3d(1.05, 0.95, 1);
|
|
}
|
|
100% {
|
|
-webkit-transform: scale3d(1, 1, 1);
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
}
|
|
@keyframes jiggle {
|
|
0% {
|
|
-webkit-transform: scale3d(1, 1, 1);
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
30% {
|
|
-webkit-transform: scale3d(1.25, 0.75, 1);
|
|
transform: scale3d(1.25, 0.75, 1);
|
|
}
|
|
40% {
|
|
-webkit-transform: scale3d(0.75, 1.25, 1);
|
|
transform: scale3d(0.75, 1.25, 1);
|
|
}
|
|
50% {
|
|
-webkit-transform: scale3d(1.15, 0.85, 1);
|
|
transform: scale3d(1.15, 0.85, 1);
|
|
}
|
|
65% {
|
|
-webkit-transform: scale3d(0.95, 1.05, 1);
|
|
transform: scale3d(0.95, 1.05, 1);
|
|
}
|
|
75% {
|
|
-webkit-transform: scale3d(1.05, 0.95, 1);
|
|
transform: scale3d(1.05, 0.95, 1);
|
|
}
|
|
100% {
|
|
-webkit-transform: scale3d(1, 1, 1);
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
}
|
|
/*******************************
|
|
Site Overrides
|
|
*******************************/
|
|
/* Import all components */
|
|
/* Import all components */
|
|
/* Reference import */
|
|
/*******************************
|
|
Layout
|
|
*******************************/
|
|
html,
|
|
body {
|
|
min-width: 320px;
|
|
}
|
|
/* Main Layout */
|
|
#filelist,
|
|
#maineditor,
|
|
#sidedocs {
|
|
position: absolute;
|
|
bottom: 0rem;
|
|
}
|
|
#filelist,
|
|
#maineditor,
|
|
#sidedocs,
|
|
#getting-started-btn {
|
|
top: 4.5rem;
|
|
}
|
|
.hideMenuBar #filelist,
|
|
.hideMenuBar #maineditor,
|
|
.hideMenuBar #sidedocs,
|
|
.hideMenuBar #getting-started-btn {
|
|
top: 0 !important;
|
|
}
|
|
.full-abs {
|
|
position: absolute !important;
|
|
left: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
}
|
|
/* Main Editor layout */
|
|
#maineditor {
|
|
left: 27rem;
|
|
right: 0;
|
|
overflow: visible;
|
|
}
|
|
/* Editor tools */
|
|
#editortools {
|
|
position: fixed;
|
|
top: auto;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 12;
|
|
height: 4.7rem;
|
|
background-color: #FDFDFF;
|
|
}
|
|
#blocksArea,
|
|
#monacoEditor,
|
|
#pxtJsonEditor,
|
|
#filelist {
|
|
bottom: 4.7rem;
|
|
}
|
|
.hideEditorToolbar #blocksArea,
|
|
.hideEditorToolbar #monacoEditor,
|
|
.hideEditorToolbar #pxtJsonEditor,
|
|
.hideEditorToolbar #filelist {
|
|
bottom: 0rem !important;
|
|
}
|
|
/* File list / Simulator layout */
|
|
#simulator {
|
|
height: 100%;
|
|
}
|
|
#filelist,
|
|
#downloadArea {
|
|
min-width: 27rem;
|
|
max-width: 27rem;
|
|
left: 0;
|
|
}
|
|
#filelist {
|
|
padding: 1em 2em 1em 2em;
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
width: 100%;
|
|
background-color: #FDFDFF;
|
|
}
|
|
#filelist .simtoolbar {
|
|
-webkit-transition: opacity 0.2s;
|
|
/* Safari */
|
|
-moz-transition: opacity 0.2s;
|
|
/* Mozilla */
|
|
-webkit-transition-timing-function: linear;
|
|
/* Mozilla */
|
|
/* Opera */
|
|
transition: opacity 0.2s;
|
|
transition-timing-function: linear;
|
|
}
|
|
#downloadArea {
|
|
margin-top: 0 !important;
|
|
padding-top: 0.7rem;
|
|
background-color: #FDFDFF;
|
|
}
|
|
.filemenu {
|
|
direction: ltr;
|
|
}
|
|
#filelist .menu {
|
|
width: 100%;
|
|
}
|
|
#filelist .nested.item {
|
|
padding-left: 4rem;
|
|
}
|
|
#filelist .header {
|
|
background: rgba(0, 0, 0, 0.05);
|
|
}
|
|
#simulators {
|
|
text-align: center;
|
|
}
|
|
/* Getting started button */
|
|
#getting-started-btn {
|
|
display: none;
|
|
z-index: 9;
|
|
position: absolute;
|
|
right: 2rem;
|
|
}
|
|
#getting-started-btn:not(.sideDocs) {
|
|
display: block;
|
|
}
|
|
.ui.button.getting-started-btn .ui.text {
|
|
font-weight: 100 !important;
|
|
}
|
|
/* Cookie Message */
|
|
#cookiemsg {
|
|
position: absolute;
|
|
right: 2rem;
|
|
bottom: 12rem;
|
|
width: 18rem;
|
|
text-align: left;
|
|
z-index: 1000;
|
|
}
|
|
#cookiemsg > a {
|
|
color: white;
|
|
text-decoration: underline;
|
|
}
|
|
.collapsedEditorTools #cookiemsg {
|
|
bottom: 6rem;
|
|
}
|
|
/* Simulator */
|
|
div.simframe {
|
|
border: none;
|
|
margin: 0 0 0.5rem 0;
|
|
position: relative;
|
|
background: transparent;
|
|
width: 100%;
|
|
padding-bottom: 81.96%;
|
|
}
|
|
div.simframe > iframe {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.simHeadless {
|
|
height: 0 !important;
|
|
width: 0 !important;
|
|
}
|
|
/* Menu */
|
|
#menubar .ui.menu .item.editor-menuitem {
|
|
margin: calc(0.45rem);
|
|
padding: calc(0.45rem);
|
|
background: rgba(27, 28, 29, 0.3) !important;
|
|
border-radius: 0.5rem !important;
|
|
}
|
|
.ui.menu.fixed .item.editor-menuitem .item {
|
|
border-radius: 0px !important;
|
|
}
|
|
.ui.inverted.menu.fixed .item.editor-menuitem :first-child {
|
|
border-top-left-radius: 0.2rem !important;
|
|
border-bottom-left-radius: 0.2rem !important;
|
|
}
|
|
.ui.inverted.menu.fixed .item.editor-menuitem :first-child[style*="display:none"] + .ui.inverted.menu.fixed .item.editor-menuitem :not([style*="display:none"]) {
|
|
border-top-left-radius: 0.2rem !important;
|
|
border-bottom-left-radius: 0.2rem !important;
|
|
}
|
|
.ui.inverted.menu.fixed .item.editor-menuitem :last-child {
|
|
border-top-right-radius: 0.2rem !important;
|
|
border-bottom-right-radius: 0.2rem !important;
|
|
}
|
|
.ui.inverted.menu .item.editor-menuitem .item {
|
|
-webkit-transition: background .3s;
|
|
/* Safari */
|
|
-moz-transition: background .3s;
|
|
/* Mozilla */
|
|
-webkit-transition-timing-function: ease-in;
|
|
/* Mozilla */
|
|
/* Opera */
|
|
transition: background .3s;
|
|
transition-timing-function: ease-in;
|
|
}
|
|
/* Help card */
|
|
#helpcard {
|
|
position: absolute;
|
|
right: 7rem;
|
|
bottom: 2.2rem;
|
|
margin: 0;
|
|
z-index: 5;
|
|
font-size: 0.8rem;
|
|
}
|
|
/* Project code cards */
|
|
.ui.cardimage {
|
|
background-color: #95a5a6;
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
height: 10rem;
|
|
border-top-left-radius: 0.28571429rem;
|
|
border-top-right-radius: 0.28571429rem;
|
|
}
|
|
/* Logo */
|
|
.ui.menu .ui.item.logo {
|
|
font-size: 2.2rem;
|
|
margin: 0;
|
|
padding: 0rem !important;
|
|
}
|
|
.ui.item.logo .name {
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, inherit;
|
|
color: #666666;
|
|
padding: 0 0.3rem;
|
|
}
|
|
.ui.item.logo svg {
|
|
width: 1.2rem;
|
|
height: 1.2rem;
|
|
}
|
|
.ui.item.logo img {
|
|
max-height: 1.6rem;
|
|
margin-left: 1rem;
|
|
margin-right: 1rem;
|
|
}
|
|
.modal img.ui.logo {
|
|
max-width: 10em;
|
|
max-height: 3em;
|
|
vertical-align: middle;
|
|
}
|
|
/* Sandbox */
|
|
.sandboxfooter {
|
|
position: absolute;
|
|
bottom: 0rem;
|
|
right: 0rem;
|
|
z-index: 100;
|
|
margin-bottom: 0.2rem !important;
|
|
}
|
|
.sandboxfooter .item {
|
|
font-size: 0.8rem !important;
|
|
}
|
|
/* code card */
|
|
.ui.card .image pre {
|
|
margin-left: 0.5rem;
|
|
margin-right: 0.5rem;
|
|
color: #000;
|
|
font-size: 0.7rem;
|
|
white-space: pre-wrap;
|
|
max-height: 10rem;
|
|
overflow-y: hidden;
|
|
}
|
|
/* Popup message */
|
|
#msg {
|
|
position: absolute;
|
|
bottom: 5rem;
|
|
left: 0;
|
|
right: 0;
|
|
text-align: center;
|
|
}
|
|
#msg > div {
|
|
display: inline-block;
|
|
z-index: 100;
|
|
}
|
|
#msg > div:empty {
|
|
display: none;
|
|
}
|
|
/* Scrollbars */
|
|
/* OSX Lion+ hides scrollbars while not in use, this overrides that so it's obvious when a div can be scrolled */
|
|
::-webkit-scrollbar {
|
|
-moz-appearance: none;
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
width: 10px;
|
|
height: 10px;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
border-radius: 4px;
|
|
background-color: #ccc;
|
|
box-shadow: 0 0 1px #ccc;
|
|
-webkit-box-shadow: 0 0 1px #ccc;
|
|
}
|
|
/* Button Colors */
|
|
/* Icon and text */
|
|
.ui.menu > .menu > .ui.item > .icon-and-text.icon {
|
|
margin: 0em auto;
|
|
}
|
|
.ui.menu > .menu > .ui.item > .icon-and-text.icon ~ span.ui.text {
|
|
margin-left: 0.6em;
|
|
}
|
|
/*******************************
|
|
Docs
|
|
*******************************/
|
|
#docs {
|
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
|
}
|
|
#docs > h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
font-family: Roboto, "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
|
}
|
|
#docs span.block {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
/*******************************
|
|
Projects Modal
|
|
*******************************/
|
|
.ui.modal.projectsdialog .ui.dividing.header,
|
|
.ui.modal.projectsdialog .content > .header {
|
|
font-weight: normal !important;
|
|
}
|
|
.ui.modal.projectsdialog .ui.secondary.inverted.pointing.menu {
|
|
border: 0;
|
|
}
|
|
.ui.modal.projectsdialog .group {
|
|
padding: 1rem;
|
|
}
|
|
.ui.modal.projectsdialog > .content {
|
|
padding: 0 !important;
|
|
}
|
|
.ui.modal.projectsdialog .tabsegment {
|
|
min-height: 450px;
|
|
background: white !important;
|
|
}
|
|
/*******************************
|
|
Notification Dialog
|
|
*******************************/
|
|
.notificationDialog.warning .header,
|
|
.notificationDialog.warning .content,
|
|
.notificationDialog.warning .actions {
|
|
background-color: #3454D1;
|
|
color: white;
|
|
}
|
|
.notificationDialog.warning .content a {
|
|
color: white;
|
|
font-weight: 400;
|
|
}
|
|
/*******************************
|
|
Monaco Editor
|
|
*******************************/
|
|
.monaco-editor .monaco-scrollable-element.editor-scrollable {
|
|
margin-left: .5rem;
|
|
}
|
|
/* Monaco Editor Line number colors, changed from the default light theme */
|
|
.monaco-editor.vs .line-numbers {
|
|
color: #2c3e50 !important;
|
|
}
|
|
/* Monaco Editor Line number background, changed from the default light theme */
|
|
.monaco-editor.vs .margin-view-overlays.monaco-editor-background {
|
|
background: rgba(0, 0, 0, 0.05) !important;
|
|
}
|
|
/* Monaco Editor Current line highlighting, only needed for the light theme */
|
|
.monaco-editor.vs .current-line {
|
|
background: rgba(0, 0, 255, 0.1) !important;
|
|
}
|
|
/* Monaco Editor Suggest Widget, styling */
|
|
.monaco-editor .suggest-widget {
|
|
border-radius: 5px;
|
|
}
|
|
.monaco-list-row.focused {
|
|
background-color: #0078D7 !important;
|
|
color: #fff !important;
|
|
}
|
|
.monaco-editor.vs .suggest-widget:not(.frozen) .monaco-list .monaco-list-row .monaco-highlighted-label .highlight {
|
|
color: #0078D7 !important;
|
|
}
|
|
.monaco-editor.vs .suggest-widget:not(.frozen) .monaco-list .monaco-list-row.focused .monaco-highlighted-label .highlight {
|
|
color: #fff !important;
|
|
}
|
|
.monaco-editor.vs .suggest-widget .details > .monaco-scrollable-element > .body > .type,
|
|
.monaco-editor .suggest-widget .monaco-list .monaco-list-row .type-label {
|
|
color: #FFB900 !important;
|
|
}
|
|
/* Monaco Editor Main tokens */
|
|
.monaco-editor .highlight-statement {
|
|
background-color: #FF8B27;
|
|
}
|
|
/* Monaco Toolbox */
|
|
.monacoFlyout {
|
|
font-family: Monaco, Menlo, "Ubuntu Mono", Consolas, source-code-pro, monospace;
|
|
background: rgba(221, 221, 221, 0.8);
|
|
overflow-x: visible;
|
|
overflow-y: auto;
|
|
border-top-right-radius: 8px;
|
|
border-bottom-right-radius: 8px;
|
|
}
|
|
.monacoFlyout > div {
|
|
margin: 1.1rem;
|
|
}
|
|
.monacoDraggableBlock {
|
|
color: #FFFFFF;
|
|
padding: 0.6rem;
|
|
border-radius: 8px;
|
|
border: solid 3px #FFFFFF;
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
-webkit-user-select: none;
|
|
user-select: none;
|
|
}
|
|
.monacoDraggableBlock span.sig {
|
|
opacity: 0.7;
|
|
}
|
|
.monacoDraggableBlock span.docs {
|
|
display: block;
|
|
/* enable as needed */
|
|
color: #FFFFFF;
|
|
font-size: 70%;
|
|
max-width: 22rem;
|
|
}
|
|
.monacoDraggableBlock:hover {
|
|
border: solid 3px #fc3 !important;
|
|
}
|
|
/******************************
|
|
Avatar
|
|
******************************/
|
|
.avatar {
|
|
position: relative;
|
|
}
|
|
#docs .avatar .message {
|
|
margin-left: 4em;
|
|
margin-bottom: 1em;
|
|
}
|
|
#docs code.lang-typescript {
|
|
overflow-wrap: break-word;
|
|
}
|
|
@media only screen {
|
|
.avatar .avatar-image {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 1em;
|
|
width: 3em;
|
|
height: 3em;
|
|
background-size: contain;
|
|
background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3Csvg%0A%20%20%20xmlns%3Adc%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Felements%2F1.1%2F%22%0A%20%20%20xmlns%3Acc%3D%22http%3A%2F%2Fcreativecommons.org%2Fns%23%22%0A%20%20%20xmlns%3Ardf%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2F02%2F22-rdf-syntax-ns%23%22%0A%20%20%20xmlns%3Asvg%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3Asodipodi%3D%22http%3A%2F%2Fsodipodi.sourceforge.net%2FDTD%2Fsodipodi-0.dtd%22%0A%20%20%20xmlns%3Ainkscape%3D%22http%3A%2F%2Fwww.inkscape.org%2Fnamespaces%2Finkscape%22%0A%20%20%20role%3D%22img%22%0A%20%20%20aria-labelledby%3D%22title%20%20desc%22%0A%20%20%20xml%3Aspace%3D%22preserve%22%0A%20%20%20enable-background%3D%22new%200%200%20280%2032.755%22%0A%20%20%20height%3D%2252.672001%22%0A%20%20%20width%3D%2252.672001%22%0A%20%20%20version%3D%221.1%22%0A%20%20%20id%3D%22svg2%22%0A%20%20%20inkscape%3Aversion%3D%220.91%20r13725%22%0A%20%20%20sodipodi%3Adocname%3D%22logo.square.black.svg%22%3E%3Csodipodi%3Anamedview%0A%20%20%20%20%20pagecolor%3D%22%23ff00ff%22%0A%20%20%20%20%20bordercolor%3D%22%23666666%22%0A%20%20%20%20%20borderopacity%3D%221%22%0A%20%20%20%20%20objecttolerance%3D%2210%22%0A%20%20%20%20%20gridtolerance%3D%2210%22%0A%20%20%20%20%20guidetolerance%3D%2210%22%0A%20%20%20%20%20inkscape%3Apageopacity%3D%220%22%0A%20%20%20%20%20inkscape%3Apageshadow%3D%222%22%0A%20%20%20%20%20inkscape%3Awindow-width%3D%221536%22%0A%20%20%20%20%20inkscape%3Awindow-height%3D%22801%22%0A%20%20%20%20%20id%3D%22namedview14%22%0A%20%20%20%20%20showgrid%3D%22false%22%0A%20%20%20%20%20inkscape%3Azoom%3D%222.0836233%22%0A%20%20%20%20%20inkscape%3Acx%3D%2283.390493%22%0A%20%20%20%20%20inkscape%3Acy%3D%2216.071144%22%0A%20%20%20%20%20inkscape%3Awindow-x%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-y%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-maximized%3D%221%22%0A%20%20%20%20%20inkscape%3Acurrent-layer%3D%22svg2%22%20%2F%3E%3Crect%0A%20%20%20%20%20id%3D%22backgroundrect%22%0A%20%20%20%20%20width%3D%22195.47368%22%0A%20%20%20%20%20height%3D%2234.210526%22%0A%20%20%20%20%20x%3D%220%22%0A%20%20%20%20%20y%3D%2218.461473%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bstroke%3Anone%22%20%2F%3E%3Ctitle%0A%20%20%20%20%20id%3D%22title%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%3C%2Ftitle%3E%3Cdesc%0A%20%20%20%20%20id%3D%22desc%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%20logo%3C%2Fdesc%3E%3Cmetadata%0A%20%20%20%20%20id%3D%22metadata37%22%3E%3Crdf%3Ardf%3E%3Ccc%3Awork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%20%2F%3E%3C%2Fcc%3Awork%3E%3C%2Frdf%3Ardf%3E%3Crdf%3ARDF%3E%3Ccc%3AWork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%3EBBC%20micro%3Abit%3C%2Fdc%3Atitle%3E%3C%2Fcc%3AWork%3E%3C%2Frdf%3ARDF%3E%3C%2Fmetadata%3E%3Cdefs%0A%20%20%20%20%20id%3D%22defs35%22%20%2F%3E%3Cpath%0A%20%20%20%20%20inkscape%3Aconnector-curvature%3D%220%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20d%3D%22m%2037.363%2C29.377%20c%20-1.677%2C0%20-3.035%2C-1.364%20-3.035%2C-3.042%200%2C-1.678%201.357%2C-3.038%203.035%2C-3.038%201.684%2C0%203.039%2C1.36%203.039%2C3.038%200%2C1.678%20-1.355%2C3.042%20-3.039%2C3.042%20M%2015.052%2C23.3%20c%20-1.677%2C0%20-3.042%2C1.357%20-3.042%2C3.035%200%2C1.678%201.363%2C3.042%203.042%2C3.042%201.674%2C0%203.036%2C-1.364%203.036%2C-3.042%200%2C-1.678%20-1.363%2C-3.035%20-3.036%2C-3.035%20m%20-0.003%2C-5.99%2022.576%2C0%20c%204.979%2C0%209.027%2C4.047%209.027%2C9.027%200%2C4.979%20-4.049%2C9.031%20-9.027%2C9.031%20l%20-22.576%2C0%20c%20-4.977%2C0%20-9.0299993%2C-4.053%20-9.0299993%2C-9.031%20C%206.0180007%2C21.357%2010.072%2C17.31%2015.049%2C17.31%20m%2022.576%2C24.076%20c%208.299%2C0%2015.047%2C-6.75%2015.047%2C-15.049%200%2C-8.299%20-6.748%2C-15.051%20-15.047%2C-15.051%20l%20-22.576%2C0%20C%206.7500007%2C11.286%206.9250488e-7%2C18.038%206.9250488e-7%2C26.337%206.9250488e-7%2C34.636%206.7500007%2C41.386%2015.049%2C41.386%20l%2022.576%2C0%22%0A%20%20%20%20%20id%3D%22path21%22%0A%20%20%20%20%20style%3D%22fill%3A%23000000%22%0A%20%20%20%20%20sodipodi%3Anodetypes%3D%22csssccsssccsssscccsssssc%22%20%2F%3E%3C%2Fsvg%3E");
|
|
}
|
|
}
|
|
@media only print {
|
|
.avatar .avatar-image {
|
|
display: list-item;
|
|
list-style-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3Csvg%0A%20%20%20xmlns%3Adc%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Felements%2F1.1%2F%22%0A%20%20%20xmlns%3Acc%3D%22http%3A%2F%2Fcreativecommons.org%2Fns%23%22%0A%20%20%20xmlns%3Ardf%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2F02%2F22-rdf-syntax-ns%23%22%0A%20%20%20xmlns%3Asvg%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3Asodipodi%3D%22http%3A%2F%2Fsodipodi.sourceforge.net%2FDTD%2Fsodipodi-0.dtd%22%0A%20%20%20xmlns%3Ainkscape%3D%22http%3A%2F%2Fwww.inkscape.org%2Fnamespaces%2Finkscape%22%0A%20%20%20role%3D%22img%22%0A%20%20%20aria-labelledby%3D%22title%20%20desc%22%0A%20%20%20xml%3Aspace%3D%22preserve%22%0A%20%20%20enable-background%3D%22new%200%200%20280%2032.755%22%0A%20%20%20height%3D%2252.672001%22%0A%20%20%20width%3D%2252.672001%22%0A%20%20%20version%3D%221.1%22%0A%20%20%20id%3D%22svg2%22%0A%20%20%20inkscape%3Aversion%3D%220.91%20r13725%22%0A%20%20%20sodipodi%3Adocname%3D%22logo.square.black.svg%22%3E%3Csodipodi%3Anamedview%0A%20%20%20%20%20pagecolor%3D%22%23ff00ff%22%0A%20%20%20%20%20bordercolor%3D%22%23666666%22%0A%20%20%20%20%20borderopacity%3D%221%22%0A%20%20%20%20%20objecttolerance%3D%2210%22%0A%20%20%20%20%20gridtolerance%3D%2210%22%0A%20%20%20%20%20guidetolerance%3D%2210%22%0A%20%20%20%20%20inkscape%3Apageopacity%3D%220%22%0A%20%20%20%20%20inkscape%3Apageshadow%3D%222%22%0A%20%20%20%20%20inkscape%3Awindow-width%3D%221536%22%0A%20%20%20%20%20inkscape%3Awindow-height%3D%22801%22%0A%20%20%20%20%20id%3D%22namedview14%22%0A%20%20%20%20%20showgrid%3D%22false%22%0A%20%20%20%20%20inkscape%3Azoom%3D%222.0836233%22%0A%20%20%20%20%20inkscape%3Acx%3D%2283.390493%22%0A%20%20%20%20%20inkscape%3Acy%3D%2216.071144%22%0A%20%20%20%20%20inkscape%3Awindow-x%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-y%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-maximized%3D%221%22%0A%20%20%20%20%20inkscape%3Acurrent-layer%3D%22svg2%22%20%2F%3E%3Crect%0A%20%20%20%20%20id%3D%22backgroundrect%22%0A%20%20%20%20%20width%3D%22195.47368%22%0A%20%20%20%20%20height%3D%2234.210526%22%0A%20%20%20%20%20x%3D%220%22%0A%20%20%20%20%20y%3D%2218.461473%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bstroke%3Anone%22%20%2F%3E%3Ctitle%0A%20%20%20%20%20id%3D%22title%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%3C%2Ftitle%3E%3Cdesc%0A%20%20%20%20%20id%3D%22desc%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%20logo%3C%2Fdesc%3E%3Cmetadata%0A%20%20%20%20%20id%3D%22metadata37%22%3E%3Crdf%3Ardf%3E%3Ccc%3Awork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%20%2F%3E%3C%2Fcc%3Awork%3E%3C%2Frdf%3Ardf%3E%3Crdf%3ARDF%3E%3Ccc%3AWork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%3EBBC%20micro%3Abit%3C%2Fdc%3Atitle%3E%3C%2Fcc%3AWork%3E%3C%2Frdf%3ARDF%3E%3C%2Fmetadata%3E%3Cdefs%0A%20%20%20%20%20id%3D%22defs35%22%20%2F%3E%3Cpath%0A%20%20%20%20%20inkscape%3Aconnector-curvature%3D%220%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20d%3D%22m%2037.363%2C29.377%20c%20-1.677%2C0%20-3.035%2C-1.364%20-3.035%2C-3.042%200%2C-1.678%201.357%2C-3.038%203.035%2C-3.038%201.684%2C0%203.039%2C1.36%203.039%2C3.038%200%2C1.678%20-1.355%2C3.042%20-3.039%2C3.042%20M%2015.052%2C23.3%20c%20-1.677%2C0%20-3.042%2C1.357%20-3.042%2C3.035%200%2C1.678%201.363%2C3.042%203.042%2C3.042%201.674%2C0%203.036%2C-1.364%203.036%2C-3.042%200%2C-1.678%20-1.363%2C-3.035%20-3.036%2C-3.035%20m%20-0.003%2C-5.99%2022.576%2C0%20c%204.979%2C0%209.027%2C4.047%209.027%2C9.027%200%2C4.979%20-4.049%2C9.031%20-9.027%2C9.031%20l%20-22.576%2C0%20c%20-4.977%2C0%20-9.0299993%2C-4.053%20-9.0299993%2C-9.031%20C%206.0180007%2C21.357%2010.072%2C17.31%2015.049%2C17.31%20m%2022.576%2C24.076%20c%208.299%2C0%2015.047%2C-6.75%2015.047%2C-15.049%200%2C-8.299%20-6.748%2C-15.051%20-15.047%2C-15.051%20l%20-22.576%2C0%20C%206.7500007%2C11.286%206.9250488e-7%2C18.038%206.9250488e-7%2C26.337%206.9250488e-7%2C34.636%206.7500007%2C41.386%2015.049%2C41.386%20l%2022.576%2C0%22%0A%20%20%20%20%20id%3D%22path21%22%0A%20%20%20%20%20style%3D%22fill%3A%23000000%22%0A%20%20%20%20%20sodipodi%3Anodetypes%3D%22csssccsssccsssscccsssssc%22%20%2F%3E%3C%2Fsvg%3E");
|
|
list-style-position: inside;
|
|
}
|
|
}
|
|
.avatar .message:after {
|
|
top: 1.1em;
|
|
left: -1em;
|
|
bottom: auto;
|
|
border-width: 0px 1em 0.7em 0;
|
|
border-color: rgba(0, 0, 0, 0) #EEE;
|
|
content: '';
|
|
position: absolute;
|
|
border-style: solid;
|
|
display: block;
|
|
width: 0;
|
|
}
|
|
/*******************************
|
|
Layout Variables
|
|
*******************************/
|
|
.ui.widedesktop.only {
|
|
display: none !important;
|
|
}
|
|
.ui.tablet.only {
|
|
display: none !important;
|
|
}
|
|
.ui.mobile.only {
|
|
display: none !important;
|
|
}
|
|
@media only screen and (min-width: 1200px) and (min-height: 30em) {
|
|
.ui.widedesktop.only {
|
|
display: inherit !important;
|
|
}
|
|
.ui.widedesktop.hide {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* smaller desktop screen */
|
|
@media only screen and (max-width: 991px), only screen and (max-aspect-ratio: 12/10) {
|
|
.ui.desktop.only {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* thin desktop portrait mode */
|
|
@media only screen and (max-width: 991px), only screen and (max-aspect-ratio: 7/10) {
|
|
.ui.landscape.only {
|
|
display: none !important;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 992px) {
|
|
.ui.portrait.only {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* Tablet only */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
.ui.tablet.only {
|
|
display: inherit !important;
|
|
}
|
|
}
|
|
/* Mobile + Tablet */
|
|
@media only screen and (max-width: 991px) {
|
|
.ui.portrait.only {
|
|
display: inherit !important;
|
|
}
|
|
.ui.portrait.hide {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* Mobile only */
|
|
@media only screen and (max-width: 767px) {
|
|
.ui.mobile.only {
|
|
display: inherit !important;
|
|
}
|
|
.ui.mobile.hide {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/* Scren heights */
|
|
@media only screen and (max-height: 44rem) {
|
|
.ui.tall.only {
|
|
display: none !important;
|
|
}
|
|
}
|
|
@media only screen and (min-height: 24rem) {
|
|
.ui.thin.only {
|
|
display: none !important;
|
|
}
|
|
}
|
|
/*******************************
|
|
Media Adjustments
|
|
*******************************/
|
|
/* Large Monitor */
|
|
/* Small Monitor */
|
|
/* Tablet */
|
|
/* Mobile */
|
|
/* >= Small Monitor (Small Monitor + Large Monitor + Wide Monitor) */
|
|
@media only screen and (min-width: 992px) {
|
|
.collapsedEditorTools #filelist {
|
|
display: none;
|
|
}
|
|
.collapsedEditorTools #downloadArea {
|
|
background: #FDFDFF;
|
|
}
|
|
.collapsedEditorTools #maineditor {
|
|
left: 0;
|
|
}
|
|
#cookiemsg {
|
|
bottom: 7.5rem;
|
|
}
|
|
/* Full screen */
|
|
.fullscreensim #filelist {
|
|
position: fixed;
|
|
z-index: 100;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
padding: 0;
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
height: 100%;
|
|
}
|
|
.fullscreensim #boardview {
|
|
position: relative;
|
|
height: 100%;
|
|
background-color: white;
|
|
padding: 4.5rem;
|
|
padding-left: calc(9rem);
|
|
padding-right: calc(9rem);
|
|
background-color: #3454D1;
|
|
background: #3454D1;
|
|
/* For browsers that do not support gradients */
|
|
/* For Safari 5.1 to 6.0 */
|
|
/* For Opera 11.1 to 12.0 */
|
|
/* For Firefox 3.6 to 15 */
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #3454D1), to(#FDFDFF));
|
|
background: linear-gradient(#3454D1 50%, #FDFDFF);
|
|
/* Standard syntax */
|
|
}
|
|
.fullscreensim #simulator .ui.item:not(.simtoolbar),
|
|
.fullscreensim #simulator .ui.menu,
|
|
.fullscreensim #menubar .ui.item:not(.logo),
|
|
.fullscreensim #maineditor,
|
|
.fullscreensim #editortools {
|
|
display: none !important;
|
|
z-index: -10;
|
|
}
|
|
.fullscreensim .sandboxfooter {
|
|
z-index: 100;
|
|
bottom: 1rem;
|
|
}
|
|
.fullscreensim .ui.menu {
|
|
background: transparent !important;
|
|
}
|
|
.fullscreensim #filelist .simtoolbar {
|
|
position: fixed;
|
|
bottom: 2rem;
|
|
left: auto;
|
|
right: auto;
|
|
}
|
|
.fullscreensim #simulators {
|
|
position: relative;
|
|
padding: 3rem;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.fullscreensim div.simframe {
|
|
position: relative;
|
|
width: 50%;
|
|
height: 100%;
|
|
float: left;
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.fullscreensim div.simframe > iframe {
|
|
position: relative;
|
|
max-width: 90%;
|
|
}
|
|
.fullscreensim div.simframe:only-child {
|
|
width: 100%;
|
|
}
|
|
.fullscreensim div.simframe:only-child > iframe {
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
/* <= Small Monitor (Mobile + Tablet + Small Monitor) */
|
|
@media only screen and (max-width: 1199px) {
|
|
/* Layout */
|
|
#filelist,
|
|
#downloadArea {
|
|
min-width: 20rem;
|
|
max-width: 20rem;
|
|
}
|
|
#maineditor {
|
|
left: 20rem;
|
|
}
|
|
/* Logo */
|
|
#logo .name {
|
|
display: none !important;
|
|
}
|
|
/* Help card */
|
|
#helpcard {
|
|
top: auto;
|
|
bottom: 2.2rem;
|
|
margin: 0;
|
|
}
|
|
}
|
|
/* <= Tablet (Mobile + Tablet) */
|
|
@media only screen and (max-width: 991px) {
|
|
/* Logo */
|
|
#logo,
|
|
#organization {
|
|
font-size: 0rem;
|
|
padding-right: 0;
|
|
}
|
|
/* Help card */
|
|
#helpcard {
|
|
top: auto;
|
|
bottom: 2rem;
|
|
margin: 0;
|
|
}
|
|
/* Layout */
|
|
#filelist {
|
|
position: absolute;
|
|
padding: 0;
|
|
margin: 1em;
|
|
z-index: 15;
|
|
bottom: 0rem !important;
|
|
left: 4rem !important;
|
|
top: auto;
|
|
width: auto;
|
|
min-width: inherit;
|
|
max-width: inherit;
|
|
background: transparent !important;
|
|
}
|
|
#maineditor {
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
#maineditor:not(.sandbox) {
|
|
bottom: 0rem;
|
|
}
|
|
#editortools {
|
|
height: 10rem;
|
|
}
|
|
#blocksArea,
|
|
#monacoEditor,
|
|
#pxtJsonEditor,
|
|
#msg {
|
|
bottom: 10rem;
|
|
}
|
|
#tutorialcard.bottom {
|
|
bottom: 11rem;
|
|
}
|
|
.hideEditorFloats #editortools {
|
|
height: 4.7rem;
|
|
}
|
|
.hideEditorFloats #blocksArea,
|
|
.hideEditorFloats #monacoEditor,
|
|
.hideEditorFloats #msg {
|
|
bottom: 4.7rem;
|
|
}
|
|
.hideEditorFloats #tutorialcard.bottom {
|
|
bottom: 4.7rem;
|
|
}
|
|
/* Simulator */
|
|
div.simframe {
|
|
display: inline-block;
|
|
width: 10rem;
|
|
margin-right: 0.5rem;
|
|
}
|
|
div.simframe:not(:first-child) {
|
|
display: none !important;
|
|
}
|
|
/* Hide floating editors */
|
|
.hideEditorFloats .editorFloat {
|
|
display: none;
|
|
}
|
|
#downloadArea {
|
|
display: none;
|
|
}
|
|
/* Menu spacing */
|
|
#root:not(.sandbox) #menubar .ui.menu .item {
|
|
padding: 0.3em !important;
|
|
}
|
|
#root #menubar .ui.menu .item.editor-menuitem .item {
|
|
padding: 0.7em !important;
|
|
}
|
|
#root #menubar .ui.menu.fixed .ui.item.editor-menuitem .item {
|
|
width: 40px;
|
|
height: 38px;
|
|
}
|
|
.active.item.javascript-menuitem ~ .toggle {
|
|
margin-left: 40px !important;
|
|
}
|
|
/* Top Menu */
|
|
#maineditor {
|
|
top: 3.5rem;
|
|
}
|
|
.hideMenuBar #maineditor {
|
|
top: 0;
|
|
}
|
|
.sandbox #maineditor {
|
|
top: 3rem;
|
|
}
|
|
/* Logo */
|
|
.ui.item.logo img {
|
|
max-height: 2.5rem;
|
|
margin-left: 0.4rem;
|
|
margin-right: 0.4rem;
|
|
}
|
|
.ui.mini.image {
|
|
display: block !important;
|
|
}
|
|
/* Blocks / JS toggle */
|
|
#menubar .ui.menu .item.editor-menuitem {
|
|
margin: calc(0.29166667rem);
|
|
padding: calc(0.29166667rem);
|
|
}
|
|
.sandbox #menubar .ui.menu .item.editor-menuitem {
|
|
margin: calc(0.2rem);
|
|
padding: calc(0.2rem);
|
|
}
|
|
}
|
|
/* Mobile */
|
|
@media only screen and (max-width: 767px) {
|
|
.hideEditorFloats #editortools {
|
|
height: 4.7rem;
|
|
}
|
|
.hideEditorFloats #blocksArea,
|
|
.hideEditorFloats #monacoEditor {
|
|
bottom: 4.7rem;
|
|
}
|
|
}
|
|
/* Mobile, Tablet AND thin screen */
|
|
@media only screen and (max-width: 991px) and (max-height: 24rem) {
|
|
/* Mobile embedded view */
|
|
.sandbox #simulators {
|
|
display: none;
|
|
}
|
|
.sandbox #maineditor {
|
|
overflow: hidden;
|
|
}
|
|
.sandbox #blocksArea,
|
|
.sandbox #monacoEditor,
|
|
.sandbox #pxtJsonEditor,
|
|
.sandbox #editortools,
|
|
.sandbox #msg {
|
|
bottom: 1.5rem !important;
|
|
}
|
|
.sandbox #cookiemsg {
|
|
bottom: 3rem;
|
|
}
|
|
.sandbox #editortools {
|
|
display: none;
|
|
}
|
|
.simView #simulators {
|
|
display: inherit;
|
|
}
|
|
.simView #filelist {
|
|
position: fixed;
|
|
z-index: 100;
|
|
top: 0 !important;
|
|
left: 0 !important;
|
|
bottom: 0 !important;
|
|
right: 0 !important;
|
|
padding: 0;
|
|
margin: 0;
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
height: 100%;
|
|
}
|
|
.simView #boardview {
|
|
position: relative;
|
|
height: 100%;
|
|
background-color: white;
|
|
padding-top: 3rem;
|
|
padding-left: 2em;
|
|
padding-right: 2em;
|
|
padding-bottom: 2em;
|
|
background-color: #3454D1;
|
|
background: #3454D1;
|
|
/* For browsers that do not support gradients */
|
|
/* For Safari 5.1 to 6.0 */
|
|
/* For Opera 11.1 to 12.0 */
|
|
/* For Firefox 3.6 to 15 */
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #3454D1), to(#FDFDFF));
|
|
background: linear-gradient(#3454D1 50%, #FDFDFF);
|
|
/* Standard syntax */
|
|
}
|
|
.simView #simulator .ui.item,
|
|
.simView #maineditor {
|
|
display: none !important;
|
|
z-index: -10;
|
|
}
|
|
.sandboxfooter {
|
|
left: 0.5em !important;
|
|
right: 0.5em !important;
|
|
margin: 0rem !important;
|
|
right: auto;
|
|
text-align: center;
|
|
}
|
|
.sandboxfooter .item {
|
|
font-size: 0.7rem !important;
|
|
}
|
|
.simView .sandboxfooter {
|
|
z-index: 100;
|
|
}
|
|
.simView .ui.menu {
|
|
background: transparent !important;
|
|
}
|
|
.simView #simulators {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.simView div.simframe {
|
|
position: relative;
|
|
width: 50%;
|
|
height: 100%;
|
|
float: left;
|
|
padding-bottom: 0 !important;
|
|
}
|
|
.simView div.simframe > iframe {
|
|
position: relative;
|
|
max-width: 90%;
|
|
}
|
|
.simView div.simframe:only-child {
|
|
width: 100%;
|
|
}
|
|
.simView div.simframe:only-child > iframe {
|
|
max-width: 100%;
|
|
}
|
|
.sandbox #cookiemsg {
|
|
left: 0;
|
|
right: 0;
|
|
margin-left: 0.2rem;
|
|
margin-right: 0.2rem;
|
|
width: inherit;
|
|
bottom: 1.5rem;
|
|
padding: 0.3rem;
|
|
}
|
|
}
|
|
/* Import all components */
|
|
/* Reference import */
|
|
/*******************************
|
|
Layout
|
|
*******************************/
|
|
.tutorial #maineditor .full-abs {
|
|
top: 5.5rem;
|
|
}
|
|
/* Tutorial Mode */
|
|
#menubar .ui.menu .item.tutorial-menuitem {
|
|
background: rgba(27, 28, 29, 0.3) !important;
|
|
margin: calc(0.45rem);
|
|
padding: calc(0.45rem);
|
|
border-radius: 0.5rem !important;
|
|
}
|
|
#menubar .ui.menu .item.tutorial-menuitem > .step-label {
|
|
margin-left: 0.4em;
|
|
margin-right: 0.4em;
|
|
}
|
|
#menubar .ui.menu .item.tutorial-menuitem > .label {
|
|
background: white;
|
|
margin-left: 0em;
|
|
}
|
|
.tutorial-menuitem > .selected {
|
|
background-color: #3454D1 !important;
|
|
padding: 1.0rem !important;
|
|
padding-left: 1.3rem !important;
|
|
padding-right: 1.3rem !important;
|
|
}
|
|
#tutorialcard {
|
|
position: relative;
|
|
z-index: 0;
|
|
height: 6rem;
|
|
width: 100%;
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
#root.dimmable.dimmed #tutorialcard.tutorialReady {
|
|
z-index: 1001;
|
|
}
|
|
#tutorialhint {
|
|
height: 100%;
|
|
}
|
|
#tutorialcontent {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
body#docs.tutorial {
|
|
overflow-y: hidden;
|
|
}
|
|
#docs.tutorial .ui.segment {
|
|
padding: 0;
|
|
margin: 0;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
border: none;
|
|
}
|
|
#docs.tutorial #content {
|
|
margin-bottom: 0.5rem !important;
|
|
}
|
|
/******************************
|
|
Tutorial Avatar
|
|
******************************/
|
|
#tutorialcard .ui.message {
|
|
width: 100%;
|
|
position: relative;
|
|
padding: 0;
|
|
border: 0;
|
|
border-radius: 5px 0px 0px 5px;
|
|
}
|
|
#tutorialcard .ui.message .avatar-image {
|
|
position: absolute;
|
|
top: 0.7rem;
|
|
left: 0.7rem;
|
|
width: 3rem;
|
|
height: 3rem;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3Csvg%0A%20%20%20xmlns%3Adc%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Felements%2F1.1%2F%22%0A%20%20%20xmlns%3Acc%3D%22http%3A%2F%2Fcreativecommons.org%2Fns%23%22%0A%20%20%20xmlns%3Ardf%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2F02%2F22-rdf-syntax-ns%23%22%0A%20%20%20xmlns%3Asvg%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3Asodipodi%3D%22http%3A%2F%2Fsodipodi.sourceforge.net%2FDTD%2Fsodipodi-0.dtd%22%0A%20%20%20xmlns%3Ainkscape%3D%22http%3A%2F%2Fwww.inkscape.org%2Fnamespaces%2Finkscape%22%0A%20%20%20role%3D%22img%22%0A%20%20%20aria-labelledby%3D%22title%20%20desc%22%0A%20%20%20xml%3Aspace%3D%22preserve%22%0A%20%20%20enable-background%3D%22new%200%200%20280%2032.755%22%0A%20%20%20height%3D%2252.672001%22%0A%20%20%20width%3D%2252.672001%22%0A%20%20%20version%3D%221.1%22%0A%20%20%20id%3D%22svg2%22%0A%20%20%20inkscape%3Aversion%3D%220.91%20r13725%22%0A%20%20%20sodipodi%3Adocname%3D%22logo.square.black.svg%22%3E%3Csodipodi%3Anamedview%0A%20%20%20%20%20pagecolor%3D%22%23ff00ff%22%0A%20%20%20%20%20bordercolor%3D%22%23666666%22%0A%20%20%20%20%20borderopacity%3D%221%22%0A%20%20%20%20%20objecttolerance%3D%2210%22%0A%20%20%20%20%20gridtolerance%3D%2210%22%0A%20%20%20%20%20guidetolerance%3D%2210%22%0A%20%20%20%20%20inkscape%3Apageopacity%3D%220%22%0A%20%20%20%20%20inkscape%3Apageshadow%3D%222%22%0A%20%20%20%20%20inkscape%3Awindow-width%3D%221536%22%0A%20%20%20%20%20inkscape%3Awindow-height%3D%22801%22%0A%20%20%20%20%20id%3D%22namedview14%22%0A%20%20%20%20%20showgrid%3D%22false%22%0A%20%20%20%20%20inkscape%3Azoom%3D%222.0836233%22%0A%20%20%20%20%20inkscape%3Acx%3D%2283.390493%22%0A%20%20%20%20%20inkscape%3Acy%3D%2216.071144%22%0A%20%20%20%20%20inkscape%3Awindow-x%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-y%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-maximized%3D%221%22%0A%20%20%20%20%20inkscape%3Acurrent-layer%3D%22svg2%22%20%2F%3E%3Crect%0A%20%20%20%20%20id%3D%22backgroundrect%22%0A%20%20%20%20%20width%3D%22195.47368%22%0A%20%20%20%20%20height%3D%2234.210526%22%0A%20%20%20%20%20x%3D%220%22%0A%20%20%20%20%20y%3D%2218.461473%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bstroke%3Anone%22%20%2F%3E%3Ctitle%0A%20%20%20%20%20id%3D%22title%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%3C%2Ftitle%3E%3Cdesc%0A%20%20%20%20%20id%3D%22desc%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%20logo%3C%2Fdesc%3E%3Cmetadata%0A%20%20%20%20%20id%3D%22metadata37%22%3E%3Crdf%3Ardf%3E%3Ccc%3Awork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%20%2F%3E%3C%2Fcc%3Awork%3E%3C%2Frdf%3Ardf%3E%3Crdf%3ARDF%3E%3Ccc%3AWork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%3EBBC%20micro%3Abit%3C%2Fdc%3Atitle%3E%3C%2Fcc%3AWork%3E%3C%2Frdf%3ARDF%3E%3C%2Fmetadata%3E%3Cdefs%0A%20%20%20%20%20id%3D%22defs35%22%20%2F%3E%3Cpath%0A%20%20%20%20%20inkscape%3Aconnector-curvature%3D%220%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20d%3D%22m%2037.363%2C29.377%20c%20-1.677%2C0%20-3.035%2C-1.364%20-3.035%2C-3.042%200%2C-1.678%201.357%2C-3.038%203.035%2C-3.038%201.684%2C0%203.039%2C1.36%203.039%2C3.038%200%2C1.678%20-1.355%2C3.042%20-3.039%2C3.042%20M%2015.052%2C23.3%20c%20-1.677%2C0%20-3.042%2C1.357%20-3.042%2C3.035%200%2C1.678%201.363%2C3.042%203.042%2C3.042%201.674%2C0%203.036%2C-1.364%203.036%2C-3.042%200%2C-1.678%20-1.363%2C-3.035%20-3.036%2C-3.035%20m%20-0.003%2C-5.99%2022.576%2C0%20c%204.979%2C0%209.027%2C4.047%209.027%2C9.027%200%2C4.979%20-4.049%2C9.031%20-9.027%2C9.031%20l%20-22.576%2C0%20c%20-4.977%2C0%20-9.0299993%2C-4.053%20-9.0299993%2C-9.031%20C%206.0180007%2C21.357%2010.072%2C17.31%2015.049%2C17.31%20m%2022.576%2C24.076%20c%208.299%2C0%2015.047%2C-6.75%2015.047%2C-15.049%200%2C-8.299%20-6.748%2C-15.051%20-15.047%2C-15.051%20l%20-22.576%2C0%20C%206.7500007%2C11.286%206.9250488e-7%2C18.038%206.9250488e-7%2C26.337%206.9250488e-7%2C34.636%206.7500007%2C41.386%2015.049%2C41.386%20l%2022.576%2C0%22%0A%20%20%20%20%20id%3D%22path21%22%0A%20%20%20%20%20style%3D%22fill%3A%23000000%22%0A%20%20%20%20%20sodipodi%3Anodetypes%3D%22csssccsssccsssscccsssssc%22%20%2F%3E%3C%2Fsvg%3E");
|
|
cursor: pointer;
|
|
}
|
|
#tutorialcard {
|
|
padding: 0.5rem;
|
|
}
|
|
#tutorialcard .ui.buttons {
|
|
width: 100%;
|
|
height: 4.5rem;
|
|
}
|
|
#tutorialcard .ui.message {
|
|
width: 100%;
|
|
}
|
|
#tutorialcard .tutorialmessage .content {
|
|
width: 100%;
|
|
font-size: 16px;
|
|
height: 3.5rem;
|
|
margin-bottom: 1rem;
|
|
overflow: auto;
|
|
cursor: pointer;
|
|
}
|
|
#tutorialcard .tutorialmessage .content p {
|
|
line-height: 25px !important;
|
|
}
|
|
#tutorialcard .tutorialmessage {
|
|
width: 100%;
|
|
padding: 0.5rem;
|
|
padding-left: 7rem;
|
|
height: 4.5rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
#root.dimmable.dimmed #tutorialcard .tutorialmessage {
|
|
border: solid white 2px;
|
|
}
|
|
/* Show / Hide in dimmer */
|
|
.ui.showlightbox {
|
|
display: none;
|
|
}
|
|
#root.dimmable.dimmed #tutorialcard.tutorialReady .ui.showlightbox {
|
|
display: block;
|
|
}
|
|
#root.dimmable.dimmed #tutorialcard.tutorialReady .ui.hidelightbox {
|
|
display: none;
|
|
}
|
|
#root.dimmable.dimmed #tutorialcard.tutorialReady .ui.prevbutton,
|
|
#root.dimmable.dimmed #tutorialcard.tutorialReady .ui.nextbutton {
|
|
opacity: 0 !important;
|
|
}
|
|
#tutorialcard .ui.button.okbutton {
|
|
border-radius: 0.28571429rem;
|
|
}
|
|
i.icon.avatar-image {
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3Csvg%0A%20%20%20xmlns%3Adc%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Felements%2F1.1%2F%22%0A%20%20%20xmlns%3Acc%3D%22http%3A%2F%2Fcreativecommons.org%2Fns%23%22%0A%20%20%20xmlns%3Ardf%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2F02%2F22-rdf-syntax-ns%23%22%0A%20%20%20xmlns%3Asvg%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20xmlns%3Asodipodi%3D%22http%3A%2F%2Fsodipodi.sourceforge.net%2FDTD%2Fsodipodi-0.dtd%22%0A%20%20%20xmlns%3Ainkscape%3D%22http%3A%2F%2Fwww.inkscape.org%2Fnamespaces%2Finkscape%22%0A%20%20%20role%3D%22img%22%0A%20%20%20aria-labelledby%3D%22title%20%20desc%22%0A%20%20%20xml%3Aspace%3D%22preserve%22%0A%20%20%20enable-background%3D%22new%200%200%20280%2032.755%22%0A%20%20%20height%3D%2252.672001%22%0A%20%20%20width%3D%2252.672001%22%0A%20%20%20version%3D%221.1%22%0A%20%20%20id%3D%22svg2%22%0A%20%20%20inkscape%3Aversion%3D%220.91%20r13725%22%0A%20%20%20sodipodi%3Adocname%3D%22logo.square.black.svg%22%3E%3Csodipodi%3Anamedview%0A%20%20%20%20%20pagecolor%3D%22%23ff00ff%22%0A%20%20%20%20%20bordercolor%3D%22%23666666%22%0A%20%20%20%20%20borderopacity%3D%221%22%0A%20%20%20%20%20objecttolerance%3D%2210%22%0A%20%20%20%20%20gridtolerance%3D%2210%22%0A%20%20%20%20%20guidetolerance%3D%2210%22%0A%20%20%20%20%20inkscape%3Apageopacity%3D%220%22%0A%20%20%20%20%20inkscape%3Apageshadow%3D%222%22%0A%20%20%20%20%20inkscape%3Awindow-width%3D%221536%22%0A%20%20%20%20%20inkscape%3Awindow-height%3D%22801%22%0A%20%20%20%20%20id%3D%22namedview14%22%0A%20%20%20%20%20showgrid%3D%22false%22%0A%20%20%20%20%20inkscape%3Azoom%3D%222.0836233%22%0A%20%20%20%20%20inkscape%3Acx%3D%2283.390493%22%0A%20%20%20%20%20inkscape%3Acy%3D%2216.071144%22%0A%20%20%20%20%20inkscape%3Awindow-x%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-y%3D%22-8%22%0A%20%20%20%20%20inkscape%3Awindow-maximized%3D%221%22%0A%20%20%20%20%20inkscape%3Acurrent-layer%3D%22svg2%22%20%2F%3E%3Crect%0A%20%20%20%20%20id%3D%22backgroundrect%22%0A%20%20%20%20%20width%3D%22195.47368%22%0A%20%20%20%20%20height%3D%2234.210526%22%0A%20%20%20%20%20x%3D%220%22%0A%20%20%20%20%20y%3D%2218.461473%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20style%3D%22fill%3Anone%3Bstroke%3Anone%22%20%2F%3E%3Ctitle%0A%20%20%20%20%20id%3D%22title%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%3C%2Ftitle%3E%3Cdesc%0A%20%20%20%20%20id%3D%22desc%22%0A%20%20%20%20%20lang%3D%22en-GB%22%3EBBC%20micro%3Abit%20logo%3C%2Fdesc%3E%3Cmetadata%0A%20%20%20%20%20id%3D%22metadata37%22%3E%3Crdf%3Ardf%3E%3Ccc%3Awork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%20%2F%3E%3C%2Fcc%3Awork%3E%3C%2Frdf%3Ardf%3E%3Crdf%3ARDF%3E%3Ccc%3AWork%0A%20%20%20%20%20%20%20%20%20rdf%3Aabout%3D%22%22%3E%3Cdc%3Aformat%3Eimage%2Fsvg%2Bxml%3C%2Fdc%3Aformat%3E%3Cdc%3Atype%0A%20%20%20%20%20%20%20%20%20%20%20rdf%3Aresource%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Fdcmitype%2FStillImage%22%20%2F%3E%3Cdc%3Atitle%3EBBC%20micro%3Abit%3C%2Fdc%3Atitle%3E%3C%2Fcc%3AWork%3E%3C%2Frdf%3ARDF%3E%3C%2Fmetadata%3E%3Cdefs%0A%20%20%20%20%20id%3D%22defs35%22%20%2F%3E%3Cpath%0A%20%20%20%20%20inkscape%3Aconnector-curvature%3D%220%22%0A%20%20%20%20%20class%3D%22%22%0A%20%20%20%20%20d%3D%22m%2037.363%2C29.377%20c%20-1.677%2C0%20-3.035%2C-1.364%20-3.035%2C-3.042%200%2C-1.678%201.357%2C-3.038%203.035%2C-3.038%201.684%2C0%203.039%2C1.36%203.039%2C3.038%200%2C1.678%20-1.355%2C3.042%20-3.039%2C3.042%20M%2015.052%2C23.3%20c%20-1.677%2C0%20-3.042%2C1.357%20-3.042%2C3.035%200%2C1.678%201.363%2C3.042%203.042%2C3.042%201.674%2C0%203.036%2C-1.364%203.036%2C-3.042%200%2C-1.678%20-1.363%2C-3.035%20-3.036%2C-3.035%20m%20-0.003%2C-5.99%2022.576%2C0%20c%204.979%2C0%209.027%2C4.047%209.027%2C9.027%200%2C4.979%20-4.049%2C9.031%20-9.027%2C9.031%20l%20-22.576%2C0%20c%20-4.977%2C0%20-9.0299993%2C-4.053%20-9.0299993%2C-9.031%20C%206.0180007%2C21.357%2010.072%2C17.31%2015.049%2C17.31%20m%2022.576%2C24.076%20c%208.299%2C0%2015.047%2C-6.75%2015.047%2C-15.049%200%2C-8.299%20-6.748%2C-15.051%20-15.047%2C-15.051%20l%20-22.576%2C0%20C%206.7500007%2C11.286%206.9250488e-7%2C18.038%206.9250488e-7%2C26.337%206.9250488e-7%2C34.636%206.7500007%2C41.386%2015.049%2C41.386%20l%2022.576%2C0%22%0A%20%20%20%20%20id%3D%22path21%22%0A%20%20%20%20%20style%3D%22fill%3A%23000000%22%0A%20%20%20%20%20sodipodi%3Anodetypes%3D%22csssccsssccsssscccsssssc%22%20%2F%3E%3C%2Fsvg%3E");
|
|
}
|
|
/******************************
|
|
Hint button
|
|
******************************/
|
|
#tutorialcard .ui.button.hintbutton {
|
|
position: absolute;
|
|
bottom: 2rem;
|
|
left: 4rem;
|
|
font-size: 0.8rem;
|
|
border-radius: 0.28571429rem;
|
|
padding: 0.4rem;
|
|
background-color: #6633cc;
|
|
color: white;
|
|
}
|
|
#tutorialcard .ui.button.hintbutton:after {
|
|
content: ' ';
|
|
position: absolute;
|
|
width: 0;
|
|
height: 0;
|
|
left: -10px;
|
|
right: auto;
|
|
top: 0px;
|
|
bottom: auto;
|
|
border: 10px solid;
|
|
border-color: #6633cc transparent transparent transparent;
|
|
}
|
|
/******************************
|
|
Inline Blocks and Buttons
|
|
******************************/
|
|
span.docs.inlinebutton {
|
|
padding: 0.4rem;
|
|
border-radius: 0.2rem;
|
|
white-space: nowrap;
|
|
background-color: #6633cc;
|
|
border: 1px solid #a385e0;
|
|
color: #FFFFFF;
|
|
}
|
|
span.docs.inlineblock {
|
|
padding: 0.15rem 0.3rem;
|
|
border-radius: 0.3rem;
|
|
white-space: nowrap;
|
|
background-color: #ffa65a;
|
|
border: 1px solid #ff8b27;
|
|
color: #FFFFFF;
|
|
}
|
|
code,
|
|
kbd,
|
|
pre,
|
|
samp {
|
|
font-weight: bold;
|
|
}
|
|
code.lang-filterblocks {
|
|
display: none;
|
|
}
|
|
/*******************************
|
|
Tutorial Hint
|
|
*******************************/
|
|
.ui.modal.hintdialog .content p {
|
|
font-size: 16px;
|
|
line-height: 25px;
|
|
}
|
|
/*******************************
|
|
Media Adjustments
|
|
*******************************/
|
|
/* Large Monitor */
|
|
/* Small Monitor */
|
|
/* Tablet */
|
|
/* Mobile */
|
|
@media only screen and (max-width: 767px) {
|
|
#tutorialcard .ui.message .avatar-image {
|
|
display: none;
|
|
}
|
|
#tutorialcard .ui.button.hintbutton {
|
|
display: none;
|
|
}
|
|
#tutorialcard .ui.button.prevbutton {
|
|
display: none;
|
|
}
|
|
#tutorialcard .tutorialmessage {
|
|
padding-left: 0.5rem;
|
|
}
|
|
}
|
|
/* >= Small Monitor (Small Monitor + Large Monitor + Wide Monitor) */
|
|
/* <= Small Monitor (Mobile + Tablet + Small Monitor) */
|
|
/* <= Tablet (Mobile + Tablet) */
|
|
/* Mobile */
|
|
/* Import all components */
|
|
/* Reference import */
|
|
/* Side Docs layout */
|
|
#sidedocs {
|
|
height: 100%;
|
|
top: 0;
|
|
z-index: 10;
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
right: 0;
|
|
width: 0;
|
|
}
|
|
#sidedocsbar {
|
|
position: absolute;
|
|
right: 1rem;
|
|
}
|
|
#sidedocsframe {
|
|
width: 0;
|
|
height: 0;
|
|
border: none;
|
|
overflow-y: hidden;
|
|
background: white;
|
|
}
|
|
/* Side docs toggle button */
|
|
#sidedocstoggle {
|
|
position: absolute;
|
|
border-top-left-radius: 100px;
|
|
border-bottom-left-radius: 100px;
|
|
right: 0;
|
|
top: 40%;
|
|
bottom: 40%;
|
|
height: 20%;
|
|
z-index: 10;
|
|
padding: 0;
|
|
margin: 0;
|
|
background: grey;
|
|
-webkit-box-shadow: none !important;
|
|
box-shadow: none !important;
|
|
-webkit-transition: none;
|
|
transition: none;
|
|
}
|
|
.sideDocs #sidedocsframe {
|
|
width: 22rem;
|
|
height: 100%;
|
|
overflow-y: auto;
|
|
-webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.41);
|
|
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.41);
|
|
}
|
|
.sideDocs #sidedocstoggle {
|
|
right: 22rem;
|
|
-webkit-transition: right 0.5s, opacity 0.5s linear;
|
|
transition: right 0.5s, opacity 0.5s linear;
|
|
}
|
|
/* Show chevron icon on hover when collapsed */
|
|
#sidedocstoggle > i.icon.hover {
|
|
display: none;
|
|
}
|
|
#root:not(.sideDocs) #sidedocstoggle.ui.button:hover > i.icon {
|
|
display: none !important;
|
|
}
|
|
#root:not(.sideDocs) #sidedocstoggle.ui.button:hover > i.icon.hover {
|
|
display: inherit !important;
|
|
}
|
|
.sideDocs #sidedocsbar {
|
|
top: calc(6rem);
|
|
}
|
|
.sideDocs #sidedocs {
|
|
visibility: visible;
|
|
opacity: 1;
|
|
width: 22rem;
|
|
padding-top: calc(5.5rem);
|
|
padding-bottom: calc(5.7rem);
|
|
}
|
|
#sidedocsbar .ui.link .icon {
|
|
cursor: pointer;
|
|
}
|
|
/* Large Monitor */
|
|
/* Small Monitor */
|
|
/* Tablet */
|
|
/* Mobile */
|
|
/* >= Small Monitor (Small Monitor + Large Monitor + Wide Monitor) */
|
|
/* <= Small Monitor (Mobile + Tablet + Small Monitor) */
|
|
/* <= Tablet (Mobile + Tablet) */
|
|
@media only screen and (max-width: 991px) {
|
|
.sideDocs #sidedocs {
|
|
padding-top: calc(4.5rem);
|
|
padding-bottom: calc(11rem);
|
|
}
|
|
.collapsedEditorTools #sidedocs {
|
|
padding-bottom: calc(5.7rem);
|
|
}
|
|
.sideDocs #sidedocsbar {
|
|
top: calc(5rem);
|
|
}
|
|
}
|
|
/* Mobile */
|
|
@media only screen and (max-width: 767px) {
|
|
.sideDocs #sidedocs,
|
|
#sidedocsframe {
|
|
width: 18rem;
|
|
}
|
|
.sideDocs #sidedocstoggle {
|
|
right: 18rem;
|
|
}
|
|
}
|
|
/* Import all components */
|
|
/* Reference import */
|
|
.blocklyWidgetDiv .blocklyPianoDiv {
|
|
position: relative;
|
|
}
|
|
.blocklyWidgetDiv .blocklyNote {
|
|
border: solid 0.5px;
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
position: absolute;
|
|
top: 0px;
|
|
border-bottom-left-radius: 3px;
|
|
border-bottom-right-radius: 3px;
|
|
}
|
|
.blocklyWidgetDiv .blocklyNote:hover {
|
|
background-color: yellow !important;
|
|
}
|
|
.blocklyWidgetDiv .blocklyNoteLabel {
|
|
border: solid 0.5px;
|
|
color: white;
|
|
display: inline-block;
|
|
line-height: normal;
|
|
position: absolute;
|
|
text-align: center;
|
|
}
|
|
.blocklyWidgetDiv .blocklyNotePrevNext {
|
|
border: solid 0.5px;
|
|
cursor: pointer;
|
|
color: white;
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
line-height: normal;
|
|
position: absolute;
|
|
text-align: center;
|
|
}
|
|
.blocklyWidgetDiv .blocklyGridPickerMenu {
|
|
display: table;
|
|
outline: none;
|
|
}
|
|
.blocklyGridPickerScroller {
|
|
outline: none;
|
|
padding: 4px;
|
|
border-radius: 10px;
|
|
}
|
|
.blocklyGridPickerPadder {
|
|
border-radius: 10px;
|
|
outline: none;
|
|
}
|
|
.blocklyWidgetDiv .blocklyGridPickerRow {
|
|
display: table-row;
|
|
}
|
|
.blocklyWidgetDiv .blocklyGridPickerMenu .goog-menuitem {
|
|
background: white;
|
|
}
|
|
.blocklyWidgetDiv .blocklyGridPickerMenu .goog-menuitem-highlight,
|
|
.blocklyWidgetDiv .blocklyGridPickerMenu .goog-menuitem-hover {
|
|
background: #d6e9f8;
|
|
}
|
|
.blocklyWidgetDiv .blocklyGridPickerMenu .goog-option {
|
|
border: solid 4px black;
|
|
border-radius: 10px;
|
|
display: table-cell;
|
|
padding: 4px;
|
|
text-align: center;
|
|
vertical-align: top;
|
|
}
|
|
.blocklyWidgetDiv .blocklyGridPickerMenu .goog-option.goog-option-selected {
|
|
outline: solid 3px #fc3;
|
|
}
|
|
.blocklyWidgetDiv .blocklyGridPickerMenu .goog-menuitem .goog-menuitem-checkbox {
|
|
display: none;
|
|
}
|
|
.blocklyGridPickerTooltip {
|
|
z-index: 100000;
|
|
/* big value for bootstrap3 compatibility */
|
|
}
|
|
/* Reference import */
|
|
/*******************************
|
|
Site Settings
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Base Sizes
|
|
--------------------*/
|
|
/* This is the single variable that controls them all */
|
|
/* The size of page text */
|
|
/*-------------------
|
|
Border Radius
|
|
--------------------*/
|
|
/* See Power-user section below
|
|
for explanation of @px variables
|
|
*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*--------------
|
|
Page Heading
|
|
---------------*/
|
|
/*--------------
|
|
Form Input
|
|
---------------*/
|
|
/* This adjusts the default form input across all elements */
|
|
/* Input Text Color */
|
|
/* Line Height Default For Inputs in Browser */
|
|
/*-------------------
|
|
Focused Input
|
|
--------------------*/
|
|
/* Used on inputs, textarea etc */
|
|
/* Used on dropdowns, other larger blocks */
|
|
/*-------------------
|
|
Sizes
|
|
--------------------*/
|
|
/*
|
|
Sizes are all expressed in terms of 14px/em (default em)
|
|
This ensures these "ratios" remain constant despite changes in EM
|
|
*/
|
|
/*-------------------
|
|
Page
|
|
--------------------*/
|
|
/*-------------------
|
|
Paragraph
|
|
--------------------*/
|
|
/*-------------------
|
|
Links
|
|
--------------------*/
|
|
/*-------------------
|
|
Highlighted Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Loader
|
|
--------------------*/
|
|
/*-------------------
|
|
Grid
|
|
--------------------*/
|
|
/*-------------------
|
|
Transitions
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*-------------------
|
|
Site Colors
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Light Colors ---*/
|
|
/*--- Neutrals ---*/
|
|
/*--- Colored Backgrounds ---*/
|
|
/*--- Colored Headers ---*/
|
|
/*--- Colored Text ---*/
|
|
/*--- Colored Border ---*/
|
|
/*-------------------
|
|
Alpha Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Accents
|
|
--------------------*/
|
|
/* Differentiating Neutrals */
|
|
/* Differentiating Layers */
|
|
/*******************************
|
|
Power-User
|
|
*******************************/
|
|
/*-------------------
|
|
Emotive Colors
|
|
--------------------*/
|
|
/* Positive */
|
|
/* Negative */
|
|
/* Info */
|
|
/* Warning */
|
|
/*-------------------
|
|
Paths
|
|
--------------------*/
|
|
/* For source only. Modified in gulp for dist */
|
|
/*-------------------
|
|
Em Sizes
|
|
--------------------*/
|
|
/*
|
|
This rounds @size values to the closest pixel then expresses that value in (r)em.
|
|
This ensures all size values round to exact pixels
|
|
*/
|
|
/* em */
|
|
/* rem */
|
|
/*-------------------
|
|
Icons
|
|
--------------------*/
|
|
/* Maximum Glyph Width of Icon */
|
|
/*-------------------
|
|
Neutral Text
|
|
--------------------*/
|
|
/*-------------------
|
|
Brand Colors
|
|
--------------------*/
|
|
/*-------------------
|
|
Borders
|
|
--------------------*/
|
|
/*-------------------
|
|
Derived Values
|
|
--------------------*/
|
|
/* Loaders Position Offset */
|
|
/* Rendered Scrollbar Width */
|
|
/* Maximum Single Character Glyph Width, aka Capital "W" */
|
|
/* Used to match floats with text */
|
|
/* Header Spacing */
|
|
/* Minimum Mobile Width */
|
|
/* Positive / Negative Dupes */
|
|
/* Responsive */
|
|
/*-------------------
|
|
Exact Pixel Values
|
|
--------------------*/
|
|
/*
|
|
These are used to specify exact pixel values in em
|
|
for things like borders that remain constantly
|
|
sized as emSize adjusts
|
|
|
|
Since there are many more sizes than names for sizes,
|
|
these are named by their original pixel values.
|
|
|
|
*/
|
|
/* Columns */
|
|
/*******************************
|
|
States
|
|
*******************************/
|
|
/*-------------------
|
|
Disabled
|
|
--------------------*/
|
|
/*-------------------
|
|
Hover
|
|
--------------------*/
|
|
/*--- Shadows ---*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Focus
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Down (:active)
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*-------------------
|
|
Active
|
|
--------------------*/
|
|
/*--- Colors ---*/
|
|
/*--- Emotive ---*/
|
|
/*--- Brand ---*/
|
|
/*--- Dark Tones ---*/
|
|
/*--- Light Tones ---*/
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Fonts
|
|
--------------------*/
|
|
/*-------------------
|
|
Breakpoints
|
|
--------------------*/
|
|
/*
|
|
@mobileBreakpoint : unit( (63 * @emSize), px);
|
|
@tabletBreakpoint : unit( (79 * @emSize), px);
|
|
@computerBreakpoint : unit( (91 * @emSize), px);
|
|
@largeMonitorBreakpoint : unit( (99 * @emSize), px);
|
|
@widescreenMonitorBreakpoint : unit( (119 * @emSize), px);
|
|
*/
|
|
/*******************************
|
|
PXT Variables
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Full screen
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/*-------------------
|
|
Blockly
|
|
--------------------*/
|
|
/*******************************
|
|
User Global Variables
|
|
*******************************/
|
|
/* Microbit.org colors */
|
|
/*******************************
|
|
PXT Overrides
|
|
*******************************/
|
|
/*-------------------
|
|
Menu
|
|
--------------------*/
|
|
/*-------------------
|
|
Layout
|
|
--------------------*/
|
|
/*-------------------
|
|
Background
|
|
--------------------*/
|
|
/*-------------------
|
|
Side Docs
|
|
--------------------*/
|
|
/*-------------------
|
|
Editor
|
|
--------------------*/
|
|
/* Reference import */
|
|
/*******************************
|
|
Add your custom CSS here
|
|
*******************************/
|
|
/* Roboto font */
|
|
@font-face {
|
|
font-family: 'Roboto';
|
|
src: url("data:application/font-woff;base64,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") format("woff");
|
|
}
|
|
.ui.button.download-button:hover {
|
|
color: black !important;
|
|
}
|
|
#filelist,
|
|
#editortools {
|
|
background: #fff url(https://az742082.vo.msecnd.net/pub/psopafpj) 0 0 repeat !important;
|
|
}
|
|
#downloadArea {
|
|
background: transparent !important;
|
|
}
|
|
.organization {
|
|
top: 1.6em;
|
|
}
|
|
/*******************************
|
|
Monaco
|
|
*******************************/
|
|
.monacoDraggableBlock {
|
|
background: #ecf0f1;
|
|
border: solid 3px #ecf0f1;
|
|
}
|
|
.monacoFlyout {
|
|
background: rgba(82, 90, 103, 0.5);
|
|
}
|
|
/* Mobile */
|
|
@media only screen and (max-width: 767px) {
|
|
#filelist {
|
|
background: transparent !important;
|
|
}
|
|
}
|
|
/* Tablet */
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
#filelist {
|
|
background: transparent !important;
|
|
}
|
|
}
|
|
/* Small Monitor */
|
|
/* Large Monitor */
|