You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

232 lines
4.9 KiB

/*
* # Semantic Text Block - Flat
* http://github.com/quirkyinc/semantic
*
*
* Copyright 2013 Contributors
* Released under the MIT license
* http://opensource.org/licenses/MIT
*
* Released: April 29 2013
*/
/*******************************
Text Block
*******************************/
.ui.message {
position: relative;
min-height: 18px;
margin: 1em 0em;
height: auto;
background-color: rgba(0, 0, 0, 0.04);
padding: 1em;
line-height: 1.33;
color: rgba(0, 0, 0, 0.6);
-webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
-moz-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
-o-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
-ms-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-border-radius: 0.325em 0.325em 0.325em 0.325em;
-moz-border-radius: 0.325em 0.325em 0.325em 0.325em;
border-radius: 0.325em 0.325em 0.325em 0.325em;
}
/*--------------
Content
---------------*/
/* block with headers */
.ui.message .header {
font-size: 1.33em;
font-weight: bold;
}
/* block with paragraphs */
.ui.message .header + p {
margin-top: 0em;
}
.ui.message p {
opacity: 0.85;
margin: 1em 0em;
}
.ui.message > :first-child {
margin-top: 0em;
}
.ui.message > :last-child {
margin-bottom: 0em;
}
/* block with child list */
.ui.message ul.list {
opacity: 0.85;
list-style-position: inside;
margin: 0.2em 0em;
padding: 0em;
}
.ui.message ul.list li {
position: relative;
list-style-type: none;
font-style: italic;
margin: 0em 0em 0em 1em;
padding: 0em;
}
.ui.message ul.list li:before {
position: absolute;
content: '\2022';
top: -0.05em;
left: -0.8em;
height: 100%;
vertical-align: baseline;
opacity: 0.5;
}
.ui.message ul.list li:first-child {
margin-top: 0em;
}
/* dismissable block */
.ui.message > .icon.close {
cursor: pointer;
position: absolute;
top: 1em;
right: 0.5em;
opacity: 0.7;
-webkit-transition: opacity 0.1s linear
;
-moz-transition: opacity 0.1s linear
;
-o-transition: opacity 0.1s linear
;
-ms-transition: opacity 0.1s linear
;
transition: opacity 0.1s linear
;
}
.ui.message > .icon.close:hover {
opacity: 1;
}
/*******************************
States
*******************************/
.ui.message.visible,
.ui.header.visible {
display: block !important;
}
.ui.message.hidden,
.ui.header.hidden {
display: none;
}
/*******************************
Variations
*******************************/
/*--------------
Compact
---------------*/
.ui.compact.message {
display: inline-block;
}
/*--------------
Attached
---------------*/
.ui.attached.message {
margin-bottom: 0em;
-webkit-border-radius: 0.325em 0.325em 0em 0em;
-moz-border-radius: 0.325em 0.325em 0em 0em;
border-radius: 0.325em 0.325em 0em 0em;
-webkit-box-shadow: 0em 0em 0em 1px #DDDDDD
;
-moz-box-shadow: 0em 0em 0em 1px #DDDDDD
;
box-shadow: 0em 0em 0em 1px #DDDDDD
;
}
.ui.bottom.attached.message {
margin-top: 0em;
-webkit-border-radius: 0em 0em 0.325em 0.325em;
-moz-border-radius: 0em 0em 0.325em 0.325em;
border-radius: 0em 0em 0.325em 0.325em;
-webkit-box-shadow: 0em 0em 0em 1px #DDDDDD
;
-moz-box-shadow: 0em 0em 0em 1px #DDDDDD
;
box-shadow: 0em 0em 0em 1px #DDDDDD
;
}
.ui.attached.message .header {
font-size: 1.1em;
}
.ui.attached.message .icon {
float: right;
}
/*--------------
Icon
---------------*/
.ui.icon.message > .icon {
display: table-cell;
vertical-align: middle;
font-size: 3.8em;
padding-right: 0.4em;
opacity: 0.2;
}
.ui.icon.message > .content {
display: table-cell;
vertical-align: middle;
}
/*--------------
Inverted
---------------*/
.ui.inverted.message {
background-color: rgba(255, 255, 255, 0.05);
color: rgba(255, 255, 255, 0.95);
}
/*--------------
Colors
---------------*/
.ui.black.message {
background-color: #333333;
color: rgba(255, 255, 255, 0.95);
}
/*--------------
Types
---------------*/
.ui.blue.message,
.ui.info.message {
border-color: #E4F5FB;
background-color: #E9F9FF;
color: #4D8796;
}
/* Success Text Block */
.ui.green.message,
.ui.success.message,
.ui.positive.message {
background-color: #DEFCD5;
color: #52A954;
border-color: #4D965B;
}
/* Warning Text Block */
.ui.yellow.message,
.ui.warning.message {
background-color: #F6F3D5;
border-color: #CBB105;
color: #96904D;
}
/* Error Text Block */
.ui.red.message,
.ui.error.message,
.ui.negative.message {
background-color: #F1D7D7;
color: #A95252;
border-color: #964D4D;
}
/*--------------
Sizes
---------------*/
.ui.small.message {
font-size: 0.875em;
}
.ui.message {
font-size: 1em;
}
.ui.large.message {
font-size: 1.125em;
}
.ui.huge.message {
font-size: 1.5em;
}
.ui.massive.message {
font-size: 2em;
}