Changeset 10224

Timestamp:

10/09/2015 09:50:54 AM (11 years ago)

Author:

hnla

Message:

Update Twentythirteen style - Group send invites screen.

• Reduce friends ul checkbox padding.
• Re-factor left & main column widths, allow more room for left list wide screens.
• Add refined columnar layout for medium breakpoints, allow invite list & selected friends to flow as single column stacking.

See #6533 Props @mercime

Location:

trunk/src/bp-templates/bp-legacy/css

Files:

• twentythirteen-rtl.css (modified) (2 diffs)
• twentythirteen.css (modified) (2 diffs)
• twentythirteen.scss (modified) (2 diffs)

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

@@ -42 +42 @@
                         6.2.1.1 - Management settings screens
                         6.2.1.2 - Group members list
+                        6.2.1.3 - Group send Invites
                 6.2.2 - item-body: User Accounts
                         6.2.2.1 - classes, pag, filters
@@ -1163 +1164 @@
         .groups.group-members #subnav li #search-members-form label input[type="text"] {
                 width: 100%;
+        }
+}
+
+/**
+*-----------------------------------------
+* @subsection 6.2.1.3 - Group send Invites
+*-----------------------------------------
+*/
+#buddypress div.invite .left-menu {
+        float: none;
+}
+
+@media screen and (min-width: 46.25em) {
+        #buddypress div.invite .left-menu {
+                float: right;
+        }
+}
+
+#buddypress div.invite #invite-list {
+        border: 1px solid #eaeaea;
+        height: auto;
+        min-height: 3.125em;
+        padding: 0 0.3em 0.5em;
+        width: auto;
+}
+
+@media screen and (min-width: 46.25em) {
+        #buddypress div.invite #invite-list {
+                width: 220px;
+        }
+}
+
+#buddypress div.invite #invite-list ul {
+        padding-right: 0;
+}
+
+#buddypress div.invite .main-column {
+        margin-right: 0;
+}
+
+@media screen and (min-width: 46.25em) {
+        #buddypress div.invite .main-column {
+                margin-right: 235px;
         }
 }

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

@@ -42 +42 @@
                         6.2.1.1 - Management settings screens
                         6.2.1.2 - Group members list
+                        6.2.1.3 - Group send Invites
                 6.2.2 - item-body: User Accounts
                         6.2.2.1 - classes, pag, filters
@@ -1163 +1164 @@
         .groups.group-members #subnav li #search-members-form label input[type="text"] {
                 width: 100%;
+        }
+}
+
+/**
+*-----------------------------------------
+* @subsection 6.2.1.3 - Group send Invites
+*-----------------------------------------
+*/
+#buddypress div.invite .left-menu {
+        float: none;
+}
+
+@media screen and (min-width: 46.25em) {
+        #buddypress div.invite .left-menu {
+                float: left;
+        }
+}
+
+#buddypress div.invite #invite-list {
+        border: 1px solid #eaeaea;
+        height: auto;
+        min-height: 3.125em;
+        padding: 0 0.3em 0.5em;
+        width: auto;
+}
+
+@media screen and (min-width: 46.25em) {
+        #buddypress div.invite #invite-list {
+                width: 220px;
+        }
+}
+
+#buddypress div.invite #invite-list ul {
+        padding-left: 0;
+}
+
+#buddypress div.invite .main-column {
+        margin-left: 0;
+}
+
+@media screen and (min-width: 46.25em) {
+        #buddypress div.invite .main-column {
+                margin-left: 235px;
         }
 }

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

@@ -196 +196 @@
                         6.2.1.1 - Management settings screens
                         6.2.1.2 - Group members list
+                        6.2.1.3 - Group send Invites
                 6.2.2 - item-body: User Accounts
                         6.2.2.1 - classes, pag, filters
@@ -1523 +1524 @@
 
 /**
+*-----------------------------------------
+* @subsection 6.2.1.3 - Group send Invites
+*-----------------------------------------
+*/
+#buddypress {
+
+        div.invite {
+                .left-menu {
+                        float: none;
+                        @media screen and (min-width: 46.25em) {
+                                float: left;
+                        }
+                }
+
+                #invite-list {
+                        border: 1px solid $border-light;
+                        height: auto;
+                        min-height: 3.125em;
+                        padding: 0 0.3em 0.5em;
+                        width: auto;
+                        @media screen and (min-width: 46.25em) {
+                                width: 220px;
+                        }
+
+                        ul {
+                                padding-left: 0;
+                        }
+                }
+
+                .main-column {
+                        margin-left: 0;
+                        @media screen and (min-width: 46.25em) {
+                                margin-left: 235px;
+                        }
+                }
+
+        } // close div.invite
+}
+
+/**
 *-----------------------------------------------------
 * @subsection 6.2.2 - Item Body User Accounts