Skip to:
Content

BuddyPress.org

Changeset 9876


Ignore:
Timestamp:
05/18/2015 08:25:59 PM (11 years ago)
Author:
hnla
Message:

Updates & corrections to twentyfifteen companion styles

  • Remove styles on message options.
  • Mirror group manage settings styles on group create settings elements.
  • Add group create classes to form overrides.
  • Add margin spacing for item-body messages instances.


See #6291

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

Legend:

Unmodified
Added
Removed

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

    r9875 r9876  
    653653  width: auto; }
    654654
    655 .groups.group-settings #group-settings-form div.radio label {
     655.groups.group-settings #group-settings-form div.radio label, .groups.group-settings #create-group-form div.radio label {
    656656  border: 1px solid #eaeaea;
    657657  padding: 0.2em; }
    658   .groups.group-settings #group-settings-form div.radio label ul {
    659     color: rgba(51, 51, 51, 0.6);
    660     font-size: 14px;
    661     font-size: 1.4rem; }
     658.groups.group-settings #group-settings-form div.radio ul, .groups.group-settings #create-group-form div.radio ul {
     659  color: rgba(51, 51, 51, 0.6);
     660  font-size: 14px;
     661  font-size: 1.4rem; }
    662662
    663663.groups.group-avatar form > p {
    … …  
    770770.bp-user #buddypress .pag-count {
    771771  font-style: italic; }
    772 .bp-user #buddypress .notifications-options-nav {
    773   border: 1px solid rgba(153, 153, 153, 0.5);
     772.bp-user #buddypress .notifications-options-nav, .bp-user #buddypress .messages-options-nav {
    774773  float: right;
    775774  width: 100%; }
    776   @media screen and (min-width: 38.75em) {
    777     .bp-user #buddypress .notifications-options-nav {
    778       width: 300px; } }
    779   .bp-user #buddypress .notifications-options-nav select, .bp-user #buddypress .notifications-options-nav input {
    780     border: 0;
     775  @media screen and (min-width: 30em) {
     776    .bp-user #buddypress .notifications-options-nav, .bp-user #buddypress .messages-options-nav {
     777      width: 50%; } }
     778  .bp-user #buddypress .notifications-options-nav select, .bp-user #buddypress .notifications-options-nav input, .bp-user #buddypress .messages-options-nav select, .bp-user #buddypress .messages-options-nav input {
    781779    font-size: 14px;
    782780    font-size: 1.4rem;
    783781    outline: 0;
    784782    padding: 0; }
    785   .bp-user #buddypress .notifications-options-nav select {
     783  .bp-user #buddypress .notifications-options-nav select, .bp-user #buddypress .messages-options-nav select {
    786784    float: right;
    787785    margin-left: 0;
    788     width: 60%; }
    789   .bp-user #buddypress .notifications-options-nav input {
     786    width: 100%; }
     787    @media screen and (min-width: 30em) {
     788      .bp-user #buddypress .notifications-options-nav select, .bp-user #buddypress .messages-options-nav select {
     789        width: 60%; } }
     790  .bp-user #buddypress .notifications-options-nav input, .bp-user #buddypress .messages-options-nav input {
    790791    float: left;
    791     font-family: inherit;
    792     line-height: 20px;
    793     width: 40%; }
     792    font-family: "Noto Serif", serif;
     793    line-height: 1.5;
     794    margin-top: 10px;
     795    width: 100%; }
     796    .bp-user #buddypress .notifications-options-nav input[disabled]:hover, .bp-user #buddypress .messages-options-nav input[disabled]:hover {
     797      background: none; }
     798    @media screen and (min-width: 30em) {
     799      .bp-user #buddypress .notifications-options-nav input, .bp-user #buddypress .messages-options-nav input {
     800        margin-top: 0;
     801        width: 38%; } }
    794802
    795803/**
    … …  
    10291037  border: 1px solid rgba(153, 153, 153, 0.5); }
    10301038
    1031 #buddypress #item-body .standard-form li {
     1039#buddypress .standard-form li, #buddypress .group-create-form li {
    10321040  float: none; }
    1033 #buddypress #item-body .standard-form input[type='text'], #buddypress #item-body .standard-form textarea {
     1041#buddypress .standard-form input[type='text'], #buddypress .standard-form textarea, #buddypress .group-create-form input[type='text'], #buddypress .group-create-form textarea {
    10341042  width: 100%; }
    10351043#buddypress div.dir-search, #buddypress div.message-search, #buddypress li.groups-members-search {
    … …  
    11201128*-------------------------------------------------------------------------------
    11211129*/
     1130#buddypress #item-body div#message {
     1131  margin-top: 20px; }
     1132  @media screen and (min-width: 55em) {
     1133    #buddypress #item-body div#message {
     1134      margin-left: 20px; } }
    11221135#buddypress div#message p {
    11231136  font-size: 18px;
    … …  
    11361149  background: #db7e7e;
    11371150  border: 1px solid #be3535;
    1138   color: #fff; }
     1151  color: #1f0808; }
    11391152
    11401153/**

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

    r9875 r9876  
    653653  width: auto; }
    654654
    655 .groups.group-settings #group-settings-form div.radio label {
     655.groups.group-settings #group-settings-form div.radio label, .groups.group-settings #create-group-form div.radio label {
    656656  border: 1px solid #eaeaea;
    657657  padding: 0.2em; }
    658   .groups.group-settings #group-settings-form div.radio label ul {
    659     color: rgba(51, 51, 51, 0.6);
    660     font-size: 14px;
    661     font-size: 1.4rem; }
     658.groups.group-settings #group-settings-form div.radio ul, .groups.group-settings #create-group-form div.radio ul {
     659  color: rgba(51, 51, 51, 0.6);
     660  font-size: 14px;
     661  font-size: 1.4rem; }
    662662
    663663.groups.group-avatar form > p {
    … …  
    770770.bp-user #buddypress .pag-count {
    771771  font-style: italic; }
    772 .bp-user #buddypress .notifications-options-nav {
    773   border: 1px solid rgba(153, 153, 153, 0.5);
     772.bp-user #buddypress .notifications-options-nav, .bp-user #buddypress .messages-options-nav {
    774773  float: left;
    775774  width: 100%; }
    776   @media screen and (min-width: 38.75em) {
    777     .bp-user #buddypress .notifications-options-nav {
    778       width: 300px; } }
    779   .bp-user #buddypress .notifications-options-nav select, .bp-user #buddypress .notifications-options-nav input {
    780     border: 0;
     775  @media screen and (min-width: 30em) {
     776    .bp-user #buddypress .notifications-options-nav, .bp-user #buddypress .messages-options-nav {
     777      width: 50%; } }
     778  .bp-user #buddypress .notifications-options-nav select, .bp-user #buddypress .notifications-options-nav input, .bp-user #buddypress .messages-options-nav select, .bp-user #buddypress .messages-options-nav input {
    781779    font-size: 14px;
    782780    font-size: 1.4rem;
    783781    outline: 0;
    784782    padding: 0; }
    785   .bp-user #buddypress .notifications-options-nav select {
     783  .bp-user #buddypress .notifications-options-nav select, .bp-user #buddypress .messages-options-nav select {
    786784    float: left;
    787785    margin-right: 0;
    788     width: 60%; }
    789   .bp-user #buddypress .notifications-options-nav input {
     786    width: 100%; }
     787    @media screen and (min-width: 30em) {
     788      .bp-user #buddypress .notifications-options-nav select, .bp-user #buddypress .messages-options-nav select {
     789        width: 60%; } }
     790  .bp-user #buddypress .notifications-options-nav input, .bp-user #buddypress .messages-options-nav input {
    790791    float: right;
    791     font-family: inherit;
    792     line-height: 20px;
    793     width: 40%; }
     792    font-family: "Noto Serif", serif;
     793    line-height: 1.5;
     794    margin-top: 10px;
     795    width: 100%; }
     796    .bp-user #buddypress .notifications-options-nav input[disabled]:hover, .bp-user #buddypress .messages-options-nav input[disabled]:hover {
     797      background: none; }
     798    @media screen and (min-width: 30em) {
     799      .bp-user #buddypress .notifications-options-nav input, .bp-user #buddypress .messages-options-nav input {
     800        margin-top: 0;
     801        width: 38%; } }
    794802
    795803/**
    … …  
    10291037  border: 1px solid rgba(153, 153, 153, 0.5); }
    10301038
    1031 #buddypress #item-body .standard-form li {
     1039#buddypress .standard-form li, #buddypress .group-create-form li {
    10321040  float: none; }
    1033 #buddypress #item-body .standard-form input[type='text'], #buddypress #item-body .standard-form textarea {
     1041#buddypress .standard-form input[type='text'], #buddypress .standard-form textarea, #buddypress .group-create-form input[type='text'], #buddypress .group-create-form textarea {
    10341042  width: 100%; }
    10351043#buddypress div.dir-search, #buddypress div.message-search, #buddypress li.groups-members-search {
    … …  
    11201128*-------------------------------------------------------------------------------
    11211129*/
     1130#buddypress #item-body div#message {
     1131  margin-top: 20px; }
     1132  @media screen and (min-width: 55em) {
     1133    #buddypress #item-body div#message {
     1134      margin-right: 20px; } }
    11221135#buddypress div#message p {
    11231136  font-size: 18px;
    … …  
    11361149  background: #db7e7e;
    11371150  border: 1px solid #be3535;
    1138   color: #fff; }
     1151  color: #1f0808; }
    11391152
    11401153/**

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

    r9875 r9876  
    12511251
    12521252.groups.group-settings {
    1253         #group-settings-form {
    1254 
    1255                 div.radio label {
    1256                         border: 1px solid $border-light;
    1257                         padding: 0.2em;
     1253        #group-settings-form,
     1254        #create-group-form {
     1255
     1256                div.radio {
     1257                        label {
     1258                                border: 1px solid $border-light;
     1259                                padding: 0.2em;
     1260                        }
    12581261
    12591262                        ul {
    … …  
    14051408        }
    14061409}
     1410
    14071411/**
    14081412*--------------------------------------------
    … …  
    14321436                .pag-count {font-style: italic;}
    14331437
    1434                 .notifications-options-nav {
    1435                         border: 1px solid rgba($border-color, 0.5);
     1438                .notifications-options-nav,
     1439                .messages-options-nav {
    14361440                        float: left;
    14371441                        width: 100%;
    1438                         @media screen and (min-width: 38.75em) {
    1439                                 width: 300px;
     1442                        @media screen and (min-width: 30em) {
     1443                                width: 50%;
    14401444                        }
    14411445
    14421446                        select,
    14431447                        input {
    1444                                 border: 0;
    14451448                                @include font-size(14);
    14461449                                outline: 0;
    … …  
    14511454                                float: left;
    14521455                                margin-right: 0;
    1453                                 width: 60%;
     1456                                width: 100%;
     1457
     1458                                @media screen and (min-width: 30em) {
     1459                                        width: 60%;
     1460                                }
    14541461                        }
    14551462
    14561463                        input {
    14571464                                float: right;
    1458                                 font-family: inherit;
    1459                                 line-height: 20px;
    1460                                 width: 40%;
     1465                                @include default-font-serif();
     1466                                line-height: 1.5;
     1467                                margin-top: $spacing-val-sm;
     1468                                width: 100%;
     1469
     1470                                &[disabled]:hover {background: none;}
     1471
     1472                                @media screen and (min-width: 30em) {
     1473                                        margin-top: 0;
     1474                                        width: 38%;
     1475                                }
    14611476                        }
    14621477
    … …  
    19081923} // close #buddypress
    19091924
    1910 // 2015 applies 100% width to form element, remove this initially for BP search
    19111925
    19121926#buddypress {
    19131927
    1914         // Manage form control widths under #item-body in user account screens
    1915         #item-body {
    1916                 .standard-form {
    1917                         li {float: none;}
    1918                         input[type='text'],
    1919                         textarea {
    1920                                 width: 100%;
    1921                         }
     1928        // Manage form control widths override BP 75% width.
     1929
     1930        .standard-form,
     1931        .group-create-form {
     1932                li {float: none;}
     1933                input[type='text'],
     1934                textarea {
     1935                        width: 100%;
    19221936                }
    19231937        }
    … …  
    21012115
    21022116#buddypress {
     2117        #item-body {
     2118                div#message {
     2119                        margin-top: $spacing-val-md;
     2120                        @media screen and (min-width: 55em) {
     2121                                margin-right: $spacing-val-md;
     2122                        }
     2123                }
     2124        }
    21032125
    21042126        div#message {
    … …  
    21262148// Without direct classes on our mesages ( 'warning' )
    21272149// we need to use the body classes
    2128 // todo: If this is class .warning is included in main BP styles remove from here
    21292150.delete-group {
    21302151        #buddypress {
    21312152                div#message.info {
     2153
    21322154                        p {
    2133                                 @include message-box($notice-warning, #fff);
     2155                                @include message-box($notice-warning);
    21342156                        }
    21352157                }
Note: See TracChangeset for help on using the changeset viewer.