category stuff

olythy · Mar 8, 2018 · 0b65d14 · 0b65d14
1 parent cbf7063
commit 0b65d14
Show file tree

Hide file tree

Showing 9 changed files with 170 additions and 74 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -48,6 +48,7 @@
         "react-router": "^4.2.0",
         "react-router-dom": "^4.2.2",
         "react-slick": "^0.18.1",
+        "react-waypoint": "^8.0.1",
         "sortablejs": "^1.7.0",
         "vue-resource": "^1.3.4"
     }

diff --git a/resources/assets/src/Components/MainContent/Home/Home.js b/resources/assets/src/Components/MainContent/Home/Home.js
@@ -2,6 +2,7 @@ import React, {Component} from 'react'
 
 import HeaderSlider from '../HeaderSlider/HeaderSlider'
 import NewsLatestPopular from '../News/NewsLatestPopular/NewsLatestPopular'
+import NewsCard from '../News/NewsCard/NewsCard'
 import TalksCategory from '../Talks/TalksCategory/TalksCategory'
 import Events from '../Events/Events'
 import StartupBanner from '../Startup/StartupBanner/StartupBanner'
@@ -23,7 +24,12 @@ class Home extends Component {
             <section className="Home">
                 <HeaderSlider />
                 <div className="Layout-width">
-                    <NewsLatestPopular name="News"/>
+                    <NewsLatestPopular name="News" showCategs seeAll >
+                        <NewsCard />
+                        <NewsCard />
+                        <NewsCard />
+                        <NewsCard />
+                    </NewsLatestPopular>
                 </div>
                     <Events />
                 <div className="Layout-width">

diff --git a/resources/assets/src/Components/MainContent/MainContent.js b/resources/assets/src/Components/MainContent/MainContent.js
@@ -18,6 +18,9 @@ class MainContent extends Component {
                   <main>
                         <Switch>
                               <Route exact path="/" component={Home}/>
+                              <Route path="/talks" component={Talks}/>
+                              <Route path="/london" component={London}/>
+                              <Route path="/about" component={About}/>
                               <Switch>
                                     <Route exact path='/news' render={routeProps => <News {...routeProps} direction={this.props.direction}/>} />
                                     <Switch>
@@ -26,9 +29,6 @@ class MainContent extends Component {
                                           <Route component={NotFound}/>
                                     </Switch>
                               </Switch>
-                              <Route path="/talks" component={Talks}/>
-                              <Route path="/london" component={London}/>
-                              <Route path="/about" component={About}/>
                               <Route component={NotFound}/>
                         </Switch>
                   </main>

diff --git a/resources/assets/src/Components/MainContent/News/News.js b/resources/assets/src/Components/MainContent/News/News.js
@@ -15,7 +15,7 @@ class News extends Component {
             <HeaderSlider />
             <CategSlider direction={this.props.direction}/>
             <div className="Layout-width">
-                <NewsLatestPopular>
+                <NewsLatestPopular showCategs seeAll>
                     <NewsCard />
                     <NewsCard />
                     <NewsCard />

diff --git a/resources/assets/src/Components/MainContent/News/News.scss b/resources/assets/src/Components/MainContent/News/News.scss
@@ -15,28 +15,6 @@
 
 .NewsArticlePage{
 	margin:4em 0;
-	h2,h3{
-		font-family:'Lato';
-		text-transform:none;
-		letter-spacing:0;
-	}
-
-	h4{
-		margin-bottom:2em;
-		line-height:1.5;
-		font-size:1.375em;;
-	}
-	h3{
-		margin-bottom:1em;
-	}
-	h2{
-		margin-bottom:.75em;
-	}
-	p{
-		font-size:1.25em;
-		line-height:1.5;
-		margin-bottom:2em;
-	}
 }
 
 .NewsArticlePage--details{
@@ -48,6 +26,7 @@
 
 .NewsArticlePage--wrp{
 	display: flex;
+	flex-wrap:wrap;
     justify-content: flex-end;
     margin: 3em 0;
     position:relative;
@@ -60,11 +39,59 @@
     top:0;
     left:20px;
 
+    &.fxd{
+    	position:fixed;
+    	top:80px;
+    	left:25%;
+    }
+
     img{
     	margin-bottom:1em;
     }
+
+    .Article-likeNumber{
+    	text-align: center;
+	    border: 1px solid $grey4;
+	    padding: 1.5em;
+	    border-radius: 25px;
+	    margin-bottom: 1em;
+	    font-weight: bold;
+	    color: $grey2;
+    }
 }
 
 .NewsArticlePage--content{
 	flex-basis:87%;
+	h2,h3{
+		font-family:'Lato';
+		text-transform:none;
+		letter-spacing:0;
+	}
+
+	h4{
+		margin-bottom:2em;
+		line-height:1.5;
+		font-size:1.375em;;
+	}
+	h3{
+		margin-bottom:1em;
+	}
+	h2{
+		margin-bottom:.75em;
+	}
+	p{
+		font-size:1.25em;
+		line-height:1.5;
+		margin-bottom:2em;
+	}
+}
+
+.NewsArticlePage--contentIMG{
+	margin-bottom:2em;
+	span{
+		text-align:center;
+		color:$grey2;
+		font-size:1em;
+		margin-top:.5em;
+	}
 }