view/global.css

   1 /* General style rules .*/
   2 .pull-right { float: right }
   3
   4 /* General designing elements */
   5 .btn {
   6   outline: none;
   7   -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
   8   -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
   9   box-shadow: inset 0px 1px 0px 0px #ffffff;
  10   background-color: #ededed;
  11   text-indent: 0;
  12   border: 1px solid #dcdcdc;
  13   display: inline-block;
  14   color: #777777;
  15   padding: 5px 10px;
  16   text-align: center;
  17 }
  18 a.btn, a.btn:hover {
  19   text-decoration: none;
  20   color: inherit;
  21 }
  22
  23 .menu-popup .divider {
  24   height: 1px;
  25   margin: 3px 0;
  26   overflow: hidden;
  27   background-color: #2d2d2d;
  28 }
  29
  30 .overline {
  31   text-decoration: overline;
  32 }
  33
  34 /* List of social Networks */
  35 img.connector, img.connector-disabled {
  36   height: 40px;
  37   margin-right: 10px;
  38   border-radius: 10px;
  39 }
  40
  41 img.connector-disabled {
  42   opacity: 0.5;
  43 }
  44
  45 h3.connector {
  46   display: inline-block;
  47   vertical-align: bottom;
  48 }
  49 span.connector {
  50   vertical-align: super;
  51 }
  52
  53 /* Embedded link information */
  54 .type-link, .type-video {
  55   border-top: 1px solid #D2D2D2;
  56   border-bottom: 1px solid #D2D2D2;
  57   display: block;
  58   padding-top: 5px;
  59   padding-bottom: 5px;
  60   margin-top: 10px;
  61 }
  62
  63 .type-link:after, .type-video:after,
  64 .oembed.video:after {
  65   content: ".";
  66   display: block;
  67   height: 0;
  68   clear: both;
  69   visibility: hidden;
  70 }
  71
  72 .type-video .oembed.video:after {
  73   float: left;
  74 }
  75
  76 .wall-item-container .wall-item-content .type-link img,
  77 .type-link img, .type-video img, img.attachment-preview {
  78   max-width: 160px;
  79   max-height: 160px;
  80   float: left;
  81   margin-right: 10px;
  82 }
  83
  84 .wall-item-container .wall-item-content .type-link img.attachment-image,
  85 .type-link img.attachment-image, .type-video img.attachment-image  {
  86   /* max-width: 640px; */
  87   max-width: 100%;
  88   max-height: initial;
  89   float: initial;
  90   margin-right: 0px;
  91 }
  92
  93 .type-link blockquote, .type-video blockquote {
  94   margin-left: 0px;
  95   max-height: 160px;
  96   overflow: hidden;
  97   border-left: 0px;
  98   padding-left: 0px;
  99   font-size: 13px;
 100   line-height: normal;
 101 }
 102
 103 .type-link .oembed, .type-video .oembed {
 104   font-size: 18px;
 105   font-weight: 300;
 106   line-height: normal;
 107 }
 108 .type-link img, .type-video img {
 109 }
 110
 111 .type-video .embed_video {
 112   margin: 0em;
 113 }
 114
 115 .type-link span.oembed + br, .type-video span.oembed + br,
 116 .type-link a + br, .type-video a + br,
 117 .type-link img + br, .type-video img + br{
 118   display: none;
 119 }
 120
 121 .embed_video {
 122   float:left;
 123   margin: 1em;
 124   position: relative;
 125 }
 126
 127 .embed_video.active {
 128   float: none;
 129 }
 130
 131 .oembed.video .embed_video > div {
 132   position: absolute;
 133   top: 0px;
 134   left: 0px;
 135 }
 136 .embed_rich {
 137   display: block;
 138   transition: height .75s;
 139 }
 140
 141 /* Shared Messages */
 142 .shared_header {
 143   min-height: 32px;
 144   color: #999;
 145   border-top: 1px solid #D2D2D2;
 146   padding-top: 5px;
 147   margin-top: 5px;
 148 }
 149
 150 .shared_header a {
 151   color: black;
 152   -webkit-transition: all 0.2s ease-in-out;
 153   -moz-transition: all 0.2s ease-in-out;
 154   -o-transition: all 0.2s ease-in-out;
 155   -ms-transition: all 0.2s ease-in-out;
 156   transition: all 0.2s ease-in-out;
 157 }
 158
 159 .shared_header a:hover {
 160   color: #36c;
 161 }
 162
 163 .shared_header img {
 164   -webkit-border-radius: 4px;
 165   -moz-border-radius: 4px;
 166   border-radius: 4px;
 167   float: left;
 168   margin-right: 9px;
 169 }
 170
 171 .shared_header span {
 172   display: table-cell;
 173   float: none;
 174 }
 175
 176 blockquote.shared_content {
 177   margin-left: 32px;
 178   color: #000;
 179   border: none;
 180 }
 181
 182 /* Events */
 183 .event-summary {
 184   margin: 0px 0px 10px 0px;
 185   font-weight: bold;
 186 }
 187
 188 .vevent .event-summary {
 189   margin: 0px 0px 10px 0px;
 190 }
 191
 192 .vevent .event-description {
 193   padding: 10px 0;
 194 }
 195
 196 .event-label {
 197   font-weight: bold;
 198 }
 199
 200 .settings-heading a:after{
 201   content: ' »';
 202 }
 203
 204 #profile-photo-wrapper {
 205   clear: both;
 206   overflow: hidden;
 207 }
 208
 209 #newmember-tips {
 210   margin-top: -3px;
 211   font-size: 1.2em;
 212 }
 213
 214 /* headers */
 215 h1, h2, h3, h4, h5, h6 {
 216   margin: 5px 0px 5px 0px;
 217   font-weight: normal;
 218   line-height: normal;
 219   text-rendering: optimizelegibility;
 220 }
 221
 222 h1 {
 223   font-size: 31.5px;
 224 }
 225
 226 h2 {
 227   font-size: 24.5px;
 228 }
 229
 230 h3 {
 231   font-size: 20.5px;
 232 }
 233
 234 h4 {
 235   font-size: 18px;
 236 }
 237
 238 h5 {
 239   font-size: 16.5px;
 240 }
 241
 242 h6 {
 243   font-size: 14.95px;
 244 }
 245
 246 span.oembed, h4 {
 247   margin: 0px 0px 0px 0px;
 248 }
 249
 250 code {
 251   display: block;
 252   background-color: #eee;
 253   color: #666;
 254   padding: 1em;
 255   font-size: 0.85em;
 256   font-family: monospace;
 257 }
 258 key {
 259   display: inline;
 260   background-color: #eee;
 261   color: #666;
 262   padding: 0.2em;
 263   font-size: 0.85em;
 264   font-family: monospace;
 265 }
 266
 267 /* fields help text */
 268 .field .field_help {
 269   clear: left;
 270 }
 271
 272 /* notifications unseen */
 273 .notify-unseen { background-color: #cceeFF; }
 274
 275 /* autocomplete popup */
 276 ul.acpopup {
 277   list-style: none;
 278   float: left;
 279   min-width: 160px;
 280   padding: 5px 0;
 281   margin: 2px 0 0;
 282 }
 283 nav .acpopup {
 284   width: 290px;
 285   max-height: 450px;
 286   max-width: 300px;
 287   overflow-y: auto;
 288   overflow-x: hidden;
 289   margin-top: 0px;
 290 }
 291 img.acpopup-img {
 292   float: left;
 293   width: 36px;
 294   height: 36px;
 295   margin-right: 5px;
 296   vertical-align: middle;
 297 }
 298 .acpopup-contactname {
 299   padding-top: 2px;
 300   font-weight: bold;
 301   line-height: 1em;
 302   white-space: nowrap;
 303   overflow: hidden;
 304   text-overflow: ellipsis;
 305   display: block;
 306 }
 307 .acpopup-sub-text {
 308   color: #777;
 309   font-size: 0.833em;
 310   line-height: 1em;
 311   overflow: hidden;
 312   text-overflow: ellipsis;
 313   display: block;
 314 }
 315 .textcomplete-item a {
 316   color: inherit;
 317   overflow: hidden;
 318   text-overflow: ellipsis;
 319   clear: both;
 320   white-space: nowrap;
 321   padding: 3px 20px;
 322   display: block;
 323 }
 324 .textcomplete-item a:hover {
 325   text-decoration: none;
 326 }
 327
 328 /* plain text editor upload/select popup */
 329
 330 .fbrowser .path a, .fbrowser .path .btn-link { padding: 5px; }
 331 .fbrowser .path a:before, .fbrowser .path .btn-link:before { content: "/"; padding-right: 5px;}
 332 .fbrowser .folders ul { list-style-type: none; padding-left: 10px;}
 333 .fbrowser .list { height: auto; overflow-y: hidden; margin: 10px 0px; }
 334 .fbrowser.image .photo-album-image-wrapper { float: left; }
 335 .fbrowser.image a img, .fbrowser.image .btn-link img { height: 48px; }
 336 .fbrowser.image a p, .fbrowser.image .btn-link p { display: none;}
 337 .fbrowser.file .photo-album-image-wrapper { float:none;  white-space: nowrap; }
 338 .fbrowser.file img { display: inline; }
 339 .fbrowser.file p  { display: inline; white-space: nowrap; }
 340 .fbrowser .upload { clear: both; padding-top: 1em;}
 341 .fbrowser .error { background: #ffeeee; border: 1px solid #994444; color: #994444; padding: 0.5em;}
 342 .fbrowser .error .close { float: right; font-weight: bold; }
 343 .fbrowser .error.hidden { display: none; }
 344
 345 a {
 346   cursor: pointer;
 347 }
 348
 349 .sr-only {
 350   position: absolute;
 351   width: 1px;
 352   height: 1px;
 353   padding: 0;
 354   margin: -1px;
 355   overflow: hidden;
 356   clip: rect(0,0,0,0);
 357   border: 0;
 358 }
 359
 360 .itentity-match-wrapper {
 361   float: left;
 362   padding: 10px;
 363   width: 120px;
 364   height: 140px;
 365   margin-bottom: 20px;
 366 }
 367
 368 .identity-match-photo {
 369   float: left;
 370   text-align: center;
 371   width: 120px;
 372 }
 373
 374 .identity-match-name {
 375   text-align: center;
 376 }
 377
 378 .identity-match-details {
 379   float: left;
 380   text-align: center;
 381   width: 120px;
 382   overflow: hidden;
 383   font-size: 10px;
 384   font-weight: 500;
 385   color: #999999;
 386 }
 387
 388 .identity-match-break, .identity-match-end {
 389   clear: both;
 390 }
 391
 392 .identity-match-photo button {
 393   border: none;
 394   padding: 0;
 395   margin: 0;
 396   background: none;
 397   height: 80px;
 398   width: 80px;
 399   cursor: pointer;
 400 }
 401
 402 .selected-identity img {
 403   border: 2px solid #ff0000;
 404 }
 405 /* poke */
 406 #poke-desc {
 407   margin: 5px 0 10px;
 408 }
 409
 410 #poke-wrapper  {
 411   padding: 10px 0 0px;
 412 }
 413
 414 #poke-recipient, #poke-action, #poke-privacy-settings {
 415   margin: 10px 0 30px;
 416 }
 417
 418 #poke-recip-label, #poke-action-label, #prvmail-message-label {
 419   margin: 10px 0 10px;
 420 }
 421 .version-match {
 422   font-weight: bold;
 423   color: #00a700;
 424 }
 425 .federation-graph {
 426   margin: 0 auto;
 427   float: right;
 428 }
 429 .federation-network-graph {
 430   float: left;
 431   margin: 20px;
 432 }
 433 ul.federation-stats,
 434 ul.credits {
 435   list-style: none;
 436 }
 437 ul.federation-stats li,
 438 ul.credits li {
 439   float: left;
 440   width: 240px;
 441 }
 442 table#federation-stats {
 443   width: 100%;
 444 }
 445 td.federation-data {
 446   border-bottom: 1px solid #000;
 447 }
 448
 449 .contact-entry-photo img {
 450   max-width: 80px;
 451   max-height: 80px;
 452 }
 453
 454 /* forumlist widget */
 455 .forumlist-img {
 456   height: 20px;
 457   width: 20px;
 458   vertical-align: middle;
 459 }
 460
 461 #forum-widget-collapse {
 462   opacity: 0.3;
 463 }
 464
 465 /* help widget */
 466 aside .help-aside-wrapper ul {
 467   padding-left: 1em;
 468 }
 469
 470 aside .help-aside-wrapper h1 {
 471   font-size:2em
 472 }
 473
 474 .md_warning {
 475   padding: 1em;
 476   border: #ff0000 solid 2px;
 477   background-color: #f9a3a3;
 478   color: #ffffff;
 479 }
 480
 481 #forum-widget-collapse:hover {
 482   opacity: 1.0;
 483 }
 484
 485 .crepair-label {
 486   margin-top: 10px;
 487   float: left;
 488   width: 250px;
 489 }
 490
 491 .crepair-input {
 492   margin-top: 10px;
 493   float: left;
 494   width: 200px;
 495 }
 496
 497 .renderinfo {
 498   clear: both;
 499 }
 500
 501 .p-addr {
 502   clear: both;
 503 }
 504
 505 #live-community {
 506   clear: both;
 507 }
 508
 509 /* contact-edit */
 510 #contact-edit-status-wrapper {
 511   border: 1px solid;
 512   padding: 10px;
 513 }
 514 #contact-edit-actions {
 515   float: right;
 516   display: inline-block;
 517   position: relative;
 518 }
 519 #contact-edit-actions > .menu-popup {
 520   right: 0;
 521   left: auto;
 522 }
 523
 524 #contact-edit-settings-label:after {
 525   content: ' »';
 526 }
 527
 528 #contact-edit-settings {
 529   display: none;
 530   margin: 10px 0;
 531 }
 532
 533 /* settings page */
 534 #settings-form .pageflags {
 535     margin: 0 0 20px 30px;
 536 }
 537
 538 /* admin pending user notes */
 539 td.pendingnote {
 540   padding-left: 20px;
 541   padding-right: 20px;
 542 }
 543 td.pendingnote > p > span {
 544   font-weight: bold;
 545 }
 546
 547 /* warning message */
 548 .warning-message {
 549   padding: 10px;
 550   margin: 5px;
 551   border-left: 5px solid #f00;
 552   font-weight: bold;
 553 }
 554
 555 /* src/href attributes filter error display */
 556 .invalid-src { border: 1px dotted red;}
 557 .invalid-href { border-bottom: 1px dotted red;}
 558 .invalid-src:after,
 559 .invalid-href:after { content: '⚠️'}
 560 img.invalid-src:after { vertical-align: top;}
 561
 562 /* Tag cloud */
 563 .tag1, .tag1:hover {
 564   font-size: 0.9em ;
 565   color: DarkGray;
 566 }
 567 .tag2, .tag2:hover {
 568   font-size: 1.0em;
 569   color: LawnGreen;
 570 }
 571 .tag3, .tag3:hover {
 572   font-size: 1.1em;
 573   color: DarkOrange;
 574 }
 575 .tag4, .tag4:hover {
 576   font-size: 1.2em;
 577   color: Red;
 578 }
 579 .tag5, .tag5:hover {
 580   font-size: 1.3em;
 581   color: Gold;
 582 }
 583 .tag6, .tag6:hover {
 584   font-size: 1.4em;
 585   color: Teal;
 586 }
 587 .tag7, .tag7:hover {
 588   font-size: 1.5em;
 589   color: DarkMagenta;
 590 }
 591 .tag8, .tag8:hover {
 592   font-size: 1.6em;
 593   color: DarkGoldenRod;
 594 }
 595 .tag9, .tag9:hover {
 596   font-size: 1.7em;
 597   color: DarkBlue;
 598 }
 599 .tag10 .tag10:hover {
 600   font-size: 1.8em;
 601   color: DeepPink;
 602 }
 603 .tags > a:hover {
 604   text-decoration: underline;
 605 }
 606 .tag-cloud {
 607   word-wrap: break-word;
 608 }
 609
 610 #register-explicid-content {
 611   font-weight: bold;
 612 }