\n\nDoesn't happen if I install directly from [elk.zone](https://elk.zone). ",[3177,3178],{"name":3166,"color":3167},{"name":3152,"color":3153},3343,"Icon of Microsoft Store version has white background","2025-08-03T02:09:25Z","https://github.com/elk-zone/elk/issues/3343",0.75236404,{"description":3185,"labels":3186,"number":3190,"owner":3155,"repository":3156,"state":3157,"title":3191,"updated_at":3192,"url":3193,"score":3194},"### Clear and concise description of the problem\r\n\r\n*Partially copied from Discord*\r\n\r\nBack in the days Twitter has removed most of the borders or made them really faded, and it became really hard for neurodivergent folks like me, because it essentially made the app a mishmash of incoherent elements, creating a condition where my eyes are all over the place and I can't just comprehend any information on the page. Gladly they have a high contrast mode that introduced most of the borders back or made them more prominent, it also made all primary colours darker.\r\n\r\nUnfortunately, Elk suffers from the same issue, perhaps to a worse degree, even. For folks like me Elk is simply unusable: it's hard to keep my attention at any particular part of the site — I cannot focus on anything and constantly feeling lost. This is not my experience on Mastodon — with or without a custom theme.\r\n\r\n| | |\r\n|:--:|:--:|\r\n|  |  |\r\n| Regular Mastodon | Mastodon with [Modern](https://userstyles.world/style/4773/mastodon-modern) theme by Freeplay |\r\n\r\nThe reason is simple: lack of contrast and visual boundaries (via borders or backgrounds) to clearly separate the elements into their own ‘baskets’.\r\n\r\n### Suggested solution\r\n\r\nI think one of the solutions will be having a high contrast preference, which would to add borders or make them more prominent, as well as make the colours more contrast-y (darker in light mode, brighter in dark mode).\r\n\r\nHere's what Elk looks like for me after playing with CSS in DevTools for a bit (hover state locked for buttons for demonstration reasons):\r\n\r\n\r\n\r\nHere's what I did:\r\n- Changed font to Inter (Roboto also works). It already made a huge difference making text ever so slightly bolder.\r\n- The primary colours are now much darker (or lighter, where needed, like search) and prominent on slightly grey background that Elk uses.\r\n- Borders introduced to a main (feed) column. Unfortunately I wasn't able to figure out why there's a border at the top.\r\n- Borders themselves now use much darker colours.\r\n- Added on-hover backgrounds to posts and embed cards.\r\n- Added borders to embed cards and removed their default grey background.\r\n\r\nAnd here's video of me doing various stuff on the page:\r\n\r\nhttps://user-images.githubusercontent.com/10401817/213188712-949e4a50-8526-48d1-b393-671902534b71.mp4\r\n\r\n### Alternative\r\n\r\n- Total change of design? Seems too radical.\r\n- Manually fixing styles with UserStyles? This would only work for me then, while others like me have to face the same issues.\r\n- Not using Elk. This what I kinda do already... Sadly. I want to test it like all other cool kids do.\r\n\r\n### Additional context\r\n\r\nImportant note must be made that high contrast mode would not be aimed strictly at the neurodivergent folks *like me*, but primarily at the people with vision issues. Twitter does more stuff for high contrast mode, like adding underlines to every link on the site, but this would not be useful for me (maybe it can be its own toggle like in Discord).",[3187],{"name":3188,"color":3189},"c: a11y","553F0B",1295,"High contrast mode","2023-02-03T03:16:51Z","https://github.com/elk-zone/elk/issues/1295",0.7572028,{"description":3196,"labels":3197,"number":3198,"owner":3155,"repository":3156,"state":3157,"title":3199,"updated_at":3200,"url":3201,"score":3202},"I have been trying to find the rationale behind the profile metadata design, and I couldn't find any, so here are some thoughts.\r\n\r\n- Elk currently treats profile metadata in two ways, some items are shown as a list, while others are inlined and iconified in a separate block. This creates two classes of metadata items, one that belongs to a recognized category, identified by their distinct icon, and the rest.\r\n\r\n- Profile metadata is quite a remarkable space of expression. Customizable tabular information is unique in a social media profile, and we're already [seeing](https://elk.zone/assemblag.es/@evemassacre) [many](https://elk.zone/typo.social/@FontsInUse) [creative](https://elk.zone/hachyderm.io/@danhon@dan.mastohon.com) [uses](https://elk.zone/assemblag.es/@timelfen). We should rather encourage and promote this chaotic space rather than codify and dismantle.\r\n\r\n- A metadata field is [iconified](https://github.com/elk-zone/elk/blob/main/components/account/AccountHeader.vue#L63) depending on its label. This enforces a certain format but also raises some further questions. The list of acceptable labels will likely be non-exhaustive, and may be misinterpreted. Why does \"website\" has an icon, but neither \"web\" nor \"homepage\"? Why does service X has an icon, but not service Y? Is the list of icon labels language-agnostic?\r\n\r\n- As the ordering of the items follows the metadata order, the icons themselves are shown in an inconsistent fashion, varying from profile to profile, making it difficult to follow and predict. Transforming tabular data into a list of inline items also makes it harder to read, and parse.\r\n\r\n- Having iconified items also raises the [question](https://github.com/elk-zone/elk/issues/155) of verified items. Should another icon be added in this flow of icons, which could make the list harder to parse?\r\n\r\nI can see Twitter's inspiration, but the design that works with a single link and a rigid structure doesn't necessarily function with free and unpredictable information.\r\n\r\n## Proposition\r\n\r\nMy suggestion would be to entirely remove the iconified metadata list, and keep the labelled items, without substitution, as is. The \"joined at\" may either be left on its own, or moved elsewhere (top right?, in the dropdown menu?).\r\n\r\nThis being said, icons are valuable as they help recognition of a link source, especially since profile metadata are dense, and often contain multiple links.\r\n\r\nWe could add a favicon of the target website, after the link content, helping to quickly identify the source, without changing the nature of the metadata. Following these icons, we can also imagine verified links, which are currently not differentiated, to also have a check icon added, following the mentioned favicon. This configuration would allow recognition of the verification at a quick glance, the tick symbol, the favicon, and the link content being located alongside each other, something like: `[label] | [link][favicon][verified-check]`.\r\n\r\nAs there might be some icon overload, so it might preferred to only show favicons when the associated link is verified.\r\nAnother question is the credibility of favicons. Favicons are however trivially spoofable. Do we consider the combination URL/favicon/verification to be sufficient? An answer could be the use of [Google Safe Browsing](https://safebrowsing.google.com/) to exclude printing favicons for unsafe pages?\r\n\r\nWhat are your thoughts?",[],1101,"Profile metadata design","2023-03-03T05:18:24Z","https://github.com/elk-zone/elk/issues/1101",0.79155475,{"description":3204,"labels":3205,"number":3207,"owner":3155,"repository":3156,"state":3208,"title":3209,"updated_at":3210,"url":3211,"score":3212},"Coming to Elk from Twitter, I find scrolling through the feed distracting as there is too much text to the left side.\r\n\r\nElk:\r\n\r\n\u003Cimg width=\"1269\" alt=\"image\" src=\"https://user-images.githubusercontent.com/6391776/216841836-69809d50-354f-43c1-ad7a-bfd5c0f066f7.png\">\r\n\r\nTwitter:\r\n\r\n\u003Cimg width=\"688\" alt=\"image\" src=\"https://user-images.githubusercontent.com/6391776/216841881-c5842da8-fe7b-4cbe-99d7-eb19cc0c2692.png\">\r\n\r\nI want to get my Elk experience to be identical to Twitter's. So only icons visible on the side. Also hide this:\r\n\r\n\u003Cimg width=\"288\" alt=\"image\" src=\"https://user-images.githubusercontent.com/6391776/216841901-b4ce3f78-d3d8-40a1-a754-83c8ab151b0f.png\">\r\n\r\nI can do it potentially via a third party extension on top but would love to avoid doing this. An optional setting for `icons only` would be perfect.\r\n\r\nThank you.",[3206],{"name":3152,"color":3153},1642,"closed","Have an icon only sidebar mode","2023-02-06T04:13:07Z","https://github.com/elk-zone/elk/issues/1642",0.7429945,{"description":3214,"labels":3215,"number":3217,"owner":3155,"repository":3156,"state":3208,"title":3218,"updated_at":3219,"url":3220,"score":3221},"In my opinion, the logo is too wide. It looks weird next to other icons, especially as a PWA on Windows in the taskbar. The padding between the border of the SVG viewbox and the actual Elk icon. I have made a quick site that shows an idea of what I think it would be like:\r\nhttps://eddiestech.github.io/elklogocompare (left is original, right is my mock-up)\r\n\r\nHappy to get feedback and also look into guidance around spacing like this.",[3216],{"name":3152,"color":3153},1890,"Improve logo spacing/decrease width of elk","2023-03-21T11:59:26Z","https://github.com/elk-zone/elk/issues/1890",0.745195,{"description":3223,"labels":3224,"number":3229,"owner":3155,"repository":3156,"state":3208,"title":3230,"updated_at":3231,"url":3232,"score":3233},"Some emojis like the transgender flag emoji do not display right in Elk. This is probably due to it using the OS-emojis (in my case Windows which are god awful)?\r\n\r\nExample. This is how it displays in Elk:\r\n\r\n\r\nAnd here on Mastodon (using glitch-soc instance with glitch theme, but Mastodon afaik also has the same display):\r\n\r\n\r\n**Solution:**\r\nUse a unified Emoji set/provider like Twemoji.",[3225,3226],{"name":3166,"color":3167},{"name":3227,"color":3228},"p: 1-normal","BFDADC",301,"More consistent unicode emoji display","2022-12-02T22:36:23Z","https://github.com/elk-zone/elk/issues/301",0.76854265,{"description":3235,"labels":3236,"number":3239,"owner":3155,"repository":3156,"state":3208,"title":3240,"updated_at":3241,"url":3242,"score":3243},"Right now Elk uses some not so good contrast values\r\n\r\ne.g.\r\n\r\n\r\nI want to try to adjust these after @patak-dev replaced usages of `opXX` styles",[3237,3238],{"name":3188,"color":3189},{"name":3227,"color":3228},147,"Improve contrast","2022-11-30T06:33:22Z","https://github.com/elk-zone/elk/issues/147",0.77245927,{"description":3245,"labels":3246,"number":3247,"owner":3155,"repository":3156,"state":3208,"title":3248,"updated_at":3249,"url":3250,"score":3251},"the theme color doesn't get updated to match the selected theme in the Android PWA (see color of status bar at top vs app theme)\r\n\r\n\r\n\r\n---\r\n\r\nProposed solution: based on https://w3c.github.io/manifest/#theme_color-member, adding/updating the appropriate meta tag (with `name=\"theme-color\"`) when the theme is selected potentially works. Not sure if that behavior is respected by all OS's and browsers, but worth attempting 😄 \r\n\r\n---\r\n\r\nDetails:\r\n- Android 13\r\n- Pixel 6\r\n- Firefox Nightly\r\n- Elk v0.3.1 (although has existed in previous versions)",[],941,"theme color should match selected app theme in Firefox PWA","2023-01-10T20:35:36Z","https://github.com/elk-zone/elk/issues/941",0.7753843,["Reactive",3253],{},["Set"],["ShallowReactive",3256],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fkHQ8VfGcQYSTVw83Om0aU0Cda49BMhflR30I7U_A82M":-1},"/elk-zone/elk/1477"]