Discord-like appearance.
// ==UserScript==
// @name kogama
// @namespace https://www.youtube.com/channel/UCG7KVL-2EUV4SL0m7jObKng
// @description Discord-like appearance.
// @author For my life
// @homepage https://www.youtube.com/channel/UCG7KVL-2EUV4SL0m7jObKng
// @include https://www.kogama.com/*
// @include https://friends.kogama.com/*
// @include https://kogama.com.br/*
// @run-at document-start
// @version 0.2
// ==/UserScript==
(function() {var css = [
".kb-status-menu {",
" left: 100%;",
"}",
"",
"/* ##### GENERAL STYLES ##### */",
"/* Page Body */",
"body {",
" background-color: #36393F !important;",
" background-image: none !important;",
" padding-top: 0px !important;",
"}",
"",
"/* Page Header */",
"header#pageheader {",
" background-color: #202225 !important;",
" height: 100% !important;",
" width: 72px !important;",
"}",
"",
"/* Page Content, Footer */",
"div#content, footer {",
" margin-left: 72px;",
" width: unset !important;",
"}",
"",
"/* ##### NAVIGATION MENU ##### */",
"",
"/* Navigation Menu Text */",
"nav.menu li span {",
" display: none !important;",
" position: relative;",
" right: -48px;",
" top: -30px;",
" padding-left: 10px !important;",
" padding-right: 10px !important;",
" background-color: #000;",
" border-radius: 5px;",
" text-transform: none !important;",
" font-weight: normal !important;",
" font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif;",
" width: max-content;",
"}",
"nav.menu li:hover span {",
" display: block !important;",
"}",
"nav.menu li:hover span::after {",
" content: \" \";",
" position: absolute;",
" top: 50%;",
" right: 100%;",
" margin-top: -5px;",
" border-width: 5px;",
" border-style: solid;",
" border-color: transparent black transparent transparent;",
"}",
"",
"/* Navigation Menu Items */",
"nav.menu ol {",
" margin-left: 4px;",
"}",
"nav.menu li {",
" border-radius: 50%;",
" background-color: #2F3136;",
" width: 48px;",
" height: 48px;",
" text-align: center;",
" margin-top: 10px;",
" transition: 200ms;",
"}",
"nav.menu li:hover {",
" background-color: #7289DA;",
" border-radius: 25%;",
" transition: 200ms;",
"}",
"nav.menu li:hover a {",
" border-bottom: none !important;",
"}",
"nav.menu li.active a {",
" background-color: unset !important;",
" border-bottom: none !important;",
"}",
"",
"/* Main Logo */",
"a.logo {",
" float: unset !important;",
"}",
".logo-image {",
" display: block !important;",
" border-radius: 50%;",
" width: 48px !important;",
" height: 48px !important;",
" margin: unset !important;",
" margin-top: 20px !important;",
" margin-left: 4px !important;",
" transition: 200ms;",
"}",
".logo-image:hover {",
" border-radius: 25% !important;",
" transition: 200ms;",
"}",
"",
"/* Player Meta Bar (XP, Gold, Profile Picture)*/",
"#meta-nav {",
" position: unset !important;",
" margin-left: 16px;",
"}",
"#meta-nav .gold span, #meta-nav .xp-bar {",
" display: none !important;",
"}",
"",
"#header-icon {",
" padding-left: 0px !important;",
"}",
"",
"/* Extended Profile Options Tab */",
"#profile-extended {",
" top: 0px !important;",
" left: 72px !important;",
" width: calc(100% - 72px) !important;",
" max-width: unset !important;",
" box-shadow: none !important;",
" -webkit-box-shadow: none !important;",
" background-color: #36393F !important;",
"}",
"#profile-extended h4, #profile-extended section.user-credits {",
" box-shadow: none !important;",
" -webkit-box-shadow: none !important;",
" background-color: #2F3136 !important;",
"}",
"#profile-extended .arrow-top {",
" border-color: #2F3136 transparent transparent !important;",
"}",
"",
"/* ##### NOTIFICATIONS PANEL ##### */",
"#notify .container {",
" position: fixed !important;",
" top: 0px !important;",
" left: 72px !important;",
" width: calc(100% - 372px);",
" height: 100% !important;",
" max-width: none !important;",
" margin: 0px !important;",
"}",
"#notify .exit {",
" top: 0px !important;",
" right: 0px !important;",
"}",
"#notify .sections {",
" max-height: none !important;",
"}",
"#notify .container {",
" background-color: #36393F !important;",
"}",
"#notify header {",
" background-color: #2F3136 !important;",
" height: 48px !important;",
"}",
"#notify .sections-container {",
" padding-top: 48px !important;",
"}",
"#notify-counters {",
" flex: 1 1 auto !important;",
"}",
"#notify-messages {",
" flex: 3 3 auto !important;",
"}",
"#notify .text {",
" color: #C6C7C9 !important;",
"}",
"",
"/* ##### FRIENDS LIST STYLES ##### */",
"",
"/* Friends List Username Header */",
"._3TORb {",
" background-color: #23272A !important;",
"}",
"",
"/* Friends List Section */",
"#chat-extended-side {",
" height: 100% !important;",
"}",
"._1Yhgq {",
" font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif;",
" background-color: #2F3136 !important;",
"}",
"",
"/* Friends List Headers */",
"._1Yhgq header {",
" color: hsla(0,0%,100%,.4) !important;",
" white-space: nowrap !important;",
" text-overflow: ellipsis !important;",
" overflow: hidden !important;",
" text-transform: uppercase !important;",
" font-size: 13px !important;",
" line-height: 20px !important;",
" font-weight: 600 !important;",
" padding-right: 8px !important;",
" padding-left: 16px !important;",
" padding-top: 20px !important;",
" height: 40px !important;",
" letter-spacing: .05em !important;",
"}",
"",
"/* Friend List Card */",
"._1lvYU {",
" padding: 0.6em !important;",
"}",
"._1lvYU:hover {",
" background-color: #36393F;",
"}",
"",
"/* Friends List: Profile Picture */",
".UA3TP ._3tYRU, .UA3TP rect {",
" clip-path: circle();",
"}",
"",
"/* Friends List: Elite Frame */",
".UA3TP img[src$=\"svg\"] {",
" transform: scale(1.1);",
" top: 2px;",
"}",
"",
"/* Friends List: Status Indicator */",
".UA3TP._1fWKe .Hkdag {",
" clip-path: circle(18%);",
" transform: none;",
" left: 12px;",
" top: 15px;",
"}",
"",
"/* Friends List: Online Indicator (Polygon) */",
"[fill=\"#e0ff13\"], [fill=\"#61bd07\"], [fill=\"#95db00\"] {",
" fill: #43B581;",
"}",
"",
"/* Friends List: Offline Indicator (Polygon) */",
"[fill=\"#d2d2d2\"], [fill=\"#aaaaaa\"], [fill=\"#bdbdbd\"] {",
" display: none;",
"}",
"",
"/* Friends List: Offline grayscale */",
"div._1Yhgq > header:nth-of-type(2) ~ div._1lvYU {",
" opacity: 0.6;",
" filter: grayscale(0.8);",
"}",
"div._1Yhgq > header:nth-of-type(2) ~ div._1lvYU:hover {",
" opacity: 1;",
" filter: none;",
"}",
"",
"/* Friends List: Username */",
"._1lvYU ._3zDi- {",
" color: #B9BBBE;",
"}",
"._1lvYU:hover ._3zDi- {",
" color: #FFF;",
"}",
"",
"/* Friends List: Playing Message */",
"._1lvYU .PTP5j {",
" color: #72767D !important;",
"}",
"._1lvYU:hover .PTP5j {",
" color: #FFF !important;",
"}",
"",
"/* Friends List: Offline Message */",
"._40qZj:not(.PTP5j) {",
" display: none;",
"}",
"",
"/* Friends List: Join Button */",
".WXeh0 {",
" background-color: #7289DA !important;",
"}",
"",
"/* ##### PROFILE PAGE STYLES ##### */",
"",
"/* Profile Badges - Overflow Wrap */",
"#profile-badges ul.badges {",
" flex-wrap: wrap !important;",
" position: unset !important;",
"}",
"#profile-badges {",
" width: auto !important;",
" height: auto !important;",
" margin-right: 32px;",
"}",
"",
"/* Profile Background */",
"#profile-page .background-avatar {",
" background-image: -o-linear-gradient(45deg,hsla(0,0%,5%,.1) 25%,transparent 0,transparent 50%,hsla(0,0%,5%,.1) 0,hsla(0,0%,5%,.1) 75%,transparent 0,transparent) !important;",
" background-image: -webkit-linear-gradient(45deg,hsla(0,0%,5%,.1) 25%,transparent 0,transparent 50%,hsla(0,0%,5%,.1) 0,hsla(0,0%,5%,.1) 75%,transparent 0,transparent) !important;",
" background-image: linear-gradient(45deg,hsla(0,0%,5%,.1) 25%,transparent 0,transparent 50%,hsla(0,0%,5%,.1) 0,hsla(0,0%,5%,.1) 75%,transparent 0,transparent) !important;",
" filter: none !important;",
"}",
"#profile-page .section-top-background {",
" background-image: none !important;",
" background-color: rgba(0,0,0,.1) !important;",
"}",
"",
"/* Profile: Username / Progress - Desktop */",
"@media only screen and (min-width: 1000px) and (orientation: landscape) {",
" .section-top > .progression {",
" display: flex;",
" justify-content: center;",
" transform: translateX(-8%);",
" }",
" .section-top > .progression > .level {",
" padding: 0 !important;",
" }",
" .section-top > .username > h2 {",
" text-align: center;",
" transform: translateX(-10%);",
" }",
" .section-top > .username a {",
" line-height: 4rem;",
" font-size: 3rem;",
" }",
"}",
"",
"/* ##### CHAT STYLES ##### */",
".zUJzi {",
" bottom: unset;",
" top: 0px;",
" left: 72px;",
" width: calc(100% - 372px);",
" height: 100%;",
" background-color: #2f3136",
"}",
"._375XK{",
" background-color: #36393f;",
"}",
"",
"/* Friend List section */",
".uwn5j{",
" background-color: #2f3136;",
" margin-top: 200px !important;",
"}",
"",
"",
"/* Friend List Headers */",
"",
"._3DYYr ._28mON header{",
" color: #72767d",
"}",
"",
"._3DYYr._2dPu4 ._28mON header{",
" color: #fff;",
"}",
"",
"._3DYYr",
"._3DYYr._2dPu4{",
" box-sizing: border-box;",
" margin: 1px 0 1px 8px;",
" height: 24px !important;",
" width: auto !important;",
"}",
"",
"._3DYYr._2dPu4{",
" background-color: rgba(79,84,92,.6);",
" text-decoration: none;",
" font-weight: 400;",
" height: 40px;",
" padding: 8px;",
" border-radius: 3px;",
"}",
"",
"._3DYYr:hover{",
" background-color: #292b2f !important;",
" text-decoration: none;",
" font-weight: 400;",
" height: 40px;",
" padding: 8px;",
" border-radius: 3px;",
"}",
"",
"",
"",
".zUJzi .o_DA6 .uwn5j ._3DYYr._2dPu4{",
" border-left-width: 0px;",
"}",
"/* No last message appearing at bottom of Chat header */",
"._3DYYr ._1j2Cd,",
"._3DYYr._2dPu4 ._1j2Cd{",
" display: none !important;",
"}",
"",
"/* Size fix Chat tickets header */",
"._28mON{",
"font-size: 25px !important",
"}",
"",
"/*Message Box*/",
"",
"._1j2Cd._1Xzzq{",
" text-align: left !important;",
" background-color: rgba(79,84,92,.6);",
" border-radius: 3px",
"}",
"",
" ._1j2Cd._1Xzzq,",
"._1j2Cd.undefined",
" {",
" border-top-style: solid;",
" padding: 1;",
" border-top-width: 1px;",
" border-top-color: hsla(0,0%,100%,.04) !important;",
" }",
"",
" ._375XK ._2XaOw ._1j2Cd._1Xzzq p{",
" font-size: 15px;",
" color: #fffe !important;",
" background-color: rgba(0, 0, 0, 0);",
" box-shadow: none;",
" padding-right: 5px;",
" padding-top: 10px;",
" padding-bottom: 2px;",
" }",
"",
"._375XK ._2XaOw ._1j2Cd p{",
" font-size: 15px;",
" color: #fffe !important;",
" background-color: rgba(0, 0, 0, 0);",
" box-shadow: none;",
" padding-left: 5px;",
" padding-top: 10px;",
" padding-bottom: 2px;",
" }",
"",
"",
"/*Text Box*/",
"._375XK textarea{",
" background-color: rgba(114,118,125,.3) !important; /*AAAA dis hard*/",
" border-top: 1px solid hsla(0,0%,100%,.06) !important;",
" border-radius: 5px;",
" margin-top: 20px;",
" padding-top: 20px;",
" margin-left: 20px;",
" margin-right: 20px;",
" margin-bottom: 30px;",
"",
" color: hsla(0,0%,100%,.7);",
" resize: none;",
" border: none;",
" appearance: none;",
" font-weight: 400;",
" font-size: 0.9375rem;",
" line-height: 1.25rem;",
" letter-spacing: -0.025rem;",
" max-height: 144px;",
" width: 100%;",
" min-height: 20px;",
" margin: 2px 2px 2px 0;",
" padding: 10px;",
"}",
"",
"._375XK textarea.kb_ignore::placeholder{",
" color: hsla(0,0%,100%,.7)",
"}",
"",
"._375XK textarea.kb_ignore{",
"}",
"",
"/* ##### FEED STYLES ##### */",
"#profile-news-feed ul.news-feed-thumbs > li.item {",
" background-color: #2F3136 !important;",
"}",
"",
"/*Text*/",
"#profile-news-feed ul.news-feed-thumbs > li.item {",
" color: #dcddde;",
" font-weight: inherit;",
" font-style: inherit;",
" font-family: inherit;",
" clear: inline-end;",
"}",
"",
"/*Author*/",
"#profile-news-feed ul.news-feed-thumbs > li.item .feed-header .feed-text .user {",
" color: #fff;",
" font: inherit;",
" font-size: 16px;",
" min-width: 0;",
" white-space: nowrap;",
" text-overflow: ellipsis;",
" overflow: hidden;",
"}",
"",
"/*Author comment*/",
"#root-page-mobile #profile-news-feed .feed-comments .comments ul.comment-list li .body .username a{",
"color: #fff",
"}",
"#root-page-mobile #profile-news-feed .feed-comments .comments ul.comment-list li .body:hover .username a{",
"color: hsla(0,0%,100%,.2)",
"}",
"",
"/*Text comment*/",
"#root-page-mobile #profile-news-feed .feed-comments .comments ul.comment-list li .body{",
"color: #dcddde",
"}",
"",
"/* Time comment*/",
"#root-page-mobile #profile-news-feed .feed-comments .comments ul.comment-list li .header .time{",
"color: hsla(0,0%,100%,.2)",
"}",
"",
"/*Time*/",
"#profile-news-feed ul.news-feed-thumbs > li.item .feed-header .feed-time {",
" font-weight: inherit;",
" font-style: inherit;",
" font-family: inherit;",
" font-size: 16px;",
" padding-right: 50%;",
" text-transform: none;",
" display: inline;",
"}",
"",
"/*Reply box*/",
"#root-page-mobile #profile-news-feed .feed-comments .comments form textarea {",
" background-color: rgba(114,118,125,.3) !important; /*AAAA dis hard*/",
" border-top: 1px solid hsla(0,0%,100%,.06) !important;",
" border-radius: 5px;",
" margin-top: 20px;",
" padding-top: 20px;",
" margin-left: 20px;",
" margin-right: 20px;",
" margin-bottom: 30px;",
"",
" color: hsla(0,0%,100%,.7);",
" resize: none;",
" border: none;",
" appearance: none;",
" font-weight: 400;",
" font-size: 0.9375rem;",
" line-height: 1.25rem;",
" letter-spacing: -0.025rem;",
" max-height: 144px;",
" width: 100%;",
" min-height: 20px;",
" margin: 2px 2px 2px 0;",
" padding: 10px;",
"}",
"",
"/*Page browser*/",
"#profile-news-feed ul.news-feed-thumbs > li.item .feed-comments .comments .paging .paginator a{",
"color: hsla(0,0%,100%,.83)",
"}",
"#profile-news-feed ul.news-feed-thumbs > li.item .feed-comments .comments .paging .paginator a:hover{",
"color: hsla(0,0%,100%,.2)",
"}",
"",
"/* #### GAME PAGE STYLES ####*/",
".game-item{",
"box-shadow: 0 6px 18px rgba(32,34,37,.6);",
"}",
"",
"",
".game-item:hover{",
"-moz-transform: rotateX(0deg) rotateY(0deg) scale(1) translateZ(0px);",
" transform-style: preserve-3d;",
" backface-visibility: hidden;",
"}"
].join("\n");
if (typeof GM_addStyle != "undefined") {
GM_addStyle(css);
} else if (typeof PRO_addStyle != "undefined") {
PRO_addStyle(css);
} else if (typeof addStyle != "undefined") {
addStyle(css);
} else {
var node = document.createElement("style");
node.type = "text/css";
node.appendChild(document.createTextNode(css));
var heads = document.getElementsByTagName("head");
if (heads.length > 0) {
heads[0].appendChild(node);
} else {
// no head yet, stick it whereever
document.documentElement.appendChild(node);
}
}
})();