├── README.md └── friends.custom.css /README.md: -------------------------------------------------------------------------------- 1 | ## Work in Progress 2 | 3 | Friends/Chat theme for use with [OG-Steam skin](https://github.com/ungstein/OG-Steam) and 4 | [OG-Steam-Library](https://github.com/ungstein/OG-Steam) and [SteamFriendsPatcher](https://github.com/PhantomGamers/SteamFriendsPatcher). 5 | 6 | ## How to Installation 7 | 8 | step 1: enable steam beta and close steam 9 | 10 | step 2: put friends.custom.css in ~\Steam\clientui 11 | 12 | step 3: launch steamfriendspatcher with steam beta option on 13 | 14 | 15 | ## credits 16 | 17 | 18 | [@ungstein](https://github.com/ungstein) - original theme idea 19 | 20 | [@RoseTheFlower](https://github.com/RoseTheFlower) - chat theme base 21 | 22 | [@PhantomGamers](https://github.com/PhantomGamers) - patching the friends 23 | 24 | ![ss+(2021-04-20+at+09 06 35)](https://user-images.githubusercontent.com/49638699/115345681-d0da8100-a1b7-11eb-8387-043778fca02d.png) 25 | 26 | 27 | -------------------------------------------------------------------------------- /friends.custom.css: -------------------------------------------------------------------------------- 1 | :root{ 2 | --focus: 0, 114, 198; /*default blue accent*/ 3 | --clientBG: 76, 88, 68; 4 | --header_dark: 61, 71, 55; 5 | --online: 93, 178, 255; 6 | --ingame: 130, 186, 0; 7 | --offline: 145, 145, 145; 8 | --golden: 255, 255, 99; 9 | --scrollbarSize: 15px; 10 | --scrollbarBG: 32, 32, 32; 11 | --textentry: 61, 71, 55; 12 | --white05: 255,255,255,.05; 13 | --white10: 255,255,255,.1; 14 | --white50: 255,255,255,.5; 15 | --white75: 255,255,255,.75; 16 | --white: 255, 255, 255; 17 | --border: 61,71,55; 18 | --textentrybuttons: 200, 200, 200; 19 | } 20 | 21 | /* Experimental Metro White theme color values: 22 | --focus: 0, 114, 198; 23 | --clientBG: 230,230,230; 24 | --header_dark: 255,255,255; 25 | --online: 66, 104, 255; 26 | --ingame: 94, 150, 15; 27 | --offline: 0, 0, 0, .45; 28 | --golden: 255, 255, 99; 29 | --scrollbarSize: 15px; 30 | --scrollbarBG: 0,0,0,.05; 31 | --textentry: 207,207,207; 32 | --white05: 0,0,0,.05; 33 | --white10: 0,0,0,.1; 34 | --white50: 0,0,0,.5; 35 | --white75: 0,0,0,.75; 36 | --white: 0,0,0; 37 | --border: 160,160,160; 38 | --textentrybuttons: 35,50,50; 39 | */ 40 | 41 | /* remove animations, round corners and delays */ 42 | *{ 43 | box-shadow: none !important; 44 | border-radius: 0 !important; 45 | transition: none !important; 46 | transition-duration: 0ms !important; 47 | text-shadow: none !important; 48 | font-family: "Motiva Sans", Arial, Helvetica, sans-serif; 49 | text-shadow: 0 0 3px black; 50 | } 51 | 52 | /* User's name and status */ 53 | .currentUserContainer .labelHolder { 54 | justify-content: center !important; 55 | margin-right: 12px!important; 56 | } 57 | 58 | .currentUserContainer .personanameandstatus_richPresenceLabel_3Q6g1{ 59 | -webkit-app-region: drag!important; 60 | } 61 | 62 | /* Top friends list border */ 63 | .currentUserContainer{ 64 | border-bottom: 1px solid rgb(var(--border)) !important; 65 | } 66 | 67 | /* Friends list window*/ 68 | .friendlistListContainer{ 69 | background: rgb(var(--clientBG)) !important; 70 | } 71 | 72 | /* Top friends list panel bg*/ 73 | .friendListHeaderContainer, .friendsListSectionTitle { 74 | background-color: rgb(var(--header_dark)) !important; 75 | } 76 | /* Bottom panel bg*/ 77 | .friendListFooter { 78 | background-color: rgb(var(--clientBG)) !important; 79 | min-height:15px!important; 80 | } 81 | 82 | /* Top Panel Avatar Effect*/ 83 | .statusHeaderGlow{ 84 | opacity: 0 !important; 85 | } 86 | /* Top Panel Focus Effect*/ 87 | .title-area-highlight{ 88 | height:0!important; 89 | } 90 | 91 | /*Top Panel Focus Line*/ 92 | .singleWindowFocusBar { 93 | height: 0px !important; 94 | background: rgb(var(--clientBG)) !important; 95 | mask: none !important; 96 | -webkit-mask: none !important; 97 | } 98 | 99 | /* Online Friends header */ 100 | .onlineFriends .groupHeaderContainer{ 101 | background: rgb(var(--clientBG)) !important; 102 | } 103 | /* Offline Friends header */ 104 | .offlineFriends .groupHeaderContainer{ 105 | background: rgb(var(--clientBG)) !important; 106 | } 107 | 108 | /* Remove each category header margin */ 109 | .FriendsListContent .friendlistListContainer .friendGroup{ 110 | border-top: none !important; 111 | margin-top: 1px !important; 112 | } 113 | 114 | /* PlusMinus Friends Header */ 115 | .friendGroup.offlineFriends .groupName .groupCount, 116 | .friendGroup.onlineFriends .groupName .groupCount, 117 | .friendGroup .groupName .groupCount.collapsed{ 118 | color: rgb(var(--white)) !important; 119 | } 120 | 121 | /*Number of friends in a category*/ 122 | .friendGroup .groupName .groupCount{ 123 | color: rgb(var(--white)) !important; 124 | margin-top: 0px !important; 125 | } 126 | .groupName{ 127 | color: rgb(var(--white)) !important; 128 | font-size:12px !important; 129 | text-transform: uppercase !important; 130 | margin-bottom: -3px!important;} 131 | 132 | .friendGroup .groupName{ 133 | margin-top: 0px!important;} 134 | 135 | .groupName .gameGroupContainer .groupIcon { 136 | margin-left: 2px!important;} 137 | 138 | /* PlusMinus Friends Header Color*/ 139 | .ExpandPlusMinus .SVGIcon_PlusCircle .horizontalLine, 140 | .ExpandPlusMinus .SVGIcon_PlusCircle .verticalLine{ 141 | stroke: rgb(var(--white)) !important; 142 | } 143 | 144 | .ExpandPlusMinus { 145 | margin-top: 2px!important;} 146 | 147 | /* zzz icon next to friends' names on the list */ 148 | .listContentContainer .friendsnooze_SnoozeContainer_1OfTa{ 149 | display: none!important; 150 | } 151 | .friendsnooze_SnoozeContainer_1OfTa.in-game .friendsnooze_SnoozeZ_29fyi{ 152 | color: rgb(var(--ingame))!important;} 153 | 154 | .friendsnooze_SnoozeContainer_1OfTa.online.friendsnooze_Dim_10sPU .friendsnooze_SnoozeZ_29fyi, .friendsnooze_SnoozeContainer_1OfTa.online .friendsnooze_SnoozeZ_29fyi{ 155 | color: rgb(var(--online))!important;} 156 | 157 | /* Remove useless "Watch Broadcast" text */ 158 | .friendsContainer .watchingbroadcast .richPresenceContainer .gameName, 159 | .friendlistListContainer .watchingbroadcast .richPresenceContainer .gameName{ 160 | position: absolute !important; 161 | opacity: 0 !important; 162 | } 163 | /* X unread Message in Friends Panel */ 164 | .unreadMessageViolator{ 165 | background: rgb(var(--clientBG)) !important; 166 | color: rgb(var(--focus)) !important; 167 | width: calc(100% - 2px)!important; 168 | border: 0 !important; 169 | right: 0px !important; 170 | left: 0px !important; 171 | z-index: 2!important; 172 | } 173 | /* Make chat screenshots small at startup */ 174 | .chatImageFull{ 175 | width: 120px !important; 176 | /* height: 150px !important; */ 177 | } 178 | .chatImageContainer img { /* the container might be a bit buggy but not important*/ 179 | min-width: 100% !important; 180 | min-height: 100% !important; 181 | } 182 | 183 | /* Fix for each friend list to have correct hover height including the rich presence */ 184 | .CompactFriendsList .friend, 185 | .CompactFriendsList .friendGroup .friend, 186 | .CompactFriendsList .friendGroup .SteamPlayerGroupFooter, 187 | .CompactFriendsList .friendGroup.gameGroup:not( .OtherGamesGroup ) .friend{ 188 | padding: 4px 0 8px 12px !important; 189 | } 190 | 191 | /* Friends list items hover colors */ 192 | .friendStatusHover.online:hover, 193 | .friendStatusHover.online.Friend_ContextMenuActive{ 194 | background-color: rgba(var(--white05)) !important; 195 | } 196 | 197 | .friendStatusHover.ingame:hover, 198 | .friendStatusHover.ingame.Friend_ContextMenuActive{ 199 | background-color: rgba(var(--white05)) !important; 200 | 201 | } 202 | 203 | .friendStatusHover.offline:hover, 204 | .friendStatusHover.offline.Friend_ContextMenuActive{ 205 | background-color: rgba(var(--white05)) !important; 206 | 207 | } 208 | 209 | .friendStatusHover.watchingbroadcast:hover, 210 | .friendStatusHover.watchingbroadcast.Friend_ContextMenuActive{ 211 | background-color: rgba(var(--white05)) !important; 212 | } 213 | 214 | .friendStatusHover.golden:hover, 215 | .friendStatusHover.golden.Friend_ContextMenuActive{ 216 | background-color: rgba(var(--white05)) !important; 217 | } 218 | 219 | /*Group chats hover*/ 220 | .ChatRoomListGroupItem:hover { 221 | background-color: rgba(var(--white05)) !important; 222 | } 223 | 224 | /* Avatar status boxes */ 225 | .avatarHolder .avatarStatus { 226 | display: none !important;} 227 | 228 | .miniprofile_miniProfileContent_25Sge .miniprofile_playerAvatar_1dzWG .steamavatar_avatar_f2laR { 229 | border: none !important;} 230 | 231 | .offline .steamavatar_avatar_f2laR { 232 | border: 1px solid rgb(var(--offline))!important; 233 | } 234 | 235 | .online .steamavatar_avatar_f2laR { 236 | border: 1px solid rgb(var(--online))!important; 237 | } 238 | 239 | .ingame .steamavatar_avatar_f2laR { 240 | border: 1px solid rgb(var(--ingame))!important;} 241 | 242 | .watchingbroadcast .steamavatar_avatar_f2laR { 243 | border: 1px solid #c9bdf7!important;} 244 | 245 | .golden .steamavatar_avatar_f2laR { 246 | border: 1px solid rgb(213, 191, 106)!important;} 247 | } 248 | 249 | .chattabs_ChatTab_1WfqA .chattabs_ChatTabContent_Friend_3m7Ps, .chattabs_ChatTabContent_ChatRoomName_2avXT{ 250 | opacity: 1!important; 251 | } 252 | 253 | /* Icons on the friends panel */ 254 | .friendRequestButton .SVGIcon_FriendRequest .friendBodyFull, 255 | .friendRequestButton .SVGIcon_FriendRequest .friendHead, 256 | .friendRequestButton .SVGIcon_FriendRequest .friendArm, 257 | .friendRequestButton .SVGIcon_FriendRequest .friendBody, 258 | .addFriendButton .SVGIcon_AddFriend .friendHead, 259 | .addFriendButton .SVGIcon_AddFriend .friendBody, 260 | .addFriendButton .SVGIcon_AddFriend .plusCircle, 261 | .friendsListSectionTitle .SVGIcon_NewChatGroup { 262 | fill: rgb(var(--white)) !important; 263 | } 264 | .friendsListSectionTitle, 265 | .activeTab { 266 | color: rgb(var(--white)) !important; 267 | background-color: rgb(var(--clientBG)) !important; 268 | } 269 | .TabSearchButton .ColorSelector { 270 | fill: rgb(var(--white)) !important; 271 | } 272 | 273 | /* Remove Friends List Top Shadow */ 274 | .insetshadow_FriendListInsetShadowTop_1mEmL, .insetshadow_FriendListInsetShadowBottom_3cl4u { 275 | background: none !important; 276 | } 277 | 278 | /* Remove Playing with X amount of people */ 279 | .SteamPlayerGroupFooterLabel { 280 | display:none !important; 281 | } 282 | .friend.firstInGroup .SteamPlayerGroupLines, 283 | .friend.inGroup .SteamPlayerGroupLines, 284 | .friend.lastInGroup .SteamPlayerGroupLines, 285 | .SteamPlayerGroupFooter .SteamPlayerGroupLines { 286 | display: none !important; 287 | } 288 | 289 | .SteamPlayerGroupFooterCount .count { 290 | position: absolute!important; 291 | margin-top: -50px!important; 292 | color: rgba(var(--ingame),1)!important; 293 | font-size: 14px!important; 294 | line-height: 14px!important; 295 | right: 27px!important; 296 | text-align: left!important; 297 | } 298 | 299 | .CompactFriendsList .SteamPlayerGroupFooterCount .count { 300 | display:none!important; 301 | } 302 | 303 | /* Remove heightspace after each friend item */ 304 | .friendGroup .SteamPlayerGroupFooter{ 305 | position: absolute !important; 306 | } 307 | /* Remove waste of space after categorized games */ 308 | .CompactFriendsList .friendsContainer{ 309 | padding: 0 !important; 310 | } 311 | 312 | .chatWindow{ 313 | background: rgb(var(--clientBG)) !important; 314 | font-size: 13px !important; 315 | } 316 | .chatRoomListContainer { 317 | background: rgb(var(--clientBG)) !important;} 318 | 319 | .titleBarContainer.ChatTabs { 320 | background: rgb(var(--header_dark)) !important; 321 | border: none!important; 322 | } 323 | .chatEntryControls{ 324 | background-color: rgb(var(--textentry)) !important; 325 | } 326 | 327 | /* Avatar status inside the chat tabs context menu */ 328 | .chattabs_ChatTabContent_Friend_3m7Ps .avatarHolder .avatarStatus{ 329 | height: 107% !important; 330 | margin: -1px 1px !important; 331 | z-index: -1 !important; 332 | } 333 | 334 | .ChatTabsContextMenu .ChatTabContextMenuItem { 335 | padding: 0!important; } 336 | 337 | .ScrollToBottomButton{ 338 | padding-top: 0px !important; 339 | color: rgb(var(--white)) !important; 340 | z-index: 13!important; 341 | } 342 | .ScrollToBottomButton > span{ 343 | width: 100% !important; 344 | background: rgb(var(--header_dark)) !important; 345 | } 346 | 347 | .ScrollToBottomButton.UnreadMessages > span { 348 | color: rgb(var(--focus))!important;} 349 | 350 | /* Favorites List Unread Indicator */ 351 | .quickAccessFriends.compactQuickAccess .friend.quickAccessFriend .ChatUnreadMessageIndicator .chatUnreadCircle{ 352 | top: -4px !important; 353 | height: 2px !important; 354 | width: 100%!important; 355 | } 356 | 357 | .quickAccessFriends:not(.compactQuickAccess) .friend.quickAccessFriend .ChatUnreadMessageIndicator .chatUnreadCircle{ 358 | left: 3px !important; 359 | top: -4px !important; 360 | height: 2px !important; 361 | width: calc(100% - 6px)!important; 362 | } 363 | 364 | .Collapsed .chatSectionTitle .ChatUnreadMessageIndicator .chatUnreadCircle { 365 | background-color: transparent!important;} 366 | 367 | .ChatUnreadMessageIndicator .chatUnreadCircle { 368 | background-color: rgb(var(--focus))!important; 369 | border-radius: 3px!important; 370 | width: 6px!important; 371 | height: 6px!important;} 372 | 373 | .chatHeader { 374 | background: rgb(var(--clientBG))!important; 375 | min-height: 0px !important; 376 | border-top: 1px solid rgb(var(--border))!important; 377 | } 378 | .chatTabList .chattabs_ChatTab_1WfqA, .ChatTabsBackButton { 379 | background: rgb(var(--clientBG)) !important; /*rgba(var(--white05))*/ 380 | margin-right: 1px!important; 381 | border: 0!important; 382 | /*border-bottom: 1px solid rgb(var(--focus)) !important;*/ 383 | } 384 | 385 | .chattabs_ChatTab_1WfqA { 386 | background: rgb(var(--clientBG)) !important; 387 | padding-right: 5px!important; 388 | } 389 | 390 | .chatEntry { 391 | background: rgb(var(--textentry)) !important; 392 | padding: 0px!important; 393 | } 394 | 395 | .chatentry_chatSubmitButton_3VRfL.chatentry_disabled_2p2vW, 396 | .chatentry_chatSubmitButton_3VRfL.chatentry_EmbedButton_1vvRh, 397 | .chatentry_chatSubmitButton_3VRfL.chatentry_EmoticonPickerButton_3fgX0 { 398 | background-color: rgb(var(--textentry)) !important; 399 | } 400 | .VoiceToggle.Inactive:hover, 401 | .chatentry_chatSubmitButton_3VRfL.chatentry_EmbedButton_1vvRh:hover, 402 | .chatentry_chatSubmitButton_3VRfL.chatentry_EmoticonPickerButton_3fgX0:hover, .chatentry_chatSubmitButton_3VRfL:hover { 403 | background-color: rgba(var(--white05)) !important; 404 | cursor: default!important;} 405 | 406 | .ChatMessageEntryVoice { 407 | background-color: rgb(var(--textentry)) !important; 408 | color: rgba(var(--white)) !important; 409 | max-width: 46px !important; 410 | margin-left: 0px !important; 411 | } 412 | .ChatMessageEntryVoice.Disabled { 413 | opacity: .2; 414 | border: 0px solid transparent!important; 415 | outline: 0px solid transparent !important; } 416 | 417 | .chatentry_chatSubmitButton_3VRfL { 418 | position: relative; 419 | background-color: rgb(var(--textentry)) !important; 420 | border: 0px solid #1b1c20 !important; 421 | margin-top: 0px !important; 422 | margin-bottom: 2px!important; 423 | min-width: 32px!important; 424 | min-height: 35px!important; 425 | cursor: default!important; 426 | } 427 | 428 | .chatWindow .chatEntry > .compactableHeight { 429 | height: 39px !important; } 430 | 431 | .VoiceToggle { 432 | height: 36px!important; 433 | border: 0px transparent !important; 434 | } 435 | 436 | .VoiceToggleIconCtn { 437 | height: 24px!important; 438 | top: 7px!important; } 439 | 440 | .chatEntry .activeVoiceFlexBox { 441 | height: 28px!important; } 442 | 443 | .SVGIcon_Submit, .chatentry_EmoticonPickerButton_3fgX0 .SVGIcon_Emoticon { 444 | width: 20px!important; 445 | height: 20px!important; 446 | margin-top: 5px!important; 447 | margin-bottom: 2px!important; } 448 | 449 | .chatentry_EmbedButton_1vvRh .SVGIcon_Paperclip { 450 | width: 20px!important; 451 | height: 20px!important; 452 | margin-top: 4px!important; 453 | margin-bottom: 2px!important; } 454 | 455 | .ChatMessageEntryVoice .activeVoiceButtons button { 456 | max-width: 28px!important; 457 | min-width: 28px!important; 458 | min-height: 28px!important; 459 | max-height: 28px!important; 460 | margin-top: 2px!important; } 461 | 462 | .ChatMessageEntryVoice .activeVoiceButtons { 463 | width: 64px!important; } 464 | 465 | .ChatMessageEntryVoice .activeVoiceControls { 466 | width: 64px !important; } 467 | 468 | .ChatMessageEntryVoice.Active { 469 | min-width: 114px!important; 470 | max-width: 114px!important; 471 | width: 114px!important; } 472 | 473 | .ChatMessageEntryVoice.pushToTalkEnabled .activeVoiceButtons { 474 | margin-top: -2px!important; } 475 | 476 | .ChatMessageEntryVoice.pushToTalkEnabled .VoiceControlPanelButton { 477 | min-height: 14px!important; } 478 | 479 | .ChatMessageEntryVoice.pushToTalkEnabled .activeVoiceButtons .SVGIcon_Button.SVGIcon_Shadow { 480 | top: 2px!important; } 481 | 482 | .ChatMessageEntryVoice .activeVoicePushToTalk { 483 | top: 18px!important; 484 | right: 0px!important; 485 | width: 66px!important; 486 | text-align: center!important; 487 | color: #74c069; 488 | background-color: #0000; } 489 | 490 | .VoiceToggle, 491 | .chatTextarea { 492 | background: rgb(var(--textentry))!important; 493 | } 494 | 495 | .ChatMessageBlock.SingletonMsg .FriendChatTimeStamp { 496 | background: none!important; 497 | } 498 | .chatentry_chatSubmitButton_3VRfL.chatentry_disabled_2p2vW{ 499 | margin-left: -1px !important; 500 | display:none!important; 501 | } 502 | 503 | .contextmenu_contextMenu_3_a2Z { 504 | border: 1px solid rgb(var(--border)); 505 | background: rgb(var(--clientBG)) !important; 506 | box-shadow: none!important; 507 | padding: 0px!important; 508 | } 509 | .contextmenu_contextMenuItem_CBC-y:hover, .contextmenu_contextMenuItem_CBC-y.contextmenu_active_3vYUp { 510 | background: rgba(var(--white05)) !important; 511 | } 512 | 513 | /* ============================= */ 514 | 515 | /* Global Dialogs */ 516 | .DialogContent, .DialogContentTransition{ 517 | background: rgb(var(--clientBG)) !important; 518 | } 519 | .DialogSlider_Value{ 520 | background: rgb(var(--focus)) !important; 521 | } 522 | .DialogSlider_Grabber{ 523 | background: rgba(var(--white75)) !important; 524 | } 525 | 526 | button.DialogButton:not(.Off) { 527 | background: rgb(var(--focus)) !important; 528 | } 529 | button.DialogButton:hover { 530 | background: rgb(81,81,81) !important; 531 | } 532 | button.DialogButton:disabled, 533 | button.DialogButton:disabled:hover{ 534 | background: rgb(var(--header_dark)) !important; 535 | } 536 | .DialogCheckbox path { 537 | stroke: rgb(var(--white)) !important; 538 | } 539 | 540 | button.DialogButton.roleButton.owner:disabled { 541 | background-color: rgb(var(--header_dark)) !important; 542 | } 543 | 544 | .Disabled .DialogOnOffToggle_Option.Active { 545 | background-color: #4f4f4f!important; 546 | } 547 | .DialogDropDownMenu._DialogInputContainer { 548 | border: 1px solid #383535!important; 549 | background: rgb(var(--header_dark)) !important; 550 | } 551 | 552 | ._DialogInputContainer .DialogDropDown_Arrow .SVGIcon_DownArrowContextMenu{ 553 | fill: rgba(var(--white75)) !important; 554 | } 555 | ._DialogInputContainer{ 556 | color: rgb(140,140,140)!important;} 557 | 558 | ._DialogTextInputBase, ._DialogInputContainer{ 559 | background: rgb(var(--clientBG))!important;} 560 | 561 | .DialogDropDown._DialogInputContainer{ 562 | color: rgba(var(--white75))!important; 563 | padding:3px 5px!important; 564 | border: 1px solid rgb(53,53,53)!important;} 565 | 566 | .DialogDropDown._DialogInputContainer:hover{ 567 | border: 1px solid rgb(81,81,81)!important;} 568 | 569 | .DialogDropDown_Arrow{ 570 | top: 5px!important;} 571 | 572 | .Dialog_EditNickName .friend.online ._DialogTextInputBase, .Dialog_ChangePersonaName .friend.online ._DialogTextInputBase{ 573 | border: 1px solid rgb(53,53,53)!important; 574 | color: rgba(var(--white75)) !important; 575 | background: rgb(39,39,39) !important;} 576 | 577 | .DialogDropDown{ 578 | cursor:initial!important;} 579 | 580 | .DialogLabel, .DialogLabelStrong{ 581 | text-transform: none!important;} 582 | 583 | .DialogDropDown_Arrow .SVGIcon_DownArrowContextMenu{ 584 | fill: none!important;} 585 | 586 | button.DialogButton, 587 | .DialogOnOffToggle_Option:hover:not( .Active ) { 588 | background: #4c4c4c; 589 | } 590 | .DialogOnOffToggle_Control { 591 | background: #343434!important 592 | } 593 | .DialogOnOffToggle_Control .Active{ 594 | background: rgb(var(--focus)) !important; 595 | } 596 | 597 | .DialogLabel, 598 | .DialogLabelStrong{ 599 | color: rgb(140,140,140) !important; 600 | } 601 | .DialogCheckbox_Container{ 602 | padding: 0 !important; 603 | } 604 | 605 | ._DialogLayout:not(.DialogButton):not(.DialogContent) { 606 | background: none !important; 607 | } 608 | 609 | .PagedSettingsDialog_PageListColumn{ 610 | background: rgb(var(--header_dark)) !important; 611 | padding-left: 0px !important; 612 | min-width: 205px!important; 613 | } 614 | .PagedSettingsDialog_Title{ 615 | color: rgb(var(--white))!important; 616 | font-size: 18px!important; 617 | text-transform: none!important; 618 | margin-left: 15px!important; 619 | margin-top: -3px!important; 620 | font-weight: 200!important;} 621 | 622 | .DialogHeader{ 623 | color: rgb(var(--white))!important; 624 | font-size: 18px!important; 625 | text-transform: none!important; 626 | letter-spacing: 0px!important;} 627 | 628 | .PagedSettingsDialog_PageListItem{ 629 | text-transform: none!important; 630 | font-size: 14px!important; 631 | margin-bottom: 3px!important; 632 | padding: 5px 15px !important; 633 | cursor: initial!important;} 634 | 635 | .PagedSettingsDialog_PageListItem.Active{ 636 | background-color:rgb(76,76,76)!important;} 637 | .PagedSettingsDialog_PageListItem:not(.Active):hover{ 638 | color:#969696!important;} 639 | 640 | .ModalPosition_TopBar{ 641 | height: 0!important;} 642 | .DialogOnOffToggle_Option:hover:not(.Active) { 643 | background: rgb(75,75,75)!important;} 644 | .DialogCheckbox .SVGIcon_DialogCheck{ 645 | overflow: rgb(var(--white))!important;} 646 | .FriendsSettingsNotificationRow{ 647 | background-color: transparent!important; 648 | color: rgb(140,140,140)!important; 649 | } 650 | 651 | .MemberListColumn.MemberListViewCompact ::-webkit-scrollbar { 652 | /* Don't show the scrollbar in compact mode (but container remains scrollable) */ 653 | width: 0 !important; 654 | background: transparent !important; } 655 | 656 | /* scroll bar*/ 657 | ::-webkit-scrollbar{ 658 | width: var(--scrollbarSize) !important; 659 | } 660 | .ChatTabs ::-webkit-scrollbar-thumb { 661 | background-color: transparent!important;} 662 | ::-webkit-scrollbar-thumb{ 663 | border-radius: 0px !important; 664 | background: rgba(var(--white05)) !important; 665 | border: 0px solid #131313!important; 666 | } 667 | 668 | .chatWindow ::-webkit-scrollbar, 669 | .friendlist ::-webkit-scrollbar{ 670 | background: rgb(var(--clientBG)) !important; 671 | width: var(--scrollbarSize) !important; 672 | } 673 | /* scroll bar button */ 674 | ::-webkit-scrollbar-button { 675 | height: 16px!important; 676 | border-radius: 0px!important; 677 | background-color: none!important; 678 | border: 2px solid transparent!important; 679 | } 680 | 681 | /* disables scroll buttons at settings */ 682 | .DialogBody::-webkit-scrollbar-button { 683 | display:none!important; 684 | } 685 | 686 | ::-webkit-scrollbar-button:hover { 687 | background-color: rgba(var(--white05)) !important; 688 | } 689 | 690 | /* Remove the following sections when on Linux or Mac */ 691 | 692 | /* arrow buttons at scroll bar */ 693 | /* Down */ 694 | ::-webkit-scrollbar-button:vertical:increment { 695 | background-image: url(https://i.imgur.com/MSeJirr.png)!important; 696 | background-repeat: no-repeat!important; 697 | background-position: 0px 0px!important; 698 | } 699 | /* Up */ 700 | ::-webkit-scrollbar-button:vertical:decrement { 701 | background-image: url(https://i.imgur.com/U6H0Z62.png)!important; 702 | background-repeat: no-repeat!important; 703 | background-position: 0px 0px!important; 704 | } 705 | 706 | /* Remove the above sections when on Linux or Mac */ 707 | 708 | /* background behind scrollbar */ 709 | ::-webkit-scrollbar-track { 710 | background-color:none!important; 711 | } 712 | /* hovering for the scrollbar itself */ 713 | ::-webkit-scrollbar-thumb:hover { 714 | background-color: rgba(var(--white10))!important; 715 | border-radius: 0px!important; 716 | } 717 | 718 | .multiChatDialog{ 719 | border: 1px solid rgb(var(--border))!important;} 720 | 721 | /* ======== Friend Panel Group ======== */ 722 | .friendsListSectionTitle.chatSectionTitle .groupChatSectionTitle{ 723 | position: absolute !important; 724 | left: 15px !important; 725 | } 726 | /* Groups chat selected category on servers */ 727 | .chatRoomTextChannel.ActiveTextChannel { 728 | background: rgb(var(--header_dark)) !important; 729 | } 730 | /* friend search input box */ 731 | .friendSearchInput[type="text"]:focus, 732 | .friendSearchInput[type="text"] { 733 | background-color: rgb(var(--clientBG)) !important;} 734 | /* Random stuff from groups area on friends list */ 735 | .chatRoomVoiceChannel.ActiveVoiceChannel { 736 | background-color: #191b1b !important; 737 | } 738 | .ChatRoomListGroupItem .openGroupButton:hover { 739 | background-color: #2f2e2e !important; 740 | } 741 | /* Voice control */ 742 | .activeVoiceControls { 743 | background:transparent!important; 744 | border-image:none!important; 745 | border-color:rgb(0,163,0)!important; 746 | } 747 | .OneOnOneVoiceStatusLabel{ 748 | color:rgb(0,163,0)!important; 749 | margin-top: 1px!important; 750 | overflow: hidden!important;} 751 | 752 | .OneOnOneVoiceActive{ 753 | background:rgb(var(--header_dark)) !important; 754 | border-bottom: 1px solid rgb(var(--border))!important; 755 | } 756 | /* Change cursor at groups */ 757 | .voiceRoomDragBar { 758 | cursor: initial !important; 759 | } 760 | 761 | /* Group chats List Height remake */ 762 | .chatRoomListContainer[style="height: 0px; max-height: 0px; min-height: 0px;"] { 763 | display: none !important; 764 | } 765 | .chatRoomListContainer[style*="height: 150px; max-height: 222px; min-height: 0px;"] { 766 | height: 100em !important; 767 | max-height: 100em !important; 768 | min-height: 100em !important; 769 | } 770 | .chatRoomListContainer { 771 | z-index: 20 !important; 772 | height: 100em !important; 773 | max-height: 100% !important; 774 | width: 100%!important; 775 | } 776 | 777 | /* Friends remove height and remake height */ 778 | .friendlistListContainer { 779 | min-height: 0px!important; 780 | } 781 | .chatRoomListContainer[style*="height: 150px; max-height: 222px; min-height: 0px;"] { 782 | height: 100em !important; 783 | max-height: 100em !important; 784 | } 785 | /* Group chats Button Clickable Area */ 786 | .ToggleGroupChatList { 787 | position: absolute !important; 788 | z-index: 11 !important; 789 | right: 50px !important; 790 | width: 100% !important; 791 | height: 30px !important; 792 | opacity: 1 !important; 793 | } 794 | 795 | .Collapsed .ToggleGroupChatList svg{ 796 | display: none !important; 797 | } 798 | 799 | .FriendsListChatSection.ChatRoomListContainerParent .ToggleGroupChatList .SVGIcon_DoubleArrow{ 800 | width: 123px!important; 801 | height: 8px!important; 802 | margin-top: 11px!important;} 803 | 804 | 805 | /* chat window message entry box */ 806 | .chatentry_chatEntryControls_2O_X7 { 807 | background-color: rgb(var(--textentry)) !important; 808 | padding-right: 0px !important; 809 | color: rgb(var(--white))!important; 810 | } 811 | /*the box where you type*/ 812 | .chatentry_chatTextarea_3e__5 { 813 | font-size: 13px !important; 814 | background-color: rgb(var(--textentry)) !important; 815 | height: 29px !important; 816 | padding: 5px 5px 5px 5px!important; 817 | color: rgb(var(--white))!important; 818 | } 819 | 820 | .compactView .chatentry_chatEntryControls_2O_X7 .chatentry_chatSubmitButton_3VRfL { 821 | margin-bottom: 0px !important; } 822 | .chatEntry.compactView .chatentry_chatSubmitButton_3VRfL svg{ 823 | height: 20px !important; 824 | margin-top: 5px !important; 825 | } 826 | 827 | .ChatTabs.compactView .friend .personanameandstatus_richPresenceLabel_3Q6g1 { 828 | line-height: 13px !important; 829 | font-size: 12px !important; 830 | margin-top: 1px !important } 831 | 832 | .ChatTabs.compactView .chatTabList .chatTab, 833 | .ChatTabs.compactView .ChatTabsBackButton { 834 | height: 34px !important; } 835 | 836 | .ingame.awayOrSnooze .personanameandstatus_richPresenceLabel_3Q6g1, .ingame .personanameandstatus_richPresenceLabel_3Q6g1, .ingame .personanameandstatus_richPresenceLabel_3Q6g1 a, .ingame .personanameandstatus_richPresenceLabel_3Q6g1 a:hover, .ingame .personanameandstatus_richPresenceLabel_3Q6g1 a:active, .ingame .personanameandstatus_richPresenceLabel_3Q6g1 a:visited{ 837 | color: rgba(var(--ingame), .5)!important;} 838 | 839 | .ingame .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1, .ingame .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a, .ingame .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:hover, .ingame .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:active, .ingame .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:visited, .ingame.personanameandstatus_twoLine_2wZNn .personanameandstatus_richPresenceLabel_3Q6g1 { 840 | color: rgb(var(--ingame)) !important;} 841 | 842 | .online .personanameandstatus_richPresenceLabel_3Q6g1, .online .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a, .online .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:hover, .online .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:active, .online .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:visited { 843 | color: rgb(var(--online)) !important;} 844 | 845 | 846 | 847 | .ingame .personanameandstatus_playerName_1uxaf { 848 | color: rgb(var(--ingame)) !important; } 849 | 850 | .currentUserContainer .ingame .personanameandstatus_playerName_1uxaf, 851 | .friend.ingame { 852 | color: rgb(var(--ingame)) !important; } 853 | 854 | .online .personanameandstatus_playerName_1uxaf { 855 | color: rgb(var(--online)) !important;} 856 | 857 | .ingame .steamavatar_avatarStatus_1Pwr6, .ingame .X-Large .steamavatar_avatarStatus_1Pwr6 { 858 | background: rgb(var(--ingame)) !important; } 859 | 860 | .online .steamavatar_avatarStatus_1Pwr6 { 861 | background: rgb(var(--online)) !important;} 862 | 863 | .FriendChatTimeStamp { 864 | font-size: 10px !important; 865 | display: none!important; 866 | } 867 | .FriendChatTimeStamp.online { 868 | color: #4b8fcc!important; 869 | } 870 | 871 | .FriendChatSpeaker .speaker.online { 872 | color: rgb(var(--online)) !important;} 873 | 874 | .FriendChatSpeaker .speaker.ingame { 875 | color: rgb(var(--ingame)) !important; } 876 | 877 | .ChatHistoryContainer .nameWidthLabel, 878 | .ChatSpeaker .speaker { 879 | font-size: 13px!important; } 880 | 881 | .chatHistoryScroll { 882 | padding: 5px 0px 12px 1px !important; 883 | } 884 | .window_resize_grip { 885 | background-image: none !important; 886 | width: 5px !important; 887 | height: 5px !important;} 888 | 889 | .inviteAnotherFriendButton { 890 | background: transparent !important; 891 | } 892 | .inviteAnotherFriendButton:hover .invitePlus, 893 | .chatRoomButton:hover:not(.Disabled) .invitePlus { 894 | transform: none !important; } 895 | 896 | .chatWindow .chatEntry > * { 897 | margin-bottom: 1px !important; } 898 | 899 | .singlewindow .chatWindow .chatEntry { 900 | padding-left: 0px !important; 901 | padding-right: 0px !important; } 902 | .OneOnOneVoiceClose { 903 | background-color: rgb(var(--textentry)) !important; 904 | 905 | z-index: 200!important; 906 | } 907 | /*emoticons and attachments area*/ 908 | .chatentry_chatEntryActionsGroup_15mWd { 909 | background-color: rgb(var(--textentry)) !important; 910 | padding: 0px!important; 911 | margin-left: 0px!important; } 912 | 913 | /*arrow at tab selection*/ 914 | .chatTabSelector { 915 | background: none !important; 916 | border: 0px solid black !important; 917 | width: 16px!important; 918 | height:16px!important; 919 | left: 2px!important; 920 | top: 7px!important; 921 | cursor: initial!important; 922 | } 923 | .chatTabSelector .SVGIcon_DownArrowContextMenu { 924 | margin-left: 2px!important; 925 | margin-top: 4px!important; 926 | fill: rgb(113,113,113)!important; 927 | width: 15px!important; 928 | height: 15px!important;} 929 | 930 | .FriendChatTypingNotification { 931 | background: rgb(var(--clientbg)) !important; 932 | color: #8c8c8c !important; 933 | padding: 18px 10px 4px 12px !important; 934 | font-weight: 300!important; 935 | text-transform: uppercase!important; 936 | } 937 | 938 | .chattabs_ChatTab_1WfqA .chatTabHighlight { 939 | height:0px!important; 940 | z-index: 20!important; 941 | background:none!important; 942 | } 943 | 944 | .chattabs_ChatTab_1WfqA:not(.chattabs_Active_3sMSI) .chatTabHighlight { 945 | background:none!important;} 946 | 947 | .contextmenu_contextMenuContents_1yyTu { 948 | font-size: 12px !important;} 949 | 950 | .contextmenu_contextMenuItem_CBC-y { 951 | padding: 4px 10px !important; 952 | line-height: 16px !important; 953 | color: rgb(var(--white)) !important; 954 | border-top: none !important; 955 | border-bottom: none !important;} 956 | 957 | .contextMenuUnselectable:hover, 958 | .contextMenuGameTitle, 959 | .contextMenuBroadcast, 960 | .contextMenuGameOptions { 961 | background-color: rgb(var(--clientBG)) !important;} 962 | .contextMenuGameTitle { 963 | border-top: 1px solid rgb(53,53,53) !important;} 964 | 965 | .contextMenuGameOptions .SVGIcon_Play { 966 | display:none!important;} 967 | 968 | html.contextmenu_ContextMenuPopup_1exss .contextmenu_contextMenuContents_1yyTu { 969 | padding: 0!important; } 970 | 971 | .currentUserAvatar:hover { 972 | transform: none !important; 973 | filter: none !important; 974 | } 975 | 976 | .miniprofile_miniProfileBackground_3gfFJ { 977 | background: rgb(var(--clientBG)) !important;} 978 | .miniprofile_miniProfileBackgroundBlur_G000o { 979 | opacity: 0 !important;} 980 | 981 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.in-game .miniprofile_personaName_W3QjS:not(.miniprofile_hasNickname_dgG-l) .miniprofile_personaNameLabel_390p4, 982 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.in-game .miniprofile_personaName_W3QjS.miniprofile_nickName_2E8Iz .miniprofile_personaNameLabel_390p4 { 983 | color: rgb(var(--ingame)) !important;} 984 | 985 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.online .miniprofile_personaName_W3QjS:not(.miniprofile_hasNickname_dgG-l) .miniprofile_personaNameLabel_390p4, 986 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.online .miniprofile_personaName_W3QjS.miniprofile_nickName_2E8Iz .miniprofile_personaNameLabel_390p4 { 987 | color: rgb(var(--online)) !important;} 988 | 989 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.miniprofile_online_3Bk5s .miniprofile_nickname_1W3dU, 990 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.miniprofile_online_3Bk5s .miniprofile_persona_1Z3Ey, 991 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.online .miniprofile_playerContent_PV11V .miniprofile_awayStatusLabel_2UzRy { 992 | color: rgb(var(--online)) !important;} 993 | 994 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.online .miniprofile_playerAvatar_1dzWG { 995 | border-bottom: 2px solid rgb(var(--online)) !important;} 996 | 997 | .miniprofile_miniProfileContent_25Sge .miniprofile_miniProfilePlayer_3cN6K.in-game .miniprofile_playerAvatar_1dzWG { 998 | border-bottom: 2px solid rgb(var(--ingame)) !important;} 999 | 1000 | .personastatusicons_PersonaStatusIcon_2rP7f.online .SVGIcon_VR path, 1001 | .personastatusicons_PersonaStatusIcon_2rP7f.online .SVGIcon_MobilePhone path, 1002 | .personastatusicons_PersonaStatusIcon_2rP7f.online .SVGIcon_BigPicture path { 1003 | fill: rgb(var(--online)) !important;} 1004 | .personastatusicons_PersonaStatusIcon_2rP7f.ingame .SVGIcon_VR path, 1005 | .personastatusicons_PersonaStatusIcon_2rP7f.ingame .SVGIcon_MobilePhone path, 1006 | .personastatusicons_PersonaStatusIcon_2rP7f.ingame .SVGIcon_BigPicture path { 1007 | fill: rgb(var(--ingame)) !important;} 1008 | 1009 | /* Settings icon image*/ 1010 | .SVGIcon_Settings { 1011 | fill: rgb(var(--white)) !important; 1012 | width: 15px !important; 1013 | height: 15px !important; 1014 | padding: 5px!important;} 1015 | 1016 | /* Settings button itself */ 1017 | .friendSettingsButton{ 1018 | cursor: initial!important;} 1019 | 1020 | .friendSettingsButton:hover .SVGIcon_Settings { 1021 | background-color: rgba(var(--white05)) !important; 1022 | animation-name: none!important; 1023 | } 1024 | 1025 | .friendListButtons { 1026 | right:4px!important; 1027 | top:27px!important;} 1028 | 1029 | /* Glow of unread messages*/ 1030 | .ChatUnreadMessageIndicator { 1031 | background: none !important; 1032 | } 1033 | 1034 | .chatSectionTitle .ChatUnreadMessageIndicator { 1035 | top: 12px!important; 1036 | padding: 0!important; 1037 | left: 5px!important; 1038 | height: 6px!important; 1039 | width: 6px!important; 1040 | background: rgb(var(--focus))!important; 1041 | border-radius: 3px!important; 1042 | } 1043 | 1044 | .chattabs_UnreadCircle_2goOD{ 1045 | background-color: rgb(var(--focus))!important; 1046 | border-radius: 50%!important;} 1047 | 1048 | .chattabs_UnreadGlow_30PFd { 1049 | background: none !important; 1050 | } 1051 | 1052 | .chattabs_Active_3sMSI .chatTabUnreadBadge{ 1053 | display:none!important;} 1054 | 1055 | .chatTab.ChatTabTransiton-exit,.chatTab.ChatTabTransiton-exit-active,.chatTab.ChatTabTransiton-appear-active, 1056 | .chatTab.ChatTabTransiton-enter-active,.chatTab.ChatTabTransiton-appear, 1057 | .chatTab.ChatTabTransiton-enter { 1058 | transform: none!important;} 1059 | 1060 | .emoticon_EmoticonSelector_Separator_1_yzI .emoticon_EmoticonSelector_SeparatorBackground_13bYy { 1061 | height: 1px !important; 1062 | background: black!important;} 1063 | 1064 | /*Suggested commands and emoticons*/ 1065 | .suggestdialog_suggestOption_t54xp { 1066 | color: #fefefe !important; 1067 | background-color: rgb(var(--clientBG)) !important; 1068 | line-height: 20px !important; 1069 | margin: 0px !important; 1070 | border: 1px solid rgb(var(--border)) !important; 1071 | padding: 2px !important; 1072 | padding-left: 22px!important; 1073 | } 1074 | .suggestdialog_mentionDialog_2hRnz { 1075 | padding: 0px 0px 0px 0px !important; 1076 | } 1077 | 1078 | .currentUserContainer .ContextMenuButton { 1079 | padding-top: 0px!important; 1080 | opacity: 0.6!important; 1081 | } 1082 | 1083 | .titleBarContainer .currentUserContainer .ContextMenuButton { 1084 | margin-top: -2px!important; 1085 | margin-bottom: 2px!important;} 1086 | 1087 | .suggestdialog_suggestOption_t54xp.suggestdialog_selected_e-sy7 { 1088 | color: !important; 1089 | background-color: #4b4b4b !important; 1090 | padding-left: 22px !important; } 1091 | 1092 | .timeDivision.time_passes .preHorizDivider, 1093 | .timeDivision.time_passes .horizDivider { 1094 | border: 1px dashed rgb(161,152,73) !important; 1095 | margin-left: 1px !important; } 1096 | 1097 | .timeDivision .preHorizDivider{ 1098 | width: 15% !important;} 1099 | .timeDivision .preHorizDivider, .timeDivision .horizDivider { 1100 | background-color: rgb(var(--clientBG)) !important;} 1101 | 1102 | .msg.timeDivision { 1103 | font-size: 12px !important; 1104 | color: #8d8d8d !important;} 1105 | 1106 | /*Connection issues message*/ 1107 | .ConnectionTroubleContent { 1108 | background: rgb(var(--focus)) !important;} 1109 | 1110 | /*URLs*/ 1111 | .msg a { 1112 | color: rgba(var(--white75))!important; 1113 | text-decoration: underline !important; 1114 | border-bottom: none!important; 1115 | } 1116 | 1117 | .msg .OpenGraphMessageURL, .OpenGraphMessageURL_full{ 1118 | color: rgba(var(--white75))!important;} 1119 | 1120 | .msg a:hover { 1121 | color: !important; 1122 | border-bottom: none!important; 1123 | filter: brightness(.9)!important;} 1124 | 1125 | /*selected text for copying etc*/ 1126 | ::selection { 1127 | background: rgba(var(--focus), .9)!important;} 1128 | 1129 | .SVGIcon_MobilePhone { 1130 | fill: none!important;} 1131 | 1132 | .chatTabSelector .SVGIcon_DownArrowContextMenu:hover, .chatTabSelector.UnreadMessages .SVGIcon_DownArrowContextMenu:hover { 1133 | fill: rgb(var(--white)) !important;} 1134 | 1135 | .chatTabList .chattabs_ChatTab_1WfqA:not(.chattabs_Active_3sMSI) { 1136 | background: rgb(var(--header_dark)) !important; 1137 | border-bottom: 1px transparent!important;} 1138 | 1139 | .chattabs_ChatTab_1WfqA:not(.chattabs_Active_3sMSI) .chattabs_ChatTabContent_Friend_3m7Ps, .chattabs_ChatTab_1WfqA:not(.chattabs_Active_3sMSI) .chattabs_ChatTabContent_ChatRoom_1AI14 { 1140 | filter: grayscale(100%)!important; 1141 | opacity:.5!important;} 1142 | 1143 | .chattabs_ChatTab_1WfqA:hover:not(.chattabs_Active_3sMSI), .ChatTabsContextMenu .chattabs_ChatTab_1WfqA:hover{ 1144 | background-color: rgba(var(--white05)) !important;} 1145 | 1146 | .msg.ChatMsgSlashEmote .speaker { 1147 | background:rgb(var(--textentry))!important; 1148 | color: rgb(var(--online))!important;} 1149 | 1150 | /*group chat member count*/ 1151 | .statMembersOnline { 1152 | color: rgb(var(--online))!important;} 1153 | .statMembersInGame{ 1154 | color: rgb(var(--ingame))!important;} 1155 | 1156 | .inviteButton.inviteButtonJoinVoice { 1157 | background: rgb(53,53,53)!important; 1158 | } 1159 | 1160 | .inviteButton.inviteButtonJoinVoice:hover { 1161 | background: rgb(var(--focus))!important;} 1162 | 1163 | .OneOnOneVoiceRoomControls{ 1164 | background-color: rgb(var(--clientBG))!important;} 1165 | 1166 | .msg.voiceChannelInvite { 1167 | color: rgba(var(--white50))!important; 1168 | float: center!important;} 1169 | 1170 | .SlashCommandSuggestion_SlashCommandDescription { 1171 | color: rgba(var(--white50))!important;} 1172 | 1173 | .SingleUserChat .msg{ 1174 | margin-right: 4px!important; 1175 | } 1176 | 1177 | .SingleUserChat .msgText{ 1178 | margin-right: 6px!important; 1179 | margin-left: 8px!important; } 1180 | 1181 | .MultiUserChat .isCurrentUser .msgText { 1182 | color: rgb(var(--offline))!important;} 1183 | 1184 | .FriendMessageCount{ 1185 | z-index: 99 !important;} 1186 | 1187 | /*Unread notification circle in chat context menu*/ 1188 | .ChatTabsContextMenu.compactView .ChatTabContextMenuItem .TabRightContainer .chatTabUnreadBadge:before { 1189 | right: 0px!important; 1190 | background-color: rgb(var(--focus))!important;} 1191 | 1192 | .ChatTabContextMenuItem .TabRightContainer .chatTabUnreadBadge{ 1193 | display:initial!important; 1194 | background:none!important;} 1195 | 1196 | /*Friend request and Add friend buttons*/ 1197 | .addFriendButton:hover .SVGIcon_AddFriend .plusCircle, .friendRequestButton:hover .requestsNumber { 1198 | transform: none !important; } 1199 | 1200 | .addFriendButton:hover .SVGIcon_AddFriend, .friendRequestButton:hover .SVGIcon_FriendRequest{ 1201 | background-color: rgba(var(--white05)) !important; 1202 | } 1203 | 1204 | .friendRequestButton:hover:not(.friendRequestViewActive) .SVGIcon_FriendRequest .friendArm { 1205 | animation-name: none!important; } 1206 | 1207 | .ContextMenuButton{ 1208 | cursor: default!important;} 1209 | 1210 | button.DialogButton{ 1211 | color: rgb(var(--white))!important; 1212 | background: rgba(255,255,255,0.12)!important;} 1213 | 1214 | .voiceMicTestContainer{ 1215 | padding: 0!important; 1216 | } 1217 | .voiceSelfDirections{ 1218 | background-color: rgb(var(--clientBG)) !important;} 1219 | 1220 | button.DialogButton.Primary:hover{ 1221 | background: rgba(255,255,255,0.24) !important;} 1222 | 1223 | .NonInlinedEmbed .SVGIcon_Video path, .NonInlinedEmbed .SVGIcon_Image path, .NonInlinedEmbed .SVGIcon_Hyperlink{ 1224 | fill: rgb(var(--white))!important; 1225 | stroke: rgb(var(--white))!important;} 1226 | 1227 | /* Hide status icons (mobile, VR, etc) from some areas*/ 1228 | .currentUserContainer .personastatusicons_PersonaStatusIcon_2rP7f.personastatusicons_MobilePhoneIcon_2ZlAW, .miniprofile_miniProfile_s5zcg .personastatusicons_PersonaStatusIcon_2rP7f { 1229 | display: none!important;} 1230 | 1231 | .ChatRoomSpeaker .speaker .speakerAvatar, 1232 | .ChatMsgSlashEmote .speaker .speakerAvatar, .speaker .speakerStatus{ 1233 | opacity: 0!important; 1234 | width: 0.5px!important;} 1235 | 1236 | .messages_SpeakerName_Online_2nKVN{ 1237 | color: rgb(var(--online))!important;} 1238 | .messages_SpeakerName_InGame_1vaKy { 1239 | color: rgb(var(--ingame))!important;} 1240 | 1241 | .chattabs_ChatTabContent_Friend_3m7Ps .friend.offline .avatarHolder, .chattabs_ChatTabContent_Friend_3m7Ps .friend.awayOrSnooze .avatarHolder { 1242 | filter: brightness(60%)!important; } 1243 | 1244 | .friend.offline .avatarHolder img.avatar { 1245 | filter: none!important;} 1246 | 1247 | .speakerTimeStamp { 1248 | font-size: 11px!important; 1249 | color: #8d8d8d!important;} 1250 | 1251 | .MultiUserChat .msg:not(.ChatMsgSlashEmote) { 1252 | padding-left: 10px!important;} 1253 | 1254 | .MultiUserChat .msg { 1255 | padding: 1.8px 0!important;} 1256 | 1257 | .msg { 1258 | line-height: 20px!important;} 1259 | 1260 | .ChatRoomSpeaker { 1261 | padding-top: 0px!important; 1262 | margin-top: -4px!important;} 1263 | .msg.serverMsg .msgText { 1264 | text-align: left!important; 1265 | color: gray!important;} 1266 | 1267 | .miniprofile_miniProfile_s5zcg{ 1268 | border: 1px solid black !important;} 1269 | 1270 | /*Nickname * indicator in chat window*/ 1271 | .chatBody .playerNicknameBracket{ 1272 | display:none!important;} 1273 | 1274 | /*new emoticon icon color*/ 1275 | .emoticon_NewEmoticonIndicator_3NVON { 1276 | background: none!important; 1277 | top: 98%!important; 1278 | right: 0%!important; 1279 | left: 0%!important;} 1280 | 1281 | .emoticon_NewEmoticonIndicator_3NVON .emoticon_NewEmoticonCircle_3mNrG { 1282 | width: 100%!important; 1283 | height: 1px!important; 1284 | background-color: rgb(var(--focus))!important;} 1285 | 1286 | /* Hide status line of inactive tabs */ 1287 | .chattabs_ChatTab_1WfqA:not(.chattabs_Active_3sMSI) .chattabs_ChatTabContent_Friend_3m7Ps .avatarHolder .avatarStatus, .chattabs_ChatTab_1WfqA:not(.chattabs_Active_3sMSI) .chattabs_ChatTabContent_Friend_3m7Ps .steamavatar_avatarFrame_1wl8m{ 1288 | opacity: 0!important; 1289 | } 1290 | .chattabs_ChatTab_1WfqA:not(.chattabs_Active_3sMSI) .chattabs_ChatTabContent_Friend_3m7Ps .steamavatar_avatar_f2laR{ 1291 | border: 1px solid transparent !important;} 1292 | 1293 | .speakerHoverArea { 1294 | pointer-events: none;} 1295 | 1296 | .NonInlinedEmbed .SVGIcon_Hyperlink { 1297 | display:none!important;} 1298 | 1299 | .msg.voiceChannelInvite { 1300 | float: left!important;} 1301 | 1302 | /*Invite box*/ 1303 | .ChatMessageInvite { 1304 | background: rgba(0,0,0,.45)!important; 1305 | border-left: 3px solid rgb(var(--focus)); 1306 | color: rgb(var(--offline))!important;} 1307 | 1308 | .inviteButton { 1309 | background: rgb(var(--focus))!important;} 1310 | .inviteButton:hover { 1311 | background: rgba(var(--white05))!important; } 1312 | 1313 | .msg.ChatMessageInvite .invitedTimeLabel, .Invite_ExpireTime { 1314 | color: gray!important;} 1315 | 1316 | .gameInviteMsg .productImage.productImageBlur, .broadcastInviteMsg .productImage.productImageBlur, .broadcastViewRequestMsg .productImage.productImageBlur { 1317 | filter:opacity(0)!important;} 1318 | 1319 | /*Embedded elements*/ 1320 | .msg div.ChatMessageOpenGraph, .msg div.SteamPublishedFile, .BBCodeYouTubeComponent, .bbcode_ChatMessageTweet_1R69m, .BBCodeOEmbedComponent, .bbcode_ChatMessageSteamStore_Failed_2wa0X, .bbcode_ChatMessageSteamStore_gwzSZ { 1321 | background: rgba(0,0,0,.45)!important;} 1322 | 1323 | .BBCodeCollapsed, .BBCodeCollapsed:hover { 1324 | background-color: rgba(0,0,0,.45)!important;} 1325 | 1326 | .bbcode_ChatMessageTweet_1R69m { 1327 | color: rgb(var(--white75))!important;} 1328 | 1329 | .OpenGraphImgBackground .ChatMessageOpenGraph_Image { 1330 | display:none!important;} 1331 | 1332 | /*Search box at the top of friends list*/ 1333 | .TabSearchButton:hover { 1334 | background-color: rgb(var(--clientBG))!important;} 1335 | 1336 | /*Hide single window switch button*/ 1337 | .title-area-icon.singleWindowToggle { 1338 | display:none!important;} 1339 | 1340 | /*Line that separates friends and chat windows in single window mode*/ 1341 | .singleWindowDivider { 1342 | min-width: 1px!important; 1343 | width: 1px!important; 1344 | background-color: rgb(var(--border))!important; 1345 | border:none!important;} 1346 | 1347 | .chatDialogs { 1348 | background: rgb(var(--clientBG))!important;} 1349 | 1350 | .friend .personanameandstatus_richPresenceLabel_3Q6g1 { 1351 | margin-top: 0px!important;} 1352 | 1353 | .awayOrSnooze .steamavatar_avatarStatus_1Pwr6 { 1354 | -webkit-mask: none!important;} 1355 | 1356 | .socialListTab { 1357 | letter-spacing: 1px!important; 1358 | padding-left: 15px!important; 1359 | } 1360 | 1361 | .compactView .socialListTab { 1362 | height: 27px!important; } 1363 | 1364 | .friendsListSectionTitle { 1365 | letter-spacing: 1px!important;} 1366 | 1367 | .friendlistListContainer .friend .avatarHolder { 1368 | width: 34px!important; 1369 | height: 34px!important; 1370 | transform: scale(1, 1) translateX(0px)!important; 1371 | padding-right: 0px!important;} 1372 | 1373 | .CompactFriendsList .SteamPlayerGroupFooter .SteamPlayerGroupFooterCount, 1374 | .CompactFriendsList .friend .avatarHolder { 1375 | height: 24px!important; 1376 | width: 24px!important; 1377 | } 1378 | 1379 | .CompactFriendsList .friend .avatarHolder { 1380 | padding-right: 2px!important;} 1381 | 1382 | /* Miniprofile avatar */ 1383 | .miniprofile_miniProfileContent_25Sge .miniprofile_playerAvatar_1dzWG { 1384 | height: 90px!important;} 1385 | 1386 | .friendGroup .friend, .friendGroup .SteamPlayerGroupFooter { 1387 | padding-left: 22px!important; 1388 | padding-top: 8px!important;} 1389 | 1390 | .FriendInGameIcon{ 1391 | margin-left: -18px!important; 1392 | margin-right: 15px!important; 1393 | margin-top: 4px!important;} 1394 | 1395 | .AvatarAndUser { 1396 | padding-left: 15px!important; 1397 | padding-top: 12px!important;} 1398 | 1399 | .currentUserAvatar img.avatar, .currentUserAvatar .avatarHolder { 1400 | width: 32px!important; 1401 | height: 32px!important; 1402 | } 1403 | 1404 | .chattabs_ChatTabRow_OdWLp .friend .personanameandstatus_statusAndName_9U-hi { 1405 | margin-top: -1px!important;} 1406 | 1407 | .chattabs_ChatTabRow_OdWLp .friend .ingame .personanameandstatus_statusAndName_9U-hi { 1408 | margin-top: -2px!important;} 1409 | 1410 | .friend .personanameandstatus_statusAndName_9U-hi { 1411 | margin-top: -5px!important;} 1412 | 1413 | .compactView .friend .personanameandstatus_statusAndName_9U-hi { 1414 | margin-top: -3px!important;} 1415 | 1416 | .currentUserContainer .personanameandstatus_playerName_1uxaf { 1417 | font-size:14px!important;} 1418 | 1419 | .friendlist .labelHolder{ 1420 | margin-left: 9px!important;} 1421 | 1422 | .miniprofile_miniProfileContent_25Sge .miniprofile_avatarStatus_23H45.miniprofile_miniProfileAvatarStatus_1VgK8 { 1423 | margin-bottom: -4px!important;} 1424 | 1425 | .title-area-icon { 1426 | padding:3px!important; 1427 | margin-top: 0px!important;} 1428 | 1429 | .title-area .title-bar-actions { 1430 | right: 0px!important;} 1431 | 1432 | /*Gray hover color for every title bar button 1433 | .title-area-icon:hover{ 1434 | background: rgba(var(--white05))!important;}*/ 1435 | 1436 | .minimizeButton:hover, .maximizeButton:hover, .restoreButton:hover { 1437 | background: rgba(var(--white05))!important;} 1438 | 1439 | .closeButton:not(.chattabs_CloseButton_SzByZ):hover { 1440 | background: rgb(232,18,35)!important;} 1441 | 1442 | .multiChatDialog .title-area-icon { 1443 | padding:1px!important;} 1444 | 1445 | .title-area-icon .SVGIcon_Button rect, 1446 | .title-area-icon .SVGIcon_Button line, 1447 | .title-area-icon .SVGIcon_Button polyline { 1448 | stroke: rgb(var(--white))!important;} 1449 | 1450 | 1451 | 1452 | .singlewindow .currentUserContainer .labelHolder.personanameandstatus_twoLine_2wZNn .personanameandstatus_statusAndName_9U-hi, .singlewindow .currentUserContainer .labelHolder.personanameandstatus_twoLine_2wZNn { 1453 | margin-right: 10px!important;} 1454 | 1455 | .chatTabSelector.UnreadMessages{ 1456 | background-color: none!important;} 1457 | 1458 | .chatTabSelector.UnreadMessages .SVGIcon_DownArrowContextMenu{ 1459 | fill: rgb(var(--focus))!important;} 1460 | 1461 | .title-area-icon .SVGIcon_Maximize line { 1462 | display: none !important; 1463 | } 1464 | 1465 | .chatTabDraggableSpace.ChromeClearance, .chatTabDraggableSpace { 1466 | width: 15px!important; 1467 | } 1468 | 1469 | .chatTabDraggableSpace.ChromeClearance { 1470 | width: 80px!important; 1471 | height: 18px!important;} 1472 | 1473 | 1474 | .chatentry_EmbedButton_1vvRh .SVGIcon_Paperclip path, .SVGIcon_Paperclip, .chatentry_EmoticonPickerButton_3fgX0 .SVGIcon_Emoticon line, .chatentry_EmoticonPickerButton_3fgX0 .SVGIcon_Emoticon circle, .chatentry_EmoticonPickerButton_3fgX0 .SVGIcon_Emoticon path, .VoiceToggleIconCtn .SVGIcon_VoiceRoom { 1475 | stroke: rgb(var(--textentrybuttons))!important;} 1476 | 1477 | .VoiceToggleIconCtn .SVGIcon_VoiceRoom .Microphone, .chatentry_chatSubmitButton_3VRfL .SVGIcon_Submit path{ 1478 | fill: rgb(var(--textentrybuttons))!important;} 1479 | 1480 | .chatentry_chatSubmitButton_3VRfL:not(.chatentry_disabled_2p2vW):hover .SVGIcon_Button.SVGIcon_Submit path { 1481 | stroke: none!important; } 1482 | 1483 | /*Unread messages count near username in friendslist*/ 1484 | .FriendMessageCount { 1485 | background: rgb(var(--focus))!important; 1486 | color: rgb(var(--white))!important; 1487 | font-size: 15px!important; 1488 | line-height: 30px!important; 1489 | height: 30px!important; 1490 | min-width: 30px!important; 1491 | padding: 0px!important; 1492 | margin-top: 11px!important; 1493 | } 1494 | 1495 | .CompactFriendsList .FriendMessageCount { 1496 | line-height: 24px!important; 1497 | height: 24px!important; 1498 | min-width: 24px!important; 1499 | margin-top: 7px!important;} 1500 | 1501 | /*Unread messages box at chat tabs*/ 1502 | .chatTab .chatTabUnreadBadge{ 1503 | color: rgb(var(--white))!important; 1504 | background: rgb(var(--focus))!important; 1505 | } 1506 | 1507 | .quickAccessFriends .friend.friend.awayOrSnooze .avatarHolder img{ 1508 | opacity: initial!important;} 1509 | 1510 | .quickAccessFriends { 1511 | padding-left: 5px!important;} 1512 | 1513 | .chattabs_CloseButton_SzByZ{ 1514 | cursor: default!important;} 1515 | 1516 | .chatTabList .chattabs_ChatTab_1WfqA, .ChatTabsBackButton { 1517 | width: 170px!important;} 1518 | 1519 | .compactView .steamavatar_avatarHolder_1G7LI .steamavatar_avatarFrame_1wl8m { 1520 | transform: scale(1.16)!important;} 1521 | 1522 | .inviteAnotherFriendButton .SVGIcon_Button{ 1523 | fill: rgb(var(--white))!important; 1524 | opacity:.4!important;} 1525 | .inviteAnotherFriendButton .SVGIcon_Button line, .chatRoomButton .SVGIcon_Button line{ 1526 | stroke: rgb(var(--white))!important;} 1527 | .inviteAnotherFriendButton:hover{ 1528 | background: rgba(var(--white05))!important; 1529 | cursor: initial!important;} 1530 | 1531 | .chatRoomButton .SVGIcon_Button{ 1532 | fill: rgb(var(--white))!important;} 1533 | .chatRoomButton:hover{ 1534 | background: rgba(var(--white05))!important;} 1535 | 1536 | .TradeOfferInvite .leftInviteContainer .SVGIcon_Trade{ 1537 | background-color: rgb(var(--focus))!important;} 1538 | 1539 | .confirmInviteButton.confirmInvites{ 1540 | background: rgb(var(--focus))!important; 1541 | background-color: none!important;} 1542 | 1543 | 1544 | 1545 | .friendGroup.offlineFriends .groupName .groupCount, .friendGroup.onlineFriends .groupName .groupCount, .friendGroup .groupName .groupCount.collapsed, .friendGroup .groupName .groupCount { 1546 | opacity: 1!important; 1547 | color: rgb(var(--white50))!important; 1548 | transform: translateX(3px)!important;} 1549 | 1550 | .dropTargetBox { 1551 | border: 2px dashed rgba(var(--focus), 0.4)!important;} 1552 | 1553 | .miniprofile_miniProfileContent_25Sge .miniprofile_playerNicknameBracket_1bkKo, 1554 | .personanameandstatus_playerNickname_3-32P, 1555 | .ChatRoomSpeaker .speaker .speakerName .playerNickname, 1556 | .personanameandstatus_playerNicknameBracket_1lu-g, 1557 | .ChatTabs .personanameandstatus_compactView_2PCWF .personanameandstatus_playerNickname_3-32P, 1558 | .playerNicknameBracket { 1559 | color: rgba(var(--white75))!important;} 1560 | 1561 | .ChatRoomSpeaker .speaker .speakerName { 1562 | margin-top: 3px;!important;} 1563 | 1564 | /* Status line for avatars in chat tabs*/ 1565 | .chattabs_ChatTab_1WfqA .ChatTabContent .avatarHolder .avatarStatus{ 1566 | z-index: 3 !important; 1567 | margin: 0px !important; 1568 | position:absolute!important; 1569 | height:100%!important; 1570 | } 1571 | 1572 | .chat_main_flex{ 1573 | border: 1px solid rgb(var(--border))!important;} 1574 | 1575 | .DialogOnOffToggle_Option:not(.Active) { 1576 | color: transparent!important;} 1577 | 1578 | .friend.ingame .personanameandstatus_twoLine_2wZNn .personanameandstatus_richPresenceLabel_3Q6g1{ 1579 | color: inherit!important;} 1580 | 1581 | .contextmenu_contextMenu_3_a2Z .compactView .avatar{ 1582 | padding:0px!important;} 1583 | 1584 | .ChatTabContent .avatarHolder .avatar{ 1585 | padding: 1px; 1586 | height: auto!important;} 1587 | 1588 | .ChatTabs:not(.compactView) .ChatTabContent .avatarHolder .avatar { 1589 | width: 32px!important;} 1590 | 1591 | .ChatTabs:not(.compactView) .ChatTabContent .avatarHolder { 1592 | margin-top:4px!important; 1593 | margin-left:2px!important;} 1594 | 1595 | .offline .personanameandstatus_playerName_1uxaf { 1596 | color: rgb(var(--offline))!important;} 1597 | 1598 | .offline .personanameandstatus_richPresenceLabel_3Q6g1, .offline .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a, .offline .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:hover, .offline .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:active, .offline .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 a:visited { 1599 | color: rgb(var(--offline))!important;} 1600 | 1601 | .msgText { 1602 | color: rgba(var(--white75))!important;} 1603 | 1604 | .smallChatFont .msg.serverMsg .msgText, .smallChatFont .nameWidthLabel, .ChatHistoryContainer.smallChatFont .ChatSpeaker .speaker, .smallChatFont .msg { 1605 | line-height: 14px!important; 1606 | } 1607 | 1608 | .smallChatFont .chatTextarea, .smallChatFont .msg.serverMsg .msgText, .FriendsSettingsChatFontSizeSection_ButtonRow .smallFontSetting, .smallChatFont .ChatMessageOpenGraph_Title, .smallChatFont .nameWidthLabel, .ChatHistoryContainer.smallChatFont .ChatSpeaker .speaker, .smallChatFont { 1609 | font-size: 12px!important;} 1610 | 1611 | .friendlistListContainer .Collapsed .ExpandPlusMinus .SVGIcon_PlusCircle:hover{ 1612 | stroke: rgb(var(--white))!important;} 1613 | 1614 | .contextMenuGameName { 1615 | color: rgb(var(--white))!important;} 1616 | 1617 | .currentUserContainer .personanameandstatus_richPresenceContainer_21cNf { 1618 | margin-top: 4px!important;} 1619 | 1620 | .personanameandstatus_richPresenceContainer_21cNf { 1621 | width: calc(100% - 20px)!important;} 1622 | 1623 | .ChatRoomListGroupItem .groupNameStatusContainer .chatRoomName{ 1624 | color: rgb(var(--white))!important;} 1625 | 1626 | .confirmInviteRequestContainer .cancelAddFriends .SVGIcon_Arrow polyline{ 1627 | stroke: rgb(var(--focus))!important;} 1628 | 1629 | .personanameandstatus_playerName_1uxaf { 1630 | -webkit-mask: none!important; 1631 | } 1632 | 1633 | button.DialogButton::before{ 1634 | box-shadow: none!important;} 1635 | 1636 | .emoticon_EmoticonSelector_Item_3muLb:hover .emoticon_emoticon_9hYGN.emoticon_large_p8Q42 { 1637 | transform: none!important; 1638 | filter: none!important;} 1639 | 1640 | .emoticon_EmoticonSelector_Item_3muLb:hover, .emoticon_StickerButton_3O95u:hover, .emoticon_RoomEffectButton_2ztWU:hover { 1641 | background-color: rgba(var(--white05))!important;} 1642 | 1643 | .ChatMessageBlockDelete{ 1644 | left: 0px!important; 1645 | top: 25px!important;} 1646 | 1647 | .quickAccessFriends.compactQuickAccess .favoriteElement:hover .friend .avatarHolder { 1648 | transform: scale(1)!important; } 1649 | 1650 | .chatTabSelector.UnreadMessages .ChatUnreadMessageIndicator{ 1651 | width:5px!important;} 1652 | 1653 | .personanameandstatus_playerName_1uxaf, .personanameandstatus_playerNickname_3-32P{ 1654 | font-size: 13px!important; 1655 | text-overflow: ellipsis!important;} 1656 | 1657 | .friendlist .personanameandstatus_richPresenceLabel_3Q6g1 { 1658 | -webkit-mask: linear-gradient(to right, black calc(100% - 10px), rgba(0, 0, 0, 0) calc(100% - 10px))!important; 1659 | } 1660 | 1661 | .personanameandstatus_richPresenceLabel_3Q6g1 { 1662 | -webkit-mask: linear-gradient(to right, black 98%, rgba(0, 0, 0, 0) 98%)!important; } 1663 | 1664 | .contextMenuGameItem { 1665 | -webkit-mask: linear-gradient(to right, black 100%, rgba(0, 0, 0, 0) 100%)!important;} 1666 | 1667 | .ChatSpeaker.ChatRoomSpeaker .speaker .rankIcon > * { 1668 | top: 5px!important;} 1669 | 1670 | .chatRoomMembers{ 1671 | border-left: 1px solid rgb(var(--border))!important;} 1672 | 1673 | .chatRoomGroupHeader{ 1674 | border-bottom: 1px solid rgb(var(--border))!important;} 1675 | 1676 | img.emoticon_emoticon_9hYGN.emoticon_large_p8Q42{ 1677 | margin-top: 0px!important; 1678 | margin-bottom: 0px!important; } 1679 | 1680 | .friend .watchingbroadcast .personanameandstatus_statusAndName_9U-hi { 1681 | margin-top: -8px!important;} 1682 | 1683 | .compactView .friend .watchingbroadcast .personanameandstatus_statusAndName_9U-hi{ 1684 | margin-top: -4px!important;} 1685 | 1686 | .titleBarContainer .currentUserContainer .personanameandstatus_richPresenceLabel_3Q6g1:not(.personanameandstatus_gameName_qvibF) { 1687 | margin-top: -1px!important;} 1688 | 1689 | .ChatTabsContextMenu.CompactFriendsList .friend { 1690 | margin-top: 0px!important; 1691 | padding-left: 1px!important; } 1692 | 1693 | .ChatRoomMultiFriendAvatar, .ChatRoomGroupAvatar{ 1694 | border: 1px solid #535c68!important;} 1695 | 1696 | .FriendsSettingsVoiceTransmissionType_ButtonRow, .FriendsSettingsFlashSection_ButtonRow{ 1697 | background-color: transparent!important;} 1698 | 1699 | .DialogSlider_Slider{ 1700 | border: 1px solid #2a2d33!important; 1701 | background: transparent!important;} 1702 | 1703 | .chattabs_ChatTabContent_Friend_3m7Ps .friend.awayOrSnooze .labelHolder, 1704 | .chattabs_ChatTabContent_Friend_3m7Ps .friend.awayOrSnooze .avatarHolder .avatarStatus, .chattabs_ChatTabContent_Friend_3m7Ps .friend.offline .avatarHolder .avatarStatus, .chattabs_ChatTabContent_Friend_3m7Ps .friend.offline .labelHolder { 1705 | opacity: .5!important;} 1706 | 1707 | .friend.awayOrSnooze .playerNameQuickAccessContainer, .friend.awayOrSnooze .labelHolder { 1708 | opacity: 1!important;} 1709 | 1710 | .friendsListSectionTitle .SVGIcon_NewChatGroup line{ 1711 | stroke: rgb(var(--clientBG))!important;} 1712 | 1713 | .friendSearchClear .SVGIcon_X_Line line, .chattabs_ChatTab_1WfqA .chatTabClose .SVGIcon_X_Line line{ 1714 | stroke: rgb(var(--white))!important;} 1715 | 1716 | .chatTabList .chattabs_Active_3sMSI, .chattabs_ChatTabContent_ChatRoomName_2avXT{ 1717 | color: rgb(var(--white))!important;} 1718 | 1719 | .changeLog .SVGIcon_Scroll path{ 1720 | fill: rgb(var(--white))!important;} 1721 | 1722 | .changeLog{ 1723 | right: 9px!important;} 1724 | 1725 | .changeLog .SVGIcon_Scroll { 1726 | width: 18px!important; 1727 | height: 18px!important; } 1728 | 1729 | .changeLog:hover { 1730 | background-color: rgba(var(--white05)) !important;} 1731 | 1732 | .currentUserContainer .personanameandstatus_statusAndName_9U-hi { 1733 | margin-right: 55px!important; 1734 | -webkit-app-region: drag!important;} 1735 | 1736 | .currentUserContainer .personanameandstatus_playerName_1uxaf { 1737 | -webkit-app-region: drag!important;} 1738 | 1739 | .compactQuickAccess .friend.quickAccessFriend .avatarHolder .avatar, .friend.quickAccessFriend .avatarHolder .avatar { 1740 | height:auto!important;} 1741 | 1742 | .friendCollapseButton, .friendSettingsButton, .friendCollapseButton .SVGIcon_DoubleArrow, .chatTabOpenFriendsList{ 1743 | cursor: default!important;} 1744 | 1745 | .chatTabOpenFriendsList{ 1746 | color: rgba(var(--white75)) !important; 1747 | background-color: rgb(var(--clientBG)) !important} 1748 | 1749 | .chatTabOpenFriendsList:hover { 1750 | background-color: rgba(var(--white05)) !important;} 1751 | 1752 | .friend.online { 1753 | color: rgb(var(--online)) !important;} 1754 | 1755 | .friendsnooze_SnoozeContainer_1OfTa.friendsnooze_Dim_10sPU .friendsnooze_SnoozeZ_29fyi { 1756 | filter: none!important;} 1757 | 1758 | .shared_svg_library_EmoticonBow_2ly3o{ 1759 | top: 0!important;} 1760 | 1761 | .steamavatar_avatarHolder_1G7LI.X-Small{ 1762 | width:30px!important; 1763 | height:30px!important;} 1764 | 1765 | .compactView .steamavatar_avatarHolder_1G7LI.X-Small{ 1766 | margin-top: 2px!important;} 1767 | 1768 | .chattabs_ChatTab_1WfqA:before, .chattabs_ChatTab_1WfqA:last-of-type:after{ 1769 | width: 0!important;} 1770 | 1771 | .emoticon_StickerButton_3O95u, .emoticon_RoomEffectButton_2ztWU { 1772 | background:none!important;} 1773 | 1774 | .socialListTab.TabSearchActive { 1775 | padding-left: 12px!important; 1776 | background-color: rgb(var(--textentry)) !important; 1777 | } 1778 | 1779 | .friendlist .friend .personanameandstatus_compactView_2PCWF .personanameandstatus_playerName_1uxaf, .friendlist .friend .personanameandstatus_compactView_2PCWF .personanameandstatus_playerNickname_3-32P, .friendlist .ingame .personanameandstatus_compactView_2PCWF .personanameandstatus_gameName_qvibF.personanameandstatus_richPresenceLabel_3Q6g1 { 1780 | font-size: 11px!important;} 1781 | 1782 | .personanameandstatus_statusAndName_9U-hi.personanameandstatus_threeLines_2pPym { 1783 | margin-top: -8px!important;} 1784 | 1785 | .compactView .personanameandstatus_statusAndName_9U-hi.personanameandstatus_threeLines_2pPym { 1786 | margin-top: -6px!important;} 1787 | 1788 | .SVGIcon_Button.SVGIcon_CopyToClipboard { 1789 | stroke: rgba(var(--white75));} 1790 | 1791 | .chattabs_CloseButton_SzByZ .SVGIcon_X_Line line { 1792 | stroke: rgb(113,113,113);} 1793 | 1794 | .FriendsListChatSection.ChatRoomListContainerParent { 1795 | border-top: 1px solid rgb(var(--border)) !important; 1796 | } 1797 | 1798 | .friendlistListContainer .friend.ingame .labelHolder { 1799 | padding-bottom: 2px!important; 1800 | } 1801 | 1802 | .FriendPicker .personanameandstatus_compactView_2PCWF .personanameandstatus_richPresenceLabel_3Q6g1 { 1803 | margin-top: 5px!important;} 1804 | 1805 | .currentUserAvatar, .currentUserAvatar .avatarFrame { 1806 | width: 34px!important; 1807 | height: 34px!important; 1808 | } 1809 | 1810 | /* .addonpicker_ItemList_275Oe .addonpicker_Item_34KHH, */ 1811 | .addonpicker_Tab_10fDn, .addonpicker_ItemList_275Oe { 1812 | cursor: default!important;} 1813 | 1814 | .addonpicker_Tab_10fDn.addonpicker_Active_2J8Y1 { 1815 | border-bottom: 4px solid rgb(var(--focus)) !important;} 1816 | 1817 | .addonpicker_Tab_10fDn:hover:not(.addonpicker_Active_2J8Y1) { 1818 | background-color: rgba(var(--white05)) !important; 1819 | border-bottom: 4px solid transparent!important;} 1820 | 1821 | .addonpicker_Tab_10fDn .addonpicker_TabContent_1oDFo:hover:not(.addonpicker_Active_2J8Y1) { 1822 | background-color: transparent !important;} 1823 | 1824 | /*emoticon code popup*/ 1825 | .emoticon_EmoticonHover_1ME8O { 1826 | background-color: rgba(var(--scrollbarBG)) !important;} 1827 | 1828 | .emoticon_hover_title, .addonpicker_SectionedPageTitle_3rqU_, .addonpicker_SectionTitle_1YfVL { 1829 | color: rgb(var(--offline))!important;} 1830 | 1831 | .emoticon_PickerTab_1tnGG svg { 1832 | width: 20px!important; 1833 | height: 20px!important; 1834 | stroke: rgb(var(--white))!important; 1835 | padding-top: 4px!important; 1836 | } 1837 | 1838 | .emoticon_PickerTab_1tnGG.emoticon_Clock_340rx svg.SVGIcon_Button.SVGIcon_Clock { 1839 | width: 18px!important; 1840 | height: 18px!important; 1841 | padding-right: 0.5px!important; 1842 | stroke: none!important;} 1843 | 1844 | .addonpicker_FilterInputContainer_1RAg8 .addonpicker_FilterInput_2tfTm, .addonpicker_FilterInputContainer_1RAg8 .addonpicker_FilterInput_2tfTm:hover, .addonpicker_FilterInputContainer_1RAg8 .addonpicker_FilterInput_2tfTm:focus { 1845 | background-color: rgb(var(--textentry))!important;} 1846 | 1847 | .addonpicker_Tabs_1WUqY { 1848 | background-color: rgb(var(--header_dark))!important; 1849 | border-bottom: 1px solid rgb(var(--border))!important;} 1850 | 1851 | .title-area-icon .SVGIcon_Maximize, .title-area-icon .SVGIcon_Minimize { 1852 | margin-left: 5px!important;} 1853 | 1854 | .msg.EmojiOnly { 1855 | line-height: 32px!important;} 1856 | 1857 | .messages_MsgWithAddons_lFLbk:hover { 1858 | background-color: #3d4737; 1859 | } 1860 | 1861 | .chatWindow .chatEntry { 1862 | background-color: #3d4737!important; 1863 | 1864 | } 1865 | 1866 | .messages_MsgWithAddons_lFLbk .messages_Addons_1aOXJ { 1867 | background-color: #3d4737; 1868 | } 1869 | 1870 | .friendGroup .groupName { 1871 | color: #a19849 !important; 1872 | } 1873 | 1874 | 1875 | .friendsListContainer { 1876 | border: 1px solid #808080; 1877 | } 1878 | 1879 | .chatentry_chatTextarea_3e__5 { 1880 | border: 0.5px solid #5a6a50; 1881 | } 1882 | 1883 | .friendListFooter { 1884 | border-bottom: 1px solid; 1885 | } 1886 | 1887 | .unreadFriend .FriendMessageCount { 1888 | background: rgba(218, 149, 0, 0.35) !important; 1889 | } 1890 | --------------------------------------------------------------------------------