| @@ -248,8 +248,9 @@ | ||
| 248 | 248 | margin-right: auto; |
| 249 | 249 | } |
| 250 | 250 | .charitable-dashboard-v2-layout .charitable-dashboard-v2-left-column { |
| 251 | 251 | flex: 0 0 700px; |
| 252 | + min-width: 0; | |
| 252 | 253 | display: flex; |
| 253 | 254 | flex-direction: column; |
| 254 | 255 | gap: 20px; |
| 255 | 256 | } |
| @@ -254,8 +255,9 @@ | ||
| 254 | 255 | gap: 20px; |
| 255 | 256 | } |
| 256 | 257 | .charitable-dashboard-v2-layout .charitable-dashboard-v2-right-column { |
| 257 | 258 | flex: 0 0 452px; |
| 259 | + min-width: 0; | |
| 258 | 260 | display: flex; |
| 259 | 261 | flex-direction: column; |
| 260 | 262 | gap: 20px; |
| 261 | 263 | } |
| @@ -716,9 +718,8 @@ | ||
| 716 | 718 | font-size: 13px; |
| 717 | 719 | line-height: 150%; |
| 718 | 720 | letter-spacing: 0px; |
| 719 | 721 | color: rgba(25, 29, 45, 0.6); |
| 720 | - margin-bottom: 15px; | |
| 721 | 722 | } |
| 722 | 723 | .charitable-dashboard-v2-section .charitable-dashboard-v2-blog-posts .charitable-dashboard-v2-blog-post-row .charitable-dashboard-v2-blog-post-left .charitable-dashboard-v2-blog-post-title { |
| 723 | 724 | margin: 0; |
| 724 | 725 | } |
| @@ -1055,8 +1056,9 @@ | ||
| 1055 | 1056 | background: white; |
| 1056 | 1057 | border: 1px solid rgba(24, 36, 69, 0.1); |
| 1057 | 1058 | border-radius: 4px; |
| 1058 | 1059 | box-shadow: 0 3px 3px rgba(0, 0, 0, 0.05); |
| 1060 | + box-sizing: border-box; | |
| 1059 | 1061 | } |
| 1060 | 1062 | .charitable-dashboard-v2-notifications .charitable-dashboard-notification-bar { |
| 1061 | 1063 | position: absolute; |
| 1062 | 1064 | top: 12px; |
| @@ -1760,5 +1762,403 @@ | ||
| 1760 | 1762 | .charitable-dashboard-v2-empty-state-content .charitable-dashboard-v2-button .button-loading { |
| 1761 | 1763 | display: inline-flex; |
| 1762 | 1764 | align-items: center; |
| 1763 | 1765 | gap: 8px; |
| 1766 | +} | |
| 1767 | + | |
| 1768 | +/* ── What's New feed overrides ── */ | |
| 1769 | +.charitable-dashboard-v2-section .charitable-dashboard-v2-blog-posts .charitable-dashboard-v2-blog-post-row { | |
| 1770 | + align-items: flex-start; | |
| 1771 | + gap: 14px; | |
| 1772 | +} | |
| 1773 | + | |
| 1774 | +.charitable-dashboard-v2-section .charitable-dashboard-v2-blog-posts .charitable-dashboard-v2-blog-post-row .charitable-dashboard-v2-blog-post-left { | |
| 1775 | + flex: 1; | |
| 1776 | + min-width: 0; | |
| 1777 | +} | |
| 1778 | + | |
| 1779 | +/* Timestamp + New badge row */ | |
| 1780 | +.charitable-dashboard-v2-blog-post-timestamp-row { | |
| 1781 | + display: flex; | |
| 1782 | + align-items: center; | |
| 1783 | + gap: 8px; | |
| 1784 | + margin-bottom: 6px; | |
| 1785 | + line-height: 1; | |
| 1786 | +} | |
| 1787 | + | |
| 1788 | +.charitable-dashboard-v2-blog-post-timestamp { | |
| 1789 | + font-size: 13px; | |
| 1790 | + font-weight: 500; | |
| 1791 | + color: rgba(25, 29, 45, 0.6); | |
| 1792 | +} | |
| 1793 | + | |
| 1794 | +.charitable-dashboard-v2-blog-post-badge-new { | |
| 1795 | + display: inline-flex; | |
| 1796 | + align-items: center; | |
| 1797 | + font-size: 10px; | |
| 1798 | + font-weight: 600; | |
| 1799 | + line-height: 1; | |
| 1800 | + padding: 3px 7px; | |
| 1801 | + border-radius: 20px; | |
| 1802 | + background-color: #276c35; | |
| 1803 | + color: #fff; | |
| 1804 | + text-transform: uppercase; | |
| 1805 | + letter-spacing: 0.4px; | |
| 1806 | + vertical-align: middle; | |
| 1807 | +} | |
| 1808 | + | |
| 1809 | +.charitable-dashboard-v2-blog-post-badge-upgrade { | |
| 1810 | + display: inline-flex; | |
| 1811 | + align-items: center; | |
| 1812 | + font-size: 10px; | |
| 1813 | + font-weight: 600; | |
| 1814 | + line-height: 1; | |
| 1815 | + padding: 3px 7px; | |
| 1816 | + border-radius: 20px; | |
| 1817 | + background-color: #eaa251; | |
| 1818 | + color: #fff; | |
| 1819 | + text-transform: uppercase; | |
| 1820 | + letter-spacing: 0.4px; | |
| 1821 | + vertical-align: middle; | |
| 1822 | + text-decoration: none; | |
| 1823 | +} | |
| 1824 | + | |
| 1825 | +.charitable-dashboard-v2-blog-post-badge-upgrade:hover { | |
| 1826 | + background-color: #d89447; | |
| 1827 | + color: #fff; | |
| 1828 | +} | |
| 1829 | + | |
| 1830 | +.charitable-dashboard-v2-blog-post-badge-pro { | |
| 1831 | + display: inline-flex; | |
| 1832 | + align-items: center; | |
| 1833 | + font-size: 10px; | |
| 1834 | + font-weight: 600; | |
| 1835 | + line-height: 1; | |
| 1836 | + padding: 3px 7px; | |
| 1837 | + border-radius: 20px; | |
| 1838 | + background-color: #eaa251; | |
| 1839 | + color: #fff; | |
| 1840 | + text-transform: uppercase; | |
| 1841 | + letter-spacing: 0.4px; | |
| 1842 | + vertical-align: middle; | |
| 1843 | +} | |
| 1844 | + | |
| 1845 | +.charitable-dashboard-v2-blog-post-badge-addon { | |
| 1846 | + display: inline-flex; | |
| 1847 | + align-items: center; | |
| 1848 | + font-size: 10px; | |
| 1849 | + font-weight: 600; | |
| 1850 | + line-height: 1; | |
| 1851 | + padding: 3px 7px; | |
| 1852 | + border-radius: 20px; | |
| 1853 | + background-color: #0ea5e9; | |
| 1854 | + color: #fff; | |
| 1855 | + text-transform: uppercase; | |
| 1856 | + letter-spacing: 0.4px; | |
| 1857 | + vertical-align: middle; | |
| 1858 | +} | |
| 1859 | + | |
| 1860 | +/* Title */ | |
| 1861 | +.charitable-dashboard-v2-section .charitable-dashboard-v2-blog-posts .charitable-dashboard-v2-blog-post-row .charitable-dashboard-v2-blog-post-left .charitable-dashboard-v2-blog-post-title { | |
| 1862 | + margin: 0 0 5px; | |
| 1863 | +} | |
| 1864 | + | |
| 1865 | +/* Description */ | |
| 1866 | +.charitable-dashboard-v2-blog-post-desc { | |
| 1867 | + font-size: 12px; | |
| 1868 | + font-weight: 400; | |
| 1869 | + line-height: 1.55; | |
| 1870 | + color: rgba(25, 29, 45, 0.6); | |
| 1871 | + margin: 0 0 4px; | |
| 1872 | +} | |
| 1873 | + | |
| 1874 | +/* Upgrade link — own line, Charitable orange */ | |
| 1875 | +.charitable-dashboard-v2-blog-post-upgrade { | |
| 1876 | + display: block; | |
| 1877 | + font-size: 12px; | |
| 1878 | + font-weight: 600; | |
| 1879 | + color: #eaa251; | |
| 1880 | + text-decoration: none; | |
| 1881 | + margin-bottom: 2px; | |
| 1882 | +} | |
| 1883 | + | |
| 1884 | +.charitable-dashboard-v2-blog-post-upgrade:hover { | |
| 1885 | + text-decoration: underline; | |
| 1886 | +} | |
| 1887 | + | |
| 1888 | +/* Learn More button — inline after description text */ | |
| 1889 | +.charitable-dashboard-v2-blog-post-learn-more { | |
| 1890 | + display: inline; | |
| 1891 | + font-size: 12px; | |
| 1892 | + font-weight: 600; | |
| 1893 | + color: rgba(25, 29, 45, 0.45); | |
| 1894 | + background: none; | |
| 1895 | + border: none; | |
| 1896 | + padding: 0; | |
| 1897 | + margin-left: 3px; | |
| 1898 | + cursor: pointer; | |
| 1899 | + text-decoration: none; | |
| 1900 | + font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; | |
| 1901 | + white-space: nowrap; | |
| 1902 | +} | |
| 1903 | + | |
| 1904 | +.charitable-dashboard-v2-blog-post-learn-more:hover { | |
| 1905 | + color: rgba(25, 29, 45, 0.8); | |
| 1906 | + text-decoration: underline; | |
| 1907 | +} | |
| 1908 | + | |
| 1909 | +/* Thumbnail button */ | |
| 1910 | +.charitable-dashboard-v2-blog-post-thumb { | |
| 1911 | + position: relative; | |
| 1912 | + display: block; | |
| 1913 | + flex-shrink: 0; | |
| 1914 | + width: 120px; | |
| 1915 | + height: 80px; | |
| 1916 | + border: 1px solid #d5d5d5; | |
| 1917 | + padding: 0; | |
| 1918 | + background: #E5E7EB; | |
| 1919 | + cursor: pointer; | |
| 1920 | + border-radius: 6px; | |
| 1921 | + overflow: hidden; | |
| 1922 | +} | |
| 1923 | + | |
| 1924 | +.charitable-dashboard-v2-blog-post-thumb svg { | |
| 1925 | + display: block; | |
| 1926 | + width: 120px; | |
| 1927 | + height: 80px; | |
| 1928 | +} | |
| 1929 | + | |
| 1930 | +.charitable-dashboard-v2-blog-post-thumb--bg { | |
| 1931 | + background-size: contain; | |
| 1932 | + background-position: center; | |
| 1933 | + background-repeat: no-repeat; | |
| 1934 | + background-color: #fff; | |
| 1935 | +} | |
| 1936 | + | |
| 1937 | +/* Feature modal — commented out in 1.8.13.3, may be re-enabled later. | |
| 1938 | +.charitable-feature-modal-overlay { | |
| 1939 | + position: fixed; | |
| 1940 | + inset: 0; | |
| 1941 | + background: rgba(10, 12, 20, 0.65); | |
| 1942 | + z-index: 999999; | |
| 1943 | + display: flex; | |
| 1944 | + align-items: center; | |
| 1945 | + justify-content: center; | |
| 1946 | + backdrop-filter: blur(3px); | |
| 1947 | +} | |
| 1948 | +.charitable-feature-modal-box { | |
| 1949 | + position: relative; | |
| 1950 | + background: #fff; | |
| 1951 | + border-radius: 12px; | |
| 1952 | + width: 750px; | |
| 1953 | + max-width: calc(100vw - 40px); | |
| 1954 | + overflow: hidden; | |
| 1955 | + box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25); | |
| 1956 | +} | |
| 1957 | +*/ | |
| 1958 | + | |
| 1959 | +/* Row dividers */ | |
| 1960 | +.charitable-dashboard-v2-section .charitable-dashboard-v2-blog-posts .charitable-dashboard-v2-blog-post-row { | |
| 1961 | + margin-bottom: 0 !important; | |
| 1962 | + padding: 14px 0; | |
| 1963 | + border-bottom: 1px solid rgba(25, 29, 45, 0.2); | |
| 1964 | +} | |
| 1965 | +.charitable-dashboard-v2-section .charitable-dashboard-v2-blog-posts .charitable-dashboard-v2-blog-post-row:last-child { | |
| 1966 | + border-bottom: none; | |
| 1967 | +} | |
| 1968 | + | |
| 1969 | +/* Modal video element — commented out in 1.8.13.3. | |
| 1970 | +.charitable-feature-modal-video-el { | |
| 1971 | + display: block; | |
| 1972 | + width: 100%; | |
| 1973 | + height: 100%; | |
| 1974 | + object-fit: cover; | |
| 1975 | +} | |
| 1976 | +*/ | |
| 1977 | + | |
| 1978 | +/* ── Are you enjoying Charitable? dashboard section ── */ | |
| 1979 | +.charitable-dashboard-enjoy-section { | |
| 1980 | + position: relative; | |
| 1981 | + background: #ffeedb; | |
| 1982 | + border-radius: 4px; | |
| 1983 | + padding: 16px 20px 14px; | |
| 1984 | + border: 1px solid rgba(24, 36, 69, 0.1); | |
| 1985 | + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.05); | |
| 1986 | + min-height: 0; | |
| 1987 | +} | |
| 1988 | + | |
| 1989 | +.charitable-enjoy-question { | |
| 1990 | + margin: 0 0 10px; | |
| 1991 | + font-size: 13px; | |
| 1992 | + color: #1d2327; | |
| 1993 | + padding-right: 24px; | |
| 1994 | +} | |
| 1995 | + | |
| 1996 | +/* Title style for the main step-1 question and explicit title modifier */ | |
| 1997 | +.charitable-enjoy-step[data-step="1"] .charitable-enjoy-question, | |
| 1998 | +.charitable-enjoy-question.charitable-enjoy-question--title { | |
| 1999 | + font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; | |
| 2000 | + font-weight: 700; | |
| 2001 | + font-size: 17px; | |
| 2002 | + line-height: 130%; | |
| 2003 | + color: rgba(25, 29, 45, 0.9); | |
| 2004 | + margin-bottom: 20px; | |
| 2005 | +} | |
| 2006 | + | |
| 2007 | +/* Body paragraph following the title in step 3 */ | |
| 2008 | +.charitable-enjoy-question--title + .charitable-enjoy-question { | |
| 2009 | + margin-top: 10px; | |
| 2010 | +} | |
| 2011 | + | |
| 2012 | +.charitable-enjoy-team { | |
| 2013 | + margin: 0 0 10px !important; | |
| 2014 | + font-size: 13px; | |
| 2015 | + color: #1d2327; | |
| 2016 | +} | |
| 2017 | + | |
| 2018 | +.charitable-enjoy-actions { | |
| 2019 | + margin: 0; | |
| 2020 | + display: flex; | |
| 2021 | + align-items: center; | |
| 2022 | + gap: 8px; | |
| 2023 | + flex-wrap: wrap; | |
| 2024 | +} | |
| 2025 | + | |
| 2026 | +.charitable-enjoy-link { | |
| 2027 | + display: inline-block; | |
| 2028 | + background: none; | |
| 2029 | + border: 1px solid #c3c4c7; | |
| 2030 | + padding: 6px 14px; | |
| 2031 | + font-size: 12px; | |
| 2032 | + font-weight: 600; | |
| 2033 | + color: #1d2327; | |
| 2034 | + cursor: pointer; | |
| 2035 | + text-decoration: none; | |
| 2036 | + line-height: 1.7; | |
| 2037 | + border-radius: 4px; | |
| 2038 | + transition: background 0.15s, border-color 0.15s, color 0.15s; | |
| 2039 | +} | |
| 2040 | + | |
| 2041 | +.charitable-enjoy-link:hover { | |
| 2042 | + background: #f0f0f1; | |
| 2043 | + color: #1d2327; | |
| 2044 | + text-decoration: none; | |
| 2045 | +} | |
| 2046 | + | |
| 2047 | +/* Yes button — Charitable green */ | |
| 2048 | +.charitable-enjoy-link--yes { | |
| 2049 | + background: #5AA152; | |
| 2050 | + border-color: #5AA152; | |
| 2051 | + color: #fff; | |
| 2052 | +} | |
| 2053 | + | |
| 2054 | +.charitable-enjoy-link--yes:hover { | |
| 2055 | + background: #43833b; | |
| 2056 | + border-color: #43833b; | |
| 2057 | + color: #fff; | |
| 2058 | +} | |
| 2059 | + | |
| 2060 | +/* Not really button — Charitable orange */ | |
| 2061 | +.charitable-enjoy-link--no { | |
| 2062 | + background: #eaa251; | |
| 2063 | + border-color: #eaa251; | |
| 2064 | + color: #fff; | |
| 2065 | +} | |
| 2066 | + | |
| 2067 | +.charitable-enjoy-link--no:hover { | |
| 2068 | + background: #d89447; | |
| 2069 | + border-color: #d89447; | |
| 2070 | + color: #fff; | |
| 2071 | +} | |
| 2072 | + | |
| 2073 | +.charitable-enjoy-sep { | |
| 2074 | + display: none; | |
| 2075 | +} | |
| 2076 | + | |
| 2077 | +.charitable-enjoy-dismiss-btn { | |
| 2078 | + position: absolute; | |
| 2079 | + top: 10px; | |
| 2080 | + right: 10px; | |
| 2081 | + background: none; | |
| 2082 | + border: none; | |
| 2083 | + color: #8c8f94; | |
| 2084 | + cursor: pointer; | |
| 2085 | + padding: 4px; | |
| 2086 | + line-height: 1; | |
| 2087 | + border-radius: 50%; | |
| 2088 | + display: flex; | |
| 2089 | + align-items: center; | |
| 2090 | + justify-content: center; | |
| 2091 | + transition: color 0.15s, background 0.15s; | |
| 2092 | +} | |
| 2093 | + | |
| 2094 | +.charitable-enjoy-dismiss-btn:hover { | |
| 2095 | + color: #1d2327; | |
| 2096 | + background: #f0f0f1; | |
| 2097 | +} | |
| 2098 | + | |
| 2099 | +/* Dashboard v2 — "you're on the latest version" confirmation pill. @since 1.8.12 */ | |
| 2100 | +.charitable-dashboard-v2-latest-updates-uptodate { | |
| 2101 | + display: inline-flex; | |
| 2102 | + align-items: center; | |
| 2103 | + gap: 6px; | |
| 2104 | + padding: 6px 12px 6px 9px; | |
| 2105 | + margin: 0 0 16px 23px; | |
| 2106 | + border-radius: 4px; | |
| 2107 | + background-color: #e5f6e9; | |
| 2108 | + color: #00a32a; | |
| 2109 | + font-size: 12px; | |
| 2110 | + font-weight: 500; | |
| 2111 | + line-height: 1.3; | |
| 2112 | +} | |
| 2113 | + | |
| 2114 | +.charitable-dashboard-v2-latest-updates-uptodate svg { | |
| 2115 | + flex: 0 0 auto; | |
| 2116 | +} | |
| 2117 | + | |
| 2118 | +.charitable-dashboard-v2-latest-updates-uptodate strong { | |
| 2119 | + font-weight: 600; | |
| 2120 | +} | |
| 2121 | + | |
| 2122 | +/* Dashboard v2 — "behind X versions (but under threshold)" amber nudge pill. @since 1.8.12 */ | |
| 2123 | +.charitable-dashboard-v2-latest-updates-behind { | |
| 2124 | + display: inline-flex; | |
| 2125 | + align-items: center; | |
| 2126 | + gap: 6px; | |
| 2127 | + padding: 6px 12px; | |
| 2128 | + margin: -7px 0 0 25px; | |
| 2129 | + border-radius: 4px; | |
| 2130 | + background-color: #fef3e4; | |
| 2131 | + color: #bf6000; | |
| 2132 | + font-size: 12px; | |
| 2133 | + font-weight: 500; | |
| 2134 | + line-height: 1.3; | |
| 2135 | +} | |
| 2136 | + | |
| 2137 | +.charitable-dashboard-v2-latest-updates-behind svg { | |
| 2138 | + flex: 0 0 auto; | |
| 2139 | +} | |
| 2140 | + | |
| 2141 | +.charitable-dashboard-v2-latest-updates-behind strong { | |
| 2142 | + font-weight: 600; | |
| 2143 | +} | |
| 2144 | + | |
| 2145 | +.charitable-dashboard-v2-latest-updates-behind a { | |
| 2146 | + color: inherit; | |
| 2147 | + text-decoration: underline; | |
| 2148 | + font-weight: 600; | |
| 2149 | +} | |
| 2150 | + | |
| 2151 | +.charitable-dashboard-v2-latest-updates-behind a:hover { | |
| 2152 | + text-decoration: none; | |
| 2153 | +} | |
| 2154 | + | |
| 2155 | +/* "Update now" link inside the big "X versions behind" headline. @since 1.8.12 */ | |
| 2156 | +.charitable-dashboard-v2-latest-updates-headline a { | |
| 2157 | + color: inherit; | |
| 2158 | + text-decoration: underline; | |
| 2159 | + white-space: nowrap; | |
| 2160 | +} | |
| 2161 | + | |
| 2162 | +.charitable-dashboard-v2-latest-updates-headline a:hover { | |
| 2163 | + text-decoration: none; | |
| 1764 | 2164 | } |
