| @@ -205,9 +205,9 @@ | ||
| 205 | 205 | right: 0; |
| 206 | 206 | background-color: #fff; |
| 207 | 207 | overflow: auto; |
| 208 | 208 | } |
| 209 | -.wpsc-humbargar-menu .box-inner { | |
| 209 | +.wpsc-humbargar-menu .wpsc-merge-box-inner { | |
| 210 | 210 | padding: 15px 15px 0; |
| 211 | 211 | } |
| 212 | 212 | .wpsc-humbargar-close { |
| 213 | 213 | display: flex; |
| @@ -463,8 +463,34 @@ | ||
| 463 | 463 | } |
| 464 | 464 | .wpsc-ticket-list-tbl tbody tr:hover { |
| 465 | 465 | cursor: pointer; |
| 466 | 466 | } |
| 467 | +.wpsc-ticket-list-tbl th.wpsc-tl-sortable-th { | |
| 468 | + cursor: pointer; | |
| 469 | + white-space: nowrap; | |
| 470 | + -webkit-user-select: none; | |
| 471 | + user-select: none; | |
| 472 | +} | |
| 473 | +.wpsc-ticket-list-tbl th .wpsc-tl-th-inner { | |
| 474 | + display: flex; | |
| 475 | + align-items: center; | |
| 476 | +} | |
| 477 | +.wpsc-ticket-list-tbl th .wpsc-tl-sort-icon { | |
| 478 | + display: inline-flex; | |
| 479 | + align-items: center; | |
| 480 | + flex: none; | |
| 481 | + height: 12px; | |
| 482 | + margin-left: 6px; | |
| 483 | +} | |
| 484 | +.wpsc-ticket-list-tbl th .wpsc-tl-sort-icon svg { | |
| 485 | + width: auto; | |
| 486 | + height: 100%; | |
| 487 | + fill: #a7aaad; | |
| 488 | +} | |
| 489 | +.wpsc-ticket-list-tbl th.wpsc-tl-sorted-asc .wpsc-tl-sort-icon svg, | |
| 490 | +.wpsc-ticket-list-tbl th.wpsc-tl-sorted-desc .wpsc-tl-sort-icon svg { | |
| 491 | + fill: #2271b1; | |
| 492 | +} | |
| 467 | 493 | |
| 468 | 494 | /* Modal Popup */ |
| 469 | 495 | .wpsc-modal .loader, |
| 470 | 496 | .wpsc-modal .inner-container { |
| @@ -506,9 +532,8 @@ | ||
| 506 | 532 | padding: 10px 15px; |
| 507 | 533 | } |
| 508 | 534 | .wpsc-modal-body { |
| 509 | 535 | display: flex; |
| 510 | - justify-content: center; | |
| 511 | 536 | font-size: 14px; |
| 512 | 537 | padding: 20px 15px 15px 15px; |
| 513 | 538 | max-height: 300px; |
| 514 | 539 | overflow: auto; |
| @@ -867,8 +892,18 @@ | ||
| 867 | 892 | } |
| 868 | 893 | .wpsc-thread .thread-text { |
| 869 | 894 | overflow: hidden; |
| 870 | 895 | } |
| 896 | +.wpsc-thread .thread-text.wpsc-collapsed { | |
| 897 | + max-height: 100px; | |
| 898 | +} | |
| 899 | +.wpsc-thread .thread-text.wpsc-expanded { | |
| 900 | + max-height: none; | |
| 901 | +} | |
| 902 | +.wpsc-thread .thread-text ul{ | |
| 903 | + list-style-type: disc !important; | |
| 904 | + padding-inline-start: 2em; | |
| 905 | +} | |
| 871 | 906 | .wpsc-thread p { |
| 872 | 907 | font-size: 14px; |
| 873 | 908 | font-weight: 400; |
| 874 | 909 | } |
| @@ -882,8 +917,11 @@ | ||
| 882 | 917 | .wpsc-log-diff .rhs { |
| 883 | 918 | display: flex; |
| 884 | 919 | align-items: center; |
| 885 | 920 | flex-wrap: wrap; |
| 921 | + word-break: break-word; | |
| 922 | + overflow-wrap: anywhere; | |
| 923 | + white-space: normal; | |
| 886 | 924 | } |
| 887 | 925 | .wpsc-log-diff .transform-icon svg { |
| 888 | 926 | width: 12px; |
| 889 | 927 | margin: 0 10px; |
| @@ -1204,12 +1242,21 @@ | ||
| 1204 | 1242 | } |
| 1205 | 1243 | .wpsc-switch-editor.active { |
| 1206 | 1244 | background: #c3c3c3; |
| 1207 | 1245 | } |
| 1208 | -.wpsc_textarea { | |
| 1246 | +.wpsc_textarea:not(#wpsc-en-body) { | |
| 1209 | 1247 | height: 160px !important; |
| 1210 | 1248 | width: 100% !important; |
| 1211 | 1249 | } |
| 1250 | +/* Email Notifications body editor (Ticket Notifications, OTP, Satisfaction Survey, | |
| 1251 | + Auto Close Ticket, WooCommerce create ticket): allow vertical resize handle to work | |
| 1252 | + by not forcing height with !important. Scoped to this id only so other .wpsc_textarea | |
| 1253 | + usages (canned replies, GDPR/T&C, ticket description, print templates, etc.) are unaffected. */ | |
| 1254 | +#wpsc-en-body.wpsc_textarea { | |
| 1255 | + height: 160px; | |
| 1256 | + width: 100% !important; | |
| 1257 | + resize: vertical; | |
| 1258 | +} | |
| 1212 | 1259 | |
| 1213 | 1260 | /* Ticket form field */ |
| 1214 | 1261 | .wpsc-tff { |
| 1215 | 1262 | display: flex; |
| @@ -1418,8 +1465,9 @@ | ||
| 1418 | 1465 | font-size: 14px !important; |
| 1419 | 1466 | min-height: 30px !important; |
| 1420 | 1467 | max-height: 30px !important; |
| 1421 | 1468 | padding: 0 24px 0 8px !important; |
| 1469 | + line-height: 2 !important; // fix for wordpress 7 | |
| 1422 | 1470 | } |
| 1423 | 1471 | |
| 1424 | 1472 | /* Checkboxes */ |
| 1425 | 1473 | #wpsc-container .checkbox-container, |
| @@ -1752,25 +1800,24 @@ | ||
| 1752 | 1800 | flex-wrap: wrap; |
| 1753 | 1801 | gap: 5px; |
| 1754 | 1802 | padding: 10px; |
| 1755 | 1803 | } |
| 1756 | -.wpsc-ac-agent { | |
| 1757 | - display: flex; | |
| 1758 | - width: fit-content; | |
| 1759 | - align-items: center; | |
| 1760 | - gap: 5px; | |
| 1761 | - padding: 5px; | |
| 1762 | - border-radius: 5px; | |
| 1763 | - font-size: 13px; | |
| 1804 | +/* Dashboard widgets css */ | |
| 1805 | + | |
| 1806 | +/* Card/widget background, text and icon colors are NOT set here - they come from the "Appearance | |
| 1807 | + > Dashboard" settings (wpsc-ap-dashboard option), injected as inline !important styles by | |
| 1808 | + WPSC_Tickets::get_agent_dashboard() (core/includes/admin/tickets/class-wpsc-tickets.php). This | |
| 1809 | + stylesheet only handles structure/spacing/shape, so it never fights that setting. */ | |
| 1810 | + | |
| 1811 | +:root { | |
| 1812 | + --wpsc-dash-border: #e7eaf0; | |
| 1813 | + --wpsc-dash-divider: #eef0f4; | |
| 1814 | + --wpsc-dash-surface-hover: #f8fafc; | |
| 1815 | + --wpsc-dash-accent: #0079bf; | |
| 1816 | + --wpsc-dash-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 1px 3px rgba(16, 24, 40, 0.06); | |
| 1764 | 1817 | } |
| 1765 | -.wpsc-ac-agent img { | |
| 1766 | - border-radius: 50%; | |
| 1767 | -} | |
| 1768 | 1818 | |
| 1769 | -/* Dashboard widgets css */ | |
| 1770 | - | |
| 1771 | 1819 | .wpsc-dash-widget svg { |
| 1772 | - color: #ccc; | |
| 1773 | 1820 | height: 80px !important; |
| 1774 | 1821 | } |
| 1775 | 1822 | |
| 1776 | 1823 | .wpsc-dashboard-widget-icon-header { |
| @@ -1777,8 +1824,14 @@ | ||
| 1777 | 1824 | display: flex; |
| 1778 | 1825 | align-items: center; |
| 1779 | 1826 | } |
| 1780 | 1827 | |
| 1828 | +.wpsc-dashboard-widget-icon-header span { | |
| 1829 | + font-size: 14px; | |
| 1830 | + font-weight: 600; | |
| 1831 | + letter-spacing: 0.01em; | |
| 1832 | +} | |
| 1833 | + | |
| 1781 | 1834 | .wpsc-dashboard-card-icon-header { |
| 1782 | 1835 | cursor: pointer; |
| 1783 | 1836 | } |
| 1784 | 1837 | |
| @@ -1792,17 +1845,16 @@ | ||
| 1792 | 1845 | .wpsc-dash-widget { |
| 1793 | 1846 | margin: 10px; |
| 1794 | 1847 | position: relative; |
| 1795 | 1848 | box-sizing: border-box; |
| 1796 | - background-color: #f4f6f9; | |
| 1797 | - border: 1px solid #ccc; | |
| 1798 | - border-radius: 5px; | |
| 1799 | - padding: 10px; | |
| 1800 | - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); | |
| 1849 | + border: 1px solid var(--wpsc-dash-border); | |
| 1850 | + border-radius: 12px; | |
| 1851 | + padding: 16px 18px; | |
| 1852 | + box-shadow: var(--wpsc-dash-shadow); | |
| 1801 | 1853 | } |
| 1802 | 1854 | |
| 1803 | 1855 | .wpsc-dash-widget2 { |
| 1804 | - padding: 10px; | |
| 1856 | + padding: 16px 18px; | |
| 1805 | 1857 | } |
| 1806 | 1858 | |
| 1807 | 1859 | .wpsc-dash-widget-small { |
| 1808 | 1860 | width: calc(20% - 20px); |
| @@ -1813,14 +1865,18 @@ | ||
| 1813 | 1865 | } |
| 1814 | 1866 | |
| 1815 | 1867 | .wpsc-dash-widget-small .wpsc-dash-widget-icon { |
| 1816 | 1868 | font-size: 70px; /* Increase the size as needed */ |
| 1817 | - color: #ccc; /* Change the icon color as needed */ | |
| 1818 | 1869 | margin-left: 10px; /* Add margin to separate from the text */ |
| 1819 | 1870 | } |
| 1820 | 1871 | |
| 1821 | 1872 | .wpsc-dash-widget-small svg { |
| 1822 | - opacity: 0.2; | |
| 1873 | + opacity: 0.5; | |
| 1874 | + flex-shrink: 0; | |
| 1875 | + overflow: visible; | |
| 1876 | + height: 48px !important; | |
| 1877 | + width: 48px !important; | |
| 1878 | + margin-left: 10px; | |
| 1823 | 1879 | } |
| 1824 | 1880 | |
| 1825 | 1881 | .wpsc-dash-widget-mid { |
| 1826 | 1882 | width: calc(50% - 20px); |
| @@ -1832,47 +1888,96 @@ | ||
| 1832 | 1888 | |
| 1833 | 1889 | .wpsc-widget h2 { |
| 1834 | 1890 | font-size: 18px; |
| 1835 | 1891 | margin-bottom: 5px; |
| 1892 | + font-weight: 600; | |
| 1836 | 1893 | } |
| 1837 | 1894 | |
| 1838 | 1895 | .wpsc-dash-widget-small h2 { |
| 1839 | - margin-bottom: 5px; | |
| 1840 | - font-size: 35px; | |
| 1841 | - font-weight: 600; | |
| 1896 | + margin-bottom: 4px; | |
| 1897 | + font-size: 32px; | |
| 1898 | + font-weight: 700; | |
| 1899 | + letter-spacing: -0.02em; | |
| 1842 | 1900 | } |
| 1843 | 1901 | |
| 1902 | +.wpsc-dash-widget-small p { | |
| 1903 | + font-size: 13px; | |
| 1904 | + font-weight: 500; | |
| 1905 | +} | |
| 1906 | + | |
| 1844 | 1907 | /* Style the header of widgets with icons and actions */ |
| 1845 | 1908 | .wpsc-dash-widget-header { |
| 1846 | 1909 | display: flex; |
| 1847 | 1910 | justify-content: space-between; |
| 1848 | 1911 | align-items: center; |
| 1849 | - margin-bottom: 10px; | |
| 1850 | - border-bottom: 1px solid #ccc; | |
| 1851 | - padding-bottom: 10px; | |
| 1912 | + margin-bottom: 14px; | |
| 1913 | + border-bottom: 1px solid var(--wpsc-dash-divider); | |
| 1914 | + padding-bottom: 12px; | |
| 1852 | 1915 | } |
| 1853 | 1916 | |
| 1854 | 1917 | .wpsc-dash-widget-header svg { |
| 1855 | - color: #ccc; | |
| 1856 | 1918 | height: 15px !important; |
| 1857 | 1919 | margin: 0px 5px 0px 0px; |
| 1858 | 1920 | } |
| 1859 | 1921 | |
| 1860 | 1922 | .wpsc-dash-widget-actions { |
| 1861 | - /* Widget action links styles here */ | |
| 1923 | + font-size: 12px; | |
| 1862 | 1924 | } |
| 1863 | 1925 | |
| 1864 | 1926 | .wpsc-dash-widget-actions a { |
| 1865 | 1927 | cursor: pointer; |
| 1866 | 1928 | text-decoration: none; |
| 1929 | + color: var(--wpsc-dash-accent); | |
| 1930 | + font-weight: 500; | |
| 1867 | 1931 | } |
| 1868 | 1932 | |
| 1933 | +.wpsc-dash-widget-actions a:hover { | |
| 1934 | + text-decoration: underline; | |
| 1935 | +} | |
| 1936 | + | |
| 1869 | 1937 | /* Style the content of widgets */ |
| 1870 | 1938 | .wpsc-dash-widget-content { |
| 1871 | - /* Widget content styles here */ | |
| 1939 | + font-size: 13px; | |
| 1872 | 1940 | } |
| 1873 | 1941 | |
| 1942 | +/* Tables rendered inside a widget's content area (agent list, recent tickets, todos, out-of-sla, | |
| 1943 | + timers, usergroups, agent performance, feedback, ...) - scoped to the content wrapper so this | |
| 1944 | + doesn't touch tables anywhere else in the app. Text color is intentionally left unset here so | |
| 1945 | + it inherits the widget's appearance-setting-driven text color instead of overriding it. */ | |
| 1946 | +.wpsc-dash-widget-content table { | |
| 1947 | + width: 100%; | |
| 1948 | + border-collapse: collapse; | |
| 1949 | +} | |
| 1950 | + | |
| 1951 | +.wpsc-dash-widget-content table thead th { | |
| 1952 | + text-align: left; | |
| 1953 | + font-size: 11px; | |
| 1954 | + font-weight: 600; | |
| 1955 | + text-transform: uppercase; | |
| 1956 | + letter-spacing: 0.04em; | |
| 1957 | + padding: 8px 10px; | |
| 1958 | + border-bottom: 1px solid var(--wpsc-dash-divider); | |
| 1959 | + white-space: nowrap; | |
| 1960 | +} | |
| 1961 | + | |
| 1962 | +.wpsc-dash-widget-content table tbody td { | |
| 1963 | + padding: 10px; | |
| 1964 | + border-bottom: 1px solid var(--wpsc-dash-divider); | |
| 1965 | +} | |
| 1966 | + | |
| 1967 | +.wpsc-dash-widget-content table tbody tr:last-child td { | |
| 1968 | + border-bottom: none; | |
| 1969 | +} | |
| 1970 | + | |
| 1971 | +.wpsc-dash-widget-content table tbody tr:hover td { | |
| 1972 | + background-color: var(--wpsc-dash-surface-hover); | |
| 1973 | +} | |
| 1974 | + | |
| 1874 | 1975 | .wpsc-actions-btn-setting { |
| 1976 | + width: 100%; | |
| 1977 | + display: flex; | |
| 1978 | + align-items: center; | |
| 1979 | + justify-content: space-between; | |
| 1875 | 1980 | padding-bottom: 15px; |
| 1876 | 1981 | } |
| 1877 | 1982 | |
| 1878 | 1983 | /* Style full-width widgets */ |
| @@ -1904,9 +2009,9 @@ | ||
| 1904 | 2009 | } |
| 1905 | 2010 | |
| 1906 | 2011 | .wpsc-dash-widget-content::-webkit-scrollbar-track, |
| 1907 | 2012 | .wpsc-widget-body::-webkit-scrollbar-track { |
| 1908 | - background-color: #ffffff; | |
| 2013 | + background-color: transparent; | |
| 1909 | 2014 | } |
| 1910 | 2015 | /* table scrollable end */ |
| 1911 | 2016 | |
| 1912 | 2017 | .wpsc-dash-widget-mid .wpsc-dash-widget-content { |
| @@ -2015,10 +2120,12 @@ | ||
| 2015 | 2120 | flex-direction: column; |
| 2016 | 2121 | } |
| 2017 | 2122 | |
| 2018 | 2123 | .wpsc-widget-list { |
| 2019 | - border-bottom: 1px solid #ccc; | |
| 2020 | - padding: 10px 0px; | |
| 2124 | + border-bottom: 1px solid var(--wpsc-dash-divider, #eef0f4); | |
| 2125 | + padding: 10px 2px; | |
| 2126 | + font-size: 13px; | |
| 2127 | + line-height: 1.6; | |
| 2021 | 2128 | } |
| 2022 | 2129 | |
| 2023 | 2130 | .wpsc-widget-list:last-child { |
| 2024 | 2131 | border-bottom: none; |
| @@ -2023,12 +2130,27 @@ | ||
| 2023 | 2130 | .wpsc-widget-list:last-child { |
| 2024 | 2131 | border-bottom: none; |
| 2025 | 2132 | } |
| 2026 | 2133 | |
| 2134 | +.wpsc-widget-list a { | |
| 2135 | + color: var(--wpsc-dash-accent, #0079bf); | |
| 2136 | + font-weight: 500; | |
| 2137 | + text-decoration: none; | |
| 2138 | +} | |
| 2139 | + | |
| 2140 | +.wpsc-widget-list a:hover { | |
| 2141 | + text-decoration: underline; | |
| 2142 | +} | |
| 2143 | + | |
| 2027 | 2144 | #wpsc-dash-agent-list .dt-search { |
| 2028 | 2145 | display: none; |
| 2029 | 2146 | } |
| 2030 | 2147 | |
| 2148 | +.wpsc-recent-ticket-list td, .wpsc-db-agent-list td, | |
| 2149 | +.wpsc-db-user-todo td { | |
| 2150 | + cursor: default !important; | |
| 2151 | +} | |
| 2152 | + | |
| 2031 | 2153 | /* User profile starts */ |
| 2032 | 2154 | .wpsc-up-section { |
| 2033 | 2155 | width: 100%; |
| 2034 | 2156 | } |
| @@ -2148,5 +2270,56 @@ | ||
| 2148 | 2270 | } |
| 2149 | 2271 | |
| 2150 | 2272 | .wpsc-icon-wp-logo { |
| 2151 | 2273 | height: 15px !important; |
| 2152 | -} | |
| 2274 | +} | |
| 2275 | + | |
| 2276 | +/* Agent collision css starts */ | |
| 2277 | +.wpsc-live-agents { | |
| 2278 | + display: flex; | |
| 2279 | + flex-direction: column; | |
| 2280 | + gap: 5px; | |
| 2281 | + align-items: stretch; | |
| 2282 | +} | |
| 2283 | + | |
| 2284 | +.wpsc-agent-avatar { | |
| 2285 | + position: relative; | |
| 2286 | + display: flex; | |
| 2287 | + align-items: center; | |
| 2288 | + gap: 6px; | |
| 2289 | + max-width: 100%; | |
| 2290 | + padding: 2px 10px 2px 2px; | |
| 2291 | + border-radius: 16px; | |
| 2292 | + cursor: pointer; | |
| 2293 | + box-sizing: border-box; | |
| 2294 | + transition: transform 0.2s ease, box-shadow 0.2s ease; | |
| 2295 | +} | |
| 2296 | + | |
| 2297 | +/* Avatar image */ | |
| 2298 | +.wpsc-agent-avatar img { | |
| 2299 | + width: 28px; | |
| 2300 | + height: 28px; | |
| 2301 | + flex-shrink: 0; | |
| 2302 | + object-fit: cover; | |
| 2303 | + border-radius: 50%; | |
| 2304 | +} | |
| 2305 | + | |
| 2306 | +/* Agent name shown alongside avatar (also covers installs with avatars disabled) */ | |
| 2307 | +.wpsc-agent-name { | |
| 2308 | + overflow: hidden; | |
| 2309 | + text-overflow: ellipsis; | |
| 2310 | + white-space: nowrap; | |
| 2311 | + font-size: 12px; | |
| 2312 | +} | |
| 2313 | +/* Agent collision css ends */ | |
| 2314 | + | |
| 2315 | +/* Error message only */ | |
| 2316 | +.wpsc-error-msg { | |
| 2317 | + color: #e53935; | |
| 2318 | + font-size: 12px; | |
| 2319 | + margin-top: 4px; | |
| 2320 | + line-height: 1.4; | |
| 2321 | +} | |
| 2322 | + | |
| 2323 | +#wpsc-container input[type=number] { | |
| 2324 | + min-height: 30px !important; // fix for wordpress 7 | |
| 2325 | +} | |
