Skip to:
Content

BuddyPress.org

Changeset 9823


Ignore:
Timestamp:
04/30/2015 05:58:56 PM (10 years ago)
Author:
hnla
Message:

Updates to twentyfourteen complimentary styles

General style updates & corrections

  • Updates various user account screen elements
  • Updates general form styles
  • Corrects item-body background

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

    r9816 r9823  
    105105  margin-top: 0; }
    106106
     107@media screen and (max-width: 783px) {
     108  #buddypress div#subnav.item-list-tabs {
     109    margin-bottom: 40px; } }
     110
    107111/*__ Vertical Menu User Account Screens __*/
    108112@media screen and (min-width: 783px) {
    109   #buddypress {
     113  .bp-user #buddypress, .single-item.groups #buddypress {
    110114    background: #d8d8d8; }
    111     #buddypress #item-header, #buddypress #item-body {
    112       background: #fff; }
    113     #buddypress #item-body {
    114       border-right: 1px solid #bebebe; }
    115     #buddypress #object-nav {
    116       background: #d8d8d8;
    117       border-left: 1px solid #bebebe;
    118       float: right;
    119       margin-left: -1px;
    120       width: 200px; }
    121       #buddypress #object-nav ul {
    122         border-bottom: 0;
    123         border-top: 1px solid #bebebe;
    124         padding: 0; }
    125         #buddypress #object-nav ul li {
    126           float: none;
    127           overflow: hidden; }
    128           #buddypress #object-nav ul li:focus, #buddypress #object-nav ul li:hover {
    129             background: #bebebe; }
    130           #buddypress #object-nav ul li span {
    131             border-radius: 10%;
    132             float: left;
    133             margin-left: 15px; }
    134         #buddypress #object-nav ul li.current {
    135           background: #f1f1f1; }
    136     #buddypress #item-body {
    137       overflow: hidden;
    138       padding: 0 20px;
    139       width: auto; }
    140       #buddypress #item-body #subnav {
    141         border: 1px solid #bebebe;
    142         border-right: 0;
    143         border-left: 0;
    144         margin: 0 -20px 40px; }
    145         #buddypress #item-body #subnav li:focus, #buddypress #item-body #subnav li:hover {
     115  #buddypress #item-header, #buddypress #item-body {
     116    background: #fff; }
     117  #buddypress #item-body {
     118    border-right: 1px solid #bebebe; }
     119  #buddypress #object-nav {
     120    background: #d8d8d8;
     121    border-left: 1px solid #bebebe;
     122    float: right;
     123    margin-left: -1px;
     124    width: 200px; }
     125    #buddypress #object-nav ul {
     126      border-bottom: 0;
     127      border-top: 1px solid #bebebe;
     128      padding: 0; }
     129      #buddypress #object-nav ul li {
     130        float: none;
     131        overflow: hidden; }
     132        #buddypress #object-nav ul li:focus, #buddypress #object-nav ul li:hover {
    146133          background: #bebebe; }
    147         #buddypress #item-body #subnav li.current {
    148           background: #f1f1f1; } }
     134        #buddypress #object-nav ul li span {
     135          border-radius: 10%;
     136          float: left;
     137          margin-left: 15px; }
     138      #buddypress #object-nav ul li.current {
     139        background: #f1f1f1; }
     140  #buddypress #item-body {
     141    overflow: hidden;
     142    padding: 0 20px;
     143    width: auto; }
     144    #buddypress #item-body #subnav {
     145      border: 1px solid #bebebe;
     146      border-right: 0;
     147      border-left: 0;
     148      margin: 0 -20px 40px; }
     149      #buddypress #item-body #subnav li:focus, #buddypress #item-body #subnav li:hover {
     150        background: #bebebe; }
     151      #buddypress #item-body #subnav li.current {
     152        background: #f1f1f1; } }
    149153
    150154/**
    … …  
    153157*----------------------------------------------------------
    154158*/
     159#buddypress div.pagination .pag-count {
     160  margin-right: 0; }
     161
    155162/**
    156163*-------------------------------------------------------------------------------
    … …  
    237244*-------------------------------------------------
    238245*/
    239 #buddypress #whats-new-form {
     246#buddypress form#whats-new-form {
    240247  margin: 40px 0; }
    241   #buddypress #whats-new-form textarea#whats-new {
     248  #buddypress form#whats-new-form p.activity-greeting {
     249    line-height: inherit; }
     250  #buddypress form#whats-new-form textarea#whats-new {
    242251    width: 100%; }
    243252
    … …  
    472481    * 6.2.2.2 - Extended Profiles
    473482    *------------------------------
     483    */
     484  /**
     485    *------------------------------
     486    * @subsection 6.2.2.5 - Messaging
     487    *------------------------------
     488    */
     489  /**
     490    *------------------------------
     491    * @subsection 6.2.2.6 - Settings
     492    *------------------------------
    474493    */ }
    475494  #buddypress .profile {
    … …  
    506525      color: #fff;
    507526      padding: 0.2em 0.5em; }
     527  #buddypress table#message-threads .bulk-select-check {
     528    width: 5%; }
     529  #buddypress table#message-threads .thread-from, #buddypress table#message-threads .thread-info {
     530    width: 35%; }
     531  #buddypress table#message-threads .thread-options {
     532    width: 25%; }
     533  #buddypress table#message-threads tr td {
     534    background: #ebf0ff; }
     535  #buddypress table#message-threads tr.alt td {
     536    background: #dbe5ff; }
     537  #buddypress table#message-threads tr.unread td {
     538    background: #cddaff;
     539    border-bottom: 1px solid #e4cdff;
     540    border-top: 1px solid #e4cdff; }
     541  #buddypress table#message-threads tr.read td {
     542    opacity: 0.5; }
     543  #buddypress table.profile-settings {
     544    width: 100%; }
     545    #buddypress table.profile-settings th, #buddypress table.profile-settings td {
     546      clear: none;
     547      width: 50%; }
    508548
    509549/*------------------------------------------------------------------------------
    … …  
    511551*-------------------------------------------------------------------------------
    512552*/
    513 #buddypress .standard-form input[type="text"], #buddypress .standard-form textarea {
     553#buddypress input[type="text"], #buddypress input[type="email"], #buddypress input[type="password"], #buddypress input[type="submit"], #buddypress select, #buddypress textarea {
     554  border: 1px solid rgba(0, 0, 0, 0.2); }
     555#buddypress .standard-form input[type="text"], #buddypress .standard-form input[type="email"], #buddypress .standard-form input[type="password"], #buddypress .standard-form input[type="submit"], #buddypress .standard-form textarea {
    514556  width: 100%; }
    515557#buddypress div.activity-comments form .ac-textarea {
    … …  
    519561    background: none;
    520562    border: 0; }
    521 #buddypress select {
    522   border: 1px solid rgba(0, 0, 0, 0.5); }
    523563
    524564#buddypress div.dir-search, #buddypress div.message-search {
     565  clear: both;
    525566  float: none;
    526567  margin: 10px 0; }
    … …  
    534575      float: right;
    535576      margin: 0;
    536       width: 100%; }
     577      width: 80%; }
    537578    #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'] {
    538579      border: 0;
    … …  
    552593@media screen and (min-width: 401px) {
    553594  #buddypress div.dir-search, #buddypress div.message-search {
     595    clear: none;
    554596    float: left;
    555597    margin: 0; }

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

    r9816 r9823  
    105105  margin-top: 0; }
    106106
     107@media screen and (max-width: 783px) {
     108  #buddypress div#subnav.item-list-tabs {
     109    margin-bottom: 40px; } }
     110
    107111/*__ Vertical Menu User Account Screens __*/
    108112@media screen and (min-width: 783px) {
    109   #buddypress {
     113  .bp-user #buddypress, .single-item.groups #buddypress {
    110114    background: #d8d8d8; }
    111     #buddypress #item-header, #buddypress #item-body {
    112       background: #fff; }
    113     #buddypress #item-body {
    114       border-left: 1px solid #bebebe; }
    115     #buddypress #object-nav {
    116       background: #d8d8d8;
    117       border-right: 1px solid #bebebe;
    118       float: left;
    119       margin-right: -1px;
    120       width: 200px; }
    121       #buddypress #object-nav ul {
    122         border-bottom: 0;
    123         border-top: 1px solid #bebebe;
    124         padding: 0; }
    125         #buddypress #object-nav ul li {
    126           float: none;
    127           overflow: hidden; }
    128           #buddypress #object-nav ul li:focus, #buddypress #object-nav ul li:hover {
    129             background: #bebebe; }
    130           #buddypress #object-nav ul li span {
    131             border-radius: 10%;
    132             float: right;
    133             margin-right: 15px; }
    134         #buddypress #object-nav ul li.current {
    135           background: #f1f1f1; }
    136     #buddypress #item-body {
    137       overflow: hidden;
    138       padding: 0 20px;
    139       width: auto; }
    140       #buddypress #item-body #subnav {
    141         border: 1px solid #bebebe;
    142         border-left: 0;
    143         border-right: 0;
    144         margin: 0 -20px 40px; }
    145         #buddypress #item-body #subnav li:focus, #buddypress #item-body #subnav li:hover {
     115  #buddypress #item-header, #buddypress #item-body {
     116    background: #fff; }
     117  #buddypress #item-body {
     118    border-left: 1px solid #bebebe; }
     119  #buddypress #object-nav {
     120    background: #d8d8d8;
     121    border-right: 1px solid #bebebe;
     122    float: left;
     123    margin-right: -1px;
     124    width: 200px; }
     125    #buddypress #object-nav ul {
     126      border-bottom: 0;
     127      border-top: 1px solid #bebebe;
     128      padding: 0; }
     129      #buddypress #object-nav ul li {
     130        float: none;
     131        overflow: hidden; }
     132        #buddypress #object-nav ul li:focus, #buddypress #object-nav ul li:hover {
    146133          background: #bebebe; }
    147         #buddypress #item-body #subnav li.current {
    148           background: #f1f1f1; } }
     134        #buddypress #object-nav ul li span {
     135          border-radius: 10%;
     136          float: right;
     137          margin-right: 15px; }
     138      #buddypress #object-nav ul li.current {
     139        background: #f1f1f1; }
     140  #buddypress #item-body {
     141    overflow: hidden;
     142    padding: 0 20px;
     143    width: auto; }
     144    #buddypress #item-body #subnav {
     145      border: 1px solid #bebebe;
     146      border-left: 0;
     147      border-right: 0;
     148      margin: 0 -20px 40px; }
     149      #buddypress #item-body #subnav li:focus, #buddypress #item-body #subnav li:hover {
     150        background: #bebebe; }
     151      #buddypress #item-body #subnav li.current {
     152        background: #f1f1f1; } }
    149153
    150154/**
    … …  
    153157*----------------------------------------------------------
    154158*/
     159#buddypress div.pagination .pag-count {
     160  margin-left: 0; }
     161
    155162/**
    156163*-------------------------------------------------------------------------------
    … …  
    237244*-------------------------------------------------
    238245*/
    239 #buddypress #whats-new-form {
     246#buddypress form#whats-new-form {
    240247  margin: 40px 0; }
    241   #buddypress #whats-new-form textarea#whats-new {
     248  #buddypress form#whats-new-form p.activity-greeting {
     249    line-height: inherit; }
     250  #buddypress form#whats-new-form textarea#whats-new {
    242251    width: 100%; }
    243252
    … …  
    472481    * 6.2.2.2 - Extended Profiles
    473482    *------------------------------
     483    */
     484  /**
     485    *------------------------------
     486    * @subsection 6.2.2.5 - Messaging
     487    *------------------------------
     488    */
     489  /**
     490    *------------------------------
     491    * @subsection 6.2.2.6 - Settings
     492    *------------------------------
    474493    */ }
    475494  #buddypress .profile {
    … …  
    506525      color: #fff;
    507526      padding: 0.2em 0.5em; }
     527  #buddypress table#message-threads .bulk-select-check {
     528    width: 5%; }
     529  #buddypress table#message-threads .thread-from, #buddypress table#message-threads .thread-info {
     530    width: 35%; }
     531  #buddypress table#message-threads .thread-options {
     532    width: 25%; }
     533  #buddypress table#message-threads tr td {
     534    background: #ebf0ff; }
     535  #buddypress table#message-threads tr.alt td {
     536    background: #dbe5ff; }
     537  #buddypress table#message-threads tr.unread td {
     538    background: #cddaff;
     539    border-bottom: 1px solid #e4cdff;
     540    border-top: 1px solid #e4cdff; }
     541  #buddypress table#message-threads tr.read td {
     542    opacity: 0.5; }
     543  #buddypress table.profile-settings {
     544    width: 100%; }
     545    #buddypress table.profile-settings th, #buddypress table.profile-settings td {
     546      clear: none;
     547      width: 50%; }
    508548
    509549/*------------------------------------------------------------------------------
    … …  
    511551*-------------------------------------------------------------------------------
    512552*/
    513 #buddypress .standard-form input[type="text"], #buddypress .standard-form textarea {
     553#buddypress input[type="text"], #buddypress input[type="email"], #buddypress input[type="password"], #buddypress input[type="submit"], #buddypress select, #buddypress textarea {
     554  border: 1px solid rgba(0, 0, 0, 0.2); }
     555#buddypress .standard-form input[type="text"], #buddypress .standard-form input[type="email"], #buddypress .standard-form input[type="password"], #buddypress .standard-form input[type="submit"], #buddypress .standard-form textarea {
    514556  width: 100%; }
    515557#buddypress div.activity-comments form .ac-textarea {
    … …  
    519561    background: none;
    520562    border: 0; }
    521 #buddypress select {
    522   border: 1px solid rgba(0, 0, 0, 0.5); }
    523563
    524564#buddypress div.dir-search, #buddypress div.message-search {
     565  clear: both;
    525566  float: none;
    526567  margin: 10px 0; }
    … …  
    534575      float: left;
    535576      margin: 0;
    536       width: 100%; }
     577      width: 80%; }
    537578    #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'] {
    538579      border: 0;
    … …  
    552593@media screen and (min-width: 401px) {
    553594  #buddypress div.dir-search, #buddypress div.message-search {
     595    clear: none;
    554596    float: right;
    555597    margin: 0; }

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

    r9821 r9823  
    116116$notice-warning:         #d05656;
    117117$notice-info:            #9fd1e2;
     118$stripe-odd:             #ebf0ff;
     119$stripe-even:            #dbe5ff;
     120$unread:                 #cddaff;
    118121
    119122// 2014 font family
    … …  
    269272}
    270273
     274// Add a little bottom margin to subnav up to vert nav display point
     275// for user/group screens
     276// @todo object nav/subnav needs display solution/styling for stacked views
     277@media screen and (max-width: 783px) {
     278    #buddypress {
     279        div#subnav.item-list-tabs {
     280            margin-bottom: $spacing-val-lg;
     281        }
     282    }
     283}
     284
    271285/*__ Vertical Menu User Account Screens __*/
    272286
    … …  
    279293
    280294@media screen and (min-width: 783px) {
     295
     296    .bp-user,
     297    .single-item.groups {
     298        #buddypress {
     299            background: lighten($nav-background-border, 10%);
     300        }
     301    }
     302
    281303    #buddypress {
    282         background: lighten($nav-background-border, 10%);
    283304
    284305        #item-header,
    … …  
    344365            }
    345366        }
    346     } // close .bp-user #buddypress
     367    } // close #buddypress
    347368} // close @media
    348369
    … …  
    352373*----------------------------------------------------------
    353374*/
     375
     376#buddypress {
     377    div.pagination {
     378        .pag-count {
     379            margin-left: 0;
     380        }
     381    }
     382}
    354383
    355384/**
    … …  
    510539*/
    511540#buddypress {
    512     #whats-new-form {
     541    form#whats-new-form {
    513542        margin: $spacing-val-lg 0;
     543
     544        // Line-height issue inherited from BP rules, override.
     545        p.activity-greeting {
     546            line-height: inherit;
     547        }
    514548
    515549        textarea#whats-new {
    … …  
    939973    } // close .profile
    940974
     975/**
     976    *------------------------------
     977    * @subsection 6.2.2.5 - Messaging
     978    *------------------------------
     979    */
     980
     981    table#message-threads {
     982
     983        .bulk-select-check {
     984            width: 5%;
     985        }
     986
     987        .thread-from,
     988        .thread-info {
     989            width: 35%;
     990        }
     991
     992        .thread-options {
     993            width: 25%;
     994        }
     995
     996        tr {
     997            td {
     998                background: $stripe-odd;
     999            }
     1000        }
     1001
     1002        tr.alt {
     1003            td {
     1004                background: $stripe-even;
     1005            }
     1006        }
     1007
     1008        tr.unread {
     1009            td {
     1010                background: $unread;
     1011                border-bottom: 1px solid #e4cdff;
     1012                border-top: 1px solid #e4cdff;
     1013            }
     1014        }
     1015
     1016        tr.read {
     1017            td {
     1018                opacity: 0.5;
     1019            }
     1020        }
     1021    }
     1022
     1023/**
     1024    *------------------------------
     1025    * @subsection 6.2.2.6 - Settings
     1026    *------------------------------
     1027    */
     1028
     1029    // Profile table td widths
     1030    table.profile-settings {
     1031        width: 100%;
     1032
     1033        th,
     1034        td {
     1035            clear: none;
     1036            width: 50%;
     1037        }
     1038    }
     1039
    9411040} // close #buddypress - user acounts item-body
    9421041/*------------------------------------------------------------------------------
    … …  
    9491048#buddypress {
    9501049
     1050    input[type="text"],
     1051    input[type="email"],
     1052    input[type="password"],
     1053    input[type="submit"],
     1054    select,
     1055    textarea {
     1056        border: 1px solid $border-med;
     1057    }
     1058
    9511059    .standard-form {
    9521060        input[type="text"],
     1061        input[type="email"],
     1062        input[type="password"],
     1063        input[type="submit"],
    9531064        textarea {
    9541065            width: 100%;
    … …  
    9701081    }
    9711082
    972     select {border: 1px solid rgba($border-color, 0.5);}
    973 
    9741083} // close #buddypress
    9751084
    … …  
    9771086    div.dir-search,
    9781087    div.message-search {
     1088        clear: both;
    9791089        float: none;
    9801090        margin: $spacing-val-sm 0;
    … …  
    9941104                float: left;
    9951105                margin: 0;
    996                 width: 100%;
     1106                width: 80%;
    9971107            }
    9981108
    … …  
    10261136        div.dir-search,
    10271137        div.message-search {
     1138            clear: none;
    10281139            float: right;
    10291140            margin: 0;
Note: See TracChangeset for help on using the changeset viewer.