قالب وردپرس درنا توس
Home / Tips and Tricks / How to Make Slack's Sidebar Work on the Phone with Dark Mode «Smartphones :: Gadget Hacks

How to Make Slack's Sidebar Work on the Phone with Dark Mode «Smartphones :: Gadget Hacks



Slack recently released a Dark Mode for Android and iOS apps, which works great for the most part. Super dark gray backgrounds and light gray fonts that are far easier for the eyes than blind white backgrounds and black text. One thing is not affected by the new night mode setting: your sidebar.

If you use the new "Dark Mode" option in Slack on your iPhone or Android phone and open the sidebar, this may shock you to see that the background is still white, purple, green, or whatever is. Certainly not black or super dark gray. On Android, this also applies to the top bar, which displays your workspace and your search.

The sidebar is not changed by Slack's dark theme because the sidebar is a customizable animal. Background colors, font colors, badge shades and more can be customized to your liking. You can either use one of Slack's default color schemes or use custom sidebar designs. Since you're adjusting that color, Slack thinks you do not want it to be changed with the higher contrast setting.

The key to the real app-wide dark mode in Slack included these custom sidebar themes. We've already shown how to design custom themes on an iPhone or Android phone ̵

1; something that is not directly possible in the mobile app.

Step 1: Find the custom settings

How to preserve the dark mode theme If you set custom colors, you must change the hex codes for the Column Background Color and Text Color options. These are the biggest ones that need to be addressed. You can play with the others to get them the way you like them, but the background and the text of the column make up 90% of the sidebar.

For convenience, you can simply use the custom design that I designed with Slack's dark design colors as the basis for some of them. Just copy the following hex codes and paste them in the box under each color picker. If you want to customize the colors to your liking, you can do this manually with steps 2 and 3.

  # 1B1D21, # 474747, # 446680, # D1D2D2, # 474747, # D1D2D2, # 2b7a58, # 266aa6 

Step 2: Change the background color of the column

If you have the six-digit hexadecimal color code for the background In the sidebar, tap in the drawing field under "Column BG". If not, tap the color in the box, and then select the color using the color picker.

Since you want a dark background, you can make a black line with # 000000 or imitate the dark gray color of Slack (1B1D21). The middle dark gray it uses would be # 212428) but in my example below # 141414 (19659013). How to Use Slack's Sidebar with the Dark Mode on Your Phone ” width=”532″ height=”532″ style=”max-width:532px;height:auto;”/>

Step 3: Change the Column's Text Color

Now do the same thing for the font color, but choose a light gray color. Slack uses # D1D2D2 for the light gray text. Feel free with it. At # C7C7C7 I got a bit darker in my example below. This changes both plain text and bold text if an unread message exists in a channel, in a thread, or in a direct message.

Step 4: Have fun with your App-Wide Dark Mode

Try it now. Open your Slack app and swipe right or tap the Slack icon to open the sidebar. It should match the look of Slack's official "Dark Mode" button.

And remember, any topic you choose for the sidebar will also apply to other Slack versions you use, including the desktop browser MacOS app, Windows app, or Linux app. App.

Do not Miss: Other apps for Android and iOS for which you can enable the dark mode

Justin Meyer's Cover Pictures and Screenshots / Gadget Hacks [19659022]

Source link