Various AT Protocol integrations with obsidian
0
fork

Configure Feed

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

better source selection

+52 -19
+1 -1
src/views/atmark.ts
··· 117 117 renderProfileIcon(nav, this.plugin.profile); 118 118 119 119 const sourceSelector = header.createEl("div", { cls: "atmark-source-selector" }); 120 - const sources: SourceType[] = ["semble", "bookmark", "margin"]; 120 + const sources: SourceType[] = ["semble", "margin", "bookmark"]; 121 121 122 122 for (const source of sources) { 123 123 const label = sourceSelector.createEl("label", { cls: "atmark-source-option" });
+51 -18
styles.css
··· 30 30 display: flex; 31 31 align-items: center; 32 32 justify-content: center; 33 - gap: 6px; 33 + gap: 0; 34 34 margin-bottom: 12px; 35 - flex-wrap: wrap; 35 + border-bottom: 1px solid var(--background-modifier-border); 36 36 } 37 37 38 38 .atmark-source-option { ··· 40 40 align-items: center; 41 41 justify-content: center; 42 42 gap: 4px; 43 - padding: 4px 12px; 43 + padding: 10px 20px; 44 44 cursor: pointer; 45 45 user-select: none; 46 - border-radius: var(--radius-s); 47 - border: 1px solid var(--background-modifier-border); 48 - background: var(--background-secondary); 46 + border: none; 47 + background: transparent; 49 48 transition: all 0.15s ease; 50 - font-size: var(--font-smaller); 49 + position: relative; 50 + margin-bottom: -1px; 51 + } 52 + 53 + .atmark-source-option::after { 54 + content: ""; 55 + position: absolute; 56 + bottom: 0; 57 + left: 0; 58 + right: 0; 59 + height: 2px; 60 + background: transparent; 61 + transition: background 0.15s ease; 51 62 } 52 63 53 64 .atmark-source-option:hover { 54 65 background: var(--background-modifier-hover); 55 - border-color: var(--background-modifier-border-hover); 56 66 } 57 67 58 - .atmark-source-option:has(input:checked) { 68 + .atmark-source-option:has(input:checked)::after { 59 69 background: var(--interactive-accent); 60 - border-color: var(--interactive-accent); 61 70 } 62 71 63 72 .atmark-source-option:has(input:checked) .atmark-source-text { 64 - color: var(--text-on-accent); 73 + color: var(--interactive-accent); 74 + font-weight: var(--font-semibold); 65 75 } 66 76 67 77 .atmark-source-radio { ··· 69 79 } 70 80 71 81 .atmark-source-text { 72 - font-size: var(--font-smaller); 82 + font-size: var(--font-ui-small); 73 83 font-weight: var(--font-medium); 74 - color: var(--text-normal); 84 + color: var(--text-muted); 75 85 } 76 86 77 87 .atmark-filters { ··· 1123 1133 padding-bottom: 12px; 1124 1134 } 1125 1135 1126 - .atmark-title { 1127 - font-size: var(--font-ui-medium); 1136 + .atmark-title, 1137 + .semble-profile-icon { 1138 + display: none; 1128 1139 } 1129 1140 1130 1141 .atmark-source-option { 1131 - padding: 3px 10px; 1132 - font-size: var(--font-smallest); 1142 + padding: 8px 16px; 1143 + font-size: var(--font-ui-small); 1133 1144 } 1134 1145 1135 1146 .atmark-source-text { 1136 - font-size: var(--font-smallest); 1147 + font-size: var(--font-ui-small); 1148 + } 1149 + 1150 + .atmark-source-selector { 1151 + justify-content: center; 1137 1152 } 1138 1153 1139 1154 .atmark-grid { ··· 1145 1160 margin-bottom: 12px; 1146 1161 } 1147 1162 } 1163 + 1164 + .is-mobile .atmark-title, 1165 + .is-mobile .semble-profile-icon { 1166 + display: none; 1167 + } 1168 + 1169 + .is-mobile .atmark-source-option { 1170 + padding: 8px 16px; 1171 + font-size: var(--font-ui-small); 1172 + } 1173 + 1174 + .is-mobile .atmark-source-text { 1175 + font-size: var(--font-ui-small); 1176 + } 1177 + 1178 + .is-mobile .atmark-source-selector { 1179 + justify-content: center; 1180 + }