Add full-screen theme.

Signed-off-by: Oleg Pykhalov <go.wigust@gmail.com>

8 files changed, 25 insertions, 38 deletions

diff --git a/src/components/filters/index.js b/src/components/filters/index.js
index 46aafcf..57b0be6 100644
--- a/src/components/filters/index.js
+++ b/src/components/filters/index.js
@@ -8,24 +8,20 @@ import DateJumpFilter from './date-jump-filter';
 
 const Filters = (props) => (
   <div className="filters-wrap mt-3 mt-sm-3 mt-md-0 mt-xl-0 mt-lg-0">
-    <div className="filter-item">
-      <LanguageFilter
-        selectedLanguage={ props.selectedLanguage }
-        updateLanguage={ props.updateLanguage }
+      <ViewFilter
+        selectedViewType={ props.selectedViewType }
+        updateViewType={ props.updateViewType }
       />
-    </div>
-    <div className="filter-item">
+      <br/>
       <DateJumpFilter
         updateDateJump={ props.updateDateJump }
         selectedDateJump={ props.selectedDateJump }
       />
-    </div>
-    <div className="filter-item d-none d-sm-none d-md-none d-xl-block d-lg-block">
-      <ViewFilter
-        selectedViewType={ props.selectedViewType }
-        updateViewType={ props.updateViewType }
+      <br/>
+      <LanguageFilter
+        selectedLanguage={ props.selectedLanguage }
+        updateLanguage={ props.updateLanguage }
       />
-    </div>
   </div>
 );
 
diff --git a/src/components/filters/language-filter/index.js b/src/components/filters/language-filter/index.js
index edc1db4..913f599 100644
--- a/src/components/filters/language-filter/index.js
+++ b/src/components/filters/language-filter/index.js
@@ -13,7 +13,7 @@ class LanguageFilter extends React.Component {
   state = {
     filterText: '',
     selectedIndex: 0,
-    showDropdown: false
+    showDropdown: true
   };
 
   focusFilterInput = () => {
@@ -178,10 +178,6 @@ class LanguageFilter extends React.Component {
   render() {
     return (
       <div className='language-filter-wrap'>
-        <button onClick={ this.toggleDropdown } className="btn btn-light language-filter shadowed">
-          <i className="fa fa-filter mr-2"></i>
-          { this.props.selectedLanguage || 'All Languages' }
-        </button>
         { this.state.showDropdown && this.getLanguageDropdown() }
       </div>
     );
diff --git a/src/components/filters/language-filter/styles.css b/src/components/filters/language-filter/styles.css
index ea0fa23..6322818 100644
--- a/src/components/filters/language-filter/styles.css
+++ b/src/components/filters/language-filter/styles.css
@@ -1,5 +1,4 @@
 .language-filter-wrap {
-  position: relative;
   z-index: 1;
 }
 
@@ -13,18 +12,15 @@
 }
 
 .language-select {
-  position: absolute;
   top: 100%;
   width: 300px;
   margin-top: 5px;
   overflow: hidden;
   font-size: 12px;
   color: #586069;
-  background-color: #fff;
   background-clip: padding-box;
   border: 1px solid #e8e8e8;
   border-radius: 8px;
-  box-shadow: 0 3px 12px rgba(27, 31, 35, 0.15);
 }
 
 .select-menu-header, .select-menu-divider {
@@ -61,8 +57,6 @@
 }
 
 .select-menu-list {
-  position: relative;
-  max-height: 400px;
   overflow: auto;
 }
 
@@ -74,7 +68,7 @@
   border-left: 0;
   display: flex;
   align-items: center;
-  padding: 10px 8px 10px 16px;
+  padding: 5px 8px 5px 16px;
   overflow: hidden;
   color: inherit;
   cursor: pointer;
@@ -86,16 +80,9 @@
 }
 
 .select-menu-item:hover, .select-menu-item.active-item {
-  color: #fff;
-  background-color: #1157ed;
   text-decoration: none;
 }
 
-.select-menu-item:hover .select-menu-item-text,
-.select-menu-item.active-item .select-menu-item-text {
-  color: white;
-}
-
 .select-menu-item .repo-language-color {
   width: 10px;
   height: 10px;
diff --git a/src/components/group-heading/index.js b/src/components/group-heading/index.js
index d4adea8..8567d6a 100644
--- a/src/components/group-heading/index.js
+++ b/src/components/group-heading/index.js
@@ -47,14 +47,12 @@ class GroupHeading extends React.Component {
 
   render() {
     return (
-      <div className="group-heading">
         <h4>
           <span className="text-capitalizes">{ this.getTitle() }</span>
           <span className="small text-muted ml-2">
             { this.getSubtitle() }
           </span>
         </h4>
-      </div>
     );
   }
 }
diff --git a/src/components/top-nav/index.js b/src/components/top-nav/index.js
index b3721e0..ccf0152 100644
--- a/src/components/top-nav/index.js
+++ b/src/components/top-nav/index.js
@@ -15,7 +15,7 @@ class TopNav extends React.Component {
     return (
       <div className='top-nav'>
         <div className="container clearfix">
-          <a href='https://cgit.duckdns.org/github/githunt/'
+          <a href='https://githunt.wugi.info/'
              rel="noopener noreferrer"
              target='_blank'
              className="logo clearfix float-left">
diff --git a/src/containers/feed/index.js b/src/containers/feed/index.js
index bde3fb4..2f3c057 100644
--- a/src/containers/feed/index.js
+++ b/src/containers/feed/index.js
@@ -8,6 +8,7 @@ import Alert from '../../components/alert';
 import Loader from '../../components/loader';
 import TopNav from '../../components/top-nav';
 import Filters from '../../components/filters';
+import LanguageFilter from '../../components/filters/language-filter';
 import GroupHeading from '../../components/group-heading';
 import { fetchTrending } from '../../redux/github/actions';
 import RepositoryList from '../../components/repository-list';
@@ -165,6 +166,8 @@ class FeedContainer extends React.Component {
                 dateJump={ this.props.preference.dateJump }
               />
             }
+          </div>
+          <div className="body-row">
             <div className="group-filters">
               {
                 this.hasRepositories() && <Filters
@@ -177,8 +180,6 @@ class FeedContainer extends React.Component {
                 />
               }
             </div>
-          </div>
-          <div className="body-row">
             { this.renderRepositoriesList() }
 
             { this.props.github.processing && <Loader/> }
diff --git a/src/containers/feed/styles.css b/src/containers/feed/styles.css
index d2c5806..cedba72 100644
--- a/src/containers/feed/styles.css
+++ b/src/containers/feed/styles.css
@@ -6,6 +6,8 @@
 
 .header-row h4 {
   margin-top: 15px;
+  padding-top: 25px;
+  text-align: center;
 }
 
 .group-heading h4 {
diff --git a/src/global.css b/src/global.css
index 532842c..5890ddb 100644
--- a/src/global.css
+++ b/src/global.css
@@ -1,6 +1,5 @@
+
 body {
-  /*background-color: #f9f9f9;*/
-  background: #f4f4f4;
   min-height: 100vh;
 }
 
@@ -21,3 +20,11 @@ a {
   background: #1157ed;
   border-color: #1157ed;
 }
+
+.container {
+    max-width: 100% !important;
+}
+
+/* .body-row { */
+/*   column-count: 2; */
+/* } */