mirror of
https://github.com/inverse-inc/sogo.git
synced 2026-05-23 04:15:26 +00:00
Adapt markup to typographic styles
- Mail Messages List
This commit is contained in:
committed by
Francis Lachapelle
parent
bd61c354f0
commit
08a76aef97
@@ -0,0 +1,8 @@
|
||||
/*! _extends.scss - */
|
||||
////
|
||||
/// SOGo
|
||||
/// Version: #{$Version}
|
||||
/// Module: list
|
||||
/// Extends for list from angular-material sources
|
||||
////
|
||||
@import '../../../angular-material/src/components/list/list.scss';
|
||||
@@ -1,76 +1,10 @@
|
||||
$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;
|
||||
|
||||
md-list {
|
||||
padding: $list-padding-top $list-padding-right $list-padding-bottom $list-padding-left;
|
||||
}
|
||||
|
||||
md-item {
|
||||
|
||||
}
|
||||
|
||||
md-item-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
box-sizing: border-box;
|
||||
|
||||
position: relative;
|
||||
|
||||
padding: $item-padding-top $item-padding-right $item-padding-bottom $item-padding-left;
|
||||
}
|
||||
|
||||
/**
|
||||
* The left tile for a list item.
|
||||
*/
|
||||
.md-tile-left {
|
||||
min-width: 56px;
|
||||
margin-right: -16px;
|
||||
// for dev only
|
||||
height: 56px;
|
||||
background-color: grey;
|
||||
}
|
||||
|
||||
/**
|
||||
* The center content tile for a list item.
|
||||
*/
|
||||
.md-tile-content {
|
||||
flex: 1;
|
||||
|
||||
padding: $baseline-grid * 2;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
h3 {
|
||||
margin: $list-h3-margin;
|
||||
font-weight: $list-h3-font-weight;
|
||||
font-size: $list-h3-font-size;
|
||||
}
|
||||
h4 {
|
||||
margin: $list-h4-margin;
|
||||
font-weight: $list-h4-font-weight;
|
||||
font-size: $list-h4-font-size;
|
||||
}
|
||||
p {
|
||||
margin: $list-p-margin;
|
||||
font-size: $list-p-font-size;
|
||||
}
|
||||
}
|
||||
////
|
||||
/// SOGo
|
||||
/// Version: #{$Version}
|
||||
/// Module: List
|
||||
/// Main definitions for List
|
||||
////
|
||||
@import 'extends';
|
||||
.sg {
|
||||
&-tile-content {
|
||||
@extend .md-tile-content;
|
||||
@@ -95,9 +29,15 @@ md-item-content {
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* The right tile for a list item.
|
||||
*/
|
||||
|
||||
// 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 {
|
||||
border-radius: 100%;
|
||||
min-height: 56px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user