|
|
/* * # Semantic - Image * http://github.com/jlukic/semantic-ui/ * * * Copyright 2013 Contributors * Released under the MIT license * http://opensource.org/licenses/MIT * */
/******************************* Theme*******************************/
/*------------------- Theme--------------------*/
/* To Override a theme for an individual element Specify using camel case*/
/******************************* Global Variables*******************************/
/*------------------- Paths--------------------*/
/*------------------- Page--------------------*/
/*------------------- Fonts--------------------*/
/*------------------- Icons--------------------*/
/* Width of largest icon */
/******************************* BG Colors*******************************/
/******************************* Colors*******************************/
/*------------------- Background--------------------*/
/*--- Colors ---*/
/*--- Emotive ---*/
/*--- Neutrals ---*/
/*------------------- Text Colors--------------------*/
/*------------------- Brand Colors--------------------*/
/*------------------- Borders--------------------*/
/*------------------- Sizes--------------------*/
/*------------------- Transitions--------------------*/
/******************************* States*******************************/
/*------------------- Disabled--------------------*/
/*------------------- Hover--------------------*/
/*--- Colors ---*/
/*--- Emotive ---*/
/*--- Neutrals ---*/
/*------------------- Down (:active)--------------------*/
/*--- Colors ---*/
/*--- Emotive ---*/
/*--- Neutrals ---*/
/*------------------- Active--------------------*/
/*--- Standard ---*/
/*--- Emotive ---*/
/*--- Neutrals ---*/
/******************************* User Global Variables*******************************/
/*------------------- Globals Used--------------------*/
/*@borderColor
*/
/*------------------- Variables--------------------*/
/******************************* User Variable Overrides*******************************/
/******************************* Overrides*******************************/
/******************************* Overrides*******************************/
/******************************* Image*******************************/
.ui.image { position: relative; display: inline-block; vertical-align: middle; max-width: 100%; background-color: rgba(0, 0, 0, 0.05);}
img.ui.image { display: block; background: none;}
.ui.image img { display: block; max-width: 100%; height: auto;}
/******************************* States*******************************/
.ui.disabled.image { cursor: default; opacity: 0.3;}
/******************************* Variations*******************************/
/*-------------- Rounded---------------*/
.ui.rounded.images .image,.ui.rounded.images img,.ui.rounded.image img,.ui.rounded.image { border-radius: 0.3125em;}
/*-------------- Circular---------------*/
.ui.circular.images .image,.ui.circular.images img,.ui.circular.image img,.ui.circular.image { border-radius: 500rem;}
/*-------------- Fluid---------------*/
.ui.fluid.images,.ui.fluid.image,.ui.fluid.images img,.ui.fluid.image img { display: block; width: 100%;}
/*-------------- Avatar---------------*/
.ui.avatar.images .image,.ui.avatar.images img,.ui.avatar.image img,.ui.avatar.image { margin-left: 0.25rem; display: inline-block; width: 2em; height: 2em; border-radius: 500rem;}
/*------------------- Floated--------------------*/
.ui.floated.image,.ui.floated.images { float: right; margin-left: 1em; margin-bottom: 1em;}
.ui.right.floated.images,.ui.right.floated.image { float: left; margin-bottom: 1em; margin-right: 1em;}
/*-------------- Sizes---------------*/
.ui.mini.images .image,.ui.mini.images img,.ui.mini.image { width: 20px; font-size: 0.7em;}
.ui.tiny.images .image,.ui.tiny.images img,.ui.tiny.image { width: 80px; font-size: 0.8em;}
.ui.small.images .image,.ui.small.images img,.ui.small.image { width: 150px; font-size: 0.875em;}
.ui.medium.images .image,.ui.medium.images img,.ui.medium.image { width: 300px; font-size: 1em;}
.ui.large.images .image,.ui.large.images img,.ui.large.image { width: 450px; font-size: 1.125em;}
.ui.big.images .image,.ui.big.images img,.ui.big.image { width: 600px; font-size: 1.25em;}
.ui.huge.images .image,.ui.huge.images img,.ui.huge.image { width: 800px; font-size: 1.375em;}
.ui.massive.images .image,.ui.massive.images img,.ui.massive.image { width: 960px; font-size: 1.5em;}
/******************************* Groups*******************************/
.ui.images { font-size: 0em; margin: 0em -0.25rem 0rem;}
.ui.images .image,.ui.images img { display: inline-block; margin: 0em 0.25rem 0.5rem;}
|
