Skip to:
Content

BuddyPress.org

Changeset 9864


Ignore:
Timestamp:
05/12/2015 03:23:45 PM (11 years ago)
Author:
hnla
Message:

Updates to twentyfourteen companion styles

  • Update message-box mixin, use default text-color based on background selected if no arg passed for color, remove set color args.
  • Add override clear none to counter themes heading clearing.
  • Update group members list display general & mobile.
  • Update users/groups headers, global styles, correct messages rendering in header area.
  • Update group-member-search for style and mobile rendering.

See #6338

Location:
trunk/src/bp-templates/bp-legacy/css
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/bp-templates/bp-legacy/css/twentyfourteen-rtl.css

    r9861 r9864  
    5353*-------------------------------------------------------------------------------
    5454*/
     55#buddypress h1, #buddypress h2, #buddypress h3, #buddypress h4, #buddypress h5, #buddypress h6 {
     56  clear: none; }
     57
    5558.buddypress .site-content {
    5659  padding-top: 4%; }
    … …  
    209212    float: none;
    210213    width: 100%; }
     214  #buddypress ul.item-list li .item {
     215    margin-right: 0; }
    211216  #buddypress ul.item-list li div.item-desc {
    212217    margin-right: 0;
    213218    width: auto; }
    214219  #buddypress ul.item-list li div.action {
     220    clear: both;
     221    float: none;
     222    margin: 0;
    215223    position: relative;
    216     text-align: right;
    217     top: 0; }
     224    text-align: right; }
    218225    #buddypress ul.item-list li div.action div {
    219226      margin: 0 0 10px; }
    … …  
    229236    #buddypress ul.item-list li .item {
    230237      float: left;
     238      margin-right: 5%;
    231239      width: 80%; }
    232     #buddypress ul.item-list li .activity-meta, #buddypress ul.item-list li .action {
     240    #buddypress ul.item-list li .activity-meta {
    233241      clear: both; }
    234       #buddypress ul.item-list li .activity-meta a, #buddypress ul.item-list li .activity-meta div, #buddypress ul.item-list li .action a, #buddypress ul.item-list li .action div {
     242      #buddypress ul.item-list li .activity-meta a, #buddypress ul.item-list li .activity-meta div {
    235243        display: inline-block;
    236244        margin: 5px 0 0 5px; } }
    … …  
    238246    #buddypress ul.item-list li .item {
    239247      float: right;
    240       margin-right: 5%;
    241248      width: 60%; }
    242249      #buddypress ul.item-list li .item div.item-desc {
    243250        margin: 0;
    244251        width: auto; }
    245     #buddypress ul.item-list li .action {
     252    #buddypress ul.item-list li div.action {
    246253      clear: none;
    247254      float: left;
     255      top: 0;
    248256      width: 25%; }
    249       #buddypress ul.item-list li .action div {
     257      #buddypress ul.item-list li div.action div {
    250258        display: block; }
    251         #buddypress ul.item-list li .action div a {
     259        #buddypress ul.item-list li div.action div a {
    252260          -webkit-box-sizing: border-box;
    253261          -moz-box-sizing: border-box;
    … …  
    255263          display: block;
    256264          width: 100%; }
    257       #buddypress ul.item-list li .action .meta {
     265      #buddypress ul.item-list li div.action .meta {
    258266        text-align: center; } }
    259267  #buddypress ul.item-list li .meta, #buddypress ul.item-list li .item-meta .activity {
    … …  
    424432*------------------------------------------------------------
    425433*/
     434#buddypress div#item-header {
     435  padding-bottom: 10px; }
     436  #buddypress div#item-header img.avatar {
     437    margin: 0 0 10px 20px; }
     438  #buddypress div#item-header #message {
     439    clear: both;
     440    margin-bottom: 5px;
     441    padding-top: 20px; }
     442    #buddypress div#item-header #message p {
     443      margin-bottom: 0; }
     444
    426445/**
    427446*-------------------------------------------------
    … …  
    455474.single-item.groups #buddypress #item-header #item-actions {
    456475  float: none;
     476  margin: 0 20px 0 0;
    457477  width: auto; }
    458478  .single-item.groups #buddypress #item-header #item-actions h3 {
    … …  
    478498*-------------------------------------------------
    479499*/
    480 .bp-user #buddypress #item-header {
    481   padding-bottom: 10px; }
     500.bp-user #buddypress #item-header #item-header-avatar {
     501  text-align: center;
     502  width: 100%; }
     503  .bp-user #buddypress #item-header #item-header-avatar img {
     504    float: none; }
     505.bp-user #buddypress #item-header #latest-update {
     506  margin-bottom: 10px; }
     507@media screen and (max-width: 594px) {
     508  .bp-user #buddypress #item-header #item-buttons div.generic-button {
     509    display: inline-block;
     510    float: none;
     511    margin: 0 0 5px 0;
     512    width: 100%; }
     513    .bp-user #buddypress #item-header #item-buttons div.generic-button a {
     514      -webkit-box-sizing: border-box;
     515      -moz-box-sizing: border-box;
     516      box-sizing: border-box;
     517      display: block;
     518      width: 100%; } }
     519@media screen and (min-width: 673px) {
    482520  .bp-user #buddypress #item-header #item-header-avatar {
    483     text-align: center;
    484     width: 100%; }
     521    float: right;
     522    overflow: hidden;
     523    text-align: right;
     524    width: 20%; }
    485525    .bp-user #buddypress #item-header #item-header-avatar img {
    486       float: none; }
    487   .bp-user #buddypress #item-header #latest-update {
    488     margin-bottom: 10px; }
    489   @media screen and (max-width: 594px) {
    490     .bp-user #buddypress #item-header #item-buttons div.generic-button {
    491       display: inline-block;
    492       float: none;
    493       margin: 0 0 5px 0;
    494       width: 100%; }
    495       .bp-user #buddypress #item-header #item-buttons div.generic-button a {
    496         -webkit-box-sizing: border-box;
    497         -moz-box-sizing: border-box;
    498         box-sizing: border-box;
    499         display: block;
    500         width: 100%; } }
    501   @media screen and (min-width: 673px) {
    502     .bp-user #buddypress #item-header #item-header-avatar {
    503       float: right;
    504       overflow: hidden;
    505       text-align: right;
    506       width: 20%; }
    507       .bp-user #buddypress #item-header #item-header-avatar img {
    508         margin: 0; }
    509     .bp-user #buddypress #item-header #item-header-content {
    510       float: left;
    511       width: 78%; }
    512       .bp-user #buddypress #item-header #item-header-content #latest-update {
    513         margin-bottom: 20px; } }
     526      margin: 0; }
     527  .bp-user #buddypress #item-header #item-header-content {
     528    float: left;
     529    width: 78%; }
     530    .bp-user #buddypress #item-header #item-header-content #latest-update {
     531      margin-bottom: 20px; } }
    514532
    515533/**
    … …  
    558576    .groups.manage-members #group-settings-form .item-list li h5 {
    559577      margin: 0; }
     578
     579/**
     580        *------------------------------
     581        * 6.2.1.2 - Group members list
     582        *------------------------------
     583        */
     584#buddypress #members-group-list .item-list h5 {
     585  display: inline-block;
     586  margin: 0; }
     587#buddypress #members-group-list .item-list span.activity {
     588  padding-right: 10px; }
     589
     590#buddypress #item-body #subnav li.groups-members-search:focus, #buddypress #item-body #subnav li.groups-members-search:hover, #buddypress #item-body #subnav li.last:focus, #buddypress #item-body #subnav li.last:hover {
     591  background: none; }
     592
     593.groups.group-members #subnav ul:before, .groups.group-members #subnav ul:after {
     594  content: " ";
     595  display: table; }
     596.groups.group-members #subnav ul:after {
     597  clear: both; }
     598.groups.group-members #subnav ul {
     599  padding: 5px 0; }
     600@media screen and (max-width: 400px) {
     601  .groups.group-members #subnav li {
     602    background: #fff;
     603    padding: 10px 0;
     604    width: 100% !important; } }
     605.groups.group-members #subnav li #search-members-form {
     606  -webkit-box-sizing: border-box;
     607  -moz-box-sizing: border-box;
     608  box-sizing: border-box;
     609  float: right; }
     610  @media screen and (max-width: 400px) {
     611    .groups.group-members #subnav li #search-members-form {
     612      margin: 0;
     613      width: 100%; }
     614      .groups.group-members #subnav li #search-members-form label input[type="text"] {
     615        width: 100%; } }
     616  @media screen and (min-width: 783px) {
     617    .groups.group-members #subnav li #search-members-form {
     618      margin-right: 3px; } }
    560619
    561620/**
    … …  
    691750    border: 0; }
    692751
    693 #buddypress div.dir-search, #buddypress div.message-search {
     752#buddypress div.dir-search, #buddypress div.message-search, #buddypress li.groups-members-search {
    694753  clear: both;
    695754  float: none;
    696755  margin: 10px 0; }
    697   #buddypress div.dir-search form, #buddypress div.message-search form {
     756  #buddypress div.dir-search form, #buddypress div.message-search form, #buddypress li.groups-members-search form {
    698757    border: 1px solid #ccc;
    699758    overflow: hidden; }
    700     #buddypress div.dir-search form label, #buddypress div.message-search form label {
     759    #buddypress div.dir-search form label, #buddypress div.message-search form label, #buddypress li.groups-members-search form label {
    701760      float: right;
    702761      width: 80%; }
    703     #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'] {
     762    #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'], #buddypress li.groups-members-search form input[type='text'] {
    704763      float: right;
    705764      margin: 0;
    706765      width: 80%; }
    707     #buddypress div.dir-search form input[type='text'], #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='text'], #buddypress div.message-search form input[type='submit'] {
     766    #buddypress div.dir-search form input[type='text'], #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='text'], #buddypress div.message-search form input[type='submit'], #buddypress li.groups-members-search form input[type='text'], #buddypress li.groups-members-search form input[type='submit'] {
    708767      border: 0;
    709768      font-size: 14px;
    710769      font-size: 0.875rem;
    711770      line-height: inherit; }
    712     #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'] {
     771    #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'], #buddypress li.groups-members-search form input[type='text'] {
    713772      border-left: 1px solid #ccc;
    714773      padding: 0.2em 0.2em 0.2em 0; }
    715     #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='submit'] {
     774    #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='submit'], #buddypress li.groups-members-search form input[type='submit'] {
    716775      float: left;
    717776      font-weight: normal;
    … …  
    727786      width: auto; }
    728787  #buddypress div.message-search {
    729     margin: 3px 0 0; } }
     788    margin: 3px 0 0; }
     789  #buddypress li.groups-members-search form label, #buddypress li.groups-members-search form input[type='submit'], #buddypress li.groups-members-search form input[type='text'] {
     790    width: auto; } }
    730791
    731792/**
    … …  
    747808  background: #c6e4ee;
    748809  border: 1px solid #78bed6;
    749   color: #fff; }
     810  color: #1e5264; }
    750811#buddypress div#message.updated p {
    751812  background: #dee6b2;
    752813  border: 1px solid #becc66;
    753   color: #fff; }
     814  color: #454d19; }
    754815
    755816.delete-group #buddypress div#message.info p {
    756817  background: #db7e7e;
    757818  border: 1px solid #be3535;
    758   color: #fff; }
     819  color: #1f0808; }
    759820
    760821/**

  • trunk/src/bp-templates/bp-legacy/css/twentyfourteen.css

    r9861 r9864  
    5353*-------------------------------------------------------------------------------
    5454*/
     55#buddypress h1, #buddypress h2, #buddypress h3, #buddypress h4, #buddypress h5, #buddypress h6 {
     56  clear: none; }
     57
    5558.buddypress .site-content {
    5659  padding-top: 4%; }
    … …  
    209212    float: none;
    210213    width: 100%; }
     214  #buddypress ul.item-list li .item {
     215    margin-left: 0; }
    211216  #buddypress ul.item-list li div.item-desc {
    212217    margin-left: 0;
    213218    width: auto; }
    214219  #buddypress ul.item-list li div.action {
     220    clear: both;
     221    float: none;
     222    margin: 0;
    215223    position: relative;
    216     text-align: left;
    217     top: 0; }
     224    text-align: left; }
    218225    #buddypress ul.item-list li div.action div {
    219226      margin: 0 0 10px; }
    … …  
    229236    #buddypress ul.item-list li .item {
    230237      float: right;
     238      margin-left: 5%;
    231239      width: 80%; }
    232     #buddypress ul.item-list li .activity-meta, #buddypress ul.item-list li .action {
     240    #buddypress ul.item-list li .activity-meta {
    233241      clear: both; }
    234       #buddypress ul.item-list li .activity-meta a, #buddypress ul.item-list li .activity-meta div, #buddypress ul.item-list li .action a, #buddypress ul.item-list li .action div {
     242      #buddypress ul.item-list li .activity-meta a, #buddypress ul.item-list li .activity-meta div {
    235243        display: inline-block;
    236244        margin: 5px 5px 0 0; } }
    … …  
    238246    #buddypress ul.item-list li .item {
    239247      float: left;
    240       margin-left: 5%;
    241248      width: 60%; }
    242249      #buddypress ul.item-list li .item div.item-desc {
    243250        margin: 0;
    244251        width: auto; }
    245     #buddypress ul.item-list li .action {
     252    #buddypress ul.item-list li div.action {
    246253      clear: none;
    247254      float: right;
     255      top: 0;
    248256      width: 25%; }
    249       #buddypress ul.item-list li .action div {
     257      #buddypress ul.item-list li div.action div {
    250258        display: block; }
    251         #buddypress ul.item-list li .action div a {
     259        #buddypress ul.item-list li div.action div a {
    252260          -webkit-box-sizing: border-box;
    253261          -moz-box-sizing: border-box;
    … …  
    255263          display: block;
    256264          width: 100%; }
    257       #buddypress ul.item-list li .action .meta {
     265      #buddypress ul.item-list li div.action .meta {
    258266        text-align: center; } }
    259267  #buddypress ul.item-list li .meta, #buddypress ul.item-list li .item-meta .activity {
    … …  
    424432*------------------------------------------------------------
    425433*/
     434#buddypress div#item-header {
     435  padding-bottom: 10px; }
     436  #buddypress div#item-header img.avatar {
     437    margin: 0 20px 10px 0; }
     438  #buddypress div#item-header #message {
     439    clear: both;
     440    margin-bottom: 5px;
     441    padding-top: 20px; }
     442    #buddypress div#item-header #message p {
     443      margin-bottom: 0; }
     444
    426445/**
    427446*-------------------------------------------------
    … …  
    455474.single-item.groups #buddypress #item-header #item-actions {
    456475  float: none;
     476  margin: 0 0 0 20px;
    457477  width: auto; }
    458478  .single-item.groups #buddypress #item-header #item-actions h3 {
    … …  
    478498*-------------------------------------------------
    479499*/
    480 .bp-user #buddypress #item-header {
    481   padding-bottom: 10px; }
     500.bp-user #buddypress #item-header #item-header-avatar {
     501  text-align: center;
     502  width: 100%; }
     503  .bp-user #buddypress #item-header #item-header-avatar img {
     504    float: none; }
     505.bp-user #buddypress #item-header #latest-update {
     506  margin-bottom: 10px; }
     507@media screen and (max-width: 594px) {
     508  .bp-user #buddypress #item-header #item-buttons div.generic-button {
     509    display: inline-block;
     510    float: none;
     511    margin: 0 0 5px 0;
     512    width: 100%; }
     513    .bp-user #buddypress #item-header #item-buttons div.generic-button a {
     514      -webkit-box-sizing: border-box;
     515      -moz-box-sizing: border-box;
     516      box-sizing: border-box;
     517      display: block;
     518      width: 100%; } }
     519@media screen and (min-width: 673px) {
    482520  .bp-user #buddypress #item-header #item-header-avatar {
    483     text-align: center;
    484     width: 100%; }
     521    float: left;
     522    overflow: hidden;
     523    text-align: left;
     524    width: 20%; }
    485525    .bp-user #buddypress #item-header #item-header-avatar img {
    486       float: none; }
    487   .bp-user #buddypress #item-header #latest-update {
    488     margin-bottom: 10px; }
    489   @media screen and (max-width: 594px) {
    490     .bp-user #buddypress #item-header #item-buttons div.generic-button {
    491       display: inline-block;
    492       float: none;
    493       margin: 0 0 5px 0;
    494       width: 100%; }
    495       .bp-user #buddypress #item-header #item-buttons div.generic-button a {
    496         -webkit-box-sizing: border-box;
    497         -moz-box-sizing: border-box;
    498         box-sizing: border-box;
    499         display: block;
    500         width: 100%; } }
    501   @media screen and (min-width: 673px) {
    502     .bp-user #buddypress #item-header #item-header-avatar {
    503       float: left;
    504       overflow: hidden;
    505       text-align: left;
    506       width: 20%; }
    507       .bp-user #buddypress #item-header #item-header-avatar img {
    508         margin: 0; }
    509     .bp-user #buddypress #item-header #item-header-content {
    510       float: right;
    511       width: 78%; }
    512       .bp-user #buddypress #item-header #item-header-content #latest-update {
    513         margin-bottom: 20px; } }
     526      margin: 0; }
     527  .bp-user #buddypress #item-header #item-header-content {
     528    float: right;
     529    width: 78%; }
     530    .bp-user #buddypress #item-header #item-header-content #latest-update {
     531      margin-bottom: 20px; } }
    514532
    515533/**
    … …  
    558576    .groups.manage-members #group-settings-form .item-list li h5 {
    559577      margin: 0; }
     578
     579/**
     580        *------------------------------
     581        * 6.2.1.2 - Group members list
     582        *------------------------------
     583        */
     584#buddypress #members-group-list .item-list h5 {
     585  display: inline-block;
     586  margin: 0; }
     587#buddypress #members-group-list .item-list span.activity {
     588  padding-left: 10px; }
     589
     590#buddypress #item-body #subnav li.groups-members-search:focus, #buddypress #item-body #subnav li.groups-members-search:hover, #buddypress #item-body #subnav li.last:focus, #buddypress #item-body #subnav li.last:hover {
     591  background: none; }
     592
     593.groups.group-members #subnav ul:before, .groups.group-members #subnav ul:after {
     594  content: " ";
     595  display: table; }
     596.groups.group-members #subnav ul:after {
     597  clear: both; }
     598.groups.group-members #subnav ul {
     599  padding: 5px 0; }
     600@media screen and (max-width: 400px) {
     601  .groups.group-members #subnav li {
     602    background: #fff;
     603    padding: 10px 0;
     604    width: 100% !important; } }
     605.groups.group-members #subnav li #search-members-form {
     606  -webkit-box-sizing: border-box;
     607  -moz-box-sizing: border-box;
     608  box-sizing: border-box;
     609  float: left; }
     610  @media screen and (max-width: 400px) {
     611    .groups.group-members #subnav li #search-members-form {
     612      margin: 0;
     613      width: 100%; }
     614      .groups.group-members #subnav li #search-members-form label input[type="text"] {
     615        width: 100%; } }
     616  @media screen and (min-width: 783px) {
     617    .groups.group-members #subnav li #search-members-form {
     618      margin-left: 3px; } }
    560619
    561620/**
    … …  
    691750    border: 0; }
    692751
    693 #buddypress div.dir-search, #buddypress div.message-search {
     752#buddypress div.dir-search, #buddypress div.message-search, #buddypress li.groups-members-search {
    694753  clear: both;
    695754  float: none;
    696755  margin: 10px 0; }
    697   #buddypress div.dir-search form, #buddypress div.message-search form {
     756  #buddypress div.dir-search form, #buddypress div.message-search form, #buddypress li.groups-members-search form {
    698757    border: 1px solid #ccc;
    699758    overflow: hidden; }
    700     #buddypress div.dir-search form label, #buddypress div.message-search form label {
     759    #buddypress div.dir-search form label, #buddypress div.message-search form label, #buddypress li.groups-members-search form label {
    701760      float: left;
    702761      width: 80%; }
    703     #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'] {
     762    #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'], #buddypress li.groups-members-search form input[type='text'] {
    704763      float: left;
    705764      margin: 0;
    706765      width: 80%; }
    707     #buddypress div.dir-search form input[type='text'], #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='text'], #buddypress div.message-search form input[type='submit'] {
     766    #buddypress div.dir-search form input[type='text'], #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='text'], #buddypress div.message-search form input[type='submit'], #buddypress li.groups-members-search form input[type='text'], #buddypress li.groups-members-search form input[type='submit'] {
    708767      border: 0;
    709768      font-size: 14px;
    710769      font-size: 0.875rem;
    711770      line-height: inherit; }
    712     #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'] {
     771    #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'], #buddypress li.groups-members-search form input[type='text'] {
    713772      border-right: 1px solid #ccc;
    714773      padding: 0.2em 0 0.2em 0.2em; }
    715     #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='submit'] {
     774    #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='submit'], #buddypress li.groups-members-search form input[type='submit'] {
    716775      float: right;
    717776      font-weight: normal;
    … …  
    727786      width: auto; }
    728787  #buddypress div.message-search {
    729     margin: 3px 0 0; } }
     788    margin: 3px 0 0; }
     789  #buddypress li.groups-members-search form label, #buddypress li.groups-members-search form input[type='submit'], #buddypress li.groups-members-search form input[type='text'] {
     790    width: auto; } }
    730791
    731792/**
    … …  
    747808  background: #c6e4ee;
    748809  border: 1px solid #78bed6;
    749   color: #fff; }
     810  color: #1e5264; }
    750811#buddypress div#message.updated p {
    751812  background: #dee6b2;
    752813  border: 1px solid #becc66;
    753   color: #fff; }
     814  color: #454d19; }
    754815
    755816.delete-group #buddypress div#message.info p {
    756817  background: #db7e7e;
    757818  border: 1px solid #be3535;
    758   color: #fff; }
     819  color: #1f0808; }
    759820
    760821/**

  • trunk/src/bp-templates/bp-legacy/css/twentyfourteen.scss

    r9861 r9864  
    103103
    104104// BP message boxes
    105 @mixin message-box($background, $text-color: inherit) {
     105@mixin message-box($background, $text-color: null) {
     106
     107        @if($text-color) {
     108                // if a param was passed through
     109                $text-color: $text-color;
     110        } @else {
     111                $text-color: darken($background, 50%);
     112        }
     113
    106114        background: lighten($background, 10%);
    107115        border: 1px solid darken($background, 10%);
    … …  
    194202*/
    195203
     204// Twentyfourteen  adds a generic grouped ruleset of clear:both;
     205// for all heading h# elements this is problematic where floats are concerned
     206// We reset this here under our #buddypress namespace
     207#buddypress {
     208        h1,
     209        h2,
     210        h3,
     211        h4,
     212        h5,
     213        h6 {
     214                clear: none;
     215        }
     216}
     217
    196218// As BP screens have specific content lets adjust the themes primary elements
    197219// to maximise the screen real estate for BP pages.
    … …  
    502524                        }
    503525
     526                        .item {
     527                                margin-left: 0;
     528                        }
     529
    504530                        // groups group description
    505531                        div.item-desc {
    … …  
    509535
    510536                        div.action {
     537                                clear: both;
     538                                float: none;
     539                                margin: 0;
    511540                                position: relative;
    512541                                text-align: left;
    513                                 top: 0;
    514542
    515543                                div {
    … …  
    540568                                .item {
    541569                                        float: right;
     570                                        margin-left: 5%;
    542571                                        width: 80%;
    543572                                }
    544573
    545                                 .activity-meta,
    546                                 .action {
     574                                .activity-meta {
    547575                                        clear: both;
    548576
    … …  
    558586                                .item {
    559587                                        float: left;
    560                                         margin-left: 5%;
    561588                                        width: 60%;
    562589
    … …  
    567594                                }
    568595
    569                                 .action {
     596                                div.action {
    570597                                        clear: none;
    571598                                        float: right;
     599                                        top: 0;
    572600                                        width: 25%;
    573601
    … …  
    875903*------------------------------------------------------------
    876904*/
     905// override BP margins - users/groups manage their own styles later on
     906#buddypress {
     907        div#item-header {
     908                padding-bottom: $spacing-val-sm;
     909
     910                img.avatar {
     911                        margin: 0 $spacing-val-md $spacing-val-sm 0;
     912                }
     913
     914                // Prevent messages block abutting bottom of floats, with padding-top
     915                #message {
     916                        clear: both;
     917                        margin-bottom: $spacing-val-xs;
     918                        padding-top: $spacing-val-md;
     919
     920                        p {margin-bottom: 0;}
     921                }
     922        }
     923}
    877924
    878925/**
    … …  
    930977                        #item-actions {
    931978                                float: none;
     979                                margin: 0 0 0 $spacing-val-md;
    932980                                width: auto;
    933981
    … …  
    9731021.bp-user #buddypress {
    9741022        #item-header {
    975                 padding-bottom: $spacing-val-sm;
    9761023
    9771024                #item-header-avatar {
    … …  
    10971144/**
    10981145        *------------------------------
     1146        * 6.2.1.2 - Group members list
     1147        *------------------------------
     1148        */
     1149
     1150#buddypress {
     1151        #members-group-list {
     1152                .item-list {
     1153                        h5 {
     1154                                display: inline-block;
     1155                                margin: 0;
     1156                        }
     1157
     1158                        span.activity {
     1159                                padding-left: $spacing-val-sm;
     1160                        }
     1161                }
     1162        }
     1163} // close #buddypress
     1164
     1165#buddypress {
     1166        #item-body {
     1167                #subnav {
     1168                        li.groups-members-search:focus,
     1169                        li.groups-members-search:hover,
     1170                        li.last:focus,
     1171                        li.last:hover {
     1172                                background: none;
     1173                        }
     1174                }
     1175        }
     1176}
     1177
     1178// Need to target groups members via body classes
     1179.groups.group-members {
     1180        #subnav {
     1181
     1182                ul:before,
     1183                ul:after {
     1184                        content: " ";
     1185                        display: table;
     1186                }
     1187
     1188                ul:after {clear: both; }
     1189
     1190                ul {
     1191                        padding: $spacing-val-xs 0;
     1192                }
     1193
     1194
     1195                li {
     1196
     1197                        @media screen and (max-width: 400px) {
     1198                                background: $content-background;
     1199                                padding: $spacing-val-sm 0;
     1200                                width: 100% !important;
     1201                        }
     1202
     1203                        #search-members-form {
     1204                                @include box-model(border-box);
     1205                                float: left;
     1206                                @media screen and (max-width: 400px) {
     1207                                        margin: 0;
     1208                                        width: 100%;
     1209
     1210                                        label {
     1211                                                input[type="text"] {width: 100%;}
     1212                                        }
     1213                                }
     1214                                @media screen and (min-width: 783px) {
     1215                                        margin-left: 3px;
     1216                                }
     1217                        }
     1218
     1219                }
     1220
     1221        } // close #subnav
     1222} // close .groups.group-members
     1223
     1224/**
     1225        *------------------------------
    10991226        * 6.2.1.3 - Groups Send Invites
    11001227        *------------------------------
    … …  
    13491476#buddypress {
    13501477        div.dir-search,
    1351         div.message-search {
     1478        div.message-search,
     1479        li.groups-members-search {
    13521480                clear: both;
    13531481                float: none;
    … …  
    14131541
    14141542                div.message-search { margin: 3px 0 0;}
     1543
     1544                li.groups-members-search {
     1545                        form {
     1546                                label,
     1547                                input[type='submit'],
     1548                                input[type='text'] {
     1549                                        width: auto;
     1550                                }
     1551                        }
     1552                }
     1553
    14151554        } // close @media
     1555
    14161556} // close #buddypress
    14171557
    … …  
    14291569*-------------------------------------------------------------------------------
    14301570*/
    1431 #buddypress {
     1571// message args ($variable-color, text-color)
     1572// Leave text-color undefined to automagically set text color
     1573// to background color darker by 50%
     1574#buddypress {
     1575
    14321576        div#message {
    14331577                p {
    … …  
    14381582                &.info {
    14391583                        p {
    1440                                 @include message-box($notice-info, #fff);
     1584                                @include message-box($notice-info);
    14411585                        }
    14421586                }
    … …  
    14441588                &.updated {
    14451589                        p {
    1446                                 @include message-box($notice-update, #fff);
     1590                                @include message-box($notice-update);
    14471591                        }
    14481592                }
    … …  
    14521596} // close  #buddypress
    14531597
    1454 // Without direct classes on our mesages ( 'warning' )
     1598// Without direct classes on our messages ( 'warning' )
    14551599// we need to use the body classes
    1456 // message args ($variable-color, text-color)
    14571600// todo: If this is class .warning is included in main BP styles remove from here
    14581601.delete-group {
    … …  
    14601603                div#message.info {
    14611604                        p {
    1462                                 @include message-box($notice-warning, #fff);
     1605                                @include message-box($notice-warning);
    14631606                        }
    14641607                }
Note: See TracChangeset for help on using the changeset viewer.