this repo has no description
0
fork

Configure Feed

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

Aesthetic changes

- Icon change for "Unlisted"
- Dynamic text size for compose field depending on char count

+23 -13
+1 -1
src/components/account.css
··· 10 10 11 11 #account-container .note { 12 12 font-size: 95%; 13 - line-height: 1.5; 13 + line-height: 1.4; 14 14 } 15 15 #account-container .note:not(:has(p)) { 16 16 /* Some notes don't have <p> tags, so we need to add some padding */
+11 -2
src/components/compose.css
··· 26 26 #compose-container textarea { 27 27 width: 100%; 28 28 max-width: 100%; 29 - height: 3em; 30 - min-height: 3em; 29 + height: 4em; 30 + min-height: 4em; 31 31 max-height: 10em; 32 32 resize: vertical; 33 + line-height: 1.4; 33 34 } 35 + 36 + @media (min-width: 40em) { 37 + #compose-container textarea { 38 + font-size: 150%; 39 + font-size: calc(100% + 50% / var(--text-weight)); 40 + } 41 + } 42 + 34 43 @keyframes appear-up { 35 44 0% { 36 45 opacity: 0;
+1 -1
src/components/compose.jsx
··· 744 744 </div> 745 745 <text-expander ref={textExpanderRef} keys="@ # :"> 746 746 <textarea 747 - class="large" 748 747 ref={textareaRef} 749 748 placeholder={ 750 749 replyToStatus ··· 774 773 }} 775 774 style={{ 776 775 maxHeight: `${maxCharacters / 50}em`, 776 + '--text-weight': (1 + charCount / 140).toFixed(1) || 1, 777 777 }} 778 778 ></textarea> 779 779 </text-expander>
+1
src/components/icon.jsx
··· 44 44 'chevron-left': 'mingcute:left-line', 45 45 reply: ['mingcute:share-forward-line', '180deg', 'horizontal'], 46 46 thread: 'mingcute:route-line', 47 + group: 'mingcute:group-line', 47 48 }; 48 49 49 50 function Icon({ icon, size = 'm', alt, title, class: className = '' }) {
+1 -2
src/components/name-text.css
··· 15 15 16 16 .name-text .avatar { 17 17 vertical-align: middle; 18 - margin-right: 4px; 19 - } 18 + }
+5 -5
src/components/status.css
··· 37 37 /* STATUS PRE META */ 38 38 39 39 .status-pre-meta { 40 - line-height: 1.5; 40 + line-height: 1.4; 41 41 padding: 8px 16px 0; 42 42 opacity: 0.75; 43 43 font-size: smaller; ··· 61 61 .status { 62 62 display: flex; 63 63 padding: 16px 16px 20px; 64 - line-height: 1.5; 64 + line-height: 1.4; 65 65 align-items: flex-start; 66 66 position: relative; 67 67 } ··· 92 92 min-width: 0; 93 93 } 94 94 .status:not(.small) .container { 95 - padding-left: 16px; 95 + padding-left: 12px; 96 96 } 97 97 98 98 .status > .container > .meta { ··· 170 170 } 171 171 172 172 .status .content-container.has-spoiler .spoiler { 173 - margin: 8px 0; 173 + margin: 4px 0; 174 174 font-size: 90%; 175 175 border: 1px dashed var(--button-bg-color); 176 176 display: flex; ··· 199 199 } 200 200 201 201 .status .content { 202 - margin-top: 8px; 202 + margin-top: 2px; 203 203 } 204 204 .timeline-deck .status .content { 205 205 max-height: 50vh;
+2 -1
src/pages/notifications.css
··· 1 1 .notification { 2 2 display: flex; 3 3 padding: 16px !important; 4 - gap: 16px; 4 + gap: 12px; 5 5 } 6 6 .only-mentions .notification:not(.mention), 7 7 .only-mentions .timeline-empty { ··· 62 62 } 63 63 .notification-content p:first-child { 64 64 margin-top: 0; 65 + margin-bottom: 8px; 65 66 } 66 67 67 68 #mentions-option {
+1 -1
src/utils/visibility-icons-map.js
··· 1 1 export default { 2 2 public: 'earth', 3 - unlisted: 'unlock', 3 + unlisted: 'group', 4 4 private: 'lock', 5 5 direct: 'message', 6 6 };