laserflash / steam-chat-skin Goto Github PK

The bottom controls extend further to the right that the main content area.

This is probably due to a margin on a button

Nothing wrong with this style but would be nice to have an extra that is closer to the vanilla style.

Should be more like

• Add styled background
• better context menu opener

Already tried generating a new one.

The buttons are a bit ugly and not well defined on the chat input.

Maybe add some accent colour here.

Write documentation for the css variables (colours and others).

• easier to understand and change
• leads into users making their own colour themes

Would be great if the option can let me type in the font name myself.
I'm a Chinese user who needs Microsoft YaHei over the 'idk what it even is' terrible default font.
Thanks in advance.

Make the discord floating input an option (default) and also have a more steam like (solid, square) bar option

Chat controls are top aligned, may look better vertically centered

The scroll bar in the group chats section is visible regardless of chat focus.
This should behave like the main friends list - only be visible when focused

This is great, and I thank you for working on such a project--please continue.

First, I wanted to ask if anyone knew the CSS selector for the chat window text (when writing with someone) the small is too small and the default is too large, and I wanted to specify its size. I was unable to find the selector in the friends.original.css file.
Second, I wanted to know if there was a way to modify the message sound using a skin to only manage the message.wav?

The problem I'm having is simple, and I believe a possible bug. The only changes I have to my css at this time is the following, because it's the only thing that works:

 * {
   font-family: Arial !important;
}

Everything else makes my friends list and chat an unusable black screen or oversized icons that overlap, etc:

• https://i.imgur.com/GPK45jh.png

Thanks for any help.

This menu would look better with all text aligned on the left. This would mean the DnD option would need it's check box on the right of the text.

Enhancement

Use a GitHub action to minify css and simplify imports.

• could reduce load times
• action run on every change in master

How to complile

• All baseTheme files compile into one, this should stop any current imports breaking
• customisable css ones are only minified

Branches

Would require a dev branch and a compiled/minified branch.
If possible master should remain good readable code.

• also remember the other branch needs to support GitHub-Pages for the imports to work
  • currently master is a set up to be github pages

Currently the Light Colour Set is not very usable.

Main Issue

White text on a white background. Fixing this will make the theme usable.

Other

• Affect on offline avatars (darkening not the best)
• Different shadow affects

Maybe create the offline skinning of the Friends List

Can be skinned using the ofriends.custom.css file

https://i.imgur.com/DET1Kjo.jpg

Vs

https://i.imgur.com/8PUnTHk.jpg

APK???

Hey, I didn't really know where else to put this to ask for some help, sorry if this is the wrong place. I'm trying to change the grey areas (top & bottom areas) on the friends list to pink (255, 223, 238), but I can't seem to find anywhere within the CSS to do that, but then I'm really not very familiar with coding/CSS. Is there any possible way I can do this please?

as screenshot shows, the avatars are only taking top left part of the frames, currently

Chat is know docked as a chat setting.
However when docked if the window is made to be narrow the controls (close, minimise, maximise) are lost

Away quick access friends remain darker even when hovered over.
If hovered they should still go to full brightness

There is some merit to having the time periods marked in chat history.
Make an option to have or remove this

Now that we have a minified css output it would be good to develop with it.

This would mean having a command such as npm run build:watch, this would run the build script whenever a css file changes.

Some dev imports would be changed to dist, although the existing ones should also exist as they are better for debugging.

Currently buttons such as those in the settings Size & Scaling are purple when the active button is hovered over.

This should be changed to a more consistent colour (probably a blue)

As shown, the circular avatar of my steam friend who equipped an avatar frame, adapts to the box shape.
While my own at the top, doesn't.

Spacing for usename, game and game dsecription is bad.

Text is not centerd and is to tall.

Fix

Get rid of game detail text and vertical centre

Most of the buttons can be better.

• settings toggle buttons
• chat send button
  • nicer active and disabled states
• voice control buttons
• probably others

related: #49, #50

The Context Menu for status options doe snot follow the theme colours

SCSS allows for better structuring of code. Using this should improve code quality, and consistency of contributions.

Not sure it's entirely suitable though. Since this is hacks on top of default steam css things could get a bit odd.

If used would want a way to compile that is good for debugging (not minified)

you can see it on your site too

Can't access your website

The Create Chat button has a label where the text colour does not have enough contrast from the button colour.

is this why the skins aren't working? is it possible to change the link to a different site?

Issue

The add friends to chat covers the "Voice chatting with ..." text

Potential fixes

• Force text to wrap before hitting the icon (will make the bar taller)
• Remove the text (dosn't feel very useful)

The file I downloaded from the website was lacking quotation marks in the urls of the imports

There are blacks on the edge of this thing

pls pls pls

• Mic icon needs vertical centre
• Away friend avatar is missing background
• various background colours