feat: fixed reviewable.io issues. News-feed modifications.

index.html

@@ -30,10 +30,7 @@
 
     <link rel="icon" href="images/favicon.ico">
     <link rel="stylesheet" href="https://cdn.materialdesignicons.com/3.8.95/css/materialdesignicons.min.css">
-    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
-      rel="stylesheet">
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.5/css/bulma.min.css">
-    <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
+
     <!-- See https://goo.gl/OOhYW5 -->
     <link rel="manifest" href="manifest.json">
 

src/components/breadcrumbs.js → src/components/breadcrumb.js

@@ -2,7 +2,7 @@ import { html, LitElement } from 'lit-element';
 import homepageStyles from '../../style/homepage.scss';
 import sharedStyles from '../../style/app.scss';
 
-class breadCrumbs extends LitElement {
+class breadCrumb extends LitElement {
   static get styles() {
     return [sharedStyles, homepageStyles];
   }
@@ -21,4 +21,4 @@ class breadCrumbs extends LitElement {
   }
 }
 
-window.customElements.define('breadcrumbs', breadCrumbs);
+window.customElements.define('breadcrumb', breadCrumb);

src/components/dashboard.js

@@ -3,8 +3,8 @@ import sharedStyles from '../../style/app.scss';
 import { PageViewElement } from './page-view-element.js';
 import './sidebar.js';
 import './top-nav.js';
-import './info-cards.js';
-import './tag-cards.js';
+import './info-card.js';
+import './tag-card.js';
 import './news-feed.js';
 import './quick-settings.js';
 import './tags.js';
@@ -31,8 +31,8 @@ class OAEDashboard extends PageViewElement {
                   <div class=" columns is-flex main-content">
                     <div class="column is-two-thirds">
                       <section class="column is-inline-flex">
-                        <info-cards></info-cards>
-                        <tag-cards></tag-cards>
+                        <info-card></info-card>
+                        <tag-card></tag-card>
                       </section>
                       <section class="column activity-dashboard">
                         <section class="is-flex">

src/components/info-cards.js → src/components/info-card.js

@@ -2,7 +2,7 @@ import { html, LitElement } from 'lit-element';
 import homepageStyles from '../../style/homepage.scss';
 import sharedStyles from '../../style/app.scss';
 
-class infoCards extends LitElement {
+class infoCard extends LitElement {
   static get styles() {
     return [sharedStyles, homepageStyles];
   }
@@ -31,4 +31,4 @@ class infoCards extends LitElement {
   }
 }
 
-window.customElements.define('info-cards', infoCards);
+window.customElements.define('info-card', infoCard);

src/components/news-feed.js

@@ -52,16 +52,12 @@ class newsFeed extends LitElement {
           <nav class="level bottom-nav-news">
             <div class="level-left">
               <div class="level-item">
-                <div class="dropdown is-active">
-                  <div class="dropdown-trigger">
-                    <button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
-                      <span>25 comments</span>
-                      <span class="icon is-small">
-                        <i class="fas fa-angle-down" aria-hidden="true"></i>
-                      </span>
-                    </button>
-                  </div>
-                </div>
+                <a class="button is-inverted is-link">
+                  <span>View (25) comments</span>
+                  <span class="icon is-small">
+                    <i class="mdi mdi-alert"></i>
+                  </span>
+                </a>
               </div>
             </div>
             <div class="level-right is-pulled-right">

src/components/quick-settings.js

@@ -15,8 +15,9 @@ class quickSettings extends LitElement {
             <div class="content info-card">
               <p>
                 LAST SIGN IN
+              </p>
               <h3>
-               <strong>TUESDAY APRIL 4 2019</strong>
+                <strong>TUESDAY APRIL 4 2019</strong>
               </h3>
             </div>
           </div>

src/components/tag-cards.js → src/components/tag-card.js

@@ -3,7 +3,7 @@ import homepageStyles from '../../style/homepage.scss';
 import sharedStyles from '../../style/app.scss';
 import './tags.js';
 
-class tagCards extends LitElement {
+class tagCard extends LitElement {
   static get styles() {
     return [sharedStyles, homepageStyles];
   }
@@ -26,4 +26,4 @@ class tagCards extends LitElement {
   }
 }
 
-window.customElements.define('tag-cards', tagCards);
+window.customElements.define('tag-card', tagCard);

style/app.scss

@@ -28,8 +28,8 @@
 //@import "../node_modules/bulma/sass/elements/_all.sass";
 //@import "../node_modules/bulma/sass/components/_all.sass";
 
-//Material Design Icons
-//Default Styles
+// Material Design Icons
+// Default Styles
 .alert.mdi::before,
 .breadcrumb .mdi::before,
 .btn.mdi::before,
@@ -72,7 +72,7 @@
 	margin-right: 0.5rem;
 }
 
-//Structure
+// Structure
 html,
 body {
 	margin: 0;
@@ -137,7 +137,7 @@ h2 {
 	background-color: #2962ff;
 }
 
-//Side Menu
+// Side Menu
 .aside {
 	height: 100%;
 }
@@ -224,7 +224,7 @@ img.search_icon {
 	}
 }
 
-//Navbar
+// Navbar
 .navbar {
 	background-color: transparent;
 }
@@ -269,7 +269,7 @@ img.search_icon {
 	border-radius: 25px;
 }
 
-//Cards
+// Cards
 .box {
 	margin: 0;
 }
@@ -303,7 +303,7 @@ img.search_icon {
 	font-weight: bold;
 }
 
-//News Feed - Dashboard
+// News Feed - Dashboard
 .tag-activity-dashboard {
 	margin-right: 10px;
 }
@@ -314,7 +314,7 @@ img.search_icon {
 .news-feed-message {
 	margin-left: 65px;
 	width: auto;
-	background-color: #d8dce8;
+	background-color: #fafafa;
 	border-radius: 5px;
 	word-wrap: break-word;
 }
@@ -334,9 +334,9 @@ img.search_icon {
 	margin-left: 65px;
 }
 
-//Tags
+// Tags
 .tag-structure {
-	margin-right: 5px; 
+	margin-right: 5px;
 }
 .tag-buttons {
 	margin-right: 5px;