Files
sogo/UI/WebServerResources/scss/components/list/list.scss
iRouge cd32bcf961 Fine-tune presentation of Mailer UI
- Colors
- Icons
- Dimmensions
- Typography
2015-06-11 15:57:22 -04:00

73 lines
1.9 KiB
SCSS

////
/// SOGo
/// Version: #{$Version}
/// Module: List
/// Main definitions for List
////
@import 'extends';
// List variables
// ----------------------------------------------------------------------------
//$list-h3-font-size: 1.1em !default;
//$list-h3-margin: 0 0 3px 0 !default;
//$list-h3-font-weight: 400 !default;
//$list-h4-font-size: 0.9em !default;
//$list-h4-font-weight: 400 !default;
//$list-h4-margin: 0 0 3px 0 !default;
//$list-p-font-size: 0.75em !default;
//$list-p-margin: 0 0 3px 0 !default;
//
//$list-padding-top: $baseline-grid !default;
//$list-padding-right: 0px !default;
//$list-padding-left: 0px !default;
//$list-padding-bottom: $baseline-grid !default;
//
//$item-padding-top: 0px !default;
//$item-padding-right: 0px !default;
//$item-padding-left: 0px !default;
//$item-padding-bottom: 0px !default;
// The right tile for a list item.
// ----------------------------------------------------------------------------
.md-tile-right {
padding-right: $item-padding-right;
}
// The right tile for a list item (avatar container)
// ----------------------------------------------------------------------------
.md-tile-left,
.md-tile-right {
border-radius: 100%;
padding: $layout-gutter-width;
width: $sg-md-grid-pitch + $baseline-grid;
height: $sg-md-grid-pitch + $baseline-grid;
background-clip: content-box;
margin-left: -$layout-gutter-width;
}
.md-tile-right {
margin-right: -$layout-gutter-width;
}
// Overqualifying to override a rule in source
div.md-tile-left {
min-width: $sg-md-grid-pitch + $baseline-grid;
}
.sg-tile-icons {
font-size: $sg-font-size-1;
color: $colorGray;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
width: (2 * $mg);
height:(7 * $line);
}
// Avatar placeholder
// ------------------------------------
.md-tile-left:before {
content: "\f251";
font-family: 'Material Design Iconic Font';
font-size: 40px;
color: rgba(0, 0, 0, 0.26);
}