| @@ -318,9 +318,9 @@ | ||
| 318 | 318 | background: #fff; |
| 319 | 319 | padding: 24px; |
| 320 | 320 | margin-right: 16px; |
| 321 | 321 | border: 1px solid #dedee7; |
| 322 | - border-radius: 2px; | |
| 322 | + border-radius: "revert-rule"; | |
| 323 | 323 | display: flex; |
| 324 | 324 | flex-direction: column; |
| 325 | 325 | margin-top: 16px; |
| 326 | 326 | } |
| @@ -385,9 +385,9 @@ | ||
| 385 | 385 | float: none !important; |
| 386 | 386 | margin: 0 !important; |
| 387 | 387 | width: 100%; |
| 388 | 388 | border: 1px solid #dedee7; |
| 389 | - border-radius: 2px; | |
| 389 | + border-radius: "revert-rule"; | |
| 390 | 390 | } |
| 391 | 391 | .wp-adminify-addons-wrapper .wp-list-table #the-list .plugin-card .plugin-card-top { |
| 392 | 392 | padding: 16px 16px 0 16px; |
| 393 | 393 | } |
| @@ -440,9 +440,9 @@ | ||
| 440 | 440 | .wp-adminify-addons-wrapper .wp-list-table #the-list .plugin-card .plugin-card-bottom { |
| 441 | 441 | padding: 12px 16px; |
| 442 | 442 | background-color: var(--adminify-preset-background); |
| 443 | 443 | border-top: 1px solid #dedee7; |
| 444 | - border-radius: 0 0 2px 2px; | |
| 444 | + border-radius: 0 0 "revert-rule" "revert-rule"; | |
| 445 | 445 | } |
| 446 | 446 | .wp-adminify-addons-wrapper .wp-list-table #the-list .plugin-card .authors cite a { |
| 447 | 447 | color: var(--adminify-primary) !important; |
| 448 | 448 | } |
| @@ -594,8 +594,27 @@ | ||
| 594 | 594 | |
| 595 | 595 | /* |
| 596 | 596 | * Useable Mixin |
| 597 | 597 | */ |
| 598 | +.wp-adminify { | |
| 599 | + /** | |
| 600 | + * WordPress pins #wpfooter with `position: absolute; bottom: 0` and reserves a | |
| 601 | + * flat 65px for it via #wpbody-content's bottom padding (wp-admin/css/common.css). | |
| 602 | + * That budget assumes core's single line of text. Adminify's footer carries the | |
| 603 | + * credit line plus a system info row - and wraps to more rows on narrow screens - | |
| 604 | + * so the extra height grows upward and lands on top of whatever the page ends | |
| 605 | + * with, typically a plugin's pagination. | |
| 606 | + * | |
| 607 | + * Letting it flow in normal document order removes the overlap for good, at any | |
| 608 | + * height and any screen width, instead of guessing a taller fixed reservation. | |
| 609 | + */ | |
| 610 | +} | |
| 611 | +.wp-adminify #wpfooter { | |
| 612 | + position: static; | |
| 613 | +} | |
| 614 | +.wp-adminify #wpbody-content { | |
| 615 | + padding-bottom: 20px; | |
| 616 | +} | |
| 598 | 617 | .wp-adminify .adminify-copyright { |
| 599 | 618 | display: flex; |
| 600 | 619 | flex-direction: column; |
| 601 | 620 | gap: 8px; |
| @@ -611,8 +630,10 @@ | ||
| 611 | 630 | .wp-adminify .adminify--footer { |
| 612 | 631 | display: flex; |
| 613 | 632 | align-items: center; |
| 614 | 633 | justify-content: space-between; |
| 634 | + flex-wrap: wrap; | |
| 635 | + gap: 8px 24px; | |
| 615 | 636 | } |
| 616 | 637 | .wp-adminify .adminify--footer .adminify-footer-right { |
| 617 | 638 | float: right; |
| 618 | 639 | display: flex; |
| @@ -663,8 +684,83 @@ | ||
| 663 | 684 | .adminify-cloneable-item .adminify-cloneable-helper .adminify-cloneable-remove::before { |
| 664 | 685 | color: #f04438; |
| 665 | 686 | } |
| 666 | 687 | |
| 688 | +/** | |
| 689 | + * Options-framework metabox tab navigation. | |
| 690 | + * | |
| 691 | + * The framework prints `.adminify-nav.adminify-nav-metabox > ul > li > a` and its | |
| 692 | + * JavaScript toggles `.adminify-active` on the anchor, but the layout rules for | |
| 693 | + * `.adminify-nav` are commented out in the framework stylesheet, so the tabs fall | |
| 694 | + * back to bare links. These rules give them a proper tab bar. | |
| 695 | + * | |
| 696 | + * Laid out horizontally rather than as the framework's 225px sidebar: a metabox is | |
| 697 | + * wide and short, and in the block editor's Meta Boxes panel a side column wastes | |
| 698 | + * most of the row. Scoped to `.adminify-metabox` so the settings screen, which has | |
| 699 | + * its own navigation design, is untouched. | |
| 700 | + */ | |
| 701 | +.adminify-metabox .adminify-nav-metabox { | |
| 702 | + float: none; | |
| 703 | + width: 100%; | |
| 704 | + margin: 0 0 20px; | |
| 705 | + border-bottom: 1px solid #dcdcde; | |
| 706 | +} | |
| 707 | +.adminify-metabox .adminify-nav-metabox > ul { | |
| 708 | + display: flex; | |
| 709 | + flex-wrap: wrap; | |
| 710 | + margin: 0; | |
| 711 | + padding: 0; | |
| 712 | + list-style: none; | |
| 713 | +} | |
| 714 | +.adminify-metabox .adminify-nav-metabox > ul > li { | |
| 715 | + margin: 0; | |
| 716 | +} | |
| 717 | +.adminify-metabox .adminify-nav-metabox > ul > li > a { | |
| 718 | + position: relative; | |
| 719 | + display: block; | |
| 720 | + padding: 10px 16px; | |
| 721 | + font-size: 13px; | |
| 722 | + font-weight: 500; | |
| 723 | + line-height: 1.4; | |
| 724 | + color: #50575e; | |
| 725 | + -webkit-text-decoration: none; | |
| 726 | + text-decoration: none; | |
| 727 | + background-color: transparent; | |
| 728 | + border: 1px solid transparent; | |
| 729 | + border-bottom: 0; | |
| 730 | + border-radius: 3px 3px 0 0; | |
| 731 | + transition: color 0.15s ease, background-color 0.15s ease; | |
| 732 | +} | |
| 733 | +.adminify-metabox .adminify-nav-metabox > ul > li > a:hover { | |
| 734 | + color: #1d2327; | |
| 735 | + background-color: #f0f0f1; | |
| 736 | +} | |
| 737 | +.adminify-metabox .adminify-nav-metabox > ul > li > a:focus { | |
| 738 | + box-shadow: none; | |
| 739 | + outline: none; | |
| 740 | +} | |
| 741 | +.adminify-metabox .adminify-nav-metabox > ul > li > a:focus-visible { | |
| 742 | + outline: 2px solid #3858e9; | |
| 743 | + outline-offset: -2px; | |
| 744 | +} | |
| 745 | +.adminify-metabox .adminify-nav-metabox > ul > li > a.adminify-active { | |
| 746 | + margin-bottom: -1px; | |
| 747 | + padding-bottom: 11px; | |
| 748 | + color: #1d2327; | |
| 749 | + background-color: #fff; | |
| 750 | + border-color: #dcdcde; | |
| 751 | +} | |
| 752 | +.adminify-metabox .adminify-nav-metabox .adminify-tab-icon { | |
| 753 | + margin-right: 6px; | |
| 754 | +} | |
| 755 | +.adminify-metabox .adminify-nav-metabox .adminify-label-error { | |
| 756 | + margin-left: 6px; | |
| 757 | + vertical-align: top; | |
| 758 | +} | |
| 759 | +.adminify-metabox .adminify-nav-metabox + .adminify-content { | |
| 760 | + margin-left: 0; | |
| 761 | +} | |
| 762 | + | |
| 667 | 763 | .wp-adminify #_wp_adminify_admin_page_display .inside { |
| 668 | 764 | margin: 8px 0 0; |
| 669 | 765 | } |
| 670 | 766 | .wp-adminify #_wp_adminify_admin_page_display .inside .adminify-wrapper { |
| @@ -693,9 +789,9 @@ | ||
| 693 | 789 | font-size: 13px; |
| 694 | 790 | font-weight: 500; |
| 695 | 791 | color: #48455f; |
| 696 | 792 | padding: 8px 12px; |
| 697 | - border-radius: 2px; | |
| 793 | + border-radius: "revert-rule"; | |
| 698 | 794 | } |
| 699 | 795 | .wp-adminify #_wp_adminify_admin_page_display .inside .adminify-wrapper .adminify-nav a.adminify-active { |
| 700 | 796 | color: #fff; |
| 701 | 797 | background-color: var(--adminify-primary); |
| @@ -790,9 +886,9 @@ | ||
| 790 | 886 | font-size: 12px; |
| 791 | 887 | font-weight: 700; |
| 792 | 888 | line-height: 1.3; |
| 793 | 889 | padding: 8px 12px; |
| 794 | - border-radius: 2px; | |
| 890 | + border-radius: "revert-rule"; | |
| 795 | 891 | cursor: pointer; |
| 796 | 892 | transition: all 0.15s; |
| 797 | 893 | } |
| 798 | 894 | .adminify-btn-primary { |
| @@ -1181,9 +1277,9 @@ | ||
| 1181 | 1277 | top: 50% !important; |
| 1182 | 1278 | left: 50% !important; |
| 1183 | 1279 | margin: 0 !important; |
| 1184 | 1280 | transform: translate(-50%, -50%); |
| 1185 | - border-radius: 2px; | |
| 1281 | + border-radius: "revert-rule"; | |
| 1186 | 1282 | } |
| 1187 | 1283 | #TB_window #TB_title #TB_closeWindowButton span::before { |
| 1188 | 1284 | color: #f04438; |
| 1189 | 1285 | } |
| @@ -1311,8 +1407,12 @@ | ||
| 1311 | 1407 | } |
| 1312 | 1408 | } |
| 1313 | 1409 | #evo_et1_color .evo_et1_color_circle { |
| 1314 | 1410 | border-color: var(--adminify-menu-border); |
| 1411 | +} | |
| 1412 | + | |
| 1413 | +.CodeMirror { | |
| 1414 | + border: 1px solid #dcdcde; | |
| 1315 | 1415 | } |
| 1316 | 1416 | |
| 1317 | 1417 | .wp-adminify .wp-adminify--menu--editor--container { |
| 1318 | 1418 | max-width: 85%; |