From 09fa2be5bd7252ce44290f7ffb1d11a80530cfd2 Mon Sep 17 00:00:00 2001
From: iRouge <bfavreault@inverse.ca>
Date: Tue, 3 Feb 2015 10:52:27 -0500
Subject: [PATCH] Typography auto-scroll List

---
 .../components/autoScrollList/_extends.scss   |  8 +++++
 .../components/autoScrollList/_functions.scss |  7 +++++
 .../autoScrollList/autoScrollList.scss        | 31 +++++++++++++++++++
 .../scss/components/button/_functions.scss    |  7 +++++
 .../scss/core/typography/typography.scss      | 16 +++++-----
 UI/WebServerResources/scss/styles.scss        |  1 +
 6 files changed, 62 insertions(+), 8 deletions(-)
 create mode 100644 UI/WebServerResources/scss/components/autoScrollList/_extends.scss
 create mode 100644 UI/WebServerResources/scss/components/autoScrollList/_functions.scss
 create mode 100644 UI/WebServerResources/scss/components/autoScrollList/autoScrollList.scss
 create mode 100644 UI/WebServerResources/scss/components/button/_functions.scss

diff --git a/UI/WebServerResources/scss/components/autoScrollList/_extends.scss b/UI/WebServerResources/scss/components/autoScrollList/_extends.scss
new file mode 100644
index 000000000..2067ae7eb
--- /dev/null
+++ b/UI/WebServerResources/scss/components/autoScrollList/_extends.scss
@@ -0,0 +1,8 @@
+/*! _extends.scss - */
+////
+/// SOGo
+/// Version: #{$Version}
+/// Module: autoScrollList
+/// Extends for autoScroll module fron ngMaterial List
+////
+@import '../../../angular-material/src/components/list/list.scss';
diff --git a/UI/WebServerResources/scss/components/autoScrollList/_functions.scss b/UI/WebServerResources/scss/components/autoScrollList/_functions.scss
new file mode 100644
index 000000000..689f5ad19
--- /dev/null
+++ b/UI/WebServerResources/scss/components/autoScrollList/_functions.scss
@@ -0,0 +1,7 @@
+/*! _functions.scss - */
+////
+/// SOGo
+/// Version: #{$Version}
+/// Module: autoScrollList
+/// Functions for autoScrollList
+////
\ No newline at end of file
diff --git a/UI/WebServerResources/scss/components/autoScrollList/autoScrollList.scss b/UI/WebServerResources/scss/components/autoScrollList/autoScrollList.scss
new file mode 100644
index 000000000..ebd7f7535
--- /dev/null
+++ b/UI/WebServerResources/scss/components/autoScrollList/autoScrollList.scss
@@ -0,0 +1,31 @@
+////
+/// SOGo
+/// Version: #{$Version}
+/// Module: autoScrollList
+/// Main definitions for autoScrollList
+////
+@import 'extends';
+
+// The only selector for vs-repeat lists is this id, we use attributes selector to
+// avoid overspecifying
+// todo: create new classes and refactor templates markup
+[id='messagesList'] {
+  md-item-content {
+    padding: $layout-gutter-width;
+  }
+}
+.sg-tile-content {
+  .sg-md-subhead-multi {
+    padding: 0 0 0 $layout-gutter-width;
+    margin: 0;
+  }
+  .sg-md-body-multi {
+    margin: 0;
+  }
+  a {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    flex-wrap: wrap;
+  }
+}
\ No newline at end of file
diff --git a/UI/WebServerResources/scss/components/button/_functions.scss b/UI/WebServerResources/scss/components/button/_functions.scss
new file mode 100644
index 000000000..b02b2f44c
--- /dev/null
+++ b/UI/WebServerResources/scss/components/button/_functions.scss
@@ -0,0 +1,7 @@
+/*! _functions.scss - */
+////
+/// SOGo
+/// Version: #{$Version}
+/// Module: button
+/// Functions for button
+////
\ No newline at end of file
diff --git a/UI/WebServerResources/scss/core/typography/typography.scss b/UI/WebServerResources/scss/core/typography/typography.scss
index aa96eb6e1..60ac8b0f0 100644
--- a/UI/WebServerResources/scss/core/typography/typography.scss
+++ b/UI/WebServerResources/scss/core/typography/typography.scss
@@ -146,7 +146,7 @@ $md: $md-prefix;
 $sg-rem-Base-value: 16 !global;
 $sg-sp-value: (1 / $sg-rem-Base-value) !default; // sp value
 
-$sg-md-baseline: 4px;
+$sg-md-typo-baseline: 4px;
 
 // Font-size basic scale (from Google)
 // NiceToHave : generate with a loop
@@ -183,15 +183,15 @@ $sg-font-size-9: nth($sg-typo-scale, 9) * 1px;
 
 // Basic line heights
 // ----------------------------------------------------------------------------
-$sg-line-height-1: $sg-font-size-1 + $sg-md-baseline;
+$sg-line-height-1: $sg-font-size-1 + $sg-md-typo-baseline;
 $sg-line-height-2: 20px;
 $sg-line-height-3: 24px;
-$sg-line-height-4: $sg-font-size-4 + $sg-md-baseline;
+$sg-line-height-4: $sg-font-size-4 + $sg-md-typo-baseline;
 $sg-line-height-5: 32px;
 $sg-line-height-6: 40px;
-$sg-line-height-7: $sg-font-size-7 + $sg-md-baseline;
-$sg-line-height-8: $sg-font-size-8 + $sg-md-baseline;
-$sg-line-height-9: $sg-font-size-9 + $sg-md-baseline;
+$sg-line-height-7: $sg-font-size-7 + $sg-md-typo-baseline;
+$sg-line-height-8: $sg-font-size-8 + $sg-md-typo-baseline;
+$sg-line-height-9: $sg-font-size-9 + $sg-md-typo-baseline;
 // Font weights
 // Google Material Design specifications strongly recommend to avoid bold
 // font weight. Here are some variables to define weights more conveniently
@@ -256,7 +256,7 @@ $h6-margin-Base: 2.33em 0;
     @extend .#{$md}-body-1;
   }
   .#{$md}-body-2 {
-    $lineHeight : $sg-line-height-2 + $sg-md-baseline;
+    $lineHeight : $sg-line-height-2 + $sg-md-typo-baseline;
     font-size: $sg-font-size-1;
     line-height: $lineHeight;
     font-weight: $sg-font-medium;
@@ -280,7 +280,7 @@ $h6-margin-Base: 2.33em 0;
     @extend .#{$md}-subhead-1;
   }
   .#{$md}-subhead-2 {
-    $lineHeight : $sg-line-height-3 + $sg-md-baseline;
+    $lineHeight : $sg-line-height-3 + $sg-md-typo-baseline;
     font-size: $sg-font-size-3;
     line-height: $lineHeight;
     font-weight: $sg-font-regular;
diff --git a/UI/WebServerResources/scss/styles.scss b/UI/WebServerResources/scss/styles.scss
index 2dbe630ff..5beca4f90 100755
--- a/UI/WebServerResources/scss/styles.scss
+++ b/UI/WebServerResources/scss/styles.scss
@@ -50,6 +50,7 @@
 
 /* Angular-material components local overrides */
 @import 'components/list/list.scss';
+@import 'components/autoScrollList/autoScrollList.scss';
 @import 'components/divider/divider.scss';
 @import 'components/bottombar/bottombar.scss';
 @import 'components/input/input.scss';