Changeset 9816
- Timestamp:
- 04/28/2015 06:16:49 PM (10 years ago)
- Location:
- trunk/src/bp-templates/bp-legacy/css
- Files:
-
- 3 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/src/bp-templates/bp-legacy/css/twentyfourteen-rtl.css
r9784 r9816 26 26 4.4 - Blogs Loop 27 27 5.0 - Directories - Members, Groups, Blogs, Forums 28 6.0 - Single Group Screens 29 7.0 - Single User Account Screens 30 7.1 - Notifications 31 7.2 - Private Messaging Threads 32 7.3 - Extended Profiles 33 7.4 - Settings 34 8.0 - Forms - General 35 9.0 - Tables - General 36 10.0 - Error / Success Messages 37 11.0 - Ajax Loading 38 12.0 - Widgets 28 6.0 - Single Item screens: User Account & Single Group Screens 29 6.1 - Item Headers: Global 30 6.1.1 - Item-header: Groups; 31 6.1.2 - item-header: User Accounts 32 6.2 - Item Body: Global 33 6.2.1 - item-body: Groups 34 6.2.1.1- Management settings screens 35 6.2.1.2 - Group members list 36 6.2.1.3 - Group Send Invites 37 6.2.2 - item-body: User Accounts 38 6.2.2.1 - classes, pag, filters 39 6.2.2.2 - Extended Profiles 40 6.2.2.3 - Groups 41 6.2.2.4 - friends 42 6.2.2.5 - Private Messaging Threads 43 6.2.2.6 - Settings 44 7.0 - Forms - General 45 8.0 - Tables - General 46 9.0 - Error / Success Messages 47 10.0 - Ajax Loading 48 11.0 - Widgets 39 49 ------------------------------------------------------------------------------*/ 40 50 /** … … 63 73 */ 64 74 /** 65 * ------------------------------------------------------------------------------ 66 * @section 2.1 - Navs - Object Nav / Sub Nav (item-list-tabs) 67 *------------------------------------------------------------------------------- 75 *---------------------------------------------------------- 76 * @subsection 2.1 - Object Nav / Subnav (item-list-tabs) 77 * 78 * The main navigational elements for all BP screens 79 *---------------------------------------------------------- 68 80 */ 69 81 .directory #buddypress .item-list-tabs ul:before, .directory #buddypress .item-list-tabs ul:after { … … 88 100 border-bottom: 0; } 89 101 102 /* List last filters global */ 103 #buddypress #subnav li#activity-filter-select.last { 104 line-height: 2.1; 105 margin-top: 0; } 106 90 107 /*__ Vertical Menu User Account Screens __*/ 91 108 @media screen and (min-width: 783px) { 92 .bp-user#buddypress {93 background: # eee; }94 .bp-user #buddypress #item-header, .bp-user#buddypress #item-body {109 #buddypress { 110 background: #d8d8d8; } 111 #buddypress #item-header, #buddypress #item-body { 95 112 background: #fff; } 96 .bp-user#buddypress #item-body {97 border-right: 1px solid # ddd; }98 .bp-user#buddypress #object-nav {99 background: # eee;100 border-left: 1px solid # ddd;113 #buddypress #item-body { 114 border-right: 1px solid #bebebe; } 115 #buddypress #object-nav { 116 background: #d8d8d8; 117 border-left: 1px solid #bebebe; 101 118 float: right; 102 119 margin-left: -1px; 103 120 width: 200px; } 104 .bp-user#buddypress #object-nav ul {121 #buddypress #object-nav ul { 105 122 border-bottom: 0; 123 border-top: 1px solid #bebebe; 106 124 padding: 0; } 107 .bp-user#buddypress #object-nav ul li {125 #buddypress #object-nav ul li { 108 126 float: none; 109 127 overflow: hidden; } 110 .bp-user #buddypress #object-nav ul li span { 128 #buddypress #object-nav ul li:focus, #buddypress #object-nav ul li:hover { 129 background: #bebebe; } 130 #buddypress #object-nav ul li span { 111 131 border-radius: 10%; 112 132 float: left; 113 133 margin-left: 15px; } 114 .bp-user #buddypress #item-body { 134 #buddypress #object-nav ul li.current { 135 background: #f1f1f1; } 136 #buddypress #item-body { 115 137 overflow: hidden; 116 138 padding: 0 20px; 117 139 width: auto; } 118 .bp-user#buddypress #item-body #subnav {119 border: 1px solid # ddd;140 #buddypress #item-body #subnav { 141 border: 1px solid #bebebe; 120 142 border-right: 0; 121 143 border-left: 0; 122 margin: 0 -20px 40px; } } 123 124 /** 125 *------------------------------------------------------------------------------- 126 * @section 2.2 - Pagination 127 *------------------------------------------------------------------------------- 144 margin: 0 -20px 40px; } 145 #buddypress #item-body #subnav li:focus, #buddypress #item-body #subnav li:hover { 146 background: #bebebe; } 147 #buddypress #item-body #subnav li.current { 148 background: #f1f1f1; } } 149 150 /** 151 *---------------------------------------------------------- 152 * @subsection 2.2 - Pagination 153 *---------------------------------------------------------- 128 154 */ 129 155 /** … … 177 203 #buddypress ul.item-list li .activity-meta a, #buddypress ul.item-list li .activity-meta div, #buddypress ul.item-list li .action a, #buddypress ul.item-list li .action div { 178 204 display: inline-block; 179 margin: spacing-val-xs 5px 0 0; } }205 margin: 5px 0 0 5px; } } 180 206 @media screen and (min-width: 783px) { 181 207 #buddypress ul.item-list li .item { … … 202 228 203 229 /** 204 *------------------------------------------------------------------------------- 205 * @section 4.0 - BP Lists / Loops Generic 206 *------------------------------------------------------------------------------- 207 */ 208 /** 209 *------------------------------------------------------------------------------- 230 *------------------------------------------------------------ 210 231 * @section 4.1 - Activity 211 *------------------------------------------------------------ -------------------212 */ 213 /** 214 *------------------------------------------------- ------------------------------215 * @s ection 4.1.1 - Activity What's New216 *------------------------------------------------- ------------------------------232 *------------------------------------------------------------ 233 */ 234 /** 235 *------------------------------------------------- 236 * @subsection 4.1.1 - Activity What's New 237 *------------------------------------------------- 217 238 */ 218 239 #buddypress #whats-new-form { … … 222 243 223 244 /** 224 *------------------------------------------------- ------------------------------225 * @s ection 4.1.2 - Activity Listing226 *------------------------------------------------- ------------------------------227 */ 228 /** 229 *------------------------------------------------- ------------------------------230 * @s ection 4.1.3 - Activity Comments231 *------------------------------------------------- ------------------------------245 *------------------------------------------------- 246 * @subsection 4.1.2 - Activity Listing 247 *------------------------------------------------- 248 */ 249 /** 250 *------------------------------------------------- 251 * @subsection 4.1.3 - Activity Comments 252 *------------------------------------------------- 232 253 */ 233 254 #buddypress .activity .activity-comments { … … 255 276 256 277 /** 257 *------------------------------------------------------------ -------------------278 *------------------------------------------------------------ 258 279 * @section 4.2 - Members Loop 259 *------------------------------------------------------------ -------------------280 *------------------------------------------------------------ 260 281 */ 261 282 #buddypress .members .item-list .my-entry .item { … … 270 291 width: 88%; } } 271 292 293 /* 294 *------------------------------------------------------------------------------- 295 * @section 6.0 - Single Item screens 296 *------------------------------------------------------------------------------- 297 */ 298 /* groups & user account page entry title */ 299 .single-item.groups .entry-title, .bp-user .entry-title { 300 background: #333333; 301 color: #fff; 302 font-size: 22px; 303 font-size: 1.375rem; 304 padding: 0.2em; } 305 @media screen and (min-width: 673px) { 306 .single-item.groups .entry-title, .bp-user .entry-title { 307 font-size: 28px; 308 font-size: 1.75rem; } } 309 310 /** 311 *------------------------------------------------------------ 312 * @subsection 6.1 - Item Header: Global 313 *------------------------------------------------------------ 314 */ 315 /** 316 *------------------------------------------------- 317 * @subsection 6.1.1 - item-header: Groups 318 *------------------------------------------------- 319 */ 320 @media screen and (max-width: 594px) { 321 .single-item.groups #buddypress div#item-header { 322 display: flex; 323 flex-direction: column; } 324 .single-item.groups #buddypress div#item-header #item-header-avatar { 325 order: 1; 326 text-align: center; } 327 .single-item.groups #buddypress div#item-header #item-header-avatar a { 328 border-bottom: 0; } 329 .single-item.groups #buddypress div#item-header #item-header-avatar a img { 330 display: inline-block; 331 float: none; } 332 .single-item.groups #buddypress div#item-header #item-header-content { 333 order: 2; } 334 .single-item.groups #buddypress div#item-header #item-actions { 335 margin-right: 0; 336 order: 3; 337 text-align: right; } 338 .single-item.groups #buddypress div#item-header #item-actions ul { 339 margin-right: 0; } 340 .single-item.groups #buddypress div#item-header #item-actions ul li { 341 float: right; } } 342 .single-item.groups #buddypress #item-header #item-actions { 343 float: none; 344 width: auto; } 345 .single-item.groups #buddypress #item-header #item-actions h3 { 346 font-size: 20px; 347 font-size: 1.25rem; } 348 .single-item.groups #buddypress #item-header #item-header-avatar { 349 text-align: center; } 350 .single-item.groups #buddypress #item-header #item-header-content { 351 float: none; 352 overflow: hidden; } 353 @media screen and (min-width: 594px) { 354 .single-item.groups #buddypress #item-header #item-actions { 355 float: left; } 356 .single-item.groups #buddypress #item-header #item-header-avatar { 357 float: right; } 358 .single-item.groups #buddypress #item-header #item-header-content { 359 float: none; 360 overflow: hidden; } } 361 362 /** 363 *------------------------------------------------- 364 * @subsection 6.1.2 - item-header: User Accounts 365 *------------------------------------------------- 366 */ 367 .bp-user #buddypress #item-header { 368 padding-bottom: 10px; } 369 .bp-user #buddypress #item-header #item-header-avatar { 370 text-align: center; 371 width: 100%; } 372 .bp-user #buddypress #item-header #item-header-avatar img { 373 float: none; } 374 @media screen and (min-width: 673px) { 375 .bp-user #buddypress #item-header #item-header-avatar { 376 float: right; 377 overflow: hidden; 378 text-align: right; 379 width: 20%; } 380 .bp-user #buddypress #item-header #item-header-avatar img { 381 margin: 0; } 382 .bp-user #buddypress #item-header #item-header-content { 383 float: left; 384 width: 78%; } } 385 386 /** 387 *------------------------------------------------------------ 388 * @subsection 6.2 - Item Body: Global 389 *------------------------------------------------------------ 390 */ 391 /** 392 *------------------------------------------------- 393 * @subsection 6.2.1 - item-body: groups 394 *------------------------------------------------- 395 */ 396 /** 397 *------------------------------ 398 * 6.2.1.1 - Groups Management 399 *------------------------------ 400 */ 401 /* manage members */ 402 .groups.manage-members #group-settings-form h4 { 403 margin-top: 40px; } 404 .groups.manage-members #group-settings-form .item-list { 405 background: #f7f7f7; 406 border-top: 0; 407 padding: 0 0.5em; } 408 .groups.manage-members #group-settings-form .item-list li { 409 border-bottom: 1px solid rgba(0, 0, 0, 0.1); } 410 .groups.manage-members #group-settings-form .item-list li:last-child { 411 border-bottom: 0; } 412 .groups.manage-members #group-settings-form .item-list li img, .groups.manage-members #group-settings-form .item-list li h5 { 413 clear: none; 414 float: right; } 415 .groups.manage-members #group-settings-form .item-list li img > a, .groups.manage-members #group-settings-form .item-list li h5 > a { 416 border-bottom: 0; } 417 .groups.manage-members #group-settings-form .item-list li span.small { 418 display: block; 419 float: none; 420 margin-top: 10px; 421 width: 100%; } 422 .groups.manage-members #group-settings-form .item-list li span.small a { 423 display: inline-block; 424 margin: 5px 0; 425 width: 100%; } 426 @media screen and (min-width: 38.75em) { 427 .groups.manage-members #group-settings-form .item-list li span.small a { 428 width: auto; } } 429 .groups.manage-members #group-settings-form .item-list li h5 { 430 margin: 0; } 431 432 /** 433 *------------------------------ 434 * 6.2.1.3 - Groups Send Invites 435 *------------------------------ 436 */ 437 @media screen and (min-width: 783px) { 438 .send-invites #buddypress #item-body { 439 border-top: 1px solid #bebebe; } } 440 .send-invites #buddypress #item-body #invite-list { 441 width: 120px; } 442 .send-invites #buddypress #item-body .main-column { 443 margin-right: 160px; } 444 .send-invites #buddypress #item-body li img.avatar { 445 display: block; 446 float: none; 447 margin: 10px auto; } 448 .send-invites #buddypress #item-body li .action { 449 margin-top: 10px; 450 text-align: right; 451 width: 100%; } 452 @media screen and (min-width: 38.75em) { 453 .send-invites #buddypress #item-body li .action { 454 text-align: left; } } 455 @media screen and (min-width: 594px) { 456 .send-invites #buddypress #item-body #invite-list { 457 width: 160px; } 458 .send-invites #buddypress #item-body .main-column { 459 margin-right: 190px; } 460 .send-invites #buddypress #item-body li img.avatar { 461 float: right; 462 margin: 0 0 0 10px; } } 463 464 /** 465 *------------------------------------------------- 466 * @subsection 6.2.2 - item-body: User Accounts 467 *------------------------------------------------- 468 */ 469 #buddypress { 470 /** 471 *------------------------------ 472 * 6.2.2.2 - Extended Profiles 473 *------------------------------ 474 */ } 475 #buddypress .profile { 476 /* Edit profile */ } 477 #buddypress .profile .bp-widget h4 { 478 background: #999; 479 color: #fff; 480 padding: 0.4em 0.2em; } 481 #buddypress .profile #profile-edit-form .button-nav:before, #buddypress .profile #profile-edit-form .button-nav:after { 482 content: " "; 483 display: table; } 484 #buddypress .profile #profile-edit-form .button-nav:after { 485 clear: both; } 486 #buddypress .profile #profile-edit-form ul.button-nav { 487 border-bottom: 1px solid rgba(0, 0, 0, 0.1); 488 margin-right: 0; } 489 #buddypress .profile #profile-edit-form ul.button-nav li { 490 float: right; 491 margin-bottom: 0; } 492 #buddypress .profile #profile-edit-form ul.button-nav li.current { 493 border: 1px solid rgba(0, 0, 0, 0.1); 494 border-bottom-color: #fff; 495 margin-bottom: -1px; } 496 #buddypress .profile #profile-edit-form ul.button-nav a { 497 background: none; 498 border: 0; 499 font-size: 18px; 500 font-size: 1.125rem; } 501 #buddypress .profile #profile-edit-form .field-visibility-settings-toggle, #buddypress .profile #profile-edit-form .field-visibility-settings { 502 font-size: 14px; 503 font-size: 0.875rem; } 504 #buddypress .profile #profile-edit-form .field-visibility-settings-close, #buddypress .profile #profile-edit-form .visibility-toggle-link { 505 background: #000; 506 color: #fff; 507 padding: 0.2em 0.5em; } 508 272 509 /*------------------------------------------------------------------------------ 273 * @section - 8.0 - Forms - General 274 *------------------------------------------------------------------------------- 275 */ 510 * @section - 7.0 - Forms - General 511 *------------------------------------------------------------------------------- 512 */ 513 #buddypress .standard-form input[type="text"], #buddypress .standard-form textarea { 514 width: 100%; } 276 515 #buddypress div.activity-comments form .ac-textarea { 277 516 background: #f7f7f7; … … 322 561 /** 323 562 *------------------------------------------------------------------------------- 324 * @section 9.0 - Tables General563 * @section 8.0 - Tables General 325 564 *------------------------------------------------------------------------------- 326 565 */ 327 566 /*__ User Account tables __*/ 567 /** 568 *------------------------------------------------------------------------------- 569 * @section 9.0 - Error / Success messages 570 *------------------------------------------------------------------------------- 571 */ 572 #buddypress div#message.info p { 573 background: #c6e4ee; 574 border: 1px solid #78bed6; 575 color: inherit; } 576 577 .delete-group #buddypress div#message.info p { 578 background: #db7e7e; 579 border: 1px solid #be3535; 580 color: #fff; } -
trunk/src/bp-templates/bp-legacy/css/twentyfourteen.css
r9784 r9816 26 26 4.4 - Blogs Loop 27 27 5.0 - Directories - Members, Groups, Blogs, Forums 28 6.0 - Single Group Screens 29 7.0 - Single User Account Screens 30 7.1 - Notifications 31 7.2 - Private Messaging Threads 32 7.3 - Extended Profiles 33 7.4 - Settings 34 8.0 - Forms - General 35 9.0 - Tables - General 36 10.0 - Error / Success Messages 37 11.0 - Ajax Loading 38 12.0 - Widgets 28 6.0 - Single Item screens: User Account & Single Group Screens 29 6.1 - Item Headers: Global 30 6.1.1 - Item-header: Groups; 31 6.1.2 - item-header: User Accounts 32 6.2 - Item Body: Global 33 6.2.1 - item-body: Groups 34 6.2.1.1- Management settings screens 35 6.2.1.2 - Group members list 36 6.2.1.3 - Group Send Invites 37 6.2.2 - item-body: User Accounts 38 6.2.2.1 - classes, pag, filters 39 6.2.2.2 - Extended Profiles 40 6.2.2.3 - Groups 41 6.2.2.4 - friends 42 6.2.2.5 - Private Messaging Threads 43 6.2.2.6 - Settings 44 7.0 - Forms - General 45 8.0 - Tables - General 46 9.0 - Error / Success Messages 47 10.0 - Ajax Loading 48 11.0 - Widgets 39 49 ------------------------------------------------------------------------------*/ 40 50 /** … … 63 73 */ 64 74 /** 65 * ------------------------------------------------------------------------------ 66 * @section 2.1 - Navs - Object Nav / Sub Nav (item-list-tabs) 67 *------------------------------------------------------------------------------- 75 *---------------------------------------------------------- 76 * @subsection 2.1 - Object Nav / Subnav (item-list-tabs) 77 * 78 * The main navigational elements for all BP screens 79 *---------------------------------------------------------- 68 80 */ 69 81 .directory #buddypress .item-list-tabs ul:before, .directory #buddypress .item-list-tabs ul:after { … … 88 100 border-bottom: 0; } 89 101 102 /* List last filters global */ 103 #buddypress #subnav li#activity-filter-select.last { 104 line-height: 2.1; 105 margin-top: 0; } 106 90 107 /*__ Vertical Menu User Account Screens __*/ 91 108 @media screen and (min-width: 783px) { 92 .bp-user#buddypress {93 background: # eee; }94 .bp-user #buddypress #item-header, .bp-user#buddypress #item-body {109 #buddypress { 110 background: #d8d8d8; } 111 #buddypress #item-header, #buddypress #item-body { 95 112 background: #fff; } 96 .bp-user#buddypress #item-body {97 border-left: 1px solid # ddd; }98 .bp-user#buddypress #object-nav {99 background: # eee;100 border-right: 1px solid # ddd;113 #buddypress #item-body { 114 border-left: 1px solid #bebebe; } 115 #buddypress #object-nav { 116 background: #d8d8d8; 117 border-right: 1px solid #bebebe; 101 118 float: left; 102 119 margin-right: -1px; 103 120 width: 200px; } 104 .bp-user#buddypress #object-nav ul {121 #buddypress #object-nav ul { 105 122 border-bottom: 0; 123 border-top: 1px solid #bebebe; 106 124 padding: 0; } 107 .bp-user#buddypress #object-nav ul li {125 #buddypress #object-nav ul li { 108 126 float: none; 109 127 overflow: hidden; } 110 .bp-user #buddypress #object-nav ul li span { 128 #buddypress #object-nav ul li:focus, #buddypress #object-nav ul li:hover { 129 background: #bebebe; } 130 #buddypress #object-nav ul li span { 111 131 border-radius: 10%; 112 132 float: right; 113 133 margin-right: 15px; } 114 .bp-user #buddypress #item-body { 134 #buddypress #object-nav ul li.current { 135 background: #f1f1f1; } 136 #buddypress #item-body { 115 137 overflow: hidden; 116 138 padding: 0 20px; 117 139 width: auto; } 118 .bp-user#buddypress #item-body #subnav {119 border: 1px solid # ddd;140 #buddypress #item-body #subnav { 141 border: 1px solid #bebebe; 120 142 border-left: 0; 121 143 border-right: 0; 122 margin: 0 -20px 40px; } } 123 124 /** 125 *------------------------------------------------------------------------------- 126 * @section 2.2 - Pagination 127 *------------------------------------------------------------------------------- 144 margin: 0 -20px 40px; } 145 #buddypress #item-body #subnav li:focus, #buddypress #item-body #subnav li:hover { 146 background: #bebebe; } 147 #buddypress #item-body #subnav li.current { 148 background: #f1f1f1; } } 149 150 /** 151 *---------------------------------------------------------- 152 * @subsection 2.2 - Pagination 153 *---------------------------------------------------------- 128 154 */ 129 155 /** … … 177 203 #buddypress ul.item-list li .activity-meta a, #buddypress ul.item-list li .activity-meta div, #buddypress ul.item-list li .action a, #buddypress ul.item-list li .action div { 178 204 display: inline-block; 179 margin: spacing-val-xs5px 0 0; } }205 margin: 5px 5px 0 0; } } 180 206 @media screen and (min-width: 783px) { 181 207 #buddypress ul.item-list li .item { … … 202 228 203 229 /** 204 *------------------------------------------------------------------------------- 205 * @section 4.0 - BP Lists / Loops Generic 206 *------------------------------------------------------------------------------- 207 */ 208 /** 209 *------------------------------------------------------------------------------- 230 *------------------------------------------------------------ 210 231 * @section 4.1 - Activity 211 *------------------------------------------------------------ -------------------212 */ 213 /** 214 *------------------------------------------------- ------------------------------215 * @s ection 4.1.1 - Activity What's New216 *------------------------------------------------- ------------------------------232 *------------------------------------------------------------ 233 */ 234 /** 235 *------------------------------------------------- 236 * @subsection 4.1.1 - Activity What's New 237 *------------------------------------------------- 217 238 */ 218 239 #buddypress #whats-new-form { … … 222 243 223 244 /** 224 *------------------------------------------------- ------------------------------225 * @s ection 4.1.2 - Activity Listing226 *------------------------------------------------- ------------------------------227 */ 228 /** 229 *------------------------------------------------- ------------------------------230 * @s ection 4.1.3 - Activity Comments231 *------------------------------------------------- ------------------------------245 *------------------------------------------------- 246 * @subsection 4.1.2 - Activity Listing 247 *------------------------------------------------- 248 */ 249 /** 250 *------------------------------------------------- 251 * @subsection 4.1.3 - Activity Comments 252 *------------------------------------------------- 232 253 */ 233 254 #buddypress .activity .activity-comments { … … 255 276 256 277 /** 257 *------------------------------------------------------------ -------------------278 *------------------------------------------------------------ 258 279 * @section 4.2 - Members Loop 259 *------------------------------------------------------------ -------------------280 *------------------------------------------------------------ 260 281 */ 261 282 #buddypress .members .item-list .my-entry .item { … … 270 291 width: 88%; } } 271 292 293 /* 294 *------------------------------------------------------------------------------- 295 * @section 6.0 - Single Item screens 296 *------------------------------------------------------------------------------- 297 */ 298 /* groups & user account page entry title */ 299 .single-item.groups .entry-title, .bp-user .entry-title { 300 background: #333333; 301 color: #fff; 302 font-size: 22px; 303 font-size: 1.375rem; 304 padding: 0.2em; } 305 @media screen and (min-width: 673px) { 306 .single-item.groups .entry-title, .bp-user .entry-title { 307 font-size: 28px; 308 font-size: 1.75rem; } } 309 310 /** 311 *------------------------------------------------------------ 312 * @subsection 6.1 - Item Header: Global 313 *------------------------------------------------------------ 314 */ 315 /** 316 *------------------------------------------------- 317 * @subsection 6.1.1 - item-header: Groups 318 *------------------------------------------------- 319 */ 320 @media screen and (max-width: 594px) { 321 .single-item.groups #buddypress div#item-header { 322 display: flex; 323 flex-direction: column; } 324 .single-item.groups #buddypress div#item-header #item-header-avatar { 325 order: 1; 326 text-align: center; } 327 .single-item.groups #buddypress div#item-header #item-header-avatar a { 328 border-bottom: 0; } 329 .single-item.groups #buddypress div#item-header #item-header-avatar a img { 330 display: inline-block; 331 float: none; } 332 .single-item.groups #buddypress div#item-header #item-header-content { 333 order: 2; } 334 .single-item.groups #buddypress div#item-header #item-actions { 335 margin-left: 0; 336 order: 3; 337 text-align: left; } 338 .single-item.groups #buddypress div#item-header #item-actions ul { 339 margin-left: 0; } 340 .single-item.groups #buddypress div#item-header #item-actions ul li { 341 float: left; } } 342 .single-item.groups #buddypress #item-header #item-actions { 343 float: none; 344 width: auto; } 345 .single-item.groups #buddypress #item-header #item-actions h3 { 346 font-size: 20px; 347 font-size: 1.25rem; } 348 .single-item.groups #buddypress #item-header #item-header-avatar { 349 text-align: center; } 350 .single-item.groups #buddypress #item-header #item-header-content { 351 float: none; 352 overflow: hidden; } 353 @media screen and (min-width: 594px) { 354 .single-item.groups #buddypress #item-header #item-actions { 355 float: right; } 356 .single-item.groups #buddypress #item-header #item-header-avatar { 357 float: left; } 358 .single-item.groups #buddypress #item-header #item-header-content { 359 float: none; 360 overflow: hidden; } } 361 362 /** 363 *------------------------------------------------- 364 * @subsection 6.1.2 - item-header: User Accounts 365 *------------------------------------------------- 366 */ 367 .bp-user #buddypress #item-header { 368 padding-bottom: 10px; } 369 .bp-user #buddypress #item-header #item-header-avatar { 370 text-align: center; 371 width: 100%; } 372 .bp-user #buddypress #item-header #item-header-avatar img { 373 float: none; } 374 @media screen and (min-width: 673px) { 375 .bp-user #buddypress #item-header #item-header-avatar { 376 float: left; 377 overflow: hidden; 378 text-align: left; 379 width: 20%; } 380 .bp-user #buddypress #item-header #item-header-avatar img { 381 margin: 0; } 382 .bp-user #buddypress #item-header #item-header-content { 383 float: right; 384 width: 78%; } } 385 386 /** 387 *------------------------------------------------------------ 388 * @subsection 6.2 - Item Body: Global 389 *------------------------------------------------------------ 390 */ 391 /** 392 *------------------------------------------------- 393 * @subsection 6.2.1 - item-body: groups 394 *------------------------------------------------- 395 */ 396 /** 397 *------------------------------ 398 * 6.2.1.1 - Groups Management 399 *------------------------------ 400 */ 401 /* manage members */ 402 .groups.manage-members #group-settings-form h4 { 403 margin-top: 40px; } 404 .groups.manage-members #group-settings-form .item-list { 405 background: #f7f7f7; 406 border-top: 0; 407 padding: 0 0.5em; } 408 .groups.manage-members #group-settings-form .item-list li { 409 border-bottom: 1px solid rgba(0, 0, 0, 0.1); } 410 .groups.manage-members #group-settings-form .item-list li:last-child { 411 border-bottom: 0; } 412 .groups.manage-members #group-settings-form .item-list li img, .groups.manage-members #group-settings-form .item-list li h5 { 413 clear: none; 414 float: left; } 415 .groups.manage-members #group-settings-form .item-list li img > a, .groups.manage-members #group-settings-form .item-list li h5 > a { 416 border-bottom: 0; } 417 .groups.manage-members #group-settings-form .item-list li span.small { 418 display: block; 419 float: none; 420 margin-top: 10px; 421 width: 100%; } 422 .groups.manage-members #group-settings-form .item-list li span.small a { 423 display: inline-block; 424 margin: 5px 0; 425 width: 100%; } 426 @media screen and (min-width: 38.75em) { 427 .groups.manage-members #group-settings-form .item-list li span.small a { 428 width: auto; } } 429 .groups.manage-members #group-settings-form .item-list li h5 { 430 margin: 0; } 431 432 /** 433 *------------------------------ 434 * 6.2.1.3 - Groups Send Invites 435 *------------------------------ 436 */ 437 @media screen and (min-width: 783px) { 438 .send-invites #buddypress #item-body { 439 border-top: 1px solid #bebebe; } } 440 .send-invites #buddypress #item-body #invite-list { 441 width: 120px; } 442 .send-invites #buddypress #item-body .main-column { 443 margin-left: 160px; } 444 .send-invites #buddypress #item-body li img.avatar { 445 display: block; 446 float: none; 447 margin: 10px auto; } 448 .send-invites #buddypress #item-body li .action { 449 margin-top: 10px; 450 text-align: left; 451 width: 100%; } 452 @media screen and (min-width: 38.75em) { 453 .send-invites #buddypress #item-body li .action { 454 text-align: right; } } 455 @media screen and (min-width: 594px) { 456 .send-invites #buddypress #item-body #invite-list { 457 width: 160px; } 458 .send-invites #buddypress #item-body .main-column { 459 margin-left: 190px; } 460 .send-invites #buddypress #item-body li img.avatar { 461 float: left; 462 margin: 0 10px 0 0; } } 463 464 /** 465 *------------------------------------------------- 466 * @subsection 6.2.2 - item-body: User Accounts 467 *------------------------------------------------- 468 */ 469 #buddypress { 470 /** 471 *------------------------------ 472 * 6.2.2.2 - Extended Profiles 473 *------------------------------ 474 */ } 475 #buddypress .profile { 476 /* Edit profile */ } 477 #buddypress .profile .bp-widget h4 { 478 background: #999; 479 color: #fff; 480 padding: 0.4em 0.2em; } 481 #buddypress .profile #profile-edit-form .button-nav:before, #buddypress .profile #profile-edit-form .button-nav:after { 482 content: " "; 483 display: table; } 484 #buddypress .profile #profile-edit-form .button-nav:after { 485 clear: both; } 486 #buddypress .profile #profile-edit-form ul.button-nav { 487 border-bottom: 1px solid rgba(0, 0, 0, 0.1); 488 margin-left: 0; } 489 #buddypress .profile #profile-edit-form ul.button-nav li { 490 float: left; 491 margin-bottom: 0; } 492 #buddypress .profile #profile-edit-form ul.button-nav li.current { 493 border: 1px solid rgba(0, 0, 0, 0.1); 494 border-bottom-color: #fff; 495 margin-bottom: -1px; } 496 #buddypress .profile #profile-edit-form ul.button-nav a { 497 background: none; 498 border: 0; 499 font-size: 18px; 500 font-size: 1.125rem; } 501 #buddypress .profile #profile-edit-form .field-visibility-settings-toggle, #buddypress .profile #profile-edit-form .field-visibility-settings { 502 font-size: 14px; 503 font-size: 0.875rem; } 504 #buddypress .profile #profile-edit-form .field-visibility-settings-close, #buddypress .profile #profile-edit-form .visibility-toggle-link { 505 background: #000; 506 color: #fff; 507 padding: 0.2em 0.5em; } 508 272 509 /*------------------------------------------------------------------------------ 273 * @section - 8.0 - Forms - General 274 *------------------------------------------------------------------------------- 275 */ 510 * @section - 7.0 - Forms - General 511 *------------------------------------------------------------------------------- 512 */ 513 #buddypress .standard-form input[type="text"], #buddypress .standard-form textarea { 514 width: 100%; } 276 515 #buddypress div.activity-comments form .ac-textarea { 277 516 background: #f7f7f7; … … 322 561 /** 323 562 *------------------------------------------------------------------------------- 324 * @section 9.0 - Tables General563 * @section 8.0 - Tables General 325 564 *------------------------------------------------------------------------------- 326 565 */ 327 566 /*__ User Account tables __*/ 567 /** 568 *------------------------------------------------------------------------------- 569 * @section 9.0 - Error / Success messages 570 *------------------------------------------------------------------------------- 571 */ 572 #buddypress div#message.info p { 573 background: #c6e4ee; 574 border: 1px solid #78bed6; 575 color: inherit; } 576 577 .delete-group #buddypress div#message.info p { 578 background: #db7e7e; 579 border: 1px solid #be3535; 580 color: #fff; } -
trunk/src/bp-templates/bp-legacy/css/twentyfourteen.scss
r9784 r9816 84 84 // Box sizing 85 85 86 @mixin box-model($box-model ) {86 @mixin box-model($box-model: border-box) { 87 87 // -webkit-box-sizing: $box-model; 88 88 // -moz-box-sizing: $box-model; … … 90 90 } 91 91 92 // BP message boxes 93 @mixin message-box($background, $text-color: inherit) { 94 background: lighten($background, 10%); 95 border: 1px solid darken($background, 10%); 96 color: $text-color; 97 } 98 99 // titles dark backgrounds 100 @mixin title-background-dark() { 101 background: lighten($dark-background, 20%); 102 color: $dark-back-text-color; 103 } 104 92 105 // Variabals: color definitions 93 $content-background: #fff; 94 $light-background: #f7f7f7; 95 $medium-background: #999; 96 $dark-background: #000; 97 $border-color: #000; // border color can be varied using rgba 98 $border-med: rgba(#000, 0.2); 99 $border-light: rgba(#000, 0.1); // BP dividers 100 $body-text: #2b2b2b; // 2015 body text color 101 $bp-button-hover: #ededed; // this is the default BP button hover background 106 $content-background: #fff; 107 $dark-back-text-color: #fff; 108 $light-background: #f7f7f7; 109 $medium-background: #999; 110 $dark-background: #000; 111 $border-color: #000; // border color can be varied using rgba 112 $border-med: rgba(#000, 0.2); 113 $border-light: rgba(#000, 0.1); // BP dividers 114 $body-text: #2b2b2b; // 2015 body text color 115 $bp-button-hover: #ededed; // this is the default BP button hover background 116 $notice-warning: #d05656; 117 $notice-info: #9fd1e2; 102 118 103 119 // 2014 font family … … 133 149 4.4 - Blogs Loop 134 150 5.0 - Directories - Members, Groups, Blogs, Forums 135 6.0 - Single Group Screens 136 7.0 - Single User Account Screens 137 7.1 - Notifications 138 7.2 - Private Messaging Threads 139 7.3 - Extended Profiles 140 7.4 - Settings 141 8.0 - Forms - General 142 9.0 - Tables - General 143 10.0 - Error / Success Messages 144 11.0 - Ajax Loading 145 12.0 - Widgets 151 6.0 - Single Item screens: User Account & Single Group Screens 152 6.1 - Item Headers: Global 153 6.1.1 - Item-header: Groups; 154 6.1.2 - item-header: User Accounts 155 6.2 - Item Body: Global 156 6.2.1 - item-body: Groups 157 6.2.1.1- Management settings screens 158 6.2.1.2 - Group members list 159 6.2.1.3 - Group Send Invites 160 6.2.2 - item-body: User Accounts 161 6.2.2.1 - classes, pag, filters 162 6.2.2.2 - Extended Profiles 163 6.2.2.3 - Groups 164 6.2.2.4 - friends 165 6.2.2.5 - Private Messaging Threads 166 6.2.2.6 - Settings 167 7.0 - Forms - General 168 8.0 - Tables - General 169 9.0 - Error / Success Messages 170 10.0 - Ajax Loading 171 11.0 - Widgets 146 172 ------------------------------------------------------------------------------*/ 147 173 … … 186 212 187 213 /** 188 * ------------------------------------------------------------------------------ 189 * @section 2.1 - Navs - Object Nav / Sub Nav (item-list-tabs) 190 *------------------------------------------------------------------------------- 214 *---------------------------------------------------------- 215 * @subsection 2.1 - Object Nav / Subnav (item-list-tabs) 216 * 217 * The main navigational elements for all BP screens 218 *---------------------------------------------------------- 191 219 */ 192 220 … … 231 259 } // close .directory #buddypress 232 260 233 /*__ Vertical Menu User Account Screens __*/ 261 /* List last filters global */ 262 #buddypress { 263 #subnav { 264 li#activity-filter-select.last { 265 line-height: 2.1; 266 margin-top: 0; 267 } 268 } 269 } 270 271 /*__ Vertical Menu User Account Screens __*/ 234 272 235 273 // This block contains the rules to re-factor the item-body structural element 236 // to sit alongside the vert menu 274 // to sit alongside the vert menu & menu item styles. 275 276 // Boders & backgrounds for user/group navs rely on one color 277 // set this here for convenience of changing and clarity 278 $nav-background-border: #bebebe; 237 279 238 280 @media screen and (min-width: 783px) { 239 .bp-user#buddypress {240 background: #eee;281 #buddypress { 282 background: lighten($nav-background-border, 10%); 241 283 242 284 #item-header, … … 245 287 } 246 288 247 #item-body {border-left: 1px solid #ddd;}289 #item-body {border-left: 1px solid $nav-background-border;} 248 290 249 291 #object-nav { 250 background: #eee;251 border-right: 1px solid #ddd;292 background: lighten($nav-background-border, 10%); 293 border-right: 1px solid $nav-background-border; 252 294 float: left; 253 295 margin-right: -1px; … … 256 298 ul { 257 299 border-bottom: 0; 300 border-top: 1px solid $nav-background-border; 258 301 padding: 0; 259 302 … … 261 304 float: none; 262 305 overflow: hidden; 306 307 &:focus, 308 &:hover { 309 background: $nav-background-border; 310 } 263 311 264 312 span { … … 268 316 } 269 317 } 318 319 li.current { 320 background: lighten($nav-background-border, 20%); 321 } 270 322 } 271 323 } … … 277 329 278 330 #subnav { 279 border: 1px solid #ddd;331 border: 1px solid $nav-background-border; 280 332 border-left: 0; 281 333 border-right: 0; 282 334 margin: 0 (-$spacing-val-md) $spacing-val-lg; 335 336 li:focus, 337 li:hover { 338 background: $nav-background-border; 339 } 340 341 li.current { 342 background: lighten($nav-background-border, 20%); 343 } 283 344 } 284 345 } … … 287 348 288 349 /** 289 *---------------------------------------------------------- ---------------------290 * @s ection 2.2 - Pagination291 *---------------------------------------------------------- ---------------------350 *---------------------------------------------------------- 351 * @subsection 2.2 - Pagination 352 *---------------------------------------------------------- 292 353 */ 293 354 … … 392 453 div { 393 454 display: inline-block; 394 margin: spacing-val-xs $spacing-val-xs 0 0;455 margin: $spacing-val-xs $spacing-val-xs 0 0; 395 456 } 396 457 } … … 438 499 439 500 /** 440 *------------------------------------------------------------------------------- 441 * @section 4.0 - BP Lists / Loops Generic 442 *------------------------------------------------------------------------------- 443 */ 444 445 /** 446 *------------------------------------------------------------------------------- 501 *------------------------------------------------------------ 447 502 * @section 4.1 - Activity 448 *------------------------------------------------------------ -------------------449 */ 450 451 /** 452 *------------------------------------------------- ------------------------------453 * @s ection 4.1.1 - Activity What's New454 *------------------------------------------------- ------------------------------503 *------------------------------------------------------------ 504 */ 505 506 /** 507 *------------------------------------------------- 508 * @subsection 4.1.1 - Activity What's New 509 *------------------------------------------------- 455 510 */ 456 511 #buddypress { … … 465 520 466 521 /** 467 *------------------------------------------------- ------------------------------468 * @s ection 4.1.2 - Activity Listing469 *------------------------------------------------- ------------------------------470 */ 471 472 /** 473 *------------------------------------------------- ------------------------------474 * @s ection 4.1.3 - Activity Comments475 *------------------------------------------------- ------------------------------522 *------------------------------------------------- 523 * @subsection 4.1.2 - Activity Listing 524 *------------------------------------------------- 525 */ 526 527 /** 528 *------------------------------------------------- 529 * @subsection 4.1.3 - Activity Comments 530 *------------------------------------------------- 476 531 */ 477 532 … … 521 576 522 577 /** 523 *------------------------------------------------------------ -------------------578 *------------------------------------------------------------ 524 579 * @section 4.2 - Members Loop 525 *------------------------------------------------------------ -------------------580 *------------------------------------------------------------ 526 581 */ 527 582 … … 546 601 } 547 602 } 603 604 /* 605 *------------------------------------------------------------------------------- 606 * @section 6.0 - Single Item screens 607 *------------------------------------------------------------------------------- 608 */ 609 /* groups & user account page entry title */ 610 .single-item.groups, 611 .bp-user { 612 613 .entry-title { 614 @include title-background-dark(); 615 @include font-size(22); 616 padding: 0.2em; 617 } 618 619 @media screen and (min-width: 673px) { 620 .entry-title { 621 @include font-size(28); 622 } 623 } 624 625 } // close #buddypress 626 /** 627 *------------------------------------------------------------ 628 * @subsection 6.1 - Item Header: Global 629 *------------------------------------------------------------ 630 */ 631 632 /** 633 *------------------------------------------------- 634 * @subsection 6.1.1 - item-header: Groups 635 *------------------------------------------------- 636 */ 637 .single-item.groups { 638 #buddypress { 639 640 @media screen and (max-width: 594px) { 641 div#item-header { 642 display: flex; 643 flex-direction: column; 644 645 #item-header-avatar { 646 order: 1; 647 text-align: center; 648 649 a { 650 border-bottom: 0; 651 652 img { 653 display: inline-block; 654 float: none; 655 } 656 } 657 } 658 659 #item-header-content {order: 2;} 660 661 #item-actions { 662 margin-left: 0; 663 order: 3; 664 text-align: left; 665 666 ul { 667 margin-left: 0; 668 669 li { 670 float: left; 671 } 672 } 673 } // close #item-actions 674 } 675 } // close @media 676 677 #item-header { 678 679 #item-actions { 680 float: none; 681 width: auto; 682 683 h3 { 684 @include font-size(20); 685 } 686 } 687 688 #item-header-avatar { 689 text-align: center; 690 } 691 692 #item-header-content { 693 float: none; 694 overflow: hidden; 695 } 696 697 @media screen and (min-width: 594px) { 698 #item-actions { 699 float: right; 700 } 701 702 #item-header-avatar { 703 float: left; 704 } 705 706 #item-header-content { 707 float: none; 708 overflow: hidden; 709 } 710 }// close @media 711 712 } 713 } 714 } // close .single-item.groups 715 716 /** 717 *------------------------------------------------- 718 * @subsection 6.1.2 - item-header: User Accounts 719 *------------------------------------------------- 720 */ 721 722 .bp-user #buddypress { 723 #item-header { 724 padding-bottom: $spacing-val-sm; 725 726 #item-header-avatar { 727 text-align: center; 728 width: 100%; 729 730 img { 731 float: none; 732 } 733 } 734 735 @media screen and (min-width: 673px) { 736 #item-header-avatar { 737 float: left; 738 overflow: hidden; 739 text-align: left; 740 width: 20%; 741 742 img {margin: 0;} 743 } 744 745 #item-header-content { 746 float: right; 747 width: 78%; 748 } 749 } 750 751 } // close #item-header 752 753 } // close .bp-user #buddypress 754 755 /** 756 *------------------------------------------------------------ 757 * @subsection 6.2 - Item Body: Global 758 *------------------------------------------------------------ 759 */ 760 761 /** 762 *------------------------------------------------- 763 * @subsection 6.2.1 - item-body: groups 764 *------------------------------------------------- 765 */ 766 767 /** 768 *------------------------------ 769 * 6.2.1.1 - Groups Management 770 *------------------------------ 771 */ 772 773 /* manage members */ 774 .groups.manage-members { 775 #group-settings-form { 776 777 h4 {margin-top: $spacing-val-lg;} 778 779 .item-list { 780 background: $light-background; 781 border-top: 0; 782 padding: 0 0.5em; 783 784 li { 785 border-bottom: 1px solid $border-light; 786 &:last-child {border-bottom: 0;} 787 788 img, 789 h5 { 790 clear: none; 791 float: left; 792 > a {border-bottom: 0;} 793 } 794 795 span.small { 796 display: block; 797 float: none; 798 margin-top: $spacing-val-sm; 799 width: 100%; 800 801 a { 802 display: inline-block; 803 margin: $spacing-val-xs 0; 804 width: 100%; 805 806 @media screen and (min-width: 38.75em) { 807 width: auto; 808 } 809 } 810 } 811 812 h5 { 813 margin: 0; 814 } 815 816 } 817 } 818 } 819 } // close .groups.manage-members 820 821 /** 822 *------------------------------ 823 * 6.2.1.3 - Groups Send Invites 824 *------------------------------ 825 */ 826 827 .send-invites { 828 #buddypress { 829 #item-body { 830 @media screen and (min-width: 783px) { 831 border-top: 1px solid $nav-background-border; 832 } 833 834 #invite-list {width: 120px;} 835 .main-column {margin-left: 160px;} 836 837 li { 838 img.avatar { 839 display: block; 840 float: none; 841 margin: $spacing-val-sm auto; 842 } 843 844 .action { 845 margin-top: $spacing-val-sm; 846 text-align: left; 847 width: 100%; 848 849 @media screen and (min-width: 38.75em) { 850 text-align: right; 851 } 852 } 853 } 854 855 @media screen and (min-width: 594px) { 856 #invite-list {width: 160px;} 857 .main-column {margin-left: 190px;} 858 859 li { 860 img.avatar { 861 float: left; 862 margin: 0 $spacing-val-sm 0 0; 863 } 864 } 865 } 866 867 } 868 } 869 } 870 /** 871 *------------------------------------------------- 872 * @subsection 6.2.2 - item-body: User Accounts 873 *------------------------------------------------- 874 */ 875 #buddypress { 876 /** 877 *------------------------------ 878 * 6.2.2.2 - Extended Profiles 879 *------------------------------ 880 */ 881 .profile { 882 883 .bp-widget { 884 h4 { 885 background: $medium-background; 886 color: #fff; 887 padding: 0.4em 0.2em; 888 } 889 } 890 891 /* Edit profile */ 892 893 #profile-edit-form { 894 .button-nav:before, 895 .button-nav:after { 896 content: " "; 897 display: table; 898 } 899 900 .button-nav:after { 901 clear: both; 902 } 903 904 ul.button-nav { 905 border-bottom: 1px solid $border-light; 906 margin-left: 0; 907 908 li { 909 float: left; 910 margin-bottom: 0; 911 912 &.current { 913 border: 1px solid $border-light; 914 border-bottom-color: #fff; 915 margin-bottom: -1px; 916 } 917 } // li 918 919 a { 920 background: none; 921 border: 0; 922 @include font-size(18) 923 } 924 } //.button-nav 925 926 .field-visibility-settings-toggle, 927 .field-visibility-settings { 928 @include font-size(14); 929 } 930 931 .field-visibility-settings-close, 932 .visibility-toggle-link { 933 background: $dark-background; 934 color: #fff; 935 padding: 0.2em 0.5em; 936 } 937 } // close profile form 938 939 } // close .profile 940 941 } // close #buddypress - user acounts item-body 548 942 /*------------------------------------------------------------------------------ 549 * @section - 8.0 - Forms - General943 * @section - 7.0 - Forms - General 550 944 *------------------------------------------------------------------------------- 551 945 */ … … 554 948 // are not inherited or being overriden. 555 949 #buddypress { 950 951 .standard-form { 952 input[type="text"], 953 textarea { 954 width: 100%; 955 } 956 } 556 957 557 958 div.activity-comments { … … 643 1044 /** 644 1045 *------------------------------------------------------------------------------- 645 * @section 9.0 - Tables General1046 * @section 8.0 - Tables General 646 1047 *------------------------------------------------------------------------------- 647 1048 */ … … 649 1050 /*__ User Account tables __*/ 650 1051 1052 /** 1053 *------------------------------------------------------------------------------- 1054 * @section 9.0 - Error / Success messages 1055 *------------------------------------------------------------------------------- 1056 */ 1057 #buddypress { 1058 div#message.info { 1059 p { 1060 @include message-box($notice-info); 1061 } 1062 } 1063 } 1064 1065 // Without direct classes on our mesages ( 'warning' ) 1066 // we need to use the body classes 1067 // message args ($variable-color, text-color) 1068 .delete-group { 1069 #buddypress { 1070 div#message.info { 1071 p { 1072 @include message-box($notice-warning, #fff); 1073 } 1074 } 1075 } 1076 } 1077
Note: See TracChangeset
for help on using the changeset viewer.