Making WordPress.org

Changeset 14309


Ignore:
Timestamp:
12/18/2024 04:59:53 AM (2 months ago)
Author:
johnjamesjacoby
Message:

BuddyPress.org/bbPress.org: small-screen bug fixes

  • Improve contrast of main nav
  • Prevent visible overflow on homepage
  • Numerous Trac nav & search improvments

Props slaffik, jtsternberg.

See: https://buddypress.trac.wordpress.org/ticket/9262

Location:
sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base
Files:
6 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/functions.php

    r14298 r14309  
    5555
    5656    // Version of CSS
    57     $version = '202412160002';
     57    $version = '202412170001';
    5858
    5959    // Base theme styling
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/header-nav.php

    r14281 r14309  
    77            <li><a href="<?php echo esc_url( '//codex.' . parse_url( home_url(), PHP_URL_HOST ) . '/' ); ?>"><?php esc_html_e( 'Codex', 'bborg' ); ?></a></li>
    88            <li <?php if ( is_post_type_archive( 'post' ) || is_singular( 'post' ) || is_date() || is_tag() || is_category() || is_home() ) : ?>class="current"<?php endif; ?>><a href="<?php echo home_url( 'blog' ); ?>"><?php esc_html_e( 'News', 'bborg' ); ?></a></li>
    9             <?php if ( function_exists( 'is_bbpress' ) ) : ?><li <?php if ( is_bbpress() ) : ?>class="current"<?php endif; ?>><a href="<?php bbp_forums_url(); ?>"><?php esc_html_e( 'Forums', 'bborg' ); ?></a></li><?php endif; ?>
     9            <?php if ( function_exists( 'is_bbpress' ) ) : ?><li <?php if ( is_bbpress() && ! is_front_page() ) : ?>class="current"<?php endif; ?>><a href="<?php bbp_forums_url(); ?>"><?php esc_html_e( 'Forums', 'bborg' ); ?></a></li><?php endif; ?>
    1010            <li class="download<?php if ( is_page( 'download' ) ) : ?> current<?php endif; ?>"><a href="<?php echo home_url( 'download' ); ?>"><?php esc_html_e( 'Download', 'bborg' ); ?></a></li>
    1111        </ul>
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/style-bbpress.css

    r14298 r14309  
    2121    /* Buttons */
    2222    --bbbase-button-background-color: rgba(0, 153, 51, 1);
    23     --bbbase-button-background-color-hover: rgba(0, 153, 51, 1);
     23    --bbbase-button-background-color-hover: rgba(0, 153, 51, 0.8);
    2424    --bbbase-button-color: rgba(235, 255, 235, 0.9);
    2525    --bbbase-button-color-hover: rgba(235, 255, 235, 0.9);
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/style-buddypress.css

    r14298 r14309  
    2020
    2121    /* Buttons */
    22     --bbbase-button-background-color: rgba(199, 66, 0, 1);
    23     --bbbase-button-background-color-hover: rgba(221, 130, 59, 0.9);
     22    --bbbase-button-background-color: rgba(221, 130, 59, 1);
     23    --bbbase-button-background-color-hover: rgba(221, 130, 59, 0.8);
    2424    --bbbase-button-color: rgba(255, 235, 235, 0.9);
    2525    --bbbase-button-color-hover: rgba(255, 235, 235, 0.9);
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/style-trac.css

    r14298 r14309  
    1010body.trac #ticket table.properties a:hover {
    1111    background-color: transparent;
     12}
     13
     14body.trac a.trac-rawlink:hover:before,
     15body.trac a.trac-ziplink:hover:before,
     16body.trac a.ext-link:hover:before,
     17body.trac a.mail-link:hover:before {
     18    border: none;
     19    text-decoration: none;
    1220}
    1321
     
    6371body.trac li {
    6472    border: none;
     73}
     74
     75body.trac ul,
     76body.trac ol {
     77    padding-left: 20px;
     78    margin: 0;
    6579}
    6680
     
    304318body.trac #mainnav ul,
    305319body.trac #mainnav ul li,
    306 body.trac #mainnav ul li a {
     320body.trac #mainnav ul li :link {
    307321    display: flex;
    308322    align-items: center;
     
    313327}
    314328
    315 body.trac #mainnav ul li a {
     329body.trac #mainnav ul li :link {
    316330    box-sizing: border-box;
    317331    padding: 0 15px;
    318332    border: 1px solid transparent !important;
    319     border-top-left-radius: 8px !important;
    320     border-top-right-radius: 8px !important;
    321 }
    322 
    323 body.trac #mainnav li.active a {
     333    border-top-left-radius: 8px;
     334    border-top-right-radius: 8px;
     335}
     336
     337body.trac #mainnav li.active :link {
    324338    margin-top: 2px;
    325     background-color: #fff !important;
    326     color: #000 !important;
     339    background-color: #fff;
     340    color: #000;
    327341    border: 1px solid var(--bbbase-grey-border-color-low-contrast) !important;
    328342    border-bottom-color: transparent !important;
    329343}
    330344
    331 body.trac #mainnav li:not(.active) a:hover {
    332     background-color: #fafafa !important;
     345body.trac #mainnav li:not(.active) :link:hover {
     346    background-color: #fafafa;
    333347    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    334348    border-bottom: 1px solid transparent !important;
     
    348362body.trac #main .date p {
    349363    margin: 0;
     364}
     365
     366body.trac #main p:first-child {
     367    margin-top: 0;
    350368}
    351369
     
    412430}
    413431
     432body.trac #ctxtnav:not(:has(a)) {
     433    display: none;
     434}
     435
    414436body.trac #ctxtnav ul {
    415437    display: flex;
     
    434456    top: auto;
    435457    right: auto;
    436     line-height:24px;
     458    line-height: 24px;
    437459    padding-top: .5em;
    438460}
     
    593615
    594616/* Roadmap */
     617body.trac #content.roadmap .milestone {
     618    margin: 0 0 30px 0;
     619}
     620
    595621body.trac #content.roadmap .milestone .info h2 {
    596622    border: none;
     
    598624}
    599625
     626body.trac #content.roadmap .milestone .info .date,
     627body.trac #content.roadmap .milestone .info .percent,
     628body.trac #content.roadmap .milestone .info .legend {
     629    font-size: 16px;
     630    font-style: normal;
     631}
    600632body.trac #content.roadmap .milestone .info .date {
    601633    color: #888;
    602     font-size: 16px;
    603     font-style: normal;
    604634    font-weight: 600;
    605     margin: 0 0 30px 0;
     635    margin: 0 20px 10px 20px;
     636}
     637
     638body.trac #content.roadmap .milestone .info .percent,
     639body.trac #content.roadmap .milestone .info .legend {
     640    margin: 10px;
     641}
     642
     643body.trac #content.roadmap .milestone .info .legend {
     644    color: var(--bbbase-brightest-white);
     645}
     646
     647body.trac #content.roadmap .milestone .info .legend span {
     648    margin: 0 0 0 10px;
     649    text-transform: capitalize;
     650}
     651
     652body.trac #content.roadmap .milestone .description {
     653    margin: 0 20px;
     654}
     655
     656body.trac table.progress,
     657body.trac .trac-groupprogress {
     658    border: none;
     659    width: 50%;
     660    max-width: 50%;
     661    margin: 0 15px;
     662    background: var(--bbbase-light-background-color-low-contrast);
     663}
     664
     665body.trac table.progress td.open {
     666    background: var(--bbbase-light-background-color-low-contrast);
     667}
     668
     669body.trac table.progress td.closed {
     670    background: var(--bbbase-button-background-color);
    606671}
    607672
     
    623688    padding: 15px 20px;
    624689    overflow: auto;
     690}
     691
     692body.trac .wikipage {
     693    padding: 0;
     694    margin: 0 0 60px 0;
     695}
     696
     697body.trac .wikipage h1 {
     698    margin: 0 0 30px 0;
    625699}
    626700
     
    805879}
    806880
     881body.trac #attachments:empty {
     882    display: none;
     883}
     884
    807885body.trac #content.ticket {
    808886    max-width: 940px;
     
    896974body.trac #ticketchange .changes,
    897975body.trac div.change ul.changes {
    898     margin: 30px 0 0 0;
     976    margin: 20px 0;
    899977    padding: 30px;
    900978    border: 1px solid #009933;
     
    904982    color: inherit;
    905983    word-break: break-word;
     984}
     985
     986body.trac #changelog h3,
     987body.trac #ticketchange h3 {
     988    border-bottom: 1px solid #d7d7d7;
     989    box-shadow: none;
     990    padding: 10px 0;
     991    margin-bottom: 15px;
     992    font-size: 100%;
     993    font-weight: normal;
    906994}
    907995
     
    12001288        margin-left: 5px;
    12011289    }
     1290
     1291    body.trac #mainnav ul,
     1292    body.trac #mainnav ul li,
     1293    body.trac #mainnav ul li :link {
     1294        height: 100%;
     1295        width: 100%;
     1296        border-radius: 0 !important;
     1297        border: none !important;
     1298        margin: 0;
     1299    }
     1300    body.trac #mainnav ul li :link {
     1301        padding: 10px;
     1302        border: none !important;
     1303    }
     1304    body.trac #mainnav ul li.active :link,
     1305    body.trac #mainnav ul li:not(.active) :link:hover {
     1306        border: none !important;
     1307        margin: 0;
     1308    }
     1309    body.trac #mainnav li {
     1310        width: 100%;
     1311    }
     1312    body.trac #mainnav ul {
     1313        display: grid;
     1314        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
     1315    }
     1316
     1317    body.trac #search input[type=submit] {
     1318        display: none;
     1319    }
    12021320}
    12031321
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/style.css

    r14298 r14309  
    137137}
    138138#header h1 a,
    139 #header h1 :link,
    140 #header h1 :link:hover,
    141 #wporg-header h1 :link,
    142 #wporg-header h1 :link:hover,
    143 #wporg-header h1 :link:visited {
     139#header h1 a:hover,
     140#wporg-header h1 a,
     141#wporg-header h1 a:hover {
    144142    border: 0;
    145143    text-decoration: none;
     
    162160    height: 400px;
    163161    line-height: 0;
     162    overflow: hidden !important;
    164163}
    165164#headline-inner p {
     
    175174    position: absolute;
    176175    bottom: 50px;
    177     font-size: 1.8em;
    178     padding: 15px 30px;
     176    font-size: 22px;
     177    padding: 25px 35px;
    179178    text-decoration: none;
    180179}
     
    290289
    291290div.content {
     291    width: 100%;
    292292    order: 2;
    293293    margin-left: auto;
     
    472472#mobile-menu-button {
    473473    display: none;
     474    border-radius: 0 !important; /* Override all other buttons */
    474475}
    475476
     
    498499}
    499500#nav li a,
    500 #wporg-header #wporg-header-menu li :link,
    501 #wporg-header #wporg-header-menu li :visited {
     501#wporg-header #wporg-header-menu li a {
    502502    display: flex;
    503503    align-items: center;
     
    513513#nav li a:hover,
    514514#nav li a.active,
    515 #wporg-header #wporg-header-menu li :link:hover,
    516 #wporg-header #wporg-header-menu li :link:active {
     515#wporg-header #wporg-header-menu li a:hover,
     516#wporg-header #wporg-header-menu li a:active {
     517    color: var(--bbbase-brightest-white);
    517518    background-color: var(--bbbase-brightest-white-blend);
    518519}
     
    19711972        width: 960px;
    19721973    }
    1973     div.content {
     1974    body:not(.page-template-page-homepage) div.content {
    19741975        width: 700px;
    19751976    }
     
    20262027        border: none;
    20272028        background: transparent;
     2029        color: var(--bbbase-darkest-black);
    20282030    }
    20292031
     
    20482050    }
    20492051    #header #nav #bb-nav li a,
    2050     #wporg-header #wporg-header-menu li :link,
    2051     #wporg-header #wporg-header-menu li :visited {
     2052    #wporg-header #wporg-header-menu li a {
    20522053        margin: 0;
    20532054        padding: 0;
     
    20572058    }
    20582059    #header #nav #bb-nav li.current a,
    2059     #header #nav #bb-nav li a:hover {
    2060         color: var(--bbbase-brightest-white);
     2060    #header #nav #bb-nav li a:hover,
     2061    #wporg-header #wporg-header-menu li.current a,
     2062    #wporg-header #wporg-header-menu li a:hover {
     2063        color: var(--bbbase-button-color-hover);
     2064        background-color: var(--bbbase-button-background-color-hover);
    20612065    }
    20622066    #header #bb-nav,
     
    20762080    #header #nav:focus #bb-menu-icon,
    20772081    #wporg-header #mobile-menu-button[aria-expanded="true"] {
    2078         background-color: rgba(255,255,255,0.3);
     2082        background-color: var(--bbbase-brightest-white-blend);
    20792083    }
    20802084    #header #nav:hover #bb-menu-icon:before,
    20812085    #header #nav:focus #bb-menu-icon:before,
    20822086    #wporg-header #mobile-menu-button[aria-expanded="true"]:before {
    2083         color: var(--bbbase-brightest-white);
     2087        color: var(--bbbase-darkest-black);
    20842088    }
    20852089}
Note: See TracChangeset for help on using the changeset viewer.