| @@ -347,8 +347,9 @@ | ||
| 347 | 347 | } |
| 348 | 348 | [class*="imagify-"] .button .dashicons { |
| 349 | 349 | margin-right: 5px; |
| 350 | 350 | vertical-align: middle; |
| 351 | + line-height: 1; | |
| 351 | 352 | } |
| 352 | 353 | |
| 353 | 354 | .imagify-settings .button-primary.button-primary, |
| 354 | 355 | .imagify-welcome .button-primary.button-primary, |
| @@ -462,8 +463,9 @@ | ||
| 462 | 463 | .imagify-button.imagify-button .dashicons, |
| 463 | 464 | .imagify-button-primary.imagify-button-primary .dashicons, |
| 464 | 465 | .imagify-button-secondary.imagify-button-secondary .dashicons { |
| 465 | 466 | vertical-align: middle; |
| 467 | + line-height: 1; | |
| 466 | 468 | } |
| 467 | 469 | |
| 468 | 470 | [class*="imagify-"] .button-text { |
| 469 | 471 | display: inline-block; |
| @@ -1392,9 +1394,9 @@ | ||
| 1392 | 1394 | box-sizing: border-box; |
| 1393 | 1395 | position: relative; |
| 1394 | 1396 | width: 800px; |
| 1395 | 1397 | max-width: 95%; |
| 1396 | - max-height: 90vw; | |
| 1398 | + max-height: 90vh; | |
| 1397 | 1399 | overflow: auto; |
| 1398 | 1400 | padding: 20px 25px; |
| 1399 | 1401 | margin: 1em auto; |
| 1400 | 1402 | background: #FFF; |
| @@ -1687,4 +1689,135 @@ | ||
| 1687 | 1689 | } |
| 1688 | 1690 | .imagify-upsell.imagify-col-content .imagify-space-left p { |
| 1689 | 1691 | font-size: 14px; |
| 1690 | 1692 | } |
| 1693 | + | |
| 1694 | +/* Analytics opt-in ============================================================================= */ | |
| 1695 | +.imagify-analytics-section { | |
| 1696 | + padding: 20px 24px; | |
| 1697 | + background: #f6f7f7; | |
| 1698 | + border-radius: 4px; | |
| 1699 | +} | |
| 1700 | + | |
| 1701 | +.imagify-analytics-optin { | |
| 1702 | + display: flex; | |
| 1703 | + flex-direction: column; | |
| 1704 | + gap: 8px; | |
| 1705 | +} | |
| 1706 | + | |
| 1707 | +.imagify-analytics-label { | |
| 1708 | + display: inline-flex; | |
| 1709 | + align-items: center; | |
| 1710 | + gap: 12px; | |
| 1711 | + cursor: pointer; | |
| 1712 | + font-size: 14px; | |
| 1713 | + font-weight: 600; | |
| 1714 | + color: #2E3243; | |
| 1715 | +} | |
| 1716 | + | |
| 1717 | +/* Hide native checkbox */ | |
| 1718 | +.imagify-analytics-checkbox { | |
| 1719 | + position: absolute; | |
| 1720 | + opacity: 0; | |
| 1721 | + width: 0; | |
| 1722 | + height: 0; | |
| 1723 | +} | |
| 1724 | + | |
| 1725 | +/* Toggle switch track */ | |
| 1726 | +.imagify-analytics-toggle-ui { | |
| 1727 | + position: relative; | |
| 1728 | + display: inline-block; | |
| 1729 | + width: 48px; | |
| 1730 | + height: 26px; | |
| 1731 | + background: #ccc; | |
| 1732 | + border-radius: 13px; | |
| 1733 | + transition: background .2s ease; | |
| 1734 | + flex-shrink: 0; | |
| 1735 | +} | |
| 1736 | + | |
| 1737 | +/* Toggle switch thumb */ | |
| 1738 | +.imagify-analytics-toggle-ui::after { | |
| 1739 | + content: ''; | |
| 1740 | + position: absolute; | |
| 1741 | + top: 3px; | |
| 1742 | + left: 3px; | |
| 1743 | + width: 20px; | |
| 1744 | + height: 20px; | |
| 1745 | + background: #fff; | |
| 1746 | + border-radius: 50%; | |
| 1747 | + box-shadow: 0 1px 3px rgba(0,0,0,.3); | |
| 1748 | + transition: transform .2s ease; | |
| 1749 | +} | |
| 1750 | + | |
| 1751 | +.imagify-analytics-checkbox:checked ~ .imagify-analytics-toggle-ui, | |
| 1752 | +.imagify-analytics-label .imagify-analytics-checkbox:checked + .imagify-analytics-toggle-ui { | |
| 1753 | + background: #40B1D0; | |
| 1754 | +} | |
| 1755 | + | |
| 1756 | +.imagify-analytics-checkbox:checked + .imagify-analytics-toggle-ui::after { | |
| 1757 | + transform: translateX(22px); | |
| 1758 | +} | |
| 1759 | + | |
| 1760 | +.imagify-analytics-description { | |
| 1761 | + margin: 0; | |
| 1762 | + color: #666; | |
| 1763 | + font-size: 13px; | |
| 1764 | +} | |
| 1765 | + | |
| 1766 | +.imagify-btn-link { | |
| 1767 | + background: none; | |
| 1768 | + border: none; | |
| 1769 | + padding: 0; | |
| 1770 | + color: #40B1D0; | |
| 1771 | + text-decoration: underline; | |
| 1772 | + cursor: pointer; | |
| 1773 | + font-size: inherit; | |
| 1774 | +} | |
| 1775 | + | |
| 1776 | +.imagify-btn-link:hover { | |
| 1777 | + color: #338ea6; | |
| 1778 | +} | |
| 1779 | + | |
| 1780 | +/* Analytics data table (modal + thank-you notice) */ | |
| 1781 | +.imagify-analytics-data-table { | |
| 1782 | + width: 100%; | |
| 1783 | + border-collapse: collapse; | |
| 1784 | + margin: 12px 0; | |
| 1785 | + border-left: 3px solid #40B1D0; | |
| 1786 | + background-color: #F0FAFD; | |
| 1787 | + border-radius: 4px; | |
| 1788 | + overflow: hidden; | |
| 1789 | +} | |
| 1790 | + | |
| 1791 | +.imagify-analytics-data-table td { | |
| 1792 | + padding: 8px 12px; | |
| 1793 | + font-size: 13px; | |
| 1794 | + border-bottom: 1px solid #D8EFF6; | |
| 1795 | + vertical-align: top; | |
| 1796 | + color: #2E3243; | |
| 1797 | +} | |
| 1798 | + | |
| 1799 | +.imagify-analytics-data-table td:first-child { | |
| 1800 | + font-weight: 600; | |
| 1801 | + width: 40%; | |
| 1802 | +} | |
| 1803 | + | |
| 1804 | +.imagify-analytics-data-table tr:last-child td { | |
| 1805 | + border-bottom: 0; | |
| 1806 | +} | |
| 1807 | + | |
| 1808 | +/* Thank-you notice text colour override */ | |
| 1809 | +.imagify-analytics-thankyou-notice, | |
| 1810 | +.imagify-analytics-thankyou-notice p { | |
| 1811 | + color: #1d2327; | |
| 1812 | +} | |
| 1813 | + | |
| 1814 | +/* Opt-in ask notice */ | |
| 1815 | +.imagify-analytics-optin-notice .imagify-analytics-data-container { | |
| 1816 | + margin-bottom: 12px; | |
| 1817 | +} | |
| 1818 | + | |
| 1819 | +.imagify-analytics-optin-notice .imagify-analytics-data-container .description { | |
| 1820 | + color: #666; | |
| 1821 | + font-size: 13px; | |
| 1822 | +} | |
| 1823 | + | |
