From 42a7a6ef5d18f5f5e07e5d8a76f2d8bebb214b85 Mon Sep 17 00:00:00 2001
From: "k.triantafyllou" <k.triantafyllou@d315682c-612b-4755-9ff5-7f18f6832af3>
Date: Tue, 2 Jul 2019 11:59:17 +0000
Subject: [PATCH] [Trunk|Connect]: Change home page view

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-connect-portal/trunk@56316 d315682c-612b-4755-9ff5-7f18f6832af3
---
 .../browse-community.component.html            |  4 ++--
 src/app/communities/communities.component.html | 18 +++++++++---------
 src/assets/connect-custom.css                  |  4 ++++
 3 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/src/app/communities/browseCommunity/browse-community.component.html b/src/app/communities/browseCommunity/browse-community.component.html
index 0866002..e0005da 100644
--- a/src/app/communities/browseCommunity/browse-community.component.html
+++ b/src/app/communities/browseCommunity/browse-community.component.html
@@ -15,7 +15,7 @@
       </div>
     </a>
   </div>
-  <div class="community uk-margin">
+  <div class="community uk-margin-medium-bottom">
     <div class="uk-text-center uk-text-small uk-text-bold">
       <a (click)="confirmModalOpen()">
         <span class="uk-text-small uk-margin-small" *ngIf="community.title" >
@@ -33,7 +33,7 @@
     </div>
   </div>
   <div class="uk-position-bottom-right uk-padding-small uk-padding-remove-bottom">
-    <a (click)="confirmModalOpen()" class="portal-color uk-text-uppercase uk-text-bold">
+    <a (click)="confirmModalOpen()" class="portal-color uk-text-uppercase uk-text-bold uk-text-small">
       Visit
     </a>
   </div>
diff --git a/src/app/communities/communities.component.html b/src/app/communities/communities.component.html
index 11eb0c3..90755ee 100644
--- a/src/app/communities/communities.component.html
+++ b/src/app/communities/communities.component.html
@@ -2,15 +2,15 @@
   <div class=" uk-section uk-padding-remove-bottom">
     <div class="uk-position-cover"></div>
     <div class="uk-position-relative uk-panel">
-      <div *ngIf="loading" class="uk-container uk-container-large uk-height-large">
+      <div *ngIf="loading" class="uk-container uk-container-expand padding-120 uk-height-large">
         <div class="uk-animation-fade uk-margin-top  uk-width-1-2" role="alert"><span class="loading-gif  uk-align-center" ></span></div>
       </div>
-      <div *ngIf="!loading" class="uk-container uk-container-large">
+      <div *ngIf="!loading" class="uk-container uk-container-expand padding-120">
         <div *ngIf="managerOfCommunities.length > 0 || subscriberOfCommunities.length > 0" class="uk-child-width-1-1@s uk-child-width-1-2@m uk-flex uk-flex-middle" uk-grid>
           <div>
             <div *ngIf="managerOfCommunities.length > 0" uk-grid>
               <h5 class="uk-width-1-1 uk-text-bold">You are managing</h5>
-              <div class="uk-width-1-1">
+              <div class="uk-width-2-3@xl uk-width-1-1@m">
                 <div class="uk-grid-match uk-grid-small  uk-child-width-1-3@m uk-child-width-1-2@s uk-child-width-1-1@xs uk-text-center" uk-grid uk-height-match=".community">
                   <div *ngFor="let community of managerOfCommunities.slice(0,3); let i = index">
                     <div  class="uk-padding-small uk-height-max-medium uk-card uk-card-default communityCard"
@@ -28,7 +28,7 @@
               </div>
             </div>
 
-            <div class="uk-container uk-container-large uk-width-4-5">
+            <div class="uk-container uk-container-expand padding-120 uk-width-4-5">
               <div *ngIf="subscriberErrorMessage" class="uk-animation-fade uk-alert uk-alert-warning" role="alert">
                 {{subscriberErrorMessage}}
               </div>
@@ -36,7 +36,7 @@
 
             <div *ngIf="subscriberOfCommunities.length > 0" uk-grid>
               <h5 class="uk-width-1-1 uk-text-bold">You are subscribed to</h5>
-              <div class="uk-width-1-1">
+              <div class="uk-width-2-3@xl uk-width-1-1@m">
                 <div class="uk-grid-match uk-grid-small  uk-child-width-1-3@m uk-child-width-1-2@s uk-child-width-1-1@xs uk-text-center" uk-grid uk-height-match=".community">
                   <div *ngFor="let community of subscriberOfCommunities.slice(0,3); let i = index">
                     <div  class="uk-padding-small uk-height-max-medium uk-card uk-card-default communityCard"
@@ -61,7 +61,7 @@
           </div>
         </div>
         <div *ngIf="managerOfCommunities.length == 0 && subscriberOfCommunities.length == 0" uk-grid>
-          <div class="uk-width-2-5@m uk-width-1-1@s">
+          <div class="uk-width-large-2-5@l uk-width-1-2@m uk-width-1-1@s">
             <h1 class="font-41">Build a <b>Gateway</b> for your <b>Community</b></h1>
             <div class="uk-text-large">Turn Open Science into Practice.<br>It takes your open and linked research outcomes.<br>A service customized to your needs.</div>
           </div>
@@ -183,7 +183,7 @@
           </div>
         </div>
       <div class="uk-margin-large-top home-background uk-section uk-background-norepeat uk-background-top-center uk-background-cover uk-section-secondary uk-section-overlap uk-position-relative uk-preserve-color">
-        <div class="uk-container uk-container-large">
+        <div class="uk-container uk-container-expand padding-120">
           <gif-slider [gifs]="gifs" [link]="true" [linkTitle]="'learn more'" [route]="'/about'">
           </gif-slider>
         </div>
@@ -221,7 +221,7 @@
 </div>
 <helper div="home-news"></helper>
 <div class="contact-banner uk-background-norepeat uk-background-cover uk-section-secondary uk-section-overlap uk-position-relative uk-preserve-color">
-  <div class="uk-container uk-section">
+  <div class="uk-container uk-container-expand padding-120 uk-section">
     <div class="uk-flex uk-flex-middle uk-padding uk-child-width-1-1@s uk-child-width-1-2@m" uk-grid>
       <div class="uk-text-center uk-width-1-1@s uk-width-1-3@m">
         <img width="237" height="250" src="../../assets/contact/1.png">
@@ -240,7 +240,7 @@
   </div>
 </div>
 <div class="uk-section-muted" uk-scrollspy="{&quot;target&quot;:&quot;[uk-scrollspy-class]&quot;,&quot;cls&quot;:&quot;uk-animation-fade&quot;,&quot;delay&quot;:false}">
-    <div class="uk-container uk-container-large">
+    <div class="uk-container uk-container-expand padding-120">
       <div uk-grid="" class="uk-grid uk-margin-large-top uk-margin-large-bottom">
         <div class="uk-width-expand@m uk-width-1-2@s uk-dark uk-grid-item-match uk-first-column explore">
           <div class="uk-margin uk-panel uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
diff --git a/src/assets/connect-custom.css b/src/assets/connect-custom.css
index 8358e6f..6ea57c0 100644
--- a/src/assets/connect-custom.css
+++ b/src/assets/connect-custom.css
@@ -244,6 +244,10 @@ div:not(.connect_App) bottom .uk-totop{
     font-size: 41px;
 }
 
+.padding-120 {
+  padding-left: 120px;
+}
+
 /* NOT USED
 .sketch-line {
     height:80%;