Changes for page Public Web Site
Last modified by Agnease on 2026/05/30 16:24
Summary
-
Objects (2 modified, 0 added, 1 removed)
Details
- XWiki.StyleSheetExtension[0]
-
- code
-
... ... @@ -726,3 +726,177 @@ 726 726 padding: 24px 20px; 727 727 } 728 728 } 729 +/* ========== Resource / Article Pages ========== */ 730 + 731 +.resource-page { 732 + padding-top: 34px; 733 +} 734 + 735 +.resource-header { 736 + padding: 40px 0 30px; 737 + border-top: none; 738 + background: 739 + radial-gradient(42rem 14rem at 50% 0%, @brand-bg 0%, transparent 70%); 740 + 741 + .resource-kicker { 742 + display: inline-flex; 743 + align-items: center; 744 + gap: 8px; 745 + color: @brand; 746 + background: fade(@brand, 8%); 747 + border: 1px solid fade(@brand, 18%); 748 + border-radius: 999px; 749 + padding: 6px 12px; 750 + margin-bottom: 14px; 751 + font-size: 13px; 752 + font-weight: 700; 753 + } 754 + 755 + h1 { 756 + max-width: 820px; 757 + margin: 0 auto 14px; 758 + text-align: center; 759 + line-height: 1.18; 760 + } 761 + 762 + .resource-summary { 763 + max-width: 780px; 764 + margin: 0 auto; 765 + color: @muted; 766 + text-align: center; 767 + font-size: 18px; 768 + line-height: 1.55; 769 + } 770 +} 771 + 772 +.resource-layout { 773 + display: grid; 774 + grid-template-columns: minmax(0, 760px) 280px; 775 + gap: 42px; 776 + max-width: 1080px; 777 + margin: 0 auto; 778 + align-items: start; 779 +} 780 + 781 +.resource-content { 782 + color: @text; 783 + font-size: 16px; 784 + line-height: 1.68; 785 + 786 + h2 { 787 + text-align: left; 788 + margin: 34px 0 12px; 789 + line-height: 1.28; 790 + } 791 + 792 + h3 { 793 + margin: 24px 0 8px; 794 + line-height: 1.3; 795 + } 796 + 797 + p { 798 + margin: 0 0 16px; 799 + } 800 + 801 + ul, 802 + ol { 803 + margin: 0 0 18px; 804 + padding-left: 22px; 805 + } 806 + 807 + li { 808 + margin: 6px 0; 809 + } 810 + 811 + strong { 812 + color: @text; 813 + } 814 +} 815 + 816 +.resource-note { 817 + border-left: 4px solid @brand; 818 + background: @brand-bg; 819 + padding: 16px 18px; 820 + margin: 22px 0; 821 + border-radius: 0 @radius @radius 0; 822 + 823 + p:last-child { 824 + margin-bottom: 0; 825 + } 826 +} 827 + 828 +.resource-checklist { 829 + margin: 18px 0 24px; 830 + padding: 0; 831 + list-style: none; 832 + 833 + li { 834 + position: relative; 835 + padding: 10px 0 10px 34px; 836 + border-bottom: 1px solid @line; 837 + 838 + &:before { 839 + content: "\f00c"; 840 + font-family: FontAwesome; 841 + position: absolute; 842 + left: 0; 843 + top: 11px; 844 + color: @brand; 845 + } 846 + } 847 +} 848 + 849 +.resource-sidebar { 850 + position: sticky; 851 + top: 96px; 852 + border: 1px solid @line; 853 + border-radius: @radius; 854 + padding: 18px; 855 + background: #fff; 856 + box-shadow: @shadow-sm; 857 + 858 + h4 { 859 + margin: 0 0 10px; 860 + } 861 + 862 + ul { 863 + margin: 0; 864 + padding-left: 18px; 865 + color: @muted; 866 + } 867 + 868 + li { 869 + margin: 8px 0; 870 + } 871 + 872 + a { 873 + color: @brand; 874 + font-weight: 600; 875 + } 876 +} 877 + 878 +.resource-cta { 879 + margin-top: 36px; 880 + padding: 22px; 881 + border: 1px solid fade(@brand, 20%); 882 + border-radius: @radius; 883 + background: @brand-bg; 884 + 885 + h3 { 886 + margin-top: 0; 887 + } 888 + 889 + p { 890 + color: @muted; 891 + } 892 +} 893 + 894 +@media (max-width: 900px) { 895 + .resource-layout { 896 + grid-template-columns: 1fr; 897 + } 898 + 899 + .resource-sidebar { 900 + position: static; 901 + } 902 +}
- XWiki.StyleSheetExtension[1]
-
- code
-
... ... @@ -7,25 +7,53 @@ 7 7 @line: #E4ECE9; 8 8 @brand-bg: #F4FCFA; 9 9 10 -.agnease-services-menu { 10 +/* Top-level menu items */ 11 + 12 +.agnease-services-menu, 13 +.agnease-products-menu { 11 11 .dropdown-toggle { 12 12 font-weight: inherit; 13 13 font-size: inherit; 14 14 } 15 15 19 + .caret { 20 + margin-left: 4px; 21 + } 22 + 16 16 &.open > .dropdown-toggle, 17 17 .dropdown-toggle:hover, 18 18 .dropdown-toggle:focus { 19 - color: @brand; 26 + color: @brand-strong; 20 20 background: transparent; 28 + background-color: transparent; 29 + box-shadow: none; 21 21 } 31 +} 22 22 23 - .caret { 24 - margin-left: 4px; 25 - } 33 +/* Keep Agnease public top-level menu visually clean when hovered/open/focused */ 34 + 35 +.navbar-nav > li.agnease-services-menu > a, 36 +.navbar-nav > li.agnease-products-menu > a, 37 +.navbar-nav > li.agnease-services-menu > a:hover, 38 +.navbar-nav > li.agnease-products-menu > a:hover, 39 +.navbar-nav > li.agnease-services-menu > a:focus, 40 +.navbar-nav > li.agnease-products-menu > a:focus, 41 +.navbar-nav > li.agnease-services-menu.open > a, 42 +.navbar-nav > li.agnease-products-menu.open > a, 43 +.navbar-nav > li.agnease-services-menu.open > a:hover, 44 +.navbar-nav > li.agnease-products-menu.open > a:hover, 45 +.navbar-nav > li.agnease-services-menu.open > a:focus, 46 +.navbar-nav > li.agnease-products-menu.open > a:focus { 47 + background: transparent; 48 + background-color: transparent; 49 + color: @brand-strong; 50 + box-shadow: none; 26 26 } 27 27 28 -.agnease-services-dropdown { 53 +/* Dropdown panels */ 54 + 55 +.agnease-services-dropdown, 56 +.agnease-products-dropdown { 29 29 min-width: 360px; 30 30 padding: 10px; 31 31 border: 1px solid @line; ... ... @@ -102,12 +102,23 @@ 102 102 } 103 103 } 104 104 133 +/* Products dropdown can be slightly narrower for now */ 134 + 135 +.agnease-products-dropdown { 136 + min-width: 340px; 137 +} 138 + 139 +/* Mobile */ 140 + 105 105 @media (max-width: 767px) { 106 - .agnease-services-dropdown { 142 + .agnease-services-dropdown, 143 + .agnease-products-dropdown { 107 107 min-width: 0; 108 108 width: 100%; 109 109 padding: 6px; 110 110 border-radius: 0; 148 + border-left: 0; 149 + border-right: 0; 111 111 box-shadow: none; 112 112 113 113 > li > a { ... ... @@ -115,15 +115,3 @@ 115 115 } 116 116 } 117 117 } 118 -/* Keep the top-level Services menu visually clean when hovered/open/focused */ 119 -.navbar-nav > li.agnease-services-menu > a, 120 -.navbar-nav > li.agnease-services-menu > a:hover, 121 -.navbar-nav > li.agnease-services-menu > a:focus, 122 -.navbar-nav > li.agnease-services-menu.open > a, 123 -.navbar-nav > li.agnease-services-menu.open > a:hover, 124 -.navbar-nav > li.agnease-services-menu.open > a:focus { 125 - background: transparent; 126 - background-color: transparent; 127 - color: @brand-strong; 128 - box-shadow: none; 129 -}
- XWiki.StyleSheetExtension[2]
-
- cache
-
... ... @@ -1,1 +1,0 @@ 1 -long - code
-
... ... @@ -1,174 +1,0 @@ 1 -/* ========== Resource / Article Pages ========== */ 2 - 3 -.resource-page { 4 - padding-top: 34px; 5 -} 6 - 7 -.resource-header { 8 - padding: 40px 0 30px; 9 - border-top: none; 10 - background: 11 - radial-gradient(42rem 14rem at 50% 0%, @brand-bg 0%, transparent 70%); 12 - 13 - .resource-kicker { 14 - display: inline-flex; 15 - align-items: center; 16 - gap: 8px; 17 - color: @brand; 18 - background: fade(@brand, 8%); 19 - border: 1px solid fade(@brand, 18%); 20 - border-radius: 999px; 21 - padding: 6px 12px; 22 - margin-bottom: 14px; 23 - font-size: 13px; 24 - font-weight: 700; 25 - } 26 - 27 - h1 { 28 - max-width: 820px; 29 - margin: 0 auto 14px; 30 - text-align: center; 31 - line-height: 1.18; 32 - } 33 - 34 - .resource-summary { 35 - max-width: 780px; 36 - margin: 0 auto; 37 - color: @muted; 38 - text-align: center; 39 - font-size: 18px; 40 - line-height: 1.55; 41 - } 42 -} 43 - 44 -.resource-layout { 45 - display: grid; 46 - grid-template-columns: minmax(0, 760px) 280px; 47 - gap: 42px; 48 - max-width: 1080px; 49 - margin: 0 auto; 50 - align-items: start; 51 -} 52 - 53 -.resource-content { 54 - color: @text; 55 - font-size: 16px; 56 - line-height: 1.68; 57 - 58 - h2 { 59 - text-align: left; 60 - margin: 34px 0 12px; 61 - line-height: 1.28; 62 - } 63 - 64 - h3 { 65 - margin: 24px 0 8px; 66 - line-height: 1.3; 67 - } 68 - 69 - p { 70 - margin: 0 0 16px; 71 - } 72 - 73 - ul, 74 - ol { 75 - margin: 0 0 18px; 76 - padding-left: 22px; 77 - } 78 - 79 - li { 80 - margin: 6px 0; 81 - } 82 - 83 - strong { 84 - color: @text; 85 - } 86 -} 87 - 88 -.resource-note { 89 - border-left: 4px solid @brand; 90 - background: @brand-bg; 91 - padding: 16px 18px; 92 - margin: 22px 0; 93 - border-radius: 0 @radius @radius 0; 94 - 95 - p:last-child { 96 - margin-bottom: 0; 97 - } 98 -} 99 - 100 -.resource-checklist { 101 - margin: 18px 0 24px; 102 - padding: 0; 103 - list-style: none; 104 - 105 - li { 106 - position: relative; 107 - padding: 10px 0 10px 34px; 108 - border-bottom: 1px solid @line; 109 - 110 - &:before { 111 - content: "\f00c"; 112 - font-family: FontAwesome; 113 - position: absolute; 114 - left: 0; 115 - top: 11px; 116 - color: @brand; 117 - } 118 - } 119 -} 120 - 121 -.resource-sidebar { 122 - position: sticky; 123 - top: 96px; 124 - border: 1px solid @line; 125 - border-radius: @radius; 126 - padding: 18px; 127 - background: #fff; 128 - box-shadow: @shadow-sm; 129 - 130 - h4 { 131 - margin: 0 0 10px; 132 - } 133 - 134 - ul { 135 - margin: 0; 136 - padding-left: 18px; 137 - color: @muted; 138 - } 139 - 140 - li { 141 - margin: 8px 0; 142 - } 143 - 144 - a { 145 - color: @brand; 146 - font-weight: 600; 147 - } 148 -} 149 - 150 -.resource-cta { 151 - margin-top: 36px; 152 - padding: 22px; 153 - border: 1px solid fade(@brand, 20%); 154 - border-radius: @radius; 155 - background: @brand-bg; 156 - 157 - h3 { 158 - margin-top: 0; 159 - } 160 - 161 - p { 162 - color: @muted; 163 - } 164 -} 165 - 166 -@media (max-width: 900px) { 167 - .resource-layout { 168 - grid-template-columns: 1fr; 169 - } 170 - 171 - .resource-sidebar { 172 - position: static; 173 - } 174 -} - contentType
-
... ... @@ -1,1 +1,0 @@ 1 -LESS - name
-
... ... @@ -1,1 +1,0 @@ 1 -resources - use
-
... ... @@ -1,1 +1,0 @@ 1 -onDemand