From 8bd8e68e11368cccb35fb2942b866e4750f2b13b Mon Sep 17 00:00:00 2001
From: Máirín Duffy <duffy@redhat.com>
Date: Jul 26 2016 20:50:06 +0000
Subject: [PATCH 1/7] removing img-wrap from team hubs header (will be plain grey to match fedora bootstrap)


---

diff --git a/hubs/static/css/style.css b/hubs/static/css/style.css
index 1ffc8bb..1160e28 100644
--- a/hubs/static/css/style.css
+++ b/hubs/static/css/style.css
@@ -57,16 +57,18 @@
       .header .dropdown.edit {
         top: 140px !important;
       }
-      .header h3.team {
+      .header h2.team {
         top: 170px !important;
       }
     }
 
     .header {
-      color: #ffffff;
-      background-color: #3c6eb4;
+      color: #373a3c;
+      background: #f3f3f3 none repeat scroll 0 0;
       width: 100%;
       font-family: 'Open Sans', sans-serif;
+      min-height: 100px;
+      border-bottom: 1px solid #ddd;
     }
 
     /*.header .dropdown.edit {
@@ -76,23 +78,6 @@
       z-index: 2;
     }*/
 
-    .header .img-wrap {
-      max-height: 100px;
-      overflow: hidden;
-      position: relative;
-    }
-
-    .header .img-wrap img {
-      width: 100%;
-      text-align: center;
-    }
-
-    .header h3.team {
-      position: absolute;
-      top: 120px;
-      left: 45%;
-    }
-
     .header img.avatar {
         width: 70px;
         float: left;
@@ -101,7 +86,7 @@
         border: 5px solid #fff;
     }
 
-    .header h3 {
+    .header h2 {
         font-weight: 700;
     }
 
diff --git a/hubs/templates/hubs.html b/hubs/templates/hubs.html
index c4e6b92..d9592ef 100644
--- a/hubs/templates/hubs.html
+++ b/hubs/templates/hubs.html
@@ -6,15 +6,12 @@
   {% if hub.user_hub %}
     <div class="padded center-block medium-wide">
       <img src="{{ hub.avatar }}" class="avatar" />
-      <h3>{{ hub.name }}</h3>
+      <h2>{{ hub.name }}</h2>
       <h5>{{ hub.summary }}</h5>
       <div class="clearfix"></div>
     </div>
     {% else %}
-    <div class="img-wrap">
-      <img src="{{ hub.header_img }}" />
-    </div>
-    <h3 class="team">{{ hub.name }}</h3>
+    <h2 class="team">{{ hub.name }}</h2>
   {% endif %}
 </div>
 

From 1f97beda194fe0b19d55d3dcf5cad0d3604f9f81 Mon Sep 17 00:00:00 2001
From: Máirín Duffy <duffy@redhat.com>
Date: Jul 26 2016 20:50:07 +0000
Subject: [PATCH 2/7] wrangling header for user/team hubs to better match Fedora bootstrap


---

diff --git a/hubs/static/css/style.css b/hubs/static/css/style.css
index 1160e28..f0f0b6a 100644
--- a/hubs/static/css/style.css
+++ b/hubs/static/css/style.css
@@ -62,7 +62,7 @@
       }
     }
 
-    .header {
+    header {
       color: #373a3c;
       background: #f3f3f3 none repeat scroll 0 0;
       width: 100%;
@@ -78,7 +78,7 @@
       z-index: 2;
     }*/
 
-    .header img.avatar {
+    header img.avatar {
         width: 70px;
         float: left;
         margin: 0 15px;
@@ -86,15 +86,15 @@
         border: 5px solid #fff;
     }
 
-    .header h2 {
-        font-weight: 700;
+    header h2 {
+        font-weight: 500;
     }
 
-    .header a, .header a:hover, .header a:focus {
+    header a, header a:hover, .header a:focus {
       color: #ffffff;
     }
 
-    .header span.edit {
+    header span.edit {
       margin: 5px 5px 0 0;
     }
     .row {
diff --git a/hubs/templates/hubs.html b/hubs/templates/hubs.html
index d9592ef..c7106fc 100644
--- a/hubs/templates/hubs.html
+++ b/hubs/templates/hubs.html
@@ -2,18 +2,21 @@
 
 {% block title %}{{ hub.name }}{% endblock %}
 {% block content %}
-<div class="header">
-  {% if hub.user_hub %}
-    <div class="padded center-block medium-wide">
-      <img src="{{ hub.avatar }}" class="avatar" />
-      <h2>{{ hub.name }}</h2>
-      <h5>{{ hub.summary }}</h5>
-      <div class="clearfix"></div>
-    </div>
-    {% else %}
-    <h2 class="team">{{ hub.name }}</h2>
-  {% endif %}
-</div>
+
+  <header class="p-t-2">
+    <div class="container">
+      {% if hub.user_hub %}
+	    <img src="{{ hub.avatar }}" class="avatar" />
+		<h2 class="user m-b-0">{{ hub.name }}</h2>
+		<h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
+	    <div class="clearfix"></div>
+      {% else %}
+      <h2 class="team">{{ hub.name }}</h2>
+      <h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
+	  {% endif %}
+  	</div>
+  </header>
+
 
 {%- with messages = get_flashed_messages(with_categories=true) -%}
   {%- if category, messages -%}

From 0347c76a2a3b9c6b6e6fe169efdcb8764a362726 Mon Sep 17 00:00:00 2001
From: Máirín Duffy <duffy@redhat.com>
Date: Jul 26 2016 20:50:07 +0000
Subject: [PATCH 3/7] first cut at vertical nav bar


---

diff --git a/hubs/static/css/style.css b/hubs/static/css/style.css
index f0f0b6a..09d6be9 100644
--- a/hubs/static/css/style.css
+++ b/hubs/static/css/style.css
@@ -265,6 +265,28 @@ font-size: 32pt;
 .navbar-nav > li.idle-2years  > a { color: #BBB; }
 .navbar-nav > li.idle-5years  > a { color: #CCC; }
 
+.nav {
+  background-color: #fcfcfc;
+  padding: 1.5rem;
+  position: absolute;
+  z-index: 3;
+  min-height: 200px; 
+  float: left;
+}
+
+/* navbar fedora-bootstrap overrides to make it vertical */
+
+.navbar-nav .nav-item {
+    float: none;
+}
+
+.navbar-nav .nav-item + .nav-item, .navbar-nav .nav-link + .nav-link {
+    box-shadow: none;
+    margin-left: 0px !important;
+}
+
+/* end fedora-bootstrap nav overrides */
+
 .media-object {
     max-width: 92px;
     max-height: 92px;
diff --git a/hubs/templates/hubs.html b/hubs/templates/hubs.html
index c7106fc..f384e37 100644
--- a/hubs/templates/hubs.html
+++ b/hubs/templates/hubs.html
@@ -78,8 +78,8 @@
       </div>
   {% endif %}
 
-
   <div class="row">
+	  
     <div class="col-md-{{ hub.left_width }}">
       <!--
         First, before the proper widgets.. a cobweb built-in widget.
diff --git a/hubs/templates/master.html b/hubs/templates/master.html
index 4fd92e5..22eb10b 100644
--- a/hubs/templates/master.html
+++ b/hubs/templates/master.html
@@ -54,16 +54,18 @@
 </div>
 <div class="bodycontent">
 
-  <nav class="navbar navbar-light navbar-underline p-t-0 p-b-0">
+  
+<div class="col-md-2">
+	  <nav class="navbar navbar-light p-t-2 p-b-0">
         <button type="button" class="navbar-toggler hidden-sm-up"
             data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
           <span class="sr-only">Toggle navigation</span>
           <span class="oi" data-glyph="menu"></span>
         </button>
 
-      <!-- Collect the nav links, forms, and other content for toggling -->
-      <div class="collapse navbar-toggleable-xs" id="bs-example-navbar-collapse-1">
-        <ul class="nav navbar-nav nav-underline">
+<!-- Collect the nav links, forms, and other content for toggling -->
+  <div class="collapse navbar-toggleable-xs" id="bs-example-navbar-collapse-1">
+        <ul class="nav navbar-nav">
           {% if g.auth.logged_in %}
           <li class="p-x-1 nav-item {% if request.path.endswith('/' + g.auth.user.username + '/') %}active{% endif %}">
             <a class="nav-link" href="/{{g.auth.user.username}}">me</a></li>
@@ -72,11 +74,15 @@
           <a class="nav-link" href="/{{hub.name}}">{{hub.name}}</a></li>
           {% endfor %}
           <!-- At the end of the list, tack on a link to all groups -->
-          <li class="p-x-1 nav-item"><a class="nav-link" href="/groups">all</a></li>
+
+ <li class="p-x-1 nav-item"><a class="nav-link" href="/groups">all</a></li>
           {% endif %}
         </ul>
-      </div><!-- /.navbar-collapse -->
+  </div><!-- /.navbar-collapse -->
   </nav>
+  
+</div>  
+  
 {% block content %}{% endblock %}
 
 </div> <!--end bodycontent-->

From 42b376a1ffc3738641ac3022917c2f62817a8de4 Mon Sep 17 00:00:00 2001
From: Máirín Duffy <duffy@redhat.com>
Date: Jul 26 2016 20:50:07 +0000
Subject: [PATCH 4/7] some padding / alignment adjustments so things line up with vertical nav


---

diff --git a/hubs/static/css/style.css b/hubs/static/css/style.css
index 09d6be9..f8636d6 100644
--- a/hubs/static/css/style.css
+++ b/hubs/static/css/style.css
@@ -77,17 +77,23 @@
       right: 0;
       z-index: 2;
     }*/
+    
+    /* line up header with cards below */
+    header .container {
+	padding-left: 1.75rem !important;
+	}
 
     header img.avatar {
         width: 70px;
         float: left;
-        margin: 0 15px;
+        margin-right: 15px;
         display: inline;
         border: 5px solid #fff;
     }
 
     header h2 {
         font-weight: 500;
+        padding-top: .5rem;
     }
 
     header a, header a:hover, .header a:focus {
@@ -98,7 +104,7 @@
       margin: 5px 5px 0 0;
     }
     .row {
-      padding: 5px;
+      padding-top: 5px;
       margin: auto 0px;
     }
     .padded {
@@ -133,6 +139,7 @@
       padding: 5px;
       /* TODO -- lots more nice styling here... */
     }
+
     .panel {
       visibility: hidden;
       max-height: 0px;
@@ -381,3 +388,19 @@ font-size: 32pt;
   height: 2em;
   width: 2em;
 }
+
+
+/** fedora bootstrap overrides **/
+
+/** tightening up card headers - they are too fat imho **/
+.card-header {
+  padding: 0.3rem 0.5rem;
+}
+
+
+/** too much padding over the user's subheader, was attached to .m-b-1 with 
+ * !important so difficult to override **/
+
+header h5.m-b-1 {
+  margin-top: 0.5rem!important;
+}
diff --git a/hubs/templates/hubs.html b/hubs/templates/hubs.html
index f384e37..99418cb 100644
--- a/hubs/templates/hubs.html
+++ b/hubs/templates/hubs.html
@@ -5,16 +5,55 @@
 
   <header class="p-t-2">
     <div class="container">
-      {% if hub.user_hub %}
-	    <img src="{{ hub.avatar }}" class="avatar" />
-		<h2 class="user m-b-0">{{ hub.name }}</h2>
-		<h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
-	    <div class="clearfix"></div>
-      {% else %}
-      <h2 class="team">{{ hub.name }}</h2>
-      <h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
-	  {% endif %}
+		
+	  <!-- Left side of header -->
+	  <div class="col-md-8">
+        {% if hub.user_hub %}
+	      <img src="{{ hub.avatar }}" class="avatar" />
+		  <h2 class="user m-b-0">{{ hub.name }}</h2>
+		  <h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
+	      <div class="clearfix"></div>
+        {% else %}
+        <h2 class="team">{{ hub.name }}</h2>
+        <h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
+	    {% endif %}
+	  </div>
+
+      <!-- right side of header -->
+      <div class="col-md-4 header-right">
+{% if g.auth.logged_in and hub.is_admin(g.auth.user) %}
+        {% if not edit %}
+          <div class="dropdown edit pull-xs-right showpointer">
+            <span class="dropdown-toggle edit-this-page" type="button"
+                  id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
+                  aria-expanded="true">
+              <span class="oi" data-glyph="pencil"></span> edit this page
+            </span>
+            <div class="dropdown-menu" aria-labelledby="dropdownMenu2">
+              <a class="dropdown-item" href="#">Customize Header</a>
+              <div class="dropdown-divider"></div>
+              <a class="dropdown-item"
+                  href="{{ url_for('hub_edit', name=hub.name) }}">
+                Configure Hub
+              </a>
+              {% if not hub.user_hub %}
+              <div class="dropdown-divider"></div>
+              <a class="dropdown-item" href="#">Manage Members</a>
+              <div class="dropdown-divider"></div>
+              <a class="dropdown-item" href="#">Archive Hub</a>
+              {% endif %}
+            </div>
+          </div>
+        {% else %}
+          <div id="save_edits_btn" class="pull-xs-right">
+            <span class="oi" data-glyph="data-transfer-download"></span>
+            Save changes
+          </div>
+        {% endif %}
+  {% endif %}
+  </div>
   	</div>
+
   </header>
 
 
@@ -45,39 +84,7 @@
 {%- endwith -%}
 
 <div class="container">
-  {% if g.auth.logged_in and hub.is_admin(g.auth.user) %}
-      <div class="row">
-        {% if not edit %}
-          <div class="dropdown edit pull-xs-right showpointer">
-            <span class="dropdown-toggle edit-this-page" type="button"
-                  id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
-                  aria-expanded="true">
-              <span class="oi" data-glyph="pencil"></span> edit this page
-            </span>
-            <div class="dropdown-menu" aria-labelledby="dropdownMenu2">
-              <a class="dropdown-item" href="#">Customize Header</a>
-              <div class="dropdown-divider"></div>
-              <a class="dropdown-item"
-                  href="{{ url_for('hub_edit', name=hub.name) }}">
-                Configure Hub
-              </a>
-              {% if not hub.user_hub %}
-              <div class="dropdown-divider"></div>
-              <a class="dropdown-item" href="#">Manage Members</a>
-              <div class="dropdown-divider"></div>
-              <a class="dropdown-item" href="#">Archive Hub</a>
-              {% endif %}
-            </div>
-          </div>
-        {% else %}
-          <div id="save_edits_btn" class="pull-xs-right">
-            <span class="oi" data-glyph="data-transfer-download"></span>
-            Save changes
-          </div>
-        {% endif %}
-      </div>
-  {% endif %}
-
+  
   <div class="row">
 	  
     <div class="col-md-{{ hub.left_width }}">

From cce099478f812c08375f6d0a3f96a4b5c776702e Mon Sep 17 00:00:00 2001
From: Máirín Duffy <duffy@redhat.com>
Date: Jul 26 2016 20:50:07 +0000
Subject: [PATCH 5/7] fixing up groups.html to not be broken-looking + to be compatible with vert bookmarks bar


---

diff --git a/hubs/static/css/style.css b/hubs/static/css/style.css
index f8636d6..a588609 100644
--- a/hubs/static/css/style.css
+++ b/hubs/static/css/style.css
@@ -400,7 +400,6 @@ font-size: 32pt;
 
 /** too much padding over the user's subheader, was attached to .m-b-1 with 
  * !important so difficult to override **/
-
 header h5.m-b-1 {
   margin-top: 0.5rem!important;
 }
diff --git a/hubs/templates/groups.html b/hubs/templates/groups.html
index 0d3bc20..f13070c 100644
--- a/hubs/templates/groups.html
+++ b/hubs/templates/groups.html
@@ -3,12 +3,16 @@
 {% block title %}Groups{% endblock %}
 {% block content %}
 
-<div class="header">
-  <div class="img-wrap">
-    <img src="#" />
-  </div>
-  <h3 class="team">Groups</h3>
-</div>
+<header class="p-t-2">
+	<div class="container">
+    <div class="col-md-8">
+      <h2 class="team m-b-0">Groups</h2>
+  		<h5 class="m-t-1 m-b-1">Summary of available team hubs</h5>
+    </div>
+    <div class="col-md-4 header-right">
+		</div>
+</header>
+
 <div class="container">
   <div class="row">
   </div>

From 33188da39f06bf5ff7f8825f64d88a1b7e7fb0b5 Mon Sep 17 00:00:00 2001
From: Máirín Duffy <duffy@redhat.com>
Date: Jul 26 2016 20:51:03 +0000
Subject: [PATCH 6/7] making body background white


---

diff --git a/hubs/static/css/style.css b/hubs/static/css/style.css
index a588609..30e246b 100644
--- a/hubs/static/css/style.css
+++ b/hubs/static/css/style.css
@@ -1,7 +1,7 @@
 @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic);
 
    body {
-      background-color: #d1d3d4;
+      background-color: #fff;
     }
 
     /*.super-header {

From bac5cbd6789d1e218752e302695ea6137b27b126 Mon Sep 17 00:00:00 2001
From: Máirín Duffy <duffy@redhat.com>
Date: Jul 26 2016 20:51:08 +0000
Subject: [PATCH 7/7] minor indentation fix


---

diff --git a/hubs/templates/groups.html b/hubs/templates/groups.html
index f13070c..4040938 100644
--- a/hubs/templates/groups.html
+++ b/hubs/templates/groups.html
@@ -7,10 +7,10 @@
 	<div class="container">
     <div class="col-md-8">
       <h2 class="team m-b-0">Groups</h2>
-  		<h5 class="m-t-1 m-b-1">Summary of available team hubs</h5>
+      <h5 class="m-t-1 m-b-1">Summary of available team hubs</h5>
     </div>
     <div class="col-md-4 header-right">
-		</div>
+    </div>
 </header>
 
 <div class="container">
diff --git a/hubs/templates/hubs.html b/hubs/templates/hubs.html
index 99418cb..f52d617 100644
--- a/hubs/templates/hubs.html
+++ b/hubs/templates/hubs.html
@@ -5,23 +5,23 @@
 
   <header class="p-t-2">
     <div class="container">
-		
-	  <!-- Left side of header -->
-	  <div class="col-md-8">
+
+    <!-- Left side of header -->
+    <div class="col-md-8">
         {% if hub.user_hub %}
-	      <img src="{{ hub.avatar }}" class="avatar" />
-		  <h2 class="user m-b-0">{{ hub.name }}</h2>
-		  <h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
-	      <div class="clearfix"></div>
+        <img src="{{ hub.avatar }}" class="avatar" />
+      <h2 class="user m-b-0">{{ hub.name }}</h2>
+      <h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
+        <div class="clearfix"></div>
         {% else %}
         <h2 class="team">{{ hub.name }}</h2>
         <h5 class="m-t-1 m-b-1">{{ hub.summary }}</h5>
-	    {% endif %}
-	  </div>
+      {% endif %}
+    </div>
 
       <!-- right side of header -->
       <div class="col-md-4 header-right">
-{% if g.auth.logged_in and hub.is_admin(g.auth.user) %}
+      {% if g.auth.logged_in and hub.is_admin(g.auth.user) %}
         {% if not edit %}
           <div class="dropdown edit pull-xs-right showpointer">
             <span class="dropdown-toggle edit-this-page" type="button"
@@ -50,9 +50,9 @@
             Save changes
           </div>
         {% endif %}
-  {% endif %}
-  </div>
-  	</div>
+      {% endif %}
+      </div>
+    </div>
 
   </header>
 
@@ -86,7 +86,7 @@
 <div class="container">
   
   <div class="row">
-	  
+ 
     <div class="col-md-{{ hub.left_width }}">
       <!--
         First, before the proper widgets.. a cobweb built-in widget.
diff --git a/hubs/templates/master.html b/hubs/templates/master.html
index 22eb10b..f093304 100644
--- a/hubs/templates/master.html
+++ b/hubs/templates/master.html
@@ -56,7 +56,7 @@
 
   
 <div class="col-md-2">
-	  <nav class="navbar navbar-light p-t-2 p-b-0">
+    <nav class="navbar navbar-light p-t-2 p-b-0">
         <button type="button" class="navbar-toggler hidden-sm-up"
             data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
           <span class="sr-only">Toggle navigation</span>