(READ ONLY) Margin is an open annotation layer for the internet. Powered by the AT Protocol. margin.at
extension web atproto comments
98
fork

Configure Feed

Select the types of activity you want to include in your feed.

actual fix this time

+19 -47
+3 -1
extension/src/components/popup/App.tsx
··· 879 879 {item.target?.title || item.title || 'Untitled'} 880 880 </div> 881 881 <div className="text-xs text-[var(--text-tertiary)] truncate"> 882 - {(item.target?.source || item.source) ? new URL(item.target?.source || item.source!).hostname : ''} 882 + {item.target?.source || item.source 883 + ? new URL(item.target?.source || item.source!).hostname 884 + : ''} 883 885 </div> 884 886 </a> 885 887 <button
+16 -46
extension/src/utils/overlay.ts
··· 928 928 ): Array<{ range: Range; item: Annotation; rect: DOMRect }> { 929 929 const results: Array<{ range: Range; item: Annotation; rect: DOMRect }> = []; 930 930 931 - let caretRange: Range | null = null; 932 - try { 933 - if (typeof (document as any).caretPositionFromPoint === 'function') { 934 - const pos = (document as any).caretPositionFromPoint(x, y); 935 - if (pos) { 936 - caretRange = document.createRange(); 937 - caretRange.setStart(pos.offsetNode, pos.offset); 938 - caretRange.collapse(true); 939 - } 940 - } else if (typeof (document as any).caretRangeFromPoint === 'function') { 941 - caretRange = (document as any).caretRangeFromPoint(x, y); 942 - } 943 - } catch { 944 - /* ignore */ 945 - } 946 - 931 + const pad = 6; 947 932 for (const { range, item } of activeItems) { 948 - let hit = false; 949 - 950 - if (caretRange) { 951 - try { 952 - const afterStart = range.compareBoundaryPoints(Range.START_TO_START, caretRange) <= 0; 953 - const beforeEnd = range.compareBoundaryPoints(Range.END_TO_START, caretRange) >= 0; 954 - hit = afterStart && beforeEnd; 955 - } catch { 956 - /* ignore */ 957 - } 958 - } 959 - 960 - if (!hit) { 961 - for (const rect of range.getClientRects()) { 962 - if (x >= rect.left && x <= rect.right && y >= rect.top && y <= rect.bottom) { 963 - hit = true; 964 - break; 933 + const rects = range.getClientRects(); 934 + for (const rect of rects) { 935 + if ( 936 + x >= rect.left - pad && 937 + x <= rect.right + pad && 938 + y >= rect.top - pad && 939 + y <= rect.bottom + pad 940 + ) { 941 + if (!results.some((r) => r.item === item)) { 942 + results.push({ range, item, rect }); 965 943 } 966 - } 967 - } 968 - 969 - if (hit) { 970 - const firstRect = range.getClientRects()[0]; 971 - if (firstRect && !results.some((r) => r.item === item)) { 972 - results.push({ range, item, rect: firstRect }); 944 + break; 973 945 } 974 946 } 975 947 } ··· 985 957 ) 986 958 ) { 987 959 document.body.style.cursor = ''; 988 - if (hoverIndicator) hoverIndicator.classList.remove('visible'); 960 + if (hoverIndicator && !popoverEl) hoverIndicator.classList.remove('visible'); 989 961 return; 990 962 } 991 963 ··· 1062 1034 } 1063 1035 } else { 1064 1036 document.body.style.cursor = ''; 1065 - if (hoverIndicator && hoverIndicator.classList.contains('visible')) { 1037 + if (hoverIndicator && hoverIndicator.classList.contains('visible') && !popoverEl) { 1066 1038 if (hoverIntentTimer) clearTimeout(hoverIntentTimer); 1067 1039 hoverIntentTimer = setTimeout(() => { 1068 1040 hoverIntentTimer = null; 1069 - if (hoverIndicator) hoverIndicator.classList.remove('visible'); 1070 - }, 80); 1041 + if (hoverIndicator && !popoverEl) hoverIndicator.classList.remove('visible'); 1042 + }, 120); 1071 1043 } 1072 1044 } 1073 1045 } ··· 1117 1089 if (currentIds === newIds) { 1118 1090 popoverEl.remove(); 1119 1091 popoverEl = null; 1120 - if (hoverIndicator) hoverIndicator.classList.remove('visible'); 1121 1092 return; 1122 1093 } 1123 1094 } ··· 1137 1108 if (popoverEl) { 1138 1109 popoverEl.remove(); 1139 1110 popoverEl = null; 1140 - if (hoverIndicator) hoverIndicator.classList.remove('visible'); 1141 1111 } 1142 1112 } 1143 1113 }