Index: src/bp-templates/bp-legacy/css/twentyseventeen-rtl.css =================================================================== --- src/bp-templates/bp-legacy/css/twentyseventeen-rtl.css (revision 11368) +++ src/bp-templates/bp-legacy/css/twentyseventeen-rtl.css (working copy) @@ -92,24 +92,12 @@ } } -.buddypress article.page .entry-header .entry-title { - font-size: 22px; - font-size: 1.375rem; -} - -@media screen and (min-width: 55em) { - .buddypress article.page .entry-header .entry-title { - font-size: 28px; - font-size: 1.75rem; - } -} - -@media screen and (min-width: 55em) { +@media screen and (min-width: 48em) { body.buddypress.page.page-two-column #primary .entry-header { - width: 20%; + width: 30%; } body.buddypress.page.page-two-column #primary .entry-content { - width: 80%; + width: 68%; } body.buddypress:not(.has-sidebar) #primary.content-area, body.buddypress:not(.page-two-column) #primary.content-area { @@ -150,7 +138,7 @@ } #buddypress div.item-list-tabs ul { - background-color: #faf9f1; + background-color: #fafafa; border-bottom: 1px solid rgba(234, 234, 234, 0.9); border-top: 1px solid rgba(234, 234, 234, 0.9); overflow: hidden; @@ -167,7 +155,7 @@ @media screen and (max-width: 38.75em) { .bp-user #buddypress #object-nav { - background: #faf9f1; + background: #fafafa; border: 1px solid #eaeaea; overflow: visible; padding: 10px; @@ -346,7 +334,7 @@ #main #buddypress #group-create-tabs.item-list-tabs ul li.selected a, #main #buddypress #group-create-tabs.item-list-tabs ul li.current a { background: none; - color: #141412; + color: #333; outline: none; } #main #buddypress #subnav ul { @@ -557,7 +545,7 @@ width: 100%; } -@media screen and (min-width: 48em) { +@media screen and (min-width: 30em) { #buddypress ul.item-list li div.action div { margin: 0 0 10px 10px; width: auto; @@ -599,7 +587,7 @@ } #buddypress form#whats-new-form #whats-new-content.active #whats-new-options[style] #whats-new-post-in-box { - border: 1px solid rgba(212, 208, 186, 0.5); + border: 1px solid rgba(190, 190, 190, 0.5); float: right; line-height: 1.5em; margin-top: 12px; @@ -726,10 +714,11 @@ margin-bottom: 5px; } -@media screen and (min-width: 38.75em) { +@media screen and (min-width: 30em) { #buddypress #activity-stream .activity-content .activity-meta a { display: inline-block; margin-bottom: 0; + width: auto; } } @@ -800,7 +789,7 @@ #buddypress #activity-stream .activity-comments .ac-form input[type="submit"], #buddypress #activity-stream .activity-comments .ac-form .ac-reply-cancel { - color: rgba(20, 20, 18, 0.8); + color: rgba(51, 51, 51, 0.8); display: inline-block; font-family: inherit; font-size: 12px; @@ -813,7 +802,7 @@ } #buddypress #activity-stream .activity-comments .ac-form .ac-reply-cancel { - border: 1px solid rgba(212, 208, 186, 0.7); + border: 1px solid rgba(190, 190, 190, 0.7); text-align: center; } @@ -1120,7 +1109,7 @@ } .groups.group-settings #group-settings-form div.radio label ul { - color: rgba(20, 20, 18, 0.6); + color: rgba(51, 51, 51, 0.6); font-size: 14px; font-size: 0.875rem; } @@ -1254,7 +1243,7 @@ } .bp-user #buddypress .notifications-options-nav { - border: 1px solid rgba(212, 208, 186, 0.5); + border: 1px solid rgba(190, 190, 190, 0.5); float: right; width: 100%; } @@ -1434,9 +1423,18 @@ } .bp-user #buddypress #message-threads thead tr { - background: #6f6f6f; + background: none; + border-bottom: 1px solid #bebebe; } +.bp-user #buddypress #message-threads thead tr th { + background: #555; +} + +.bp-user #buddypress #message-threads tr { + border-bottom: 5px solid #878787; +} + .bp-user #buddypress #message-threads tr td { background: #fff; display: inline-block; @@ -1445,8 +1443,8 @@ .bp-user #buddypress #message-threads tr td.thread-star, .bp-user #buddypress #message-threads tr td.thread-options { - border-bottom-color: #ccc; - border-bottom-width: 2px; + border-bottom-color: #bebebe; + border-bottom-width: 1px; height: 2.4em; padding-bottom: 0.2em; padding-top: 0.2em; @@ -1459,6 +1457,14 @@ } } +.bp-user #buddypress #message-threads tr td.bulk-select-check, +.bp-user #buddypress #message-threads tr td.thread-star, +.bp-user #buddypress #message-threads tr td.thread-from, +.bp-user #buddypress #message-threads tr td.thread-info, +.bp-user #buddypress #message-threads tr td.thread-options { + border-top: 0; +} + .bp-user #buddypress #message-threads tr td.thread-star { vertical-align: middle; } @@ -1529,8 +1535,8 @@ } .bp-user #buddypress #message-threads tr.unread td { - background: #eee; - border-color: #d4d0ba; + background: none; + border-color: #bebebe; } .bp-user #buddypress #message-threads th { @@ -1717,7 +1723,7 @@ #buddypress div.activity-comments form .ac-textarea { background: #f7f7f7; - border: 1px solid rgba(212, 208, 186, 0.5); + border: 1px solid rgba(190, 190, 190, 0.5); } #buddypress div.activity-comments form .ac-textarea textarea { @@ -1735,7 +1741,7 @@ #buddypress .standard-form button, #buddypress .standard-form select, #buddypress .standard-form textarea { - border-color: rgba(212, 208, 186, 0.5); + border-color: rgba(190, 190, 190, 0.5); border-width: 1px; } @@ -1761,7 +1767,7 @@ #buddypress div.dir-search form, #buddypress div.message-search form, #buddypress li.groups-members-search form { - border: 1px solid rgba(212, 208, 186, 0.6); + border: 1px solid rgba(190, 190, 190, 0.6); overflow: hidden; } @@ -1795,7 +1801,7 @@ #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'], #buddypress li.groups-members-search form input[type='text'] { - border-left: 1px solid rgba(212, 208, 186, 0.6); + border-left: 1px solid rgba(190, 190, 190, 0.6); padding: 0.2em 0.2em 0.2em 0; } @@ -1855,9 +1861,9 @@ } #buddypress table tr th { - background: #6f6f6f; - border-color: #b7b7b7; - color: #fff; + background: #f7f7f7; + border-color: #eaeaea; + color: #333; } #buddypress table p { Index: src/bp-templates/bp-legacy/css/twentyseventeen.css =================================================================== --- src/bp-templates/bp-legacy/css/twentyseventeen.css (revision 11368) +++ src/bp-templates/bp-legacy/css/twentyseventeen.css (working copy) @@ -92,24 +92,12 @@ } } -.buddypress article.page .entry-header .entry-title { - font-size: 22px; - font-size: 1.375rem; -} - -@media screen and (min-width: 55em) { - .buddypress article.page .entry-header .entry-title { - font-size: 28px; - font-size: 1.75rem; - } -} - -@media screen and (min-width: 55em) { +@media screen and (min-width: 48em) { body.buddypress.page.page-two-column #primary .entry-header { - width: 20%; + width: 30%; } body.buddypress.page.page-two-column #primary .entry-content { - width: 80%; + width: 68%; } body.buddypress:not(.has-sidebar) #primary.content-area, body.buddypress:not(.page-two-column) #primary.content-area { @@ -132,6 +120,140 @@ } } +body.colors-dark #buddypress #group-create-tabs.item-list-tabs li.selected, +body.colors-dark #buddypress #group-create-tabs.item-list-tabs li.current { + border-bottom-color: #222; +} + +body.colors-dark #buddypress #group-create-tabs.item-list-tabs li.selected a, +body.colors-dark #buddypress #group-create-tabs.item-list-tabs li.current a { + color: inherit; +} + +body.colors-dark #buddypress .item-list-tabs li.selected a, +body.colors-dark #buddypress .item-list-tabs li.current a { + color: inherit; +} + +body.colors-dark #buddypress #subnav.item-list-tabs ul { + border-bottom: 1px solid rgba(234, 234, 234, 0.9); + margin-bottom: 20px; +} + +body.colors-dark #buddypress #subnav.item-list-tabs ul li.last { + border-top: 1px solid rgba(234, 234, 234, 0.9); +} + +body.colors-dark #buddypress .item-list div.meta { + color: #ddd; +} + +body.colors-dark #buddypress .item-list div.item-desc, +body.colors-dark #buddypress .item-list .activity-header p, +body.colors-dark #buddypress .item-list .activity-comments ul, +body.colors-dark #buddypress .item-list .acomment-meta { + color: #eee; +} + +body.colors-dark #buddypress .item-list .activity-meta a, +body.colors-dark #buddypress .item-list .action a { + background: #fafafa; +} + +body.colors-dark #buddypress .item-list .activity-meta a:focus, body.colors-dark #buddypress .item-list .activity-meta a:hover, +body.colors-dark #buddypress .item-list .action a:focus, +body.colors-dark #buddypress .item-list .action a:hover { + background: #fff; +} + +body.colors-dark #buddypress #latest-update { + color: #eee; +} + +body.colors-dark #buddypress div.pagination * { + color: #ddd; +} + +body.colors-dark #buddypress #item-header .user-nicename { + color: #eee; +} + +body.colors-dark #buddypress #item-body table thead tr, +body.colors-dark #buddypress #item-body table thead th { + background: none; + color: #eee; +} + +body.colors-dark #buddypress #item-body table tr.alt td { + background: none; + color: #eee; +} + +body.colors-dark #buddypress #item-body table .field-visibility-settings, +body.colors-dark #buddypress #item-body table .field-visibility-settings-notoggle { + color: #eee; +} + +body.colors-dark #buddypress #item-body fieldset { + background: none; +} + +body.colors-dark #buddypress #item-body .checkbox label, +body.colors-dark #buddypress #item-body .radio label { + color: #eee; +} + +body.colors-dark #buddypress #item-body div#invite-list { + background: none; +} + +.directory.colors-dark #buddypress #subnav ul { + border-top: 0; +} + +.directory.colors-dark #buddypress #subnav ul li.last.filter { + border-top: 0; +} + +.directory.colors-dark #buddypress div.activity ul.item-list { + border-top: 0; +} + +body.colors-light #buddypress div.item-list-tabs ul { + background-color: #fafafa; +} + +body.colors-light #buddypress div#subnav.item-list-tabs ul { + background-color: #f7f7f7; +} + +body.colors-light #buddypress div#subnav.item-list-tabs ul li.last { + background: #fff; +} + +body.colors-light #buddypress .item-list .activity-header p { + background-color: #f7f7f7; + color: #878787; +} + +body.colors-light #buddypress .item-list .activity-comments .acomment-meta { + color: #737373; +} + +body.colors-light #buddypress #item-body .profile h2 { + background: #878787; + color: #fff; +} + +body.colors-light #buddypress table tr.alt td { + background: #f5f5f5; + color: #333; +} + +body.colors-light #buddypress div#invite-list { + background: #fafafa; +} + /** *------------------------------------------------------------------------------- * @section 2.0 - Navigation - General @@ -150,53 +272,15 @@ } #buddypress div.item-list-tabs ul { - background-color: #faf9f1; border-bottom: 1px solid rgba(234, 234, 234, 0.9); - border-top: 1px solid rgba(234, 234, 234, 0.9); overflow: hidden; padding: 0; } -#buddypress div.item-list-tabs ul li a { - color: #0073c1; -} - #buddypress div.item-list-tabs ul li a span { border-radius: 25%; } -@media screen and (max-width: 38.75em) { - .bp-user #buddypress #object-nav { - background: #faf9f1; - border: 1px solid #eaeaea; - overflow: visible; - padding: 10px; - } - .bp-user #buddypress #object-nav ul { - border: 0; - height: 0; - transition: height 0.3s ease-in-out 0.7s; - visibility: hidden; - } - .bp-user #buddypress #object-nav:before { - content: "Menu \021E9"; - display: inline; - opacity: 0.7; - } - .bp-user #buddypress #object-nav:hover:before, .bp-user #buddypress #object-nav:focus:before { - content: "Menu \021E7"; - } - .bp-user #buddypress #object-nav:hover ul, .bp-user #buddypress #object-nav:focus ul { - height: 320px; - opacity: 1; - overflow-y: auto; - visibility: visible; - } - .bp-user #buddypress #subnav { - clear: both; - } -} - /*__ Horizontal menus __*/ #buddypress #object-nav ul { overflow: hidden; @@ -229,7 +313,6 @@ } #buddypress div#subnav.item-list-tabs ul { - background-color: #f7f7f7; border-bottom: 0; margin-top: 5px; padding: 0; @@ -236,7 +319,6 @@ } #buddypress div#subnav.item-list-tabs ul li.last { - background: #fff; margin-top: 0; padding: 5px 5px 5px 0; width: 100%; @@ -273,55 +355,51 @@ /*__ Vertical menu User Account / Group single screens __*/ @media screen and (min-width: 55em) { - body.no-sidebar #buddypress #item-header, - body.no-sidebar #buddypress #item-body { - background: #fff; - } - body.no-sidebar #buddypress #object-nav { + body:not(.page-two-column) #buddypress #object-nav { border-right: 1px solid #ddd; float: left; margin-right: -1px; width: 200px; } - body.no-sidebar #buddypress #object-nav ul { + body:not(.page-two-column) #buddypress #object-nav ul { background: none; border-bottom: 0; padding: 0; } - body.no-sidebar #buddypress #object-nav ul li { + body:not(.page-two-column) #buddypress #object-nav ul li { float: none; overflow: hidden; } - body.no-sidebar #buddypress #object-nav ul li span { + body:not(.page-two-column) #buddypress #object-nav ul li span { background: #fff; border-radius: 10%; float: right; margin-right: 2px; } - body.no-sidebar #buddypress #item-body { + body:not(.page-two-column) #buddypress #item-body { border-left: 1px solid #ddd; overflow: hidden; padding: 0 0 0 20px; width: auto; } - body.no-sidebar #buddypress #item-body #subnav { + body:not(.page-two-column) #buddypress #item-body #subnav { margin: 0 0 0 -20px; } - body.no-sidebar #buddypress #item-body #subnav ul { + body:not(.page-two-column) #buddypress #item-body #subnav ul { margin-top: 0; } } @media screen and (min-width: 48em) { - #main #buddypress #group-create-tabs.item-list-tabs ul:before, - #main #buddypress #group-create-tabs.item-list-tabs ul:after { + #buddypress #group-create-tabs.item-list-tabs ul:before, + #buddypress #group-create-tabs.item-list-tabs ul:after { content: " "; display: table; } - #main #buddypress #group-create-tabs.item-list-tabs ul:after { + #buddypress #group-create-tabs.item-list-tabs ul:after { clear: both; } - #main #buddypress #group-create-tabs.item-list-tabs ul { + #buddypress #group-create-tabs.item-list-tabs ul { background: none; border: 0; border-bottom: 1px solid #ddd; @@ -328,12 +406,12 @@ overflow: visible; padding-bottom: 0; } - #main #buddypress #group-create-tabs.item-list-tabs ul li { + #buddypress #group-create-tabs.item-list-tabs ul li { float: left; width: auto; } - #main #buddypress #group-create-tabs.item-list-tabs ul li.selected, - #main #buddypress #group-create-tabs.item-list-tabs ul li.current { + #buddypress #group-create-tabs.item-list-tabs ul li.selected, + #buddypress #group-create-tabs.item-list-tabs ul li.current { border: 1px solid #ddd; border-bottom-color: #fff; -webkit-border-top-right-radius: 4px; @@ -343,13 +421,13 @@ background-clip: padding-box; margin-bottom: -1px; } - #main #buddypress #group-create-tabs.item-list-tabs ul li.selected a, - #main #buddypress #group-create-tabs.item-list-tabs ul li.current a { + #buddypress #group-create-tabs.item-list-tabs ul li.selected a, + #buddypress #group-create-tabs.item-list-tabs ul li.current a { background: none; - color: #141412; + color: #333; outline: none; } - #main #buddypress #subnav ul { + #buddypress #subnav ul { border-bottom: 0; } } @@ -495,8 +573,8 @@ #buddypress ul.item-list li .item .item-title .update { display: block; - font-size: 12px; - font-size: 0.75rem; + font-size: 13px; + font-size: 0.8125rem; padding: 10px 0; text-align: left; } @@ -557,7 +635,7 @@ width: 100%; } -@media screen and (min-width: 48em) { +@media screen and (min-width: 30em) { #buddypress ul.item-list li div.action div { margin: 0 10px 10px 0; width: auto; @@ -599,7 +677,7 @@ } #buddypress form#whats-new-form #whats-new-content.active #whats-new-options[style] #whats-new-post-in-box { - border: 1px solid rgba(212, 208, 186, 0.5); + border: 1px solid rgba(190, 190, 190, 0.5); float: left; line-height: 1.5em; margin-top: 12px; @@ -704,21 +782,20 @@ } #buddypress #activity-stream .activity-content .activity-header { - line-height: inherit; margin-right: 0; } #buddypress #activity-stream .activity-content .activity-header p { - background-color: #f7f7f7; border: 1px solid rgba(234, 234, 234, 0.6); - color: #727272; margin-top: 0; padding: 0 0.2em; } #buddypress #activity-stream .activity-content .activity-header img.avatar { + box-shadow: none; display: inline-block; - margin-bottom: 0 !important; + margin: 0 5px !important; + vertical-align: middle; } #buddypress #activity-stream .activity-content .activity-meta a { @@ -726,10 +803,11 @@ margin-bottom: 5px; } -@media screen and (min-width: 38.75em) { +@media screen and (min-width: 30em) { #buddypress #activity-stream .activity-content .activity-meta a { display: inline-block; margin-bottom: 0; + width: auto; } } @@ -781,26 +859,34 @@ */ #buddypress #activity-stream .activity-comments { border-left: 1px solid #eaeaea; - margin-top: 5px; + margin: 20px 0 20px; } +@media screen and (min-width: 30em) { + #buddypress #activity-stream .activity-comments { + margin-left: 20px; + } +} + #buddypress #activity-stream .activity-comments ul { - background: rgba(247, 247, 247, 0.6); - color: #737373; margin: 15px 0 0 2px; } +#buddypress #activity-stream .activity-comments ul li { + border-top: 1px solid #bebebe; +} + #buddypress #activity-stream .activity-comments ul a { color: #0077c7; } #buddypress #activity-stream .activity-comments .acomment-meta { - color: #737373; + border-bottom: 1px solid #eaeaea; } #buddypress #activity-stream .activity-comments .ac-form input[type="submit"], #buddypress #activity-stream .activity-comments .ac-form .ac-reply-cancel { - color: rgba(20, 20, 18, 0.8); + color: rgba(51, 51, 51, 0.8); display: inline-block; font-family: inherit; font-size: 12px; @@ -813,7 +899,7 @@ } #buddypress #activity-stream .activity-comments .ac-form .ac-reply-cancel { - border: 1px solid rgba(212, 208, 186, 0.7); + border: 1px solid rgba(190, 190, 190, 0.7); text-align: center; } @@ -834,6 +920,12 @@ #buddypress #members-list li .action { float: right; } + #buddypress #members-list li.is-current-user .item { + float: none; + left: 0; + padding-left: 5%; + width: auto; + } } /** @@ -880,6 +972,30 @@ * @subsection 6.1 - Item Header Global *----------------------------------------------------------- */ +@media screen and (min-width: 48em) { + .bp-user.page-two-column #buddypress #cover-image-container #item-header-cover-image #item-header-content { + margin-left: 140px; + margin-top: -100px; + } + .single-item.groups.page-two-column #buddypress #cover-image-container #item-header-cover-image #item-header-content { + margin-left: 10px; + } +} + +.bp-user #buddypress #item-header-cover-image .user-nicename, +.single-item.groups #buddypress #item-header-cover-image .user-nicename { + color: #333; + text-shadow: none; +} + +@media screen and (min-width: 48em) { + .bp-user #buddypress #item-header-cover-image .user-nicename, + .single-item.groups #buddypress #item-header-cover-image .user-nicename { + color: #fff; + text-shadow: 0 0 3px rgba(0, 0, 0, 0.8); + } +} + .bp-user #buddypress #item-header-content #item-meta, .single-item.groups #buddypress #item-header-content #item-meta { font-size: 14px; @@ -953,9 +1069,6 @@ order: 1; text-align: center; } - .single-item.groups #buddypress div#item-header #item-header-avatar a { - border-bottom: 0; - } .single-item.groups #buddypress div#item-header #item-header-avatar a img { display: inline-block; float: none; @@ -1051,7 +1164,6 @@ .bp-user #buddypress #item-header #item-header-avatar img.avatar, .bp-user #buddypress #item-header #item-header-avatar a { - border-bottom: 0; display: inline-block; float: none; } @@ -1083,6 +1195,11 @@ * Groups specific item body rules - screens *---------------------------------------------------- */ +.groups.single-item.members #buddypress #subnav.item-list-tabs ul { + background: none; + border-top: 0; +} + /** *----------------------------------------- * @subsection 6.2.1.1 - Group Management @@ -1120,7 +1237,7 @@ } .groups.group-settings #group-settings-form div.radio label ul { - color: rgba(20, 20, 18, 0.6); + color: rgba(51, 51, 51, 0.6); font-size: 14px; font-size: 0.875rem; } @@ -1184,7 +1301,7 @@ .groups.group-members #subnav li #search-members-form { float: right; - margin: 5px 5px 0 0; + margin: 5px 0 0; } @media screen and (max-width: 38.75em) { @@ -1253,25 +1370,28 @@ font-style: italic; } -.bp-user #buddypress .notifications-options-nav { - border: 1px solid rgba(212, 208, 186, 0.5); +.bp-user #buddypress .notifications-options-nav, +.bp-user #buddypress .messages-options-nav { float: left; width: 100%; } @media screen and (min-width: 38.75em) { - .bp-user #buddypress .notifications-options-nav { + .bp-user #buddypress .notifications-options-nav, + .bp-user #buddypress .messages-options-nav { width: 300px; } } -.bp-user #buddypress .notifications-options-nav select { +.bp-user #buddypress .notifications-options-nav select, +.bp-user #buddypress .messages-options-nav select { height: auto; } .bp-user #buddypress .notifications-options-nav select, -.bp-user #buddypress .notifications-options-nav input { - border: 0; +.bp-user #buddypress .notifications-options-nav input, +.bp-user #buddypress .messages-options-nav select, +.bp-user #buddypress .messages-options-nav input { font-size: 14px; font-size: 0.875rem; outline: 0; @@ -1278,13 +1398,15 @@ padding: 0; } -.bp-user #buddypress .notifications-options-nav select { +.bp-user #buddypress .notifications-options-nav select, +.bp-user #buddypress .messages-options-nav select { float: left; - margin-right: 0; - width: 60%; + margin-right: 1%; + width: 59%; } -.bp-user #buddypress .notifications-options-nav input { +.bp-user #buddypress .notifications-options-nav input, +.bp-user #buddypress .messages-options-nav input { float: right; font-family: inherit; line-height: 20px; @@ -1291,6 +1413,13 @@ width: 40%; } +.bp-user #buddypress .notifications-options-nav input[disabled="disabled"]:focus, +.bp-user #buddypress .notifications-options-nav input[disabled="disabled"]:hover, +.bp-user #buddypress .messages-options-nav input[disabled="disabled"]:focus, +.bp-user #buddypress .messages-options-nav input[disabled="disabled"]:hover { + background: none; +} + /** *------------------------------------------- * @subsection 6.2.2.2 - Extended Profiles @@ -1301,8 +1430,6 @@ } .bp-user #buddypress .profile .bp-widget h2 { - background: #7b7b7b; - color: #fff; margin: 40px 0 10px; padding: 0.1em 0 0.1em 0.4em; } @@ -1311,6 +1438,14 @@ margin-top: 0; } +.bp-user #buddypress .profile .bp-widget .profile-fields tr.alt td { + color: #333; +} + +.bp-user #buddypress .profile .bp-widget .profile-fields tr:last-child { + border-bottom: none; +} + .bp-user #buddypress .profile #profile-edit-form .button-nav:before, .bp-user #buddypress .profile #profile-edit-form .button-nav:after { content: " "; @@ -1345,14 +1480,21 @@ } .bp-user #buddypress .profile #profile-edit-form .field-visibility-settings-toggle, +.bp-user #buddypress .profile #profile-edit-form .field-visibility-settings-notoggle, .bp-user #buddypress .profile #profile-edit-form .field-visibility-settings { font-size: 14px; font-size: 0.875rem; + margin-top: 10px; } .bp-user #buddypress .profile #profile-edit-form .field-visibility-settings-close, .bp-user #buddypress .profile #profile-edit-form .visibility-toggle-link { background: #555; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + -ms-border-radius: 3px; + border-radius: 3px; + background-clip: padding-box; color: #fff; padding: 0.2em 0.5em; } @@ -1434,11 +1576,19 @@ } .bp-user #buddypress #message-threads thead tr { - background: #6f6f6f; + background: none; + border-bottom: 1px solid #bebebe; } +.bp-user #buddypress #message-threads thead tr th { + background: #555; +} + +.bp-user #buddypress #message-threads tr { + border-bottom: 5px solid #878787; +} + .bp-user #buddypress #message-threads tr td { - background: #fff; display: inline-block; float: left; } @@ -1445,8 +1595,8 @@ .bp-user #buddypress #message-threads tr td.thread-star, .bp-user #buddypress #message-threads tr td.thread-options { - border-bottom-color: #ccc; - border-bottom-width: 2px; + border-bottom-color: #bebebe; + border-bottom-width: 1px; height: 2.4em; padding-bottom: 0.2em; padding-top: 0.2em; @@ -1459,6 +1609,14 @@ } } +.bp-user #buddypress #message-threads tr td.bulk-select-check, +.bp-user #buddypress #message-threads tr td.thread-star, +.bp-user #buddypress #message-threads tr td.thread-from, +.bp-user #buddypress #message-threads tr td.thread-info, +.bp-user #buddypress #message-threads tr td.thread-options { + border-top: 0; +} + .bp-user #buddypress #message-threads tr td.thread-star { vertical-align: middle; } @@ -1529,8 +1687,8 @@ } .bp-user #buddypress #message-threads tr.unread td { - background: #eee; - border-color: #d4d0ba; + background: none; + border-color: #bebebe; } .bp-user #buddypress #message-threads th { @@ -1550,10 +1708,6 @@ width: 30px; } -.bp-user #buddypress .messages-options-nav select { - height: auto; -} - .bp-user #buddypress .acfb-holder { list-style: none; } @@ -1563,7 +1717,7 @@ } .bp-user #buddypress .acfb-holder li.friend-tab { - background: #edf7fa; + background: #e3f6ff; border: inherit; margin-right: 0; padding: 0.5em; @@ -1717,7 +1871,7 @@ #buddypress div.activity-comments form .ac-textarea { background: #f7f7f7; - border: 1px solid rgba(212, 208, 186, 0.5); + border: 1px solid rgba(190, 190, 190, 0.5); } #buddypress div.activity-comments form .ac-textarea textarea { @@ -1735,7 +1889,7 @@ #buddypress .standard-form button, #buddypress .standard-form select, #buddypress .standard-form textarea { - border-color: rgba(212, 208, 186, 0.5); + border-color: rgba(190, 190, 190, 0.5); border-width: 1px; } @@ -1761,7 +1915,12 @@ #buddypress div.dir-search form, #buddypress div.message-search form, #buddypress li.groups-members-search form { - border: 1px solid rgba(212, 208, 186, 0.6); + border: 1px solid rgba(190, 190, 190, 0.6); + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + -ms-border-radius: 2px; + border-radius: 2px; + background-clip: padding-box; overflow: hidden; } @@ -1770,6 +1929,7 @@ #buddypress li.groups-members-search form label { float: left; margin: 0; + width: 70%; } #buddypress div.dir-search form input[type='text'], @@ -1777,7 +1937,7 @@ #buddypress li.groups-members-search form input[type='text'] { float: left; margin: 0; - width: 70%; + width: 100%; } #buddypress div.dir-search form input[type='text'], @@ -1786,9 +1946,9 @@ #buddypress div.message-search form input[type='submit'], #buddypress li.groups-members-search form input[type='text'], #buddypress li.groups-members-search form input[type='submit'] { + border: 0; font-size: 14px; font-size: 0.875rem; - border: 0; line-height: inherit; } @@ -1795,7 +1955,8 @@ #buddypress div.dir-search form input[type='text'], #buddypress div.message-search form input[type='text'], #buddypress li.groups-members-search form input[type='text'] { - border-right: 1px solid rgba(212, 208, 186, 0.6); + border-right: 1px solid rgba(190, 190, 190, 0.6); + font-weight: 400; padding: 0.2em 0 0.2em 0.2em; } @@ -1802,6 +1963,7 @@ #buddypress div.dir-search form input[type='submit'], #buddypress div.message-search form input[type='submit'], #buddypress li.groups-members-search form input[type='submit'] { + border-radius: 0; float: right; font-weight: normal; padding: 0.2em 1em; @@ -1810,6 +1972,18 @@ width: 30%; } +#buddypress div.dir-search { + margin-top: 0; +} + +#buddypress .dir-search #search-members-form input[type='text'], +#buddypress #search-groups-form input[type='text'], +#buddypress #search-message-form input[type='text'] { + float: left; + margin: 0; + width: 70%; +} + @media screen and (min-width: 30em) { #buddypress div.dir-search, #buddypress div.message-search, @@ -1817,32 +1991,49 @@ float: right; margin-bottom: 5px !important; } - #buddypress div.dir-search form label, - #buddypress div.dir-search form input[type='text'], - #buddypress div.dir-search form input[type='submit'], - #buddypress div.message-search form label, - #buddypress div.message-search form input[type='text'], - #buddypress div.message-search form input[type='submit'], - #buddypress li.groups-members-search form label, - #buddypress li.groups-members-search form input[type='text'], - #buddypress li.groups-members-search form input[type='submit'] { - width: auto; - } } @media screen and (min-width: 67em) { #buddypress .dir-search form input[type='text'], - #buddypress .message-search form input[type='text'] { + #buddypress .message-search form input[type='text'], + #buddypress li.groups-members-search form input[type='text'] { font-size: 16px; font-size: 1rem; } #buddypress .dir-search form input[type='submit'], - #buddypress .message-search form input[type='submit'] { + #buddypress .message-search form input[type='submit'], + #buddypress li.groups-members-search form input[type='submit'] { font-size: 16px; font-size: 1rem; } } +body.colors-dark #page #buddypress .dir-search form, +body.colors-dark #page #buddypress .groups-members-search form { + background: #333; + border-color: #555; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + -ms-border-radius: 2px; + border-radius: 2px; + background-clip: padding-box; + padding: 1px; +} + +body.colors-dark #page #buddypress .dir-search input[type="text"], +body.colors-dark #page #buddypress .groups-members-search input[type="text"] { + background: none; +} + +body.colors-dark #page #buddypress .dir-search input[type="submit"], +body.colors-dark #page #buddypress .groups-members-search input[type="submit"] { + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + -ms-border-radius: 2px; + border-radius: 2px; + background-clip: padding-box; +} + /** *------------------------------------------------------------------------------- * @section 8.0 - Tables - General @@ -1855,9 +2046,9 @@ } #buddypress table tr th { - background: #6f6f6f; - border-color: #b7b7b7; - color: #fff; + background: #f7f7f7; + border-color: #eaeaea; + color: #333; } #buddypress table p { @@ -1914,6 +2105,10 @@ text-align: center; } +#buddypress .notifications .actions { + text-align: center; +} + /** *------------------------------------------------------------------------------- * @section 9.0 - Error / Success messages @@ -1926,9 +2121,9 @@ } #buddypress div#message.info p { - background: #c6e4ee; - border: 1px solid #78bed6; - color: #1e5264; + background: #b0e5ff; + border: 1px solid #4ac3ff; + color: #00547d; } #buddypress div#message.updated p { @@ -1937,6 +2132,15 @@ color: #454d19; } +#buddypress .bp-avatar-status .warning, +#buddypress .bp-cover-image-status .warning { + background: #7dd4ff; + border: 1px solid #000; + color: #333; + font-size: 16px; + font-size: 1rem; +} + .delete-group #buddypress div#message.info p { background: #db7e7e; border: 1px solid #be3535; @@ -1949,6 +2153,6 @@ *------------------------------------------------------------------------------- */ #buddypress .acfb-holder li.friend-tab { - background: #9fd1e2; + background: #7dd4ff; border: inherit; } Index: src/bp-templates/bp-legacy/css/twentyseventeen.scss =================================================================== --- src/bp-templates/bp-legacy/css/twentyseventeen.scss (revision 11368) +++ src/bp-templates/bp-legacy/css/twentyseventeen.scss (working copy) @@ -192,14 +192,23 @@ } // Variables: color definitions -$body-text: #141412; + +$dark-grey: #555; +$medium-grey: #878787; +$light-grey: #dcdcdc; +$x-light-grey: #f7f7f7; +$white: #fff; + +$body-text: #333; +$bp-light-text: $medium-grey; +$bp-xlight-text: #eee; $content-background: #fff; -$off-white: lighten(#f9f8ee, 0.7); +$off-white: #fafafa; $cream-background: #f7f5e7; -$light-background: #f7f7f7; -$medium-background: #ccc; -$dark-background: #555; -$border-color: #d4d0ba; // border color is varied using rgba +$light-background: $x-light-grey; +$medium-background: $medium-grey; +$dark-background: $dark-grey; +$border-color: #bebebe; $border-light: #eaeaea; // BP dividers $border-med: #ddd; $background-hover: #db572f; // 2017 link background hover @@ -206,11 +215,11 @@ $bp-button-hover: #ededed; // this is the default BP button hover background $notice-error: #c85a6e; $notice-warning: #d05656; -$notice-info: #9fd1e2; +$notice-info: #7dd4ff; $notice-update: #ced98c; $stripe-odd: #ebf0ff; $stripe-even: #dbe5ff; -$unread: #eee; +$unread: $x-light-grey; $link-action: #c82b2b; /*-------------------------------------------------------------- @@ -293,7 +302,7 @@ } // close .buddypress - // reduce the overlarge entry title margins +// reduce the overlarge entry title margins @include medium-up { .buddypress.bp-user.page, @@ -310,27 +319,12 @@ } } } -// 2017 has very small page entry title headings -// enlarge slightly for BP screens. -.buddypress { - article.page { - .entry-header { - .entry-title { - @include font-size(22); - @include medium-up { - @include font-size(28); - } - } - } - } -} - // Open up the content width areas for BP screens to allow max widths. -// This takes into account the ability to add/remove sidebars in 2017. +// This takes into account the ability to columnize pages in 2017. // Only effect changes based on breakpoints. -@include medium-up { +@include med-small-up { body.buddypress.page.page-two-column { @@ -337,11 +331,11 @@ #primary { .entry-header { - width: 20%; + width: 30%; } .entry-content { - width: 80%; + width: 68%; } } } @@ -357,7 +351,6 @@ .content-bottom-widgets { margin-left: 0; margin-right: 0; -// width: auto; } } @@ -371,6 +364,239 @@ } // body.buddypress } +// 2017 allows for selecting two distinct color schemes. +// Our companion styles respect themes colors & inherit or avoid +// setting backgrounds/colors so selecting the dark scheme generally +// allows the theme to reset the BP text/headings etc to white +// In places we do set backgrounds, Navs, search forms etc these +// are added here under the themes body class to enable changing + +// Some element colors are inherited from BP original sheet so need to +// to be reset under the dark scheme, where set in this sheet we simply state them +// only for the light scheme, additionally elements such as BP form styles +// need styles removing & are handled later in 'Forms' section +body.colors-dark { + + #buddypress { + + //tabs border bottom color needs to match dark background + #group-create-tabs.item-list-tabs { + + li.selected, + li.current { + border-bottom-color: #222; + + a { + color: inherit; + } + } + } + + .item-list-tabs { + + li.selected, + li.current { + + a { + color: inherit; + } + } + } + + // With the dark scheme the subnav links lose definition as list links + // nav menu, add a border bottom to clarify the nav. + #subnav.item-list-tabs { + + ul { + border-bottom: 1px solid rgba($border-light, 0.9); + margin-bottom: $spacing-val-md; + + li.last { + border-top: 1px solid rgba($border-light, 0.9); + } + } + } + + // lists text: descr, meta, etc + .item-list { + + div.meta { + color: #ddd; + } + + div.item-desc, + .activity-header p, + .activity-comments ul, + .acomment-meta { + color: $bp-xlight-text; + } + + .activity-meta, + .action { + a { + background: $off-white; + + &:focus, + &:hover { + background: $white; + } + } + } + } + + #latest-update { + color: $bp-xlight-text; + } + + div.pagination * { + color: #ddd; + } + + #item-header { + .user-nicename { + color: $bp-xlight-text; + } + } + + #item-body { + + table { + + thead { + + tr, + th { + background: none ; + color: $bp-xlight-text; + } + } + + tr.alt { + + td { + background: none; + color: $bp-xlight-text; + } + } + + .field-visibility-settings, + .field-visibility-settings-notoggle { + color: #eee; + } + + } + + fieldset { + background: none; + } + + .checkbox, + .radio { + + label { + color: #eee; + } + } + + div#invite-list { + background: none; + } + } + + } // close #buddypress +} + +// remove borders for dir component screens. +.directory.colors-dark { + + #buddypress { + + #subnav { + ul { + border-top: 0; + + li.last.filter { + border-top: 0; + } + } + } + + div.activity { + ul.item-list { + border-top: 0; + } + } + } +} + +body.colors-light { + + #buddypress { + + div.item-list-tabs { + + ul { + background-color: $off-white; + } + } + + div#subnav.item-list-tabs { + + ul { + background-color: $light-background; + + li.last { + background: $content-background; + } + } + } + + .item-list { + + .activity-header { + + p { + background-color: $light-background; + color: $bp-light-text; + } + } + + .activity-comments { + + .acomment-meta { + color: #737373; + } + } + } + + #item-body { + + .profile { + + h2 { + background: $medium-grey; + color: #fff; + } + } + } + + table { + + tr.alt { + + td { + background: #f5f5f5; + color: $body-text; + } + } + } + + div#invite-list { + background: $off-white; + } + } // close #buddypress +} + /** *------------------------------------------------------------------------------- * @section 2.0 - Navigation - General @@ -409,9 +635,7 @@ div.item-list-tabs { ul { - background-color: $off-white; border-bottom: 1px solid rgba($border-light, 0.9); - border-top: 1px solid rgba($border-light, 0.9); overflow: hidden; padding: 0; @@ -418,7 +642,6 @@ li { a { - color: #0073c1; span {border-radius: 25%;} } @@ -428,55 +651,7 @@ } // close #buddypress -// .bp-user #object-nav @ small screen as a dropdown -.bp-user { - - #buddypress { - - @include small-only { - - #object-nav { - background: $off-white; - border: 1px solid $border-light; - overflow: visible; - padding: $spacing-val-sm; - - ul { - border: 0; - height: 0; - // all latest vendor releases handle transitions, so no prefixes used. - transition: height 0.3s ease-in-out 0.7s; - visibility: hidden; - } - - &:before { - content: "Menu \021E9"; - display: inline; - opacity: 0.7; - } - - &:hover, - &:focus { - &:before {content: "Menu \021E7";} - - ul { - height: 320px; - opacity: 1; - overflow-y: auto; - visibility: visible; - } - } - } - - #subnav { - clear: both; - } - - } // close @media - } -} - /*__ Horizontal menus __*/ #buddypress { @@ -519,13 +694,11 @@ margin-top: 0; ul { - background-color: $light-background; border-bottom: 0; margin-top: $spacing-val-xs; padding: 0; li.last { - background: $content-background; margin-top: 0; padding: $spacing-val-xs $spacing-val-xs $spacing-val-xs 0; width: 100%; @@ -569,19 +742,14 @@ // This block contains rules to re-factor the item-body structural element // to sit alongside the vert menu // 2017 right sidebar is displayed if the widget sidebar has widgets; -// we'll only display object nav as a vert menu if sidebar not present. +// we'll only display object nav as a vert menu if not .two-column-page. @include medium-up { - body.no-sidebar { + body:not(.page-two-column) { #buddypress { - #item-header, - #item-body { - background: $content-background; - } - #object-nav { border-right: 1px solid $border-med; float: left; @@ -630,8 +798,6 @@ @include med-small-up { - #main { - #buddypress { #group-create-tabs.item-list-tabs { @@ -682,7 +848,7 @@ } // close #subnav } // close #buddypress - } + } // close @media /** @@ -770,8 +936,11 @@ } .action { + .generic-button { + a { + &:focus, &:hover { background: inherit; @@ -851,7 +1020,7 @@ .update { display: block; - @include font-size(12); + @include font-size(13); @include medium-up { @include font-size(14); @@ -892,8 +1061,8 @@ // remove BP margin left margin-left: 0; padding: $spacing-val-md 0 $spacing-val-xs; + // push the actions to the right - @include medium-up { clear: none; float: right; @@ -917,7 +1086,7 @@ // Provisionally lets keep the 'action' div // position but inline-block the buttons - @include med-small-up { + @include small-up { // keep buttons to a row small tablet up margin: 0 $spacing-val-sm $spacing-val-sm 0; width: auto; @@ -1088,7 +1257,9 @@ li.mini { .activity-avatar { + a { + img.avatar { height: 30px; margin-left: 15px; @@ -1109,31 +1280,32 @@ margin-top: -12px; .activity-header { - line-height: inherit; margin-right: 0; p { - background-color: $light-background; border: 1px solid rgba($border-light, 0.6); - color: #727272; margin-top: 0; padding: 0 0.2em; } img.avatar { + box-shadow: none; display: inline-block; - margin-bottom: 0 !important; // have to match to BP + margin: 0 5px !important; // have to match to BP + vertical-align: middle; } } // close .activity-header .activity-meta { + a { display: block; margin-bottom: $spacing-val-xs; - @include small-up-bp { + @include small-up { display: inline-block; margin-bottom: 0; + width: auto; } } } @@ -1197,13 +1369,20 @@ .activity-comments { border-left: 1px solid $border-light; - margin-top: 5px; + margin: $spacing-val-md 0 $spacing-val-md ; + + @include small-up { + margin-left: $spacing-val-md; + } + ul { - background: rgba($light-background, 0.6); - color: #737373; margin: 15px 0 0 2px; + li { + border-top: 1px solid $border-color; + } + a { color: #0077c7; } @@ -1210,7 +1389,7 @@ } .acomment-meta { - color: #737373; + border-bottom: 1px solid $border-light; } .ac-form { @@ -1256,6 +1435,7 @@ #members-list { @include medium-up { + li { .item-avatar, .item { @@ -1266,6 +1446,16 @@ float: right; } } + + li.is-current-user { + + .item { + float: none; + left: 0; + padding-left: 5%; + width: auto; + } + } } } // close #members-list @@ -1318,12 +1508,76 @@ * @subsection 6.1 - Item Header Global *----------------------------------------------------------- */ + @include med-small-up { + + .bp-user.page-two-column { + + #buddypress { + + #cover-image-container { + + #item-header-cover-image { + + + } + } + + #cover-image-container { + + #item-header-cover-image { + + #item-header-content { + margin-left: 140px; + margin-top: -100px; + } + } + } + } + } + + .single-item.groups.page-two-column { + + #buddypress { + + #cover-image-container { + + #item-header-cover-image { + + #item-header-content { + margin-left: 10px; + } + } + } + } + } +} + .bp-user, .single-item.groups { #buddypress { + // we need to remove the cover image dec styles + // & reset them for med up only. + #item-header-cover-image { + .user-nicename { + color: $body-text; + text-shadow: none; + } + } + + @include med-small-up { + + #item-header-cover-image { + + .user-nicename { + color: $white; + text-shadow: 0 0 3px rgba(0, 0, 0, 0.8); + } + } + } + #item-header-content { #item-meta { @@ -1417,7 +1671,6 @@ text-align: center; a { - border-bottom: 0; img { display: inline-block; @@ -1524,7 +1777,6 @@ img.avatar, a { - border-bottom: 0; display: inline-block; float: none; } @@ -1560,6 +1812,7 @@ *----------------------------------------------------------- */ + /** *---------------------------------------------------- * @subsection 6.2.1 - Item Body Groups @@ -1568,6 +1821,22 @@ *---------------------------------------------------- */ +.groups.single-item.members { + + #buddypress { + + #subnav.item-list-tabs { + + ul { + background: none; + border-top: 0; + } + + } + } + +} + /** *----------------------------------------- * @subsection 6.2.1.1 - Group Management @@ -1709,7 +1978,7 @@ } } - margin: $spacing-val-xs $spacing-val-xs 0 0; + margin: $spacing-val-xs 0 0; } } } @@ -1778,8 +2047,9 @@ .pag-count {font-style: italic;} - .notifications-options-nav { - border: 1px solid rgba($border-color, 0.5); + .notifications-options-nav, + .messages-options-nav { + float: left; width: 100%; @@ -1793,7 +2063,7 @@ select, input { - border: 0; + @include font-size(14); outline: 0; padding: 0; @@ -1801,8 +2071,8 @@ select { float: left; - margin-right: 0; - width: 60%; + margin-right: 1%; + width: 59%; } input { @@ -1812,8 +2082,14 @@ width: 40%; } - } // close .notifications-options-nav + input[disabled="disabled"]:focus, + input[disabled="disabled"]:hover { + background: none; + } + + } // close .notifications-options-nav/.messages-options-nav + } //close #buddypress } // close .bp-user @@ -1830,14 +2106,27 @@ .profile { .bp-widget { h2 { - background: lighten($dark-background, 15%); - color: #fff; margin: $spacing-val-lg 0 $spacing-val-sm; padding: 0.1em 0 0.1em 0.4em; } table {margin-top: 0;} + + .profile-fields { + + tr.alt { + td { + color: $body-text; + } + } + + tr:last-child { + border-bottom: none; + } + } + } + /* Edit profile */ #profile-edit-form { @@ -1874,13 +2163,16 @@ } //.button-nav .field-visibility-settings-toggle, + .field-visibility-settings-notoggle, .field-visibility-settings { @include font-size(14); + margin-top: $spacing-val-sm; } .field-visibility-settings-close, .visibility-toggle-link { background: $dark-background; + @include border-radius(3px); color: #fff; padding: 0.2em 0.5em; } @@ -1932,6 +2224,7 @@ #message-thread { //Single message view + a { border-bottom: 0; } @@ -1979,6 +2272,7 @@ } #send-reply { + .message-content { background: $content-background; border: 0; @@ -1994,14 +2288,22 @@ #message-threads { thead { + tr { - background: lighten($dark-background, 10%); + background: none; + border-bottom: 1px solid $border-color; + + + th { + background: #555; + } } } tr { + border-bottom: 5px solid $medium-grey; + td { - background: $content-background; display: inline-block; float: left; } @@ -2008,8 +2310,8 @@ td.thread-star, td.thread-options { - border-bottom-color: $medium-background; - border-bottom-width: 2px; + border-bottom-color: $border-color; + border-bottom-width: 1px; height: 2.4em; padding-bottom: 0.2em; padding-top: 0.2em; @@ -2019,6 +2321,14 @@ } } + td.bulk-select-check, + td.thread-star, + td.thread-from, + td.thread-info, + td.thread-options { + border-top: 0; + } + td.thread-star { vertical-align: middle; @@ -2080,8 +2390,9 @@ } tr.unread { + td { - background: $unread; + background: none; border-color: $border-color; } } @@ -2104,12 +2415,6 @@ } } - .messages-options-nav { - select { - height: auto; - } - } - .acfb-holder { list-style: none; @@ -2295,10 +2600,15 @@ // Attempt to reset form control widths #main { + #buddypress { + .standard-form { - li {float: none;} + li { + float: none; + } + input[type='text'], input[type='email'], input[type='password'], @@ -2309,7 +2619,6 @@ } } - #buddypress { // Match BP form elements to Themes(2017) styling where styles @@ -2364,6 +2673,7 @@ } // close #buddypress #buddypress { + div.dir-search, div.message-search, li.groups-members-search { @@ -2375,32 +2685,36 @@ form { // *sigh* only to bludgeon over specified rules border: 1px solid rgba($border-color, 0.6); + @include border-radius(2px); overflow: hidden; label { float: left; margin: 0; + width: 70%; } input[type='text'] { float: left; margin: 0; - width: 70%; + width: 100%; } input[type='text'], input[type='submit'] { + border: 0; @include font-size(14); - border: 0; line-height: inherit; } input[type='text'] { border-right: 1px solid rgba($border-color, 0.6); + font-weight: 400; padding: 0.2em 0 0.2em 0.2em; } input[type='submit'] { + border-radius: 0; float: right; font-weight: normal; padding: 0.2em 1em; @@ -2412,6 +2726,24 @@ } // close .dir-search, .message-search + // Dirs & certain components hide search hides labels so can't width the label element + // adjust so that the input takes reduced width. + + div.dir-search { + margin-top: 0; + } + + .dir-search #search-members-form, + #search-groups-form, + #search-message-form { + + input[type='text'] { + float: left; + margin: 0; + width: 70%; + } + } + // Shift the search parent to the right and allow to shrinkwrap @include small-up { @@ -2420,14 +2752,6 @@ li.groups-members-search { float: right; margin-bottom: 5px !important; - - form { - label, - input[type='text'], - input[type='submit'] { - width: auto; - } - } } } // close @media @@ -2436,9 +2760,9 @@ @include large-up { .dir-search, + .message-search, + li.groups-members-search { - .message-search { - form { input[type='text'] { @@ -2454,6 +2778,34 @@ } // close #buddypress +// Adjustments for form elements colors, backgrounds, borders under the dark scheme. +body.colors-dark { + + #page { // for weight + + #buddypress { + + .dir-search, + .groups-members-search { + + form { + background: #333; + border-color: #555; + @include border-radius(2px); + padding: 1px; + } + + input[type="text"] { + background: none; + } + + input[type="submit"] { + @include border-radius(2px) + } + } + } + } +} /** *------------------------------------------------------------------------------- * @section 8.0 - Tables - General @@ -2472,9 +2824,9 @@ margin: $spacing-val-md 0; tr th { - background: lighten($dark-background, 10%); - border-color: darken($border-light, 20%); - color: $content-background; + background: $light-background; + border-color: $border-light; + color: $body-text; } // Reduce the themes inherited paragraph margins in tables @@ -2536,6 +2888,12 @@ } } // .notifications, .message-notices + + .notifications { // table element + .actions { // th element + text-align: center; + } + } } // #buddypress /** @@ -2573,6 +2931,17 @@ } // close #message + .bp-avatar-status, + .bp-cover-image-status { + + .warning { + background: #7dd4ff; + border: 1px solid #000; + color: $body-text; + @include font-size(16); + } + } + } // close #buddypress // Without direct classes on our mesages ( 'warning')