Changeset 10216 for trunk/src/bp-templates/bp-legacy/css/twentythirteen.scss

Timestamp:

10/08/2015 11:23:07 AM (9 years ago)

Author:

hnla

Message:

Commit updates for Twentythirteen companion styles.
Update addresses user account and single group headers, styling updates for cover image header and default header instances at various screen sizes.
See #6533

File:

• trunk/src/bp-templates/bp-legacy/css/twentythirteen.scss (modified) (9 diffs)

trunk/src/bp-templates/bp-legacy/css/twentythirteen.scss

@@ -134 +134 @@
 // Variables: color definitions
 $body-text:          #141412;
+$light-body:         lighten(#141412, 45%);
 $content-background: #fff;
-$off-white:          lighten(#f9f8ee, 0.7);
+$off-white:          lighten(#f9f8ee, 10%);
 $cream-background:   #f7f5e7;
 $light-background:   #f7f7f7;
@@ -367 +368 @@
 // to sit alongside the vert menu
 // As 2013 has an inner sidebar which if active can narrow screen too far
-// for a columner nav we'll only use these rules if no sidebar.
+// for a columner nav we'll only use these rules if no sidebar 'body:not(.sidebar)'.
 
 @media screen and (min-width: 55em) {
@@ -1067 +1068 @@
 .bp-user,
 .single-item.groups {
+
+    .entry-header {
+        margin-bottom: 0;
+
+        .entry-title {
+            color: $light-body;
+            @include font-size(32);
+            margin-bottom: $spacing-val-sm;
+            text-align: center;
+            @media screen and (min-width: 46.25em) {
+                text-align: left;
+            }
+        }
+    }
+
     #buddypress {
         #item-header-content {
@@ -1200 +1216 @@
 
                 h3 {
-                    //background: $dark-background;
-                    //color: $content-background;
                     @include font-size(14);
 
@@ -1228 +1242 @@
 
                 div#item-actions {
+                    clear: both;
                     float: right;
                     width: 28%;
+
+                    h3 {
+                        @include font-size(14);
+                    }
                 }
 
             } // close @media
+
+            #item-header-cover-image {
+    //          #item-header-content {
+    //          }
+
+                #item-actions {
+                    border: 0;
+                    @media screen and (max-width: 46.25em) {
+                        clear: both !important;
+                    }
+                    float: none;
+                    width: auto;
+                }
+
+                @media screen and (min-width: 46.25em) {
+                    #item-header-content {
+                        padding-left: $spacing-val-sm;
+
+                        #item-buttons {
+                            margin-top: 0;
+                        }
+                    }
+
+                    #item-actions {
+                        border-left: 1px solid $border-light;
+                        clear: none;
+                        float: right;
+                        margin-top: 230px !important;
+                        padding-top: 0 !important;
+                        width: 20%;
+                    }
+                }
+            }
 
         } // close #item-header
@@ -1247 +1299 @@
 
 .bp-user {
+
     #buddypress {
         #item-header {
@@ -1263 +1316 @@
             }
 
+            #item-header-content {
+                .user-nicename,
+                span.activity {
+                    display: block;
+                    text-align: center;
+                }
+            }
+
             @media screen and (min-width: 46.25em) {
                 #item-header-avatar {
                     float: left;
-                    width: 20%;
+                    width: auto;
 
                     a {
@@ -1274 +1335 @@
 
                 #item-header-content {
-                    float: right;
-                    margin-right: 5%;
-                    width: 69%;
+                    float: none;
+                    overflow: hidden;
+
+                    .user-nicename,
+                    span.activity {
+                        text-align: left;
+                    }
+
+                    #item-meta {
+                        margin-top: 0;
+                    }
                 }
 
@@ -1282 +1351 @@
 
         } // close #item-header
+
+        #item-header-cover-image {
+
+            #item-header-content {
+                @media screen and (min-width: 46.25em) {
+                    .user-nicename {
+                        margin-bottom: $spacing-val-md;
+                    }
+
+                    #item-buttons {
+                        margin: 0;
+                    }
+                }
+            }
+        }
 
     } // close #buddypress