Making WordPress.org

Changeset 14298


Ignore:
Timestamp:
12/17/2024 01:58:19 AM (2 months ago)
Author:
johnjamesjacoby
Message:

BuddyPress.org/bbPress.org: Base theme improvements

  • Fix bbPress link color CSS variable value
  • Fix Trac admin styling
  • Improve contrast of BuddyPress colors
  • Improve Trac styling in Reports, Changesets, fieldsets, and form fields

Props slaffik.

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

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

Legend:

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

    r14287 r14298  
    5555
    5656    // Version of CSS
    57     $version = '202412160001';
     57    $version = '202412160002';
    5858
    5959    // Base theme styling
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/style-bbpress.css

    r14281 r14298  
    55
    66    /* Header */
    7     --bbbase-header-background-color: rgba(141,199,112,1);
     7    --bbbase-header-background-color: rgba(141, 199, 112, 1);
    88    --bbbase-header-image-url: url('../bbpress-org/images/bee.png');
    99    --bbbase-header-image-url-2x: url('../bbpress-org/images/bee-2x.png');
     
    2020
    2121    /* Buttons */
    22     --bbbase-button-background-color: rgba(0,153,51,1);
    23     --bbbase-button-background-color-hover: rgba(0,153,51,1);
    24     --bbbase-button-color: rgba(235,255,235,0.9);
    25     --bbbase-button-color-hover: rgba(235,255,235,0.9);
     22    --bbbase-button-background-color: rgba(0, 153, 51, 1);
     23    --bbbase-button-background-color-hover: rgba(0, 153, 51, 1);
     24    --bbbase-button-color: rgba(235, 255, 235, 0.9);
     25    --bbbase-button-color-hover: rgba(235, 255, 235, 0.9);
    2626
    2727    /* Links */
    28     --bbbase-link-color: #rgba(50,140,0,1);
    29     --bbbase-link-color-hover: rgba(213,78,33,1);
     28    --bbbase-link-color: rgba(50, 140, 0, 1);
     29    --bbbase-link-color-hover: rgba(213, 78, 33, 1);
    3030
    3131    /* Subnav */
    32     --bbbase-subnav-color-hover: rgba(141,199,112,1);
     32    --bbbase-subnav-color-hover: rgba(141, 199, 112, 1);
    3333
    3434    /* Lists */
    35     --bbbase-list-hover-helper-background: rgba(235,255,235,1);
     35    --bbbase-list-hover-helper-background: rgba(235, 255, 235, 1);
    3636}
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/style-buddypress.css

    r14281 r14298  
    55
    66    /* Header */
    7     --bbbase-header-background-color: rgb(221,130,59,1);
     7    --bbbase-header-background-color: rgb(221, 130, 59, 1);
    88    --bbbase-header-image-url: none;
    99    --bbbase-header-image-url-2x: none;
     
    2020
    2121    /* Buttons */
    22     --bbbase-button-background-color: rgba(221,130,59,0.9);
    23     --bbbase-button-background-color-hover: rgba(221,130,59,0.9);
    24     --bbbase-button-color: rgba(255,235,235,0.9);
    25     --bbbase-button-color-hover: rgba(255,235,235,0.9);
     22    --bbbase-button-background-color: rgba(199, 66, 0, 1);
     23    --bbbase-button-background-color-hover: rgba(221, 130, 59, 0.9);
     24    --bbbase-button-color: rgba(255, 235, 235, 0.9);
     25    --bbbase-button-color-hover: rgba(255, 235, 235, 0.9);
    2626
    2727    /* Links */
    28     --bbbase-link-color: rgba(221,130,59,0.9);
    29     --bbbase-link-color-hover: rgba(213,78,33,1);
     28    --bbbase-link-color: rgba(199, 66, 0, 1);
     29    --bbbase-link-color-hover: rgba(213, 78, 33, 1);
    3030
    3131    /* Subnav */
    32     --bbbase-subnav-color-hover: rgb(216,72,0,1);
     32    --bbbase-subnav-color-hover: rgb(216, 72, 0, 1);
    3333
    3434    /* Lists */
    35     --bbbase-list-hover-helper-background: rgba(255,235,235,1);
     35    --bbbase-list-hover-helper-background: rgba(255, 235, 235, 1);
    3636}
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/style-trac.css

    r14281 r14298  
    2323body.trac fieldset {
    2424    position: relative;
    25     border-radius: 8px;
     25    border-radius: var(--bbbase-border-radius);
    2626}
    2727
     
    4242body.trac input[type=text],
    4343body.trac input.textwidget {
    44     border-radius: 8px;
     44    border-radius: var(--bbbase-border-radius);
    4545}
    4646
     
    6363body.trac li {
    6464    border: none;
     65}
     66
     67body.trac .buttons {
     68    margin: 30px 0;
     69    text-align: right;
     70}
     71
     72body.trac .buttons input {
     73    margin: 0 0 0 10px;
    6574}
    6675
     
    209218body.trac #subnav #nav-user:before {
    210219    font: normal 20px/1 'dashicons';
    211     color: rgba(240, 246, 252, .6);
     220    color: rgba(240, 246, 252, .6); /* Not variable */
    212221    content: '\f120';
    213222    float: left;
     
    221230    width: 100%;
    222231}
    223 body.trac #subnav #nav-user li {
    224 
    225 }
    226232
    227233body.trac #subnav #nav-user a {
     
    240246body.trac #banner,
    241247body.trac #mainnav {
    242     background-color: #eee;
     248    background-color: var(--bbbase-grey-background-color-low-contrast);
    243249}
    244250
     
    282288body.trac #banner form#search input {
    283289    font-size: 16px;
     290    font-weight: 400;
    284291    padding: 10px 15px;
    285     border-radius: 8px;
     292    border-radius: var(--bbbase-border-radius);
    286293}
    287294
     
    292299/* Main Navigation */
    293300body.trac #mainnav {
    294     border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important;
     301    border-bottom: 1px solid var(--bbbase-grey-border-color-low-contrast) !important;
    295302}
    296303
     
    318325    background-color: #fff !important;
    319326    color: #000 !important;
    320     border: 1px solid rgba(0, 0, 0, 0.3) !important;
     327    border: 1px solid var(--bbbase-grey-border-color-low-contrast) !important;
    321328    border-bottom-color: transparent !important;
    322329}
     
    361368}
    362369
     370/* Notices */
     371body.trac #main .wp-notice {
     372    margin: 0;
     373    padding: 30px;
     374}
     375
     376body.trac #main .wp-notice p:first-child {
     377    margin-top: 0;
     378}
     379
     380body.trac #main .wp-notice p:last-child {
     381    margin-bottom: 0;
     382}
     383
     384body.trac #main .newticket-not-here .support,
     385body.trac #main .newticket-not-here .security {
     386    margin-bottom: 0;
     387}
     388
     389/* Alt Links */
     390body.trac #main #altlinks {
     391    float: none;
     392    text-align: center;
     393    margin: 30px 0;
     394    max-width: none;
     395}
     396
     397body.trac #main #altlinks .preferences-link {
     398    float: none;
     399    margin: 0 0 0 auto;
     400    padding: 20px;
     401}
     402
     403body.trac #main #altlinks > a,
     404body.trac #main #altlinks h3,
     405body.trac #main #altlinks li {
     406    font-size: 14px;
     407}
     408
    363409/* Context Nav */
    364410body.trac #ctxtnav {
    365     border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important;
     411    border-bottom: 1px solid var(--bbbase-grey-border-color-low-contrast) !important;
    366412}
    367413
     
    470516
    471517/* Prefs */
     518body.trac #content.prefs #tabs {
     519    padding: 0;
     520    margin: 0 auto;
     521}
     522
     523body.trac #content.prefs #tabs li {
     524    list-style: none;
     525    padding: 15px;
     526}
     527
     528body.trac #content.prefs #tabcontent {
     529    margin: 0 0 60px;
     530    padding: 60px 0 0 0;
     531}
     532
    472533body.trac #content #prefs {
    473534    background: #eee;
    474     border-radius: 8px;
     535    border-radius: var(--bbbase-border-radius);
    475536    padding: 20px;
    476537    margin: 30px 0;
     
    504565body.trac #content #prefs input,
    505566body.trac #content #prefs select {
    506     font-size: 15px;
    507     padding: 8px 10px;
    508     border-radius: 8px;
     567    padding: 8px 12px;
     568    border-radius: var(--bbbase-border-radius);
    509569}
    510570
    511571body.trac #content #prefs fieldset {
    512     border-radius: 8px;
     572    border-radius: var(--bbbase-border-radius);
    513573    border: 1px solid #ccc;
    514574    padding: 10px 20px 20px 20px;
     
    559619    box-shadow: 0 0 1em #eee;
    560620    font-size: 15px;
    561     border-radius: 8px;
     621    border-radius: var(--bbbase-border-radius);
    562622    margin: 20px 0;
    563623    padding: 15px 20px;
     
    627687}
    628688
     689body.trac #content.report div.reports > div {
     690    position: relative;
     691    padding: 20px;
     692    margin-bottom: 20px;
     693    background: var(--bbbase-grey-background-color-low-contrast);
     694}
     695
     696body.trac #content.report div.reports > h2 {
     697    border-bottom: none;
     698    margin-top: 30px;
     699}
     700
     701body.trac #content.report h3 {
     702    border: none;
     703}
     704
     705body.trac #content.report .inlinebuttons input[type=button],
     706body.trac #content.report .inlinebuttons input[type=submit] {
     707    margin-left: 5px;
     708    color: var(--bbbase-button-background-color);
     709    background: transparent;
     710}
     711
     712
    629713/* Tickets */
    630714body.trac div#ticket {
    631     border-radius: 8px;
     715    border-radius: var(--bbbase-border-radius);
    632716    margin: 0 0 30px 0;
    633717    padding: 30px;
     
    710794    margin-bottom: 30px;
    711795    border: 1px solid #ccc;
    712     border-radius: 8px;
     796    border-radius: var(--bbbase-border-radius);
    713797    overflow: hidden;
    714798}
     
    721805}
    722806
     807body.trac #content.ticket {
     808    max-width: 940px;
     809}
     810
    723811body.trac #content.ticket h3.foldable {
    724812    font-size: 17px;
     
    739827body.trac #content.ticket div#github-prs + div:not(.collapsed) h3.foldable {
    740828    margin: 30px 0;
     829}
     830
     831body.trac #content.ticket #propertyform[action*="/newticket"] fieldset {
     832    padding: 30px;
     833    border: 1px solid var(--bbbase-grey-border-color-low-contrast);
     834    background: var(--bbbase-light-background-color-low-contrast);
     835}
     836
     837body.trac #content.ticket #propertyform[action*="/newticket"] fieldset fieldset {
     838    padding: 0;
    741839}
    742840
     
    786884    color: #aaa;
    787885    border: 1px solid #ccc;
    788     border-radius: 8px;
     886    border-radius: var(--bbbase-border-radius);
    789887}
    790888
     
    859957}
    860958
     959/* Browser */
     960body.trac #content.browser {
     961    display: flex;
     962    flex-wrap: wrap;
     963    flex-direction: row;
     964    gap: 30px;
     965    margin-bottom: 60px;
     966}
     967
     968body.trac #content.browser h1,
     969body.trac #content.browser #anydiff,
     970body.trac #content.browser #help {
     971    flex-basis: 100%;
     972    margin-bottom: 0;
     973}
     974
     975body.trac #content.browser #anydiff,
     976body.trac #content.browser #help {
     977    text-align: right;
     978}
     979
     980body.trac #content.browser #diffrev,
     981body.trac #content.browser #jumprev,
     982body.trac #content.browser #jumploc {
     983    float: none;
     984    font-size: 16px;
     985    margin: 0 20px 0 0;
     986}
     987
     988body.trac #content.browser #diffrev input,
     989body.trac #content.browser #jumprev input,
     990body.trac #content.browser #jumploc select,
     991body.trac #content.browser #jumploc input {
     992    font-size: 16px;
     993    margin: 0;
     994}
     995
     996body.trac #content.browser #info .props {
     997    list-style: none;
     998    margin: 0;
     999    padding: 20px;
     1000    font-family: monospace;
     1001}
     1002body.trac #content.browser #info .props li:not(:last-of-type) {
     1003    margin-bottom: 20px;
     1004}
     1005
     1006/* Changeset */
     1007body.trac #main .message.searchable p {
     1008    margin: 15px 0;
     1009}
     1010
     1011body.trac #main .message.searchable p:first-of-type {
     1012    margin-top: 0;
     1013}
     1014
     1015body.trac #main .message.searchable p:last-of-type {
     1016    margin-bottom: 0;
     1017}
     1018
     1019body.trac #file-legend {
     1020    margin: 0;
     1021}
     1022
     1023body.trac .legend {
     1024    font-size: 16px;
     1025    padding: 0;
     1026    margin: 0;
     1027}
     1028
     1029body.trac #main #info {
     1030    background: var(--bbbase-grey-background-color-low-contrast);
     1031    border: 1px solid var(--bbbase-grey-border-color-low-contrast);
     1032}
     1033
     1034body.trac #main #info th,
     1035body.trac #main #info td {
     1036    padding: 20px;
     1037}
     1038
     1039body.trac #main #info tr:first-child th,
     1040body.trac #main #info tr:first-child td {
     1041    padding-bottom: 10px;
     1042}
     1043
     1044body.trac #main #info tr:last-child th,
     1045body.trac #main #info tr:last-child td {
     1046    padding-top: 10px;
     1047}
     1048
     1049/* Admin */
     1050body.trac #content.admin {
     1051    float: none;
     1052    display: flex;
     1053    flex-direction: row;
     1054    flex-wrap: wrap;
     1055    gap: 30px;
     1056    margin-bottom: 60px;
     1057}
     1058
     1059body.trac #content.admin h1 {
     1060    float: none;
     1061    flex-basis: 100%;
     1062    margin-bottom: 0;
     1063}
     1064
     1065body.trac #content.admin #tabs {
     1066    float: none;
     1067    flex: 0 0 auto;
     1068    width: 200px;
     1069    margin: 0;
     1070    padding: 0;
     1071    border-radius: var(--bbbase-border-radius);
     1072    background-color: var(--bbbase-grey-background-color-low-contrast);
     1073}
     1074
     1075body.trac #content.admin #tabs > ul {
     1076    margin: 20px 0 0 0;
     1077    padding: 0;
     1078}
     1079
     1080body.trac #content.admin #tabs > ul:not(:last-of-type) {
     1081    border-bottom: 1px solid var(--bbbase-grey-border-color-low-contrast)
     1082}
     1083
     1084body.trac #content.admin #tabs > ul > li {
     1085    margin: 15px;
     1086}
     1087
     1088body.trac #content.admin #tabs > ul > li > ul {
     1089    margin: 8px -21px 0 -21px;
     1090}
     1091
     1092body.trac #content.admin #tabs li {
     1093    list-style: none;
     1094    margin: 0;
     1095}
     1096
     1097body.trac #content.admin #tabs li li:hover {
     1098    background: var(--bbbase-button-background-color);
     1099}
     1100body.trac #content.admin #tabs li li.active {
     1101    background: var(--bbbase-button-background-color);
     1102    color: var(--bbbase-brightest-white);
     1103    border: none;
     1104}
     1105
     1106body.trac #content.admin #tabs li :link,
     1107body.trac #content.admin #tabs li :visited {
     1108    border: none;
     1109    display: block;
     1110    border-radius: 0;
     1111    padding: 8px 10px;
     1112    margin: 0;
     1113    text-decoration: none;
     1114}
     1115
     1116body.trac #content.admin #tabs li li.active :link,
     1117body.trac #content.admin #tabs li li.active :visited {
     1118    color: var(--bbbase-brightest-white);
     1119}
     1120
     1121body.trac #content.admin #tabs li li:hover a {
     1122    color: var(--bbbase-brightest-white);
     1123}
     1124
     1125body.trac #content.admin #tabcontent {
     1126    float: none;
     1127    flex: 1;
     1128    min-width: 0;
     1129    margin: 0;
     1130    padding: 0;
     1131}
     1132body.trac #content.admin #tabcontent p.hint {
     1133    margin: 0;
     1134    padding: 0 20px 20px 20px;
     1135}
     1136body.trac #content.admin #tabcontent input {
     1137    max-width: 400px;
     1138}
     1139body.trac #content.admin #tabcontent fieldset {
     1140    margin-bottom: 30px;
     1141}
     1142body.trac #content.admin #tabcontent .field td:first-child {
     1143    width: 210px;
     1144    text-align: right;
     1145    padding-right: 20px;
     1146}
     1147
     1148/* System Messages */
     1149body.trac #notice.system-message,
     1150body.trac #notice.system-message,
     1151body.trac #warning.system-message,
     1152body.trac .warning.system-message {
     1153    max-width: 880px;
     1154    padding: 30px;
     1155    margin: 30px auto -30px;
     1156    font-size: 16px;
     1157    background-color: #ffe;
     1158    border-color: #e6db55;
     1159    border-radius: var(--bbbase-border-radius);
     1160}
     1161
     1162body.trac div.system-message .trac-close-msg {
     1163    border: none;
     1164    color: var(--bbbase-grey-border-color-low-contrast);
     1165    text-decoration: none;
     1166    text-transform: uppercase;
     1167    padding: 3px 5px;
     1168    margin: 0;
     1169}
     1170
    8611171/* Footer */
    862 
    8631172body.trac #footer {
    8641173    width: 100%;
     
    8741183}
    8751184
    876 body.trac #footer > * {
    877     max-width: 920px;
    878     width: 100%;
    879 }
    880 
    881 body.trac #footer-inner {
    882     font-size: 12px;
    883     margin: 0 auto;
    884     display: flex;
    885     align-items: center;
    886 }
    887 body.trac #footer div {
    888     padding: 40px 0;
    889 }
    890 body.trac #footer div.details {
    891     order: 1;
    892     margin-right: auto;
    893 }
    894 body.trac #footer div.links {
    895     order: 2;
    896     margin-left: auto;
    897 }
    898 body.trac #footer p {
    899     margin: 0;
    900 }
    901 
    902 
    9031185/* Mock-admin bar */
    9041186@media screen {
  • sites/trunk/buddypress.org/public_html/wp-content/themes/bb-base/style.css

    r14281 r14298  
    3535:root {
    3636
     37    /* Border Radius */
     38    --bbbase-border-radius: 8px;
     39
    3740    /* Header */
    38     --bbbase-header-background-color: #eee;
     41    --bbbase-header-background-color: rgba(238, 238, 238, 1);
    3942    --bbbase-header-image-url: none;
    4043    --bbbase-header-image-url-2x: none;
     
    5154
    5255    /* Buttons */
    53     --bbbase-button-background-color: #000;
    54     --bbbase-button-background-color-hover: #000;
    55     --bbbase-button-color: #fff;
    56     --bbbase-button-color-hover: #fff;
     56    --bbbase-button-background-color: rgba(0, 0, 0, 1);
     57    --bbbase-button-background-color-hover: rgba(0, 0, 0, 1);
     58    --bbbase-button-color: rgba(255, 255, 255, 1);
     59    --bbbase-button-color-hover: rgba(255, 255, 255, 1);
    5760
    5861    /* Links */
    59     --bbbase-link-color: #000;
    60     --bbbase-link-color-hover: #333;
     62    --bbbase-link-color: rgba(0, 0, 0, 1);
     63    --bbbase-link-color-hover: rgba(51, 51, 51, 1);
    6164
    6265    /* Subnav */
    63     --bbbase-subnav-color-hover: #000;
     66    --bbbase-subnav-color-hover: rgba(0, 0, 0, 1);
    6467
    6568    /* Lists */
    66     --bbbase-list-hover-helper-background: rgba(0,0,0,0.01);
     69    --bbbase-list-hover-helper-background: rgba(0, 0, 0, 0.01);
     70
     71    /* Screen Reader */
     72    --bbbase-screen-reader-color: rgba(33, 117, 155, 1);
     73    --bbbase-screen-reader-shador-color: rgba(0, 0, 0, 0.6);
    6774
    6875    /* Common Colors */
    69     --bbbase-brightest-white: #fff;
    70     --bbbase-darkest-black: #000;
    71     --bbbase-light-background-low-contrast: #fafafa;
    72     --bbbase-grey-background-low-contrast: #eee;
    73     --bbbase-grey-border-low-contrast: #ccc;
    74     --bbbase-grey-border-low-contrast: #ccc;
     76    --bbbase-brightest-white: rgba(255, 255, 255, 1);
     77    --bbbase-brightest-white-blend: rgba(255, 255, 255, 0.3);
     78    --bbbase-darkest-black: rgba(0, 0, 0, 1);
     79    --bbbase-darkest-black-blend: rgba(0, 0, 0, 0.05);
     80    --bbbase-light-background-color-low-contrast: rgba(250, 250, 250, 1);
     81    --bbbase-grey-background-color-low-contrast: rgba(238, 238, 238, 1);
     82    --bbbase-grey-border-color-low-contrast: rgba(204, 204, 204, 1);
     83    --bbbase-darkest-text-color-low-contrast: rgba(34, 34, 34, 1);
     84    --bbbase-darker-text-color-low-contrast: rgba(51, 51, 51, 1);
     85    --bbbase-dark-text-color-low-contrast: rgba(85, 85, 85, 1);
     86    --bbbase-light-text-color-low-contrast: rgba(170, 170, 170, 1);
     87    --bbbase-lightest-text-color-low-contrast: rgba(241, 241, 241, 1);
     88
     89    /* Form Field Colors */
     90    --bbbase-form-field-background-color: rgba(255, 255, 255, 1);
     91    --bbbase-form-field-outline-color: rgba(102, 128, 189, 1);
    7592}
    7693
     
    86103    text-align: left;
    87104    background: var(--bbbase-brightest-white);
    88     margin: 0;
    89     color: #222;
     105    color: var(--bbbase-darkest-text-color-low-contrast);
     106    margin: 0;
    90107}
    91108.hide-if-js {
     
    153170    font-weight: 400;
    154171    font-size: 16px;
    155     color: #555;
     172    color: var(--bbbase-dark-text-color-low-contrast);
    156173}
    157174#big-demo-button {
     
    169186p.headline-label {
    170187    padding: 0 0 24px 10px;
    171     color: var(--bbbase-grey-border-low-contrast);
     188    color: var(--bbbase-grey-border-color-low-contrast);
    172189}
    173190p.plans {
     
    179196}
    180197#showcase {
    181     background-color: var(--bbbase-grey-background-low-contrast);
    182     color: #555;
     198    background-color: var(--bbbase-grey-background-color-low-contrast);
     199    color: var(--bbbase-dark-text-color-low-contrast);
    183200}
    184201#showcase-inner {
     
    188205}
    189206#showcase h3 {
    190     color: #333;
     207    color: var(--bbbase-darker-text-color-low-contrast);
    191208    margin: 0 0 10px 0;
    192209}
     
    205222#footer {
    206223    width: 100%;
    207     background-color: var(--bbbase-light-background-low-contrast);
    208     color: #aaa;
     224    background-color: var(--bbbase-light-background-color-low-contrast);
     225    color: var(--bbbase-light-text-color-low-contrast);
    209226}
    210227#footer-inner {
     
    265282}
    266283div.feature img {
    267     border: 1px solid var(--bbbase-grey-border-low-contrast);
     284    border: 1px solid var(--bbbase-grey-border-color-low-contrast);
    268285}
    269286
    270287a:hover img {
    271     border: 1px solid #555
     288    border: 1px solid var(--bbbase-dark-text-color-low-contrast);
    272289}
    273290
     
    288305div.group {
    289306    padding: 20px 20px 1px 20px;
    290     background: var(--bbbase-grey-background-low-contrast);
     307    background: var(--bbbase-grey-background-color-low-contrast);
    291308    margin: 0 0 24px 0;
    292309}
     
    325342    margin: 0 24px 12px 0;
    326343    background: #f6f6f6;
    327     border: var(--bbbase-grey-border-low-contrast) solid 1px;
     344    border: var(--bbbase-grey-border-color-low-contrast) solid 1px;
    328345}
    329346div.plan p {
     
    348365}
    349366div.plan ul li {
    350     border-bottom: var(--bbbase-grey-border-low-contrast) solid 1px;
     367    border-bottom: var(--bbbase-grey-border-color-low-contrast) solid 1px;
    351368    list-style: none;
    352369}
     
    382399
    383400div.single-post table tr.alt td {
    384     background: #f5f5f5;
     401    background: var(--bbbase-grey-background-color-low-contrast);
    385402}
    386403
     
    397414
    398415    /* Overrides */
     416    cursor: pointer;
    399417    font-family: sans-serif;
    400418    height: auto;
    401     line-height: 1;
    402     padding: 5px 10px;
    403     font-weight: 600;
    404     border-radius: 8px;
     419    line-height: 1rem;
     420    padding: 8px 12px;
     421    font-weight: 400;
     422    border-radius: var(--bbbase-border-radius) !important;
    405423    border: none;
    406424}
     
    426444}
    427445
     446.button[disabled],
     447button[disabled],
     448input[type=button][disabled],
     449input[type=submit][disabled],
     450input[type=reset][disabled] {
     451    cursor: not-allowed;
     452    color: var(--bbbase-dark-text-color-low-contrast);
     453    background-color: var(--bbbase-grey-background-color-low-contrast);
     454
     455    /* Overrides */
     456    border: none;
     457    -webkit-box-shadow: none;
     458    box-shadow: none;
     459    text-shadow: none;
     460}
     461
    428462/* =Navigation
    429463-------------------------------------------------------------- */
     
    443477#mobile-menu-button:before {
    444478    font: normal 16px/1 'dashicons';
    445     color: var(--bbase-darkest-black);
     479    color: var(--bbbase-darkest-black);
    446480    content: '\f349';
    447481    flex-shrink: 0;
     
    472506    width: 100%;
    473507    height: 100%;
    474     color: #fff;
     508    color: var(--bbbase-brightest-white);
    475509    padding: 0 13px;
    476510    font-weight: 600;
     
    481515#wporg-header #wporg-header-menu li :link:hover,
    482516#wporg-header #wporg-header-menu li :link:active {
    483     background-color: rgba(255,255,255,0.3);
     517    background-color: var(--bbbase-brightest-white-blend);
    484518}
    485519
    486520#nav li.current-menu-item a,
    487521#nav li.current-page-ancestor a,
    488 #nav li.current a {
     522#nav li.current a,
     523#wporg-header #wporg-header-menu li.current a {
    489524
    490525    /* Match body for strong emphasis */
    491     background-color: #fff;
    492     color: #111;
     526    background-color: var(--bbbase-brightest-white);
     527    color: var(--bbbase-darkest-black);
    493528}
    494529
     
    507542
    508543h2 {
     544    color: var(--bbbase-darkest-black);
    509545    font-size: 20px;
    510     color: var(--bbase-darkest-black);
    511546    margin: 0 0 30px 0;
    512547}
     
    522557    font-weight: 400;
    523558    font-size: 2.5em;
    524     color: #555;
     559    color: var(--bbbase-dark-text-color-low-contrast);
    525560    text-shadow: none;
    526561    text-decoration: none;
    527562}
    528563
     564h3,
     565h4,
     566h5,
     567h6 {
     568    color: var(--bbbase-darker-text-color-low-contrast);
     569}
     570
    529571h3 {
    530572    font-size: 15px;
    531     color: #333;
    532573    margin-bottom: 15px;
    533574}
    534 
    535575h3.tour {
    536     background: var(--bbbase-grey-background-low-contrast);
    537     color: var(--bbase-darkest-black);
     576    background: var(--bbbase-grey-background-color-low-contrast);
     577    color: var(--bbbase-darkest-black);
    538578    padding: 6px 15px;
    539579    margin: 0 0 12px 0;
    540     border-bottom: var(--bbbase-grey-border-low-contrast) solid 1px;
     580    border-bottom: var(--bbbase-grey-border-color-low-contrast) solid 1px;
    541581    font-size: 18px;
    542582}
     
    544584    margin: 0 0 12px 0;
    545585}
     586
    546587h4 {
    547588    font-size: 14px;
    548     color: #333;
    549 }
     589}
     590
    550591
    551592/* =Lists
     
    568609dl dt {
    569610    font-weight: 600;
    570     color: #333;
     611    color: var(--bbbase-darker-text-color-low-contrast);
    571612}
    572613dl dd {
     
    576617    float: left;
    577618    width: 140px;
    578     color: #444;
     619    color: var(--bbbase-dark-text-color-low-contrast);
    579620    font-size: 12px;
    580621    text-align: right;
     
    588629dl.help dt {
    589630    font-size: 14px;
    590     color: var(--bbase-darkest-black);
     631    color: var(--bbbase-darkest-black);
    591632}
    592633dl.help dd {
    593634    margin: 0 0 24px 0;
    594635    padding: 0 0 24px 0;
    595     border-bottom: var(--bbbase-grey-border-low-contrast) solid 1px;
     636    border-bottom: var(--bbbase-grey-border-color-low-contrast) solid 1px;
    596637}
    597638
     
    618659    max-width: 680px;
    619660    padding: 10px;
    620     border: 1px solid var(--bbbase-grey-border-low-contrast);
    621     background: var(--bbbase-grey-background-low-contrast);
     661    border: 1px solid var(--bbbase-grey-border-color-low-contrast);
     662    background: var(--bbbase-grey-background-color-low-contrast);
    622663    position: relative;
    623664}
    624665
    625666div.wp-caption img {
    626     border: 5px double var(--bbbase-grey-border-low-contrast);
     667    border: 5px double var(--bbbase-grey-border-color-low-contrast);
    627668    position: relative;
    628669    display: block;
     
    648689    font-style: italic;
    649690    font-size: 15px;
    650     border: 1px dotted var(--bbbase-grey-border-low-contrast);
     691    border: 1px dotted var(--bbbase-grey-border-color-low-contrast);
    651692    padding: 10px;
    652693    margin: 0 0 15px 0;
     
    654695}
    655696blockquote:before {
    656     color: #ccc;
     697    color: var(--bbbase-dark-text-color-low-contrast);
    657698    content: open-quote;
    658699    font-size: 4em;
     
    673714    font-size: 14px;
    674715    font-style: normal;
    675     color: #aaa;
     716    color: var(--bbbase-light-text-color-low-contrast);
    676717    display: block;
    677718    margin-bottom: 15px;
     
    703744small {
    704745    font-size: 12px;
    705     color: #666 !important;
     746    color: var(--bbbase-dark-text-color-low-contrast) !important;
    706747}
    707748div.action {
    708     background: #EBF5FA;
     749    background: var(--bbbase-grey-background-color-low-contrast);
    709750    font-size: 20px;
    710751    text-align: center;
     
    713754}
    714755div.action a:hover {
    715     color: var(--bbase-darkest-black);
     756    color: var(--bbbase-darkest-black);
    716757}
    717758
     
    732773
    733774.screen-reader-text:focus {
    734     background-color: #f1f1f1;
     775    background-color: var(--bbbase-brightest-white);
    735776    border-radius: 3px;
    736     -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    737     box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
     777    -webkit-box-shadow: 0 0 2px 2px var(--bbbase-screen-reader-shadow-color);
     778    box-shadow: 0 0 2px 2px var(--bbbase-screen-reader-shadow-color);
    738779    clip: auto !important;
    739     color: #21759b;
     780    color: var(--bbbase-screen-reader-color);
    740781    display: block;
    741782    font-size: 14px;
     
    771812input,
    772813select {
     814    background-color: var(--bbbase-form-field-background-color);
     815    color: var(--bbbase-form-field-color);
     816    border: 1px solid var(--bbbase-grey-border-color-low-contrast);
     817    border-radius: var(--bbbase-border-radius);
    773818    font: 14px/16px sans-serif;
    774819    padding: 5px 10px;
    775     color: #333;
    776     border: 1px solid #ccc;
    777     border-radius: 8px;
    778820}
    779821input.submit {
    780822    border: none;
    781     font-weight: 600;
     823    font-weight: 400;
    782824    cursor: pointer;
    783 }
    784 #footer input.submit {
    785     font-size: 12px;
    786 }
    787 dl.support-request input {
    788     width: 98%;
    789825}
    790826
     
    861897.commentlist li .avatar {
    862898    float: left;
    863     border: 1px solid var(--bbbase-grey-background-low-contrast);
    864899    padding: 2px;
    865900    margin: 0 10px 10px 0;
    866     background: #fff;
     901    border: 1px solid var(--bbbase-grey-background-color-low-contrast);
     902    background: var(--bbbase-brightest-white);
    867903}
    868904.commentlist li ul li {
     
    931967}
    932968.thread-even {
    933     background-color: #fff;
     969    background-color: var(--bbbase-brightest-white);
    934970}
    935971.depth-1 {
    936     border: 1px solid var(--bbbase-grey-border-low-contrast);
     972    border: 1px solid var(--bbbase-grey-border-color-low-contrast);
    937973}
    938974a.reply {
     
    954990#bbpress-forums hr {
    955991    margin: 40px;
    956     border: 1px solid var(--bbbase-grey-background-low-contrast);
     992    border: 1px solid var(--bbbase-grey-background-color-low-contrast);
    957993}
    958994
     
    10391075
    10401076#bbpress-forums .bbp-pagination {
    1041     color: #888;
     1077    color: var(--bbbase-dark-text-color-low-contrast);
    10421078    float: none;
    10431079    display: flex;
     
    10651101#bbpress-forums .bbp-pagination-links a {
    10661102    border: 1px solid transparent;
    1067     border-radius: 8px;
     1103    border-radius: var(--bbbase-border-radius);
    10681104    font-size: 16px;
    10691105    padding: 4px 8px;
     
    11571193#bbpress-forums div.bbp-topic-content pre,
    11581194#bbpress-forums div.bbp-reply-content pre {
    1159     background-color: #f0f0f0;
     1195    background-color: var(--bbbase-lightest-text-color-low-contrast);
    11601196    max-height: 40em;
    11611197}
     
    11821218#bbpress-forums .bbp-topic-form select {
    11831219    padding: 6px 8px;
    1184     border-radius: 8px;
     1220    border-radius: var(--bbbase-border-radius);
    11851221}
    11861222
     
    11941230    font-weight: 600;
    11951231    font-size: 15px;
    1196     color: #333;
     1232    color: var(--bbbase-darker-text-color-low-contrast);
    11971233    padding: 10px 0 10px 0;
    11981234}
     
    12601296#bbpress-forums ul.sticky.status-closed li.bbp-topic-title:before,
    12611297#bbpress-forums ul.super-sticky.status-closed li.bbp-topic-title:before {
    1262     color: #bbb;
     1298    color: var(--bbbase-light-text-color-low-contrast);
    12631299}
    12641300
     
    12691305#bbpress-forums ul.status-closed,
    12701306#bbpress-forums ul.status-closed a {
    1271     color: #aaa;
     1307    color: var(--bbbase-light-text-color-low-contrast);
    12721308}
    12731309
     
    12771313
    12781314#bbpress-forums p.bbp-topic-meta a {
    1279     color: #888;
     1315    color: var(--bbbase-dark-text-color-low-contrast);
    12801316    text-decoration: none;
    12811317}
    12821318
    12831319#bbpress-forums p.bbp-topic-meta .bbp-topic-started-in a {
    1284     color: #999;
    1285     background-color: var(--bbbase-grey-background-low-contrast);
     1320    color: var(--bbbase-dark-text-color-low-contrast);
     1321    background-color: var(--bbbase-grey-background-color-low-contrast);
     1322    border: 0.5px solid var(--bbbase-dark-text-color-low-contrast);
     1323    border-radius: 10px;
    12861324    padding: 3px 8px;
    1287     border-radius: 10px;
    1288     border: 0.5px solid #999;
    12891325    font-size: 10px;
    12901326    font-weight: 400;
     
    13221358    margin: 5px 15px 5px 5px;
    13231359    display: none;
    1324     color: rgba(0,0,0,0.05);
     1360    color: var(--bbbase-darkest-black-blend);
    13251361}
    13261362
     
    13721408    max-width: 40px;
    13731409    max-height: 40px;
    1374     border-radius: 8px;
     1410    border-radius: var(--bbbase-border-radius);
    13751411}
    13761412
     
    14041440div.bbp-template-notice,
    14051441div.indicator-hint {
    1406     border-radius: 8px;
     1442    border-radius: var(--bbbase-border-radius);
    14071443    padding: 0;
    14081444    margin: 0 0 30px 0;
     
    14211457    text-align: right;
    14221458    padding: 20px;
    1423     background: #f5f5f5;
     1459    background: var(--bbbase-grey-background-color-low-contrast);
    14241460}
    14251461#bbpress-forums #bbp-your-profile fieldset.submit div {
     
    14661502#bbpress-forums div.bbp-reply-content pre,
    14671503#bbpress-forums div.bbp-topic-content pre {
    1468     background-color: #f2f2f2;
     1504    background-color: var(--bbbase-lightest-text-color-low-contrast);
     1505    border: 1px dotted var(--bbbase-grey-border-color-low-contrast);
    14691506    overflow: auto;
    14701507    margin: 5px 5px 15px 5px;
    14711508    padding: 10px;
    1472     border: 1px dotted #bbb;
    14731509}
    14741510
     
    14771513#bbpress-forums fieldset.bbp-form select,
    14781514#bbpress-forums fieldset.bbp-form input {
    1479     border: 1px solid #ccc;
    1480     outline-color: rgb(102, 128, 189) !important;
     1515    border: 1px solid var(--bbbase-grey-border-color-low-contrast);
     1516    outline-color: var(--bbbase-form-field-outline-color) !important;
    14811517}
    14821518
     
    14971533#bbpress-forums #bbp-single-user-details #bbp-user-navigation a {
    14981534    padding: 8px 15px;
    1499     border-radius: 8px;
     1535    border-radius: var(--bbbase-border-radius);
    15001536}
    15011537
     
    15611597#bbpress-forums #bbp-your-profile fieldset select,
    15621598#bbpress-forums #bbp-your-profile fieldset textarea {
    1563     border-radius: 8px;
    1564     background-color: #fff;
     1599    color: var(--bbbase-form-field-color);
     1600    background-color: var(--bbbase-form-field-background-color);
     1601    border-radius: var(--bbbase-border-radius);
    15651602    margin-top: 0;
    15661603}
     
    15991636    font: normal 16px/23px 'dashicons';
    16001637    margin-right: 5px;
    1601     color: var(--bbase-darkest-black);
     1638    color: var(--bbbase-darkest-black);
    16021639}
    16031640
     
    17031740    padding: 10px 20px 15px 20px;
    17041741    margin-left: 20px;
    1705     background: var(--bbbase-light-background-low-contrast);
    1706     border: 1px solid var(--bbbase-grey-background-low-contrast);
     1742    background: var(--bbbase-light-background-color-low-contrast);
     1743    border: 1px solid var(--bbbase-grey-background-color-low-contrast);
    17071744}
    17081745
     
    17281765#bbpress-forums .wp-editor-tools a {
    17291766    border: none;
    1730     color: #888;
     1767    color: var(--bbbase-dark-text-color-low-contrast);
    17311768    background: none;
    17321769    float: none;
     
    17371774    background: #f6f6f6;
    17381775    border: none;
    1739     border-color: var(--bbbase-grey-border-low-contrast);
     1776    border-color: var(--bbbase-grey-border-color-low-contrast);
    17401777    border-width: 1px 1px 0 1px;
    17411778    border-style: solid;
     
    17531790
    17541791#bbpress-forums .mceIframeContainer {
    1755     border: 1px solid #ccc !important;
     1792    border: 1px solid var(--bbbase-grey-border-color-low-contrast) !important;
    17561793    margin-top: -3px;
    17571794}
     
    17681805#bbpress-forums p.bbp-user-nicename {
    17691806    font-weight: 600;
    1770     color: #666;
     1807    color: var(--bbbase-dark-text-color-low-contrast);
    17711808    direction: ltr;
    17721809    word-wrap: break-word;
     
    18371874#menu-bp li a:hover {
    18381875    text-decoration: none;
    1839     background: var(--bbbase-light-background-low-contrast);
     1876    background: var(--bbbase-light-background-color-low-contrast);
    18401877}
    18411878
    18421879#menu-bp li.current-menu-parent a {
    1843     background: var(--bbbase-grey-background-low-contrast);
     1880    background: var(--bbbase-grey-background-color-low-contrast);
    18441881    color: inherit;
    18451882}
     
    18761913#buddypress .groups-members-search input[type=search],
    18771914#buddypress .groups-members-search input[type=text] {
    1878     background: #fff;
     1915    background: var(--bbbase-form-field-background-color);
    18791916}
    18801917
     
    20152052        margin: 0;
    20162053        padding: 0;
    2017         color: var(--bbase-darkest-black);
     2054        color: var(--bbbase-darkest-black);
    20182055        text-shadow: none;
    20192056        border-radius: 0;
     
    20212058    #header #nav #bb-nav li.current a,
    20222059    #header #nav #bb-nav li a:hover {
    2023         color: #fff;
     2060        color: var(--bbbase-brightest-white);
    20242061    }
    20252062    #header #bb-nav,
     
    20322069    #header #nav:focus #bb-nav,
    20332070    #wporg-header #wporg-header-menu.toggled {
    2034         background-color: var(--bbbase-grey-background-low-contrast);
     2071        background-color: var(--bbbase-grey-background-color-low-contrast);
    20352072        display: block !important;
    20362073        z-index: 100;
     
    20442081    #header #nav:focus #bb-menu-icon:before,
    20452082    #wporg-header #mobile-menu-button[aria-expanded="true"]:before {
    2046         color: #fff;
     2083        color: var(--bbbase-brightest-white);
    20472084    }
    20482085}
     
    20742111    #bbpress-forums li.bbp-body div.type-reply span.bbp-admin-links {
    20752112        display: block !important;
    2076         border-top: 1px dotted var(--bbbase-grey-border-low-contrast);
     2113        border-top: 1px dotted var(--bbbase-grey-border-color-low-contrast);
    20772114        margin: 10px 10px 0 10px;
    20782115        padding: 5px 0;
     
    20902127    }
    20912128}
    2092 
Note: See TracChangeset for help on using the changeset viewer.