Changeset 1468:3132a0aca046 for admin/style
- Timestamp:
- 08/19/13 09:55:29 (12 years ago)
- Branch:
- default
- Parents:
- 1466:e67efe636ce1 (diff), 1467:917fc08f3a59 (diff)
Note: this is a merge changeset, the changes displayed below correspond to the merge itself.
Use the (diff) links above to see all the changes relative to each parent. - Files:
-
- 2 edited
Legend:
- Unmodified
- Added
- Removed
-
admin/style/default.css
r1465 r1468 541 541 } 542 542 543 #upg-notify { 544 } 545 #upg-notify ul { 546 padding-left: 15px; 547 } 548 #upg-notify li { 549 color: #fff; 550 } 543 551 /* ------------------------------------------------------------------ post */ 544 552 #entry-wrapper { … … 1617 1625 } 1618 1626 1627 /* --------------------------------------------------------------- password indcator */ 1628 .pw-table { 1629 display: table; 1630 margin-bottom: 1em; 1631 } 1632 .pw-cell { 1633 display: table-cell; 1634 margin-bottom: 1em; 1635 } 1636 #pwindicator { 1637 display: table-cell; 1638 vertical-align: bottom; 1639 padding-left: 1.5em; 1640 height: 3.8em; 1641 } 1642 #pwindicator .bar { 1643 height: 6px; 1644 margin-bottom: 4px; 1645 } 1646 .pw-very-weak .bar { 1647 background: #900; 1648 width: 30px; 1649 } 1650 .pw-weak .bar { 1651 background: #c00; 1652 width: 60px; 1653 } 1654 .pw-mediocre .bar { 1655 background: #f60; 1656 width: 90px; 1657 } 1658 .pw-strong .bar { 1659 background: #060; 1660 width: 120px; 1661 } 1662 .pw-very-strong .bar { 1663 background: #0c0; 1664 width: 150px; 1665 } 1666 1619 1667 /* --------------------------------------------------------------------------- 1620 1668 Media queries vite fait en attendant la reprise complète du layout -
admin/style/default.css
r1375 r1468 13 13 14 14 /* ------------------------------------------------------------------ html */ 15 html { 16 font-size: 62.5%; 17 } 15 18 body { 16 font: 75%/1.5em Helvetica,Arial,sans-serif;19 font: 1.2rem/1.5 Arial,Helvetica,sans-serif; 17 20 color: #333; 18 background: #f 5f5f5;21 background: #fff; 19 22 margin: 0; 20 23 padding: 0; 21 }22 body.auth {23 background: #fff;24 24 } 25 25 … … 36 36 } 37 37 38 h1, h2, h3, h4, h5, h6, p {38 h1, h2, h3, .as_h3, h4, h5, h6, p { 39 39 margin-top: 0; 40 margin-bottom: 0.6em;40 margin-bottom: 1rem; 41 41 } 42 42 h2 { 43 43 color: #666; 44 font-size: 1.4em; 45 padding: 4px 0; 44 font-size: 1.8rem; 45 padding: 0 0 1.8rem; 46 font-weight: normal; 47 } 48 h2 a:link, h2 a:visited { 49 color: #666; 50 border-color: #000; 46 51 } 47 52 .page-title { 48 53 color: #d30e60; 49 54 } 50 h3 { 55 .page-title img { 56 padding-left: .6rem; 57 vertical-align: middle; 58 } 59 #content > h2 { 60 padding: 0 1.8rem .6rem; 61 margin: 0 -1.8rem 1rem; 62 background: #fff url(bg_h2.png) repeat-x center bottom; 63 } 64 h3, .as_h3 { 65 color: #575859; 66 font-size: 1.4rem; 67 } 68 h4 { 69 font-size: 1.1em; 70 color: #575859; 71 } 72 h5 { 73 font-size: 1em; 74 color: #575859; 75 } 76 #entry-sidebar h5 { 77 font-weight: normal; 51 78 color: #333; 52 font-size: 1.2em; 79 } 80 .entry-status label img { 81 padding-left: .4rem; 82 vertical-align: text-top; 53 83 } 54 84 p, div.p { … … 57 87 hr { 58 88 height: 1px; 59 border-width: 1px 0 0 0;89 border-width: 1px 0 0; 60 90 border-color: #999; 61 91 border-style: solid; … … 83 113 #header { 84 114 background: #575859; 85 height: 3em;86 115 position: relative; 116 border-bottom: 4px solid #A2CBE9; 117 width: 100%; 87 118 } 88 119 #prelude { 89 background: #575859; 90 line-height: 1.5em; 91 margin: 0; 92 padding: 0 1.7em 0 1em; 120 line-height: 1.9; 121 margin: 0; 122 padding: 0; 93 123 overflow: hidden; 94 124 position: absolute; 95 top: 1.2em;125 top: 3em; 96 126 left: 0; 127 background: #A2CBE9; 128 width: 14.5em; 97 129 } 98 130 #prelude li { 99 131 list-style-type: none; 100 margin: 0 1em 0 0;132 margin: 0; 101 133 background:transparent; 102 134 } 103 135 #prelude li a { 104 color:#fff; 105 } 136 padding-left: 1.6rem; 137 background: #A2CBE9; 138 color: #000; 139 border-bottom-color: #A2CBE9; 140 } 106 141 #top { 107 142 margin: 0; 108 143 padding: 0; 109 width: 1 3em;144 width: 14.5em; 110 145 float: left; 111 146 } … … 113 148 padding: 0; 114 149 margin: 0; 115 height: 3 em;150 height: 3.6rem; 116 151 text-indent: -1000px; 117 background: transparent url(dc_logo.png) no-repeat 0 50%;118 152 } 119 153 #top h1 a { 120 154 position: absolute; 121 top: 3px;155 top: 0; 122 156 left: 0; 123 width: 1 30px;124 height: 60px;157 width: 17.4rem; 158 height: 3.6rem; 125 159 border: none; 126 outline: none;127 160 color: #fff; 128 161 } 162 #top h1 a:link { 163 background: transparent url(dc_logos/b-dotclear120.png) no-repeat 0 6px; 164 } 165 #top h1 a:hover, #top h1 a:focus { 166 background: transparent url(dc_logos/b-dotclear120.png) no-repeat 0 -94px; 167 } 129 168 #info-boxes { 130 background: #575859; 131 font-size: .95em; 132 height: 3em; 169 font-size: 1em; 170 line-height: 3em; 133 171 } 134 172 #info-box1 { 135 173 margin: 0; 136 padding: .5em 3px 4px 0;174 padding: 0 3px 0 1.8rem; 137 175 color: #fff; 138 float: left; 139 background: #575859; 176 display: inline-block; 140 177 } 141 178 #info-box2 { 142 margin: .1em 0 00;143 padding: .5em 1.3em 4px0;179 margin: 0; 180 padding: 0 1.3em 0 0; 144 181 color: #fff; 145 182 float: right; 146 183 text-align: right; 147 background: #575859;148 height: 2em;149 184 } 150 185 #info-box1 p { … … 153 188 } 154 189 #info-box1 select { 155 width: 1 5em;190 width: 14.5em; 156 191 } 157 192 #info-box1 a img, #info-box2 a img { … … 159 194 padding-left: .3em; 160 195 } 161 #info-box1 a, #info-box2 a { 162 background: #575859; 196 #info-boxes a { 163 197 font-weight: bold; 164 198 color: #fff; … … 173 207 } 174 208 #info-box2 a.active { 175 border-bottom-color: #f 5f5f5;209 border-bottom-color: #fff; 176 210 margin: 0; 177 211 padding: 1.2em .5em; 178 background-color: #f 5f5f5;212 background-color: #fff; 179 213 color: #333; 180 214 font-weight: bold; 181 215 } 182 216 #info-box2 span { 183 color: # 575859;184 } 185 /* prelude*/217 color: #999; 218 } 219 /* main blocks */ 186 220 #wrapper { 187 221 width: 100%; … … 190 224 width: 100%; 191 225 float: right; 192 margin-left: -1 3em;226 margin-left: -14.5em; 193 227 margin-top: 0; 228 background: #fff url(bg_menu.png); 194 229 } 195 230 #content { 196 margin: 1.5em 1.5em .5em 13em;197 padding: 1em;231 margin: 0 0 0 14.5em; 232 padding: .9rem 1.8rem 1.8rem; 198 233 background: #fff; 199 border-radius: .5em;200 border: 1px solid #ddd;201 234 } 202 235 /* Micro clearfix thx to Nicolas Gallagher */ … … 219 252 } 220 253 .two-cols .col { 221 width: 4 9%;254 width: 47%; 222 255 margin-left: 2%; 223 256 float: left; 224 257 } 225 .two-cols .col:first-child {226 width: 49%;227 margin-left: 0;228 }229 258 .two-cols .col70{ 230 width: 6 9%;259 width: 68%; 231 260 margin-left: 0; 232 261 float: left; 233 262 } 234 . two-cols .col30 {263 .col30 { 235 264 width: 28%; 236 265 margin-left: 2%; 237 266 float: left; 238 267 } 268 .two-cols .col:first-child, 269 .two-cols .col30.first-col { 270 margin-left: 0; 271 margin-right: 2%; 272 } 273 .two-cols .col:last-child, 274 .two-cols .col70.last-col { 275 margin-left: 2%; 276 margin-right: 0; 277 } 239 278 /* -------------------------------------------------------------- layout - onglets */ 240 279 .part-tabs ul { 241 padding: . 3em 0 1px 1em;242 border-bottom: 1px solid # 999;280 padding: .5em 0 .3em 1.2rem; 281 border-bottom: 1px solid #ddd; 243 282 } 244 283 .part-tabs li { … … 248 287 } 249 288 .part-tabs li a { 250 padding: . 3em 0.5em;251 margin-right: .5em;252 border: 1px solid # 999;289 padding: .5em 2em; 290 margin-right: -1px; 291 border: 1px solid #aaa; 253 292 border-bottom: none; 254 background: #dfdfdf;255 293 text-decoration: none; 256 border-top-left-radius: .3em; 257 border-top-right-radius: .3em; 258 color: #000; 259 } 260 .part-tabs li.part-tabs-link a { 261 background: #ffe; 294 color: #333; 295 background-color:#E4E0EC; 262 296 } 263 297 .part-tabs li a:hover, .part-tabs li a:focus { … … 268 302 .part-tabs li.part-tabs-active a { 269 303 background: #fff; 270 border-bottom: 1px solid #fff;271 color: #000;272 304 font-weight: bold; 305 border-bottom-color: #fff; 306 padding-bottom: .7rem; 273 307 } 274 308 /* ------------------------------------------------------------------ main-menu */ 275 309 #main-menu { 276 width: 1 3em;310 width: 14.5em; 277 311 float: left; 278 margin-top: 1.2em; 279 margin-bottom: .5em; 312 margin:0; 313 padding-top: 4.5em; 314 padding-bottom: 1em; 315 background: #f7f7f7; 280 316 } 281 317 #main-menu h3 { 282 margin: 0 0 0.5em;283 padding: .5em 0 0 .5em;284 text- transform: uppercase;318 margin: 0; 319 padding: 1.2rem 0 1rem 2.2rem; 320 text-indent: -1.6rem; 285 321 color: #666; 286 font-size: 1.1em; 322 font-size: 1.4rem; 323 } 324 #main-menu h3 img[alt="cacher"] { 325 vertical-align: top; 287 326 } 288 327 #main-menu ul { 289 font-size: .95em; 290 margin: 0 0 1em 0; 328 margin: 0 0 1.8rem 0; 291 329 padding: 0; 292 330 list-style: none; … … 295 333 display: block; 296 334 margin: 0.5em 0 0; 297 padding: . 2em 0 0 32px;335 padding: .3rem 0 0 30px; 298 336 background-repeat: no-repeat; 299 background-position: 12px .4em; 337 background-position: 8px .3em; 338 } 339 #main-menu li.active { 340 background-color: #fff; 300 341 } 301 342 #main-menu a { 302 font-weight: bold; 343 color: #333; 344 border-bottom-color: #ccc; 303 345 } 304 346 #main-menu .active a { 305 347 border-bottom: none; 306 color: # 333;348 color: #d30e60; 307 349 } 308 350 #main-menu .active { 309 background-color: #fff; 310 padding: .4em 0 .1em 32px; 311 background-position: 12px .4em; 312 border-top: 1px solid #ddd; 313 border-bottom: 1px solid #ddd; 314 margin-right: -1px; 315 } 316 #favorites-menu { 317 margin: 0 0 2em; 351 font-weight: bolder; 352 } 353 #search-menu { 354 padding: .3rem .4rem 0; 355 font-size: 100% 356 } 357 #search-menu p { 358 display: inline-block; 359 border: 1px solid #999; 360 border-radius: .6em; 361 position: relative; 362 height: 2rem; 363 overflow: hidden; 364 } 365 #search-menu #q { 366 width: 12rem; 367 border-bottom-left-radius: .6em; 368 border-top-left-radius: .6em; 369 background: transparent url(search.png) no-repeat 4px center; 370 text-indent: 18px; 371 height: 2rem; 372 padding: 0 2px; 373 border: none; 374 } 375 #search-menu input[type="submit"] { 376 padding: 0 0.3rem; 377 background: #dfdfdf; 378 border-color: #999; 379 color: #444; 380 border-bottom-right-radius: .6em; 381 border-top-right-radius: .6em; 382 border-top-left-radius: 0; 383 border-bottom-left-radius: 0; 384 text-shadow: none; 385 height: 2rem; 386 border: none; 387 border-left: 1px solid #aaa; 388 font-size: 1rem; 389 } 390 #search-menu input[type="submit"]:hover, 391 #search-menu input[type="submit"]:focus { 392 background: #575859; 393 color: #fff; 394 } 395 #favorites-menu, #blog-menu, #system-menu, #plugins-menu { 396 border-bottom: 1px dashed #A2CBE9; 318 397 } 319 398 #favorites-menu h3 { 320 color: #333; 321 text-transform: none; 322 } 323 #favorites-menu a { 324 color: #333; 325 } 326 #favorites-menu .active { 327 background-color: transparent; 328 border: none; 329 } 330 #favorites-menu .active a { 331 font-weight: bold; 332 color: #666; 399 color: #000; 400 font-variant: small-caps; 401 padding-top: .6rem; 333 402 } 334 403 /* ------------------------------------------------------------------ footer */ 335 404 #footer { 336 405 clear: both; 337 padding: . 75em .75em 00;406 padding: .6rem 1.2rem .6rem 0; 338 407 text-align: right; 408 border-top: .1rem solid #ccc; 339 409 } 340 410 #footer p { 341 411 margin: 0; 342 412 padding: 0 1em; 343 text-align: center; 344 font-size: 1.1em; 345 } 346 #footer a { 413 font-size: 1em; 347 414 } 348 415 #footer p span.credit { 349 font-size: .85em;416 font-size: 1rem; 350 417 font-weight: normal; 351 418 } … … 355 422 width: 18em; 356 423 margin: 1.5em auto 0; 357 font-size: 1. 1em;424 font-size: 1.4rem; 358 425 } 359 426 #login-screen h1 { 360 427 text-indent: -2000px; 361 background: transparent url(d otclear-logo2.png) no-repeat top left;362 height: 50px;428 background: transparent url(dc_logos/w-dotclear240.png) no-repeat top left; 429 height: 66px; 363 430 margin-bottom: .5em; 364 margin-left: .5em;431 margin-left: 0; 365 432 } 366 433 #login-screen fieldset, #login-screen .fieldset { 367 border: 1px solid # 999;434 border: 1px solid #A8DC26; 368 435 padding: 1em 1em 0 1em; 369 436 border-radius: 4px; 437 background: #fff; 438 } 439 #login-screen legend { 440 border: 1px solid #A8DC26; 370 441 } 371 442 #login-screen input[type=text], #login-screen input[type=password], #login-screen input[type=submit] { … … 373 444 } 374 445 #login-screen #issue { 375 margin-left: 1 em;376 font-size: 1 em;446 margin-left: 1.5rem; 447 font-size: 1.2rem; 377 448 } 378 449 #login-screen #issue strong {font-weight: normal;} … … 381 452 /* ------------------------------------------------------------------ dashboard */ 382 453 #dashboard-main { 383 float: left;384 overflow: hidden;385 padding: 1em 2% 1em 0;386 width: 70%;387 }388 #dashboard-main.fullwidth {389 width: 100%;390 454 padding: 1em 0; 391 float: none;392 455 } 393 456 #icons { … … 399 462 width: 210px; 400 463 text-align: center; 401 margin: 2em 0 0 0; 464 margin: 1em 0 2em; 465 padding: 1em 0; 402 466 display:inline-block; 467 vertical-align: top; 403 468 } 404 469 #icons a, … … 412 477 #icons a span { 413 478 border-bottom: 1px dotted #f90; 479 color: #333; 480 } 481 #icons a img { 482 padding: 2em; 483 background: #eee; 484 border-radius: 1.6rem; 485 box-shadow: 0 3px 3px 0 #ccc; 486 margin-bottom: .6rem; 487 } 488 #icons a img:hover, #icons a:focus img { 489 background-color: #BBDB58; 414 490 } 415 491 #icons a:focus span, #icons a:hover span { … … 417 493 } 418 494 #quick { 419 clear: left;420 495 margin-top: 2em; 421 496 } … … 432 507 } 433 508 #dashboard-items { 434 float: left; 435 width: 27%; 436 overflow: hidden; 437 padding-bottom: 1em; 438 padding-top: 3em; 509 margin: 3em auto; 510 display: table; 511 width: 100%; 512 border-collapse: collapse; 513 } 514 .db-item { 515 display: table-cell; 516 padding: 1em 3em; 517 vertical-align: top; 518 border: 1px solid #ccc; 439 519 } 440 520 #dashboard-items img { … … 476 556 } 477 557 #entry-content { 478 margin-right: 18em; 558 margin-right: 19em; 559 margin-left: 0; 560 } 561 .multi-part { 562 padding-left: 1.2rem; 563 } 564 #entry-content label { 565 text-transform: uppercase; 566 font-weight: bold; 567 margin-top: 2em; 479 568 } 480 569 #entry-sidebar { 481 570 width: 17em; 482 571 float: right; 572 } 573 #entry-sidebar input[type="text"], 574 #entry-sidebar select { 575 width: 14em; /* to prevent inline with label */ 576 } 577 .box { 578 border-bottom: 1px solid #ddd; 579 margin-bottom: 1em; 483 580 } 484 581 #comments { … … 518 615 } 519 616 #media-details { 617 } 618 .near-icon { 520 619 margin-left: 70px; 620 margin-bottom: 3em; 521 621 } 522 622 #media-details ul { … … 653 753 /* -------------------------------------------------------------------- Themes */ 654 754 #themes { 655 border-bottom: 1px solid #ccc; 656 margin: 1em 0; 755 margin: 0; 756 width: 100%; 757 padding: 0; 758 } 759 #themes h3 { 657 760 } 658 761 #themes div.theme-details { 659 clear: left;660 762 border-top: 1px solid #ccc; 661 padding: 1em 0; 763 padding: 12px; 764 display: inline-block; 765 vertical-align: top; 766 width: 284px; 767 } 768 .current-theme { 769 background: #eef; 662 770 } 663 771 #themes div.theme-details:hover { 664 background: # eee;772 background: #f0f0f0; 665 773 } 666 774 #themes div.theme-details div.theme-shot { 667 float: left;668 775 } 669 776 #themes div.theme-details div.theme-shot img { 670 777 display: block; 671 width: 57px;672 height: 50px;673 778 border: 1px solid #ccc; 779 margin-bottom: 1.5em; 674 780 } 675 781 #themes div.theme-details div.theme-info { 676 margin-left: 67px;677 782 } 678 783 #themes div.theme-details div.theme-info span.theme-desc { … … 683 788 } 684 789 #themes div.theme-details div.theme-actions { 685 margin-left: 67px; 686 } 790 } 791 #themes-actions { 792 border-bottom: 1px solid #999; 793 margin-bottom: 3em; 794 } 795 .theme-css { 796 display: block; 797 } 798 687 799 /* Themes list, JS version */ 688 800 #themes-wrapper { 801 display: table; 802 } 803 #themes-wrapper #themes { 804 display: table-cell; 805 vertical-align: top; 806 padding-left: 1em; 689 807 } 690 808 #theme-box { 691 border: 1px solid #999;692 border-left: none;693 padding: 5px;694 float: right;695 height: 420px;696 width: 320px;697 overflow: auto;809 display: table-cell; 810 vertical-align: top; 811 padding: 1rem 0; 812 width: 312px; 813 background: #eef; 814 border: 1px solid #ccc; 815 border-radius: 3px; 698 816 } 699 817 #theme-box div.theme-shot img { 700 818 display: block; 701 margin: 0 0 0 10px;819 margin: 0 16px; 702 820 width: 280px; 703 821 height: 245px; … … 705 823 } 706 824 #theme-box div.theme-info { 707 margin: 1em 0 0 10px; 708 } 709 #theme-box h3 { 710 margin: 0; 711 } 712 #theme-box div.theme-info span { 713 display: block; 825 margin: 1em 16px; 826 } 827 #theme-box h4 { 828 color: #000; 714 829 } 715 830 #theme-box span.theme-version { … … 724 839 } 725 840 #theme-box div.theme-actions { 726 margin-left: 10px; 727 } 728 #themes-wrapper #themes { 729 border: 1px solid #999; 730 overflow: auto; 731 height: 420px; 732 padding: 5px; 733 margin: 0; 841 padding: 0 16px; 734 842 } 735 843 #themes div.theme-details-js { … … 737 845 width: 120px; 738 846 height: 150px; 739 margin: 0 1 0px 20px;740 padding: 1 0px 10px 0;847 margin: 0 12px 24px; 848 padding: 12px 12px 0; 741 849 text-align: center; 742 850 background: #f3f3f3; 743 border: 1px solid # f3f3f3;851 border: 1px solid #ddd; 744 852 cursor: pointer; 745 853 border-radius: 4px; … … 749 857 } 750 858 #themes div.theme-details-js.theme-selected { 751 background: # E5E3DA;859 background: #ddd; 752 860 border: 1px solid #999; 753 861 } … … 757 865 border: 1px solid #fff; 758 866 } 759 #themes div.theme-details-js h3 {760 font-family: inherit;761 font-weight: normal;762 margin: 0;763 padding: 0;764 }765 867 /* ---------------------------------------------------------- Plugins list */ 766 868 #plugins td.action { … … 776 878 /* ------------------------------------------------------------------ contextual help */ 777 879 #help { 778 margin-top: 2em;880 margin-top: 4em; 779 881 background: #f5f5f5; 780 882 z-index: 100; 781 883 } 782 884 #help-button { 783 position: fixed; 784 top: 3.2em; 885 background: transparent url(../images/page_help.png) no-repeat 6px center; 886 position: absolute; 887 top: 3.6rem; 785 888 right: 0px; 889 padding: 0 2rem 0 3rem; 786 890 cursor: pointer; 787 background: #fc3; 788 border: 1px solid #dde; 789 border-right: none; 790 font-size: 1.1em; 791 font-weight: bold; 792 text-transform: capitalize; 793 padding: .33em .75em .33em 1em; 794 border-radius: 1em 0 0 1em; 795 color: #444; 891 color: #2373A8; 892 line-height: 4.2rem; 893 } 894 #help-button span { 895 padding: .6rem 0 .1rem 0; 896 border-bottom: 1px solid #2373A8; 796 897 } 797 898 .help-box { … … 803 904 } 804 905 #content.with-help #help-button { 805 right: 282px; 906 right: 28.2rem; 907 background-color: #f5f5f5; 908 position: fixed; 909 border-top: 2px solid #FFD478; 910 border-left: 2px solid #FFD478; 911 border-bottom: 2px solid #FFD478; 912 border-bottom-left-radius: 1rem; 913 border-top-left-radius: 1rem; 806 914 } 807 915 #content.with-help #help { 808 916 display: block; 809 917 position: absolute; 810 top: 40px;918 top: 3.6rem; 811 919 right: 0; 812 width: 280px; 813 border-left: 2px solid #fc3; 920 width: 28rem; 921 border-left: 2px solid #FFD478; 922 border-top: 2px solid #FFD478; 814 923 margin-top: 0; 815 924 padding: 10px 0 0 0; … … 829 938 /* ------------------------------------------------------------------ popups */ 830 939 body.popup #wrapper, body.popup #top { 831 margin-top: -1.5em; 940 width: 100%; 941 padding: 0; 942 } 943 body.popup #wrapper { 832 944 float: none; 833 } 834 body.popup #top h1 { 835 background: transparent; 945 margin:0; 946 display: block; 947 } 948 body.popup h1, body.popup #top { 949 margin: 0; 950 border-bottom: 1px solid; 951 font-weight: normal; 952 color: #fff; 953 background: #575859; 954 font-size: 1.5em; 955 text-indent: .6rem; 956 line-height: 1.3em; 836 957 } 837 958 body.popup #main { 838 margin-left: -35px; 839 margin-bottom: 1em; 959 margin-bottom: 1em 0; 840 960 } 841 961 body.popup #content { 842 margin -left: 35px;843 margin-left: 2em; /* 3.2 */844 } 845 body.popup # footer{846 display: none; /* 3.2 */962 margin: 0; 963 padding: .6rem 0 !important; 964 } 965 body.popup #content h2 { 966 margin: 0 0 1em; 847 967 } 848 968 body.popup #footer p { 849 margin-left: 35px;850 969 border: none; 851 970 } … … 859 978 } 860 979 p.error, p.message, p.static-msg { 861 padding-top: 1 em;862 padding-bottom: 1 em;980 padding-top: 1rem; 981 padding-bottom: 1rem; 863 982 } 864 983 div.error, p.error { … … 874 993 div.static-msg a, p.static-msg a { 875 994 color: #fff; 995 } 996 /* ------------------------------------------------------------------ navigation */ 997 .anchor-nav { 998 background: #575859; 999 color: #fff; 1000 padding: .4rem 1.2rem; 1001 float: right; 1002 } 1003 .nav_prevnext { 1004 margin-bottom: 2em; 1005 color: #fff; 1006 } 1007 .nav_prevnext a, a.back { 1008 border: 1px solid #ddd; 1009 padding: .2rem 2rem; 1010 border-radius: 1rem; 1011 background-color: #f0f0f0; 1012 } 1013 a.back:before { 1014 content: "\ab\a0"; 1015 } 1016 a.onblog_link { 1017 color: #333; 1018 float: right; 1019 border: 1px solid #eee; 1020 padding: .2rem 2rem; 1021 border-radius: 1rem; 1022 background-color: #ffe; 876 1023 } 877 1024 /* ------------------------------------------------------------------ debug */ … … 898 1045 /* -------------------------------------------------------------------- CLASSES COMMUNES */ 899 1046 900 .no-margin { 901 margin: 0; 902 } 1047 .no-margin, #entry-content label.no-margin { 1048 margin: 0; 1049 } 1050 .border-top { 1051 border-top: 1px solid #999; 1052 padding-top: 1em; 1053 margin-top: 1em; 1054 } 1055 .fieldset { 1056 background: #fff; 1057 border: 1px solid #aaa; 1058 border-radius: 6px; 1059 padding: 1em .7em .5em; 1060 margin-bottom: 1em; 1061 } 1062 .fieldset h3 { 1063 color: #333; 1064 } 1065 903 1066 /* paragraphe pour bouton Nouveau bidule */ 904 1067 p.top-add { … … 991 1154 -------------------------------------------------------- */ 992 1155 table { 993 font-size: 1 em;1156 font-size: 1.2rem; 994 1157 border-collapse: collapse; 995 1158 margin: 0 0 1em 0; 996 1159 } 997 1160 tr.line:hover { 998 background: # ddd;1161 background: #f3f3f3; 999 1162 } 1000 1163 caption { 1001 1164 color: #333; 1002 font-size: 1.2em;1003 1165 font-weight: bold; 1004 1166 text-align: left; … … 1006 1168 } 1007 1169 1008 t h, td {1170 td { 1009 1171 border-width: 0 0 1px 0; 1010 1172 border-style: solid; 1173 border-color: #e3e3e3; 1174 padding: .4rem .5rem; 1175 vertical-align: top; 1176 } 1177 th { 1178 border-width: 1px 0 1px 0; 1179 border-style: solid; 1011 1180 border-color: #ccc; 1012 padding: 3px 5px; 1181 background: #f3f3ff; 1182 padding: .4rem .5rem; 1013 1183 vertical-align: top; 1014 }1015 th {1016 1184 text-align: left; 1017 border-bottom-color: #666;1018 1185 } 1019 1186 .noborder td, td.noborder, .noborder th, th.noborder { 1020 border-width: 0; 1187 border-width: 0 0 1px 0; 1188 border-color: #ddd; 1189 line-height: 2.4rem; 1190 padding-bottom: 0; 1191 } 1192 .noborder p { 1193 margin-bottom: 0; 1021 1194 } 1022 1195 table .maximal, table.maximal { … … 1032 1205 table.settings, table.prefs { 1033 1206 width: 80%; 1207 border: 1px solid #999; 1208 margin-bottom: 3em; 1209 } 1210 table.settings th, table.prefs th { 1211 background: #eef; 1034 1212 } 1035 1213 table.settings th:first-child, table.prefs th:first-child { … … 1045 1223 width: 40%; 1046 1224 } 1047 1048 1225 td.status { 1049 1226 vertical-align: middle; … … 1084 1261 padding-left: 15px; 1085 1262 } 1086 1087 1263 /* ----------------------------------------------------------------- FORMS */ 1088 1264 form { … … 1091 1267 padding: 0; 1092 1268 } 1093 fieldset , .fieldset{1269 fieldset { 1094 1270 display: block; 1095 1271 margin: 0 0 1em 0; … … 1105 1281 border-width: 1px; 1106 1282 border-style: solid; 1107 border-color: # ccc;1108 background: #f 5f5f5;1283 border-color: #333; 1284 background: #fff; 1109 1285 margin-bottom: 0.5em; 1286 border-radius: 3px; 1110 1287 } 1111 1288 optgroup { … … 1121 1298 border-width: 1px; 1122 1299 border-style: solid; 1123 border-color: # 000 #ccc #ccc #000;1300 border-color: #666 #ccc #ccc #999; 1124 1301 } 1125 1302 input.invalid, textarea.invalid, select.invalid { … … 1130 1307 } 1131 1308 input, textarea, select, option { 1132 font: 1 em"DejaVu Sans","Lucida Grande","Lucida Sans Unicode",Arial,sans-serif;1309 font: 100% "DejaVu Sans","Lucida Grande","Lucida Sans Unicode",Arial,sans-serif; 1133 1310 } 1134 1311 input[type=text], input[type=password], textarea { … … 1136 1313 margin-right: .3em; 1137 1314 } 1138 input[type=checkbox], input[type=radio] {1139 border: none;1140 }1141 1315 textarea { 1142 1316 padding: 2px 0; 1143 1317 } 1144 1145 input[type=checkbox], input[type=radio] { 1318 input[type=checkbox], input[type=radio], input[type=file] { 1319 border: none; 1146 1320 margin: 0; 1147 1321 padding: 0; … … 1162 1336 font-style:italic; 1163 1337 font-weight: normal; 1338 text-transform: none; 1164 1339 color: #666; 1165 1340 } … … 1173 1348 } 1174 1349 p.form-note.info { 1175 background: #eef url(info.png) no-repeat .3em .2em; 1176 border: 1px solid #99f; 1177 } 1178 .form-note a {border-bottom: 1px solid #99f;} 1179 1350 background: #f5eaff url(info.png) no-repeat .3em .2em; 1351 border: 1px solid #ddbaff; 1352 } 1353 .form-note a {border-bottom: 1px solid #ddbaff;} 1354 1355 label.ib { 1356 display: inline-block; 1357 } 1180 1358 label.classic { 1181 1359 display: inline; … … 1214 1392 display: inline; 1215 1393 position: absolute; 1216 left: 1 5em;1394 left: 14.5em; 1217 1395 top: 0; 1218 1396 } … … 1226 1404 a.form-control { 1227 1405 display: none; 1228 font-weight: bold; 1229 background: url(magnifier.png) no-repeat 0 0; 1230 color: green; 1406 background: url(../images/expand.png) no-repeat .4rem center; 1231 1407 padding-left: 20px; 1408 color: #000; 1232 1409 } 1233 1410 .constrained { … … 1239 1416 1240 1417 /* --------------------------------------------------------------- buttons */ 1241 h2 a.button {1242 color: #333;1243 font-weight: normal;1244 font-size: .75em;1245 vertical-align: middle;1246 }1247 1418 /* commun */ 1248 1419 input[type=submit], … … 1250 1421 input[type=button], 1251 1422 a.button, 1252 a.back,1253 1423 a.submit { 1254 1424 display: inline-block; … … 1257 1427 text-align: center; 1258 1428 text-decoration: none; 1259 padding: .1em .5em 0 .5em;1429 padding: .1em .5em; 1260 1430 text-shadow: 0 1px 1px rgba(0,0,0,.3); 1261 1431 border-radius: .2em; 1262 1432 margin-bottom: .1em; 1263 1433 } 1434 h4 a.button {font-weight: normal;} 1435 1264 1436 /* validation */ 1265 1437 input[type=submit], … … 1286 1458 /* suppression et reset */ 1287 1459 a.button, 1288 a.back,1289 1460 input[type=submit].reset, 1290 1461 input[type=submit].delete { … … 1297 1468 } 1298 1469 a.button:hover, 1299 a.back:hover,1300 1470 input[type=reset]:hover, 1301 1471 input[type=submit].reset:hover, 1302 1472 input[type=submit].delete:hover, 1303 1473 a.button:focus, 1304 a.back:focus,1305 1474 input[type=reset]:focus, 1306 1475 input[type=submit].reset:focus, … … 1315 1484 input[type=submit].delete { 1316 1485 color: #c00; 1317 padding-bottom: . 1em;1486 padding-bottom: .2rem; 1318 1487 } 1319 1488 #entry-content .delete { … … 1336 1505 margin-left: 2em; 1337 1506 } 1338 a.back:before { 1339 content: "\ab\a0"; 1340 } 1341 a.button.add { 1342 border-radius: .5em; 1343 margin-bottom: .1em; 1344 background: #2C8FD1 url(../images/add.png) no-repeat 6px center; 1345 color: #fff; 1346 padding: .2em 16px .2em 30px; 1347 border: 1px solid #2373A8; 1348 } 1349 a.button.add:hover, a.button.add:focus { 1350 background-color: #2373A8; 1507 .button.add { 1508 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #8cb82b) ); 1509 background:-moz-linear-gradient( center top, #9dce2c 5%, #8cb82b 100% ); 1510 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#8cb82b'); 1511 background-color:#9dce2c; 1512 border:1px solid #83c41a; 1513 padding:.6rem 1.8rem; 1514 color: #000; 1515 text-shadow: 1px 1px 0 #BBDB58; 1516 font-weight: normal; 1517 font-size: 1.4rem; 1518 } 1519 .button.add:hover, .button.add:focus { 1520 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8cb82b), color-stop(1, #9dce2c) ); 1521 background:-moz-linear-gradient( center top, #8cb82b 5%, #9dce2c 100% ); 1522 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cb82b', endColorstr='#9dce2c'); 1523 background-color:#8cb82b; 1524 border:1px solid #83c41a; 1525 } 1526 .button-add:focus { 1527 outline: dotted 1px; 1351 1528 } 1352 1529 … … 1384 1561 } 1385 1562 1563 /* ------------------------------------------------------- Filters */ 1564 #filters-form { 1565 border: 1px dashed #999; 1566 border-radius: .6rem; 1567 margin-bottom: 2em; 1568 padding: .5em 1em 0; 1569 } 1570 #filters-form .table { 1571 display: table; 1572 width: 100%; 1573 padding: 0; 1574 margin-bottom: 1em; 1575 margin-top: 1.5em; 1576 } 1577 #filters-form .cell { 1578 padding: 0 2em 0 0; 1579 display: table-cell; 1580 vertical-align: top; 1581 } 1582 #filters-form .filters-options { 1583 padding-left: 2em; 1584 border-left: 1px solid #ccc; 1585 } 1586 #filters-form label.ib, span.ib { 1587 width:7em; 1588 display: inline-block; 1589 } 1590 #filters-form label.ibw, span.ibw { 1591 width: 9em; 1592 display: inline-block; 1593 } 1594 #filters-form select { 1595 width: 14em; 1596 } 1597 1598 /* ---------------------------------------------------- Pagination */ 1599 .pagination { 1600 height: 22px; 1601 margin-top: 1em; 1602 line-height: 22px; 1603 padding: 0 1rem; 1604 border: 1px solid #ddd; 1605 overflow: hidden; 1606 background: #e1e1e1; 1607 background: -moz-linear-gradient(center top , #f2f2f2, #e1e1e1); 1608 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(100%,#e1e1e1)); 1609 -moz-border-radius: 4px; 1610 -webkit-border-radius: 4px; 1611 border-radius: 4px; 1612 clear: left; 1613 } 1614 .pagination a, .pagination strong { 1615 height: 20px; 1616 border: none; 1617 padding: 2px 6px; 1618 background-color : transparent; 1619 background-position : 50% 50%; 1620 background-repeat: no-repeat; 1621 } 1622 .pagination a:hover, .pagination strong { 1623 border-color : #ccc; 1624 background-color: #fff; 1625 } 1626 1386 1627 /* --------------------------------------------------------------- password indcator */ 1387 1628 .pw-table { … … 1423 1664 width: 150px; 1424 1665 } 1666 1667 /* --------------------------------------------------------------------------- 1668 Media queries vite fait en attendant la reprise complète du layout 1669 ---------------------------------------------------------------------------- */ 1670 @media screen and (max-width: 920px) { 1671 #top, #top h1 a {width: 42px !important; height:100%; overflow: hidden; 1672 } 1673 #top h1 a:link { 1674 background: transparent url(dc_logos/b-dotclear120.png) no-repeat -180px 6px; 1675 border-right: 1px solid #ccc; 1676 } 1677 #top h1 a:hover, #top h1 a:focus { 1678 background: url(dc_logos/b-dotclear120.png) no-repeat -180px -94px; 1679 border-right: 1px solid #A2CBE9; 1680 } 1681 } 1682 @media screen and (max-width: 800px) { 1683 #top, #info-boxes, #info-box1, #info-box2 { 1684 display:inline-block; 1685 vertical-align:middle; 1686 margin:0; 1687 padding:0; 1688 line-height: 3.2rem; 1689 } 1690 #info-box1 {margin-left: 1rem;} 1691 #info-box1 select {width: 14rem;} 1692 #main-menu, #main, #content, #content h2, #entry-wrapper, #entry-sidebar, #entry-content, .two-cols .col, .two-cols .col:first-child { 1693 display:block; 1694 width: 98%; 1695 margin:0 auto; 1696 padding:0; 1697 float:none; 1698 text-align: left; 1699 clear: both; 1700 } 1701 #content { 1702 width: 100%; 1703 padding-top: .5em; 1704 } 1705 } 1706 @media screen and (max-width: 720px) { 1707 .smallscreen {display: none;} 1708 #help-button {width:20px; overflow: hidden;} 1709 #info-box2 {float:none;} 1710 #dashboard-items div {display: block;margin-bottom: 1em; padding: 0 1em;} 1711 } 1712 @media screen and (max-width: 492px) { 1713 #header {height:3.6rem;} 1714 #wrapper {font-size: 1.6rem;} 1715 .page-title, #info-boxes, .media-item {display: inline-block;} 1716 div.media-list .media-item {width: 90%; float: none} 1717 #info-box1 select {width: 12rem; margin-right: .6rem;} 1718 #info-box1 p.nomobile, label.nomobile {display: none;} 1719 #help-button {height:26px; width:26px; background-color: #A2CBE9; padding: 0; margin:0;font-size: 1rem;line-height: 68px} 1720 }
Note: See TracChangeset
for help on using the changeset viewer.