Skip to:
Content

BuddyPress.org


Ignore:
Timestamp:
05/16/2015 06:08:30 PM (9 years ago)
Author:
hnla
Message:

Updates to twentyfourteen companion styles

  • Minor corrections & improvements for mobile views
  • Transpose what's new active class to use style attr check
  • Port over messages-threads table layout from 2015 and adjust layout to work for 2014; update various styles. props r-a-y

See #6338

File:
1 edited

Legend:

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

    r9864 r9872  
    495495}
    496496
    497 // Trying to position the action div absolute has bad consequences where
    498 // aditional items are displayed, floating is an alternative that
    499 // allows natural flow expansion.
    500497// This block:
    501 // * Manages li items, Stacks them small screen, floated left at wider screens.
    502 // * Adjusts display of action buttons at small screen
     498// - Manages li items, Stacks them small screen, floated left at wider screens.
     499// - Adjusts display of action buttons at small screen
    503500
    504501#buddypress {
     
    522519                float: none;
    523520                width: 100%;
     521
     522                > a {text-align: center;}
    524523            }
    525524
     
    566565                }
    567566
     567                div.item-title > a {text-align: left;}
     568
    568569                .item {
    569570                    float: right;
     
    581582                    }
    582583                }
     584
    583585            } // close @media
    584586
     
    613615                        text-align: center;
    614616                    }
    615                 }
     617                } // close .action
     618
    616619            } // close @media
     620
    617621            .meta,
    618622            .item-meta .activity {
    619623                font-style: italic;
    620624            }
     625
    621626        } // close li
    622627    } // ul.item-list
     
    661666        }
    662667
    663         #whats-new-content.active {
    664             textarea {
    665                 // !important to override the BP inline fixed height
    666                 height: auto !important;
    667             }
    668 
    669             #whats-new-options {
     668        #whats-new-content {
     669
     670            #whats-new-options[style] {
    670671                // Have to override the BP fixed height
    671672                height: auto !important;
     
    686687
    687688                    #whats-new-post-in-box {
     689                        margin-top: $spacing-val-sm;
    688690                        order: 1;
    689691
     
    854856*/
    855857
    856 #buddypress {
    857     .members {
    858         .item-list {
    859             .my-entry {
    860                 .item {
    861                     background: $light-background;
    862                     @include box-model(border-box);
    863                     padding: 0 0.5em;
    864                     @media screen and (min-width: 783px) {
    865 
    866                         float: right;
    867                         margin-left: 0;
    868                         padding: 0 0.5em;
    869                         width: 88%;
    870                     }
    871                 }
    872             }
    873         }
    874     }
    875 }
     858
    876859
    877860/*
     
    12711254    }
    12721255}
     1256
    12731257/**
    12741258*-------------------------------------------------
     
    12761260*-------------------------------------------------
    12771261*/
    1278 #buddypress {
     1262
     1263
    12791264/**
    12801265    *------------------------------
     
    12821267    *------------------------------
    12831268    */
     1269
     1270
     1271#buddypress {
    12841272    .profile {
    12851273
     
    12921280        }
    12931281
    1294             /* Edit profile */
     1282        // Edit profile
    12951283
    12961284        #profile-edit-form {
     
    13411329
    13421330    } // close .profile
     1331} // close #buddypress - user acounts item-body
    13431332
    13441333/**
     
    13481337    */
    13491338
     1339#buddypress {
     1340
    13501341    table#message-threads {
    1351 
    1352         .bulk-select-check {
    1353             width: 5%;
    1354         }
    1355 
    1356         .thread-from,
    1357         .thread-info {
    1358             width: 35%;
    1359         }
    1360 
    1361         .thread-options {
    1362             width: 25%;
     1342        border-left: 1px solid $border-med;
     1343        border-right: 1px solid $border-med;
     1344
     1345        tbody > tr:first-child {
     1346            td.bulk-select-check,
     1347            td.thread-from {
     1348                border-top: 1px solid $border-med;
     1349         }
    13631350        }
    13641351
    13651352        tr {
     1353
    13661354            td {
    1367                 background: $stripe-odd;
    1368             }
    1369         }
    1370 
    1371         tr.alt {
    1372             td {
    1373                 background: $stripe-even;
     1355                background: $content-background;
     1356                border-right: 0 !important;
     1357                @include box-model(border-box);
     1358                display: inline-block;
     1359                float: left;
     1360            }
     1361
     1362            td.thread-star,
     1363            td.thread-options {
     1364                border-bottom-color: darken($border-med, 5%);
     1365                border-bottom-width: 2px;
     1366                border-left: 0;
     1367                height: 2.4em;
     1368                padding-bottom: 0.2em;
     1369                padding-top: 0.2em;
     1370
     1371                @media screen and (max-width: 549px) {
     1372                    padding-top: 0;
     1373                }
     1374            }
     1375
     1376            td.bulk-select-check,
     1377            td.thread-from {
     1378                border-left: 0;
     1379                height: 2.6em;
     1380                @media screen and (max-width: 320px) {
     1381                    height: 5.2em;
     1382                }
     1383            }
     1384
     1385            td.thread-from,
     1386            td.thread-options {
     1387                border-left: 0;
     1388                @include calc(width, "100% - 30px");
     1389                margin-left: 0;
     1390            }
     1391
     1392            td.thread-info {
     1393                border-left: 0;
     1394                padding-left: 41px;
     1395                width: 100%;
     1396
     1397                a::after {
     1398                    content: " \2013 \00a0"attr(title);
     1399                    @include font-size(12);
     1400                }
     1401            }
     1402
     1403            td.thread-options {
     1404                text-align: right;
     1405
     1406                a {
     1407                    @include font-size(12);
     1408                    line-height: 2.2;
     1409                }
     1410            }
     1411
     1412            span.from {
     1413                display: none;
     1414            }
     1415
     1416            span.activity {
     1417                display: block;
     1418                float: right;
     1419                line-height: 2;
     1420                @media screen and (max-width: 320px) {
     1421                    clear: both;
     1422                    @include font-size(11);
     1423                    width: 100%;
     1424                }
    13741425            }
    13751426        }
     
    13771428        tr.unread {
    13781429            td {
    1379                 background: $unread;
    1380                 border-bottom: 1px solid #e4cdff;
    1381                 border-top: 1px solid #e4cdff;
    1382             }
    1383         }
    1384 
    1385         tr.read {
    1386             td {
    1387                 opacity: 0.5;
    1388             }
    1389         }
    1390     }
     1430                background: lighten($unread, 7%);
     1431                border-color: $border-med;
     1432                border-top: 0;
     1433                border-width: 1px;
     1434            }
     1435        }
     1436
     1437        th {
     1438            display: none;
     1439        }
     1440
     1441        th.bulk-select-all {
     1442            border-bottom: 0;
     1443            display: inline-block;
     1444            text-align: left;
     1445        }
     1446
     1447        th.bulk-select-all,
     1448        td.bulk-select-check,
     1449        td.thread-star {
     1450            border-right: 0;
     1451            width: 30px;
     1452        }
     1453
     1454    } // close #messages-threads
     1455
     1456    /* Read Single thread */
     1457    #message-thread {
     1458
     1459        #message-subject {
     1460            @include title-background-dark();
     1461            padding: 0.5em;
     1462        }
     1463
     1464        .message-box {
     1465            .message-metadata {
     1466                margin-bottom: $spacing-val-sm;
     1467            }
     1468
     1469            .message-content {
     1470                clear: left;
     1471                margin-left: 0;
     1472            }
     1473        }
     1474    }
     1475
     1476} // close #buddypress - user acounts item-body
    13911477
    13921478/**
     
    13961482    */
    13971483
     1484#buddypress {
    13981485    #settings-form {
    13991486        // 'p' = email notification screen sub heading
     
    14271514        }
    14281515    }
    1429 
    14301516} // close #buddypress - user acounts item-body
    14311517
     
    14581544    }
    14591545
     1546    // BP :(
     1547    #send-reply.standard-form textarea {width: 100%;}
     1548
    14601549    div.activity-comments {
    14611550        form {
     
    14751564
    14761565#buddypress {
     1566
    14771567    div.dir-search,
    14781568    div.message-search,
     
    15611651*-------------------------------------------------------------------------------
    15621652*/
    1563 
     1653#buddypress {
     1654    table {
     1655        border-color: $border-med;
     1656    }
     1657}
    15641658/*__ User Account tables __*/
    15651659
Note: See TracChangeset for help on using the changeset viewer.