Last active
October 4, 2018 05:47
-
-
Save werrpy/5749130053677b8e14c293aa6bca5a95 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* 2014 material design colors from https://material.io/design/color/the-color-system.html#tools-for-picking-colors */ | |
| /* | |
| Green | |
| 50 #E8F5E9 | |
| 100 #C8E6C9 | |
| 200 #A5D6A7 | |
| 300 #81C784 | |
| 400 #66BB6A | |
| 500 #4CAF50 | |
| 600 #43A047 | |
| 700 #388E3C | |
| 800 #2E7D32 | |
| 900 #1B5E20 | |
| A100 #B9F6CA | |
| A200 #69F0AE | |
| A400 #00E676 | |
| A700 #00C853 | |
| Red | |
| 50 #FFEBEE | |
| 100 #FFCDD2 | |
| 200 #EF9A9A | |
| 300 #E57373 | |
| 400 #EF5350 | |
| 500 #F44336 | |
| 600 #E53935 | |
| 700 #D32F2F | |
| 800 #C62828 | |
| 900 #B71C1C | |
| A100 #FF8A80 | |
| A200 #FF5252 | |
| A400 #FF1744 | |
| A700 #D50000 | |
| */ | |
| :root { | |
| --color-light-blue: #81C784; | |
| --color-light-green: #81C784; | |
| --color-light-magenta: #81C784; | |
| --color-light-purple: #81C784; | |
| --color-light-red: #E57373; | |
| --color-400: #66BB6A; | |
| --color-blue: #F44336; | |
| --color-green: #4CAF50; | |
| --color-yellow: #4CAF50; | |
| --color-magenta: #43A047; | |
| --color-red: #2E7D32; | |
| --color-dark-green: #2E7D32; | |
| --color-A400: #00E676; | |
| --color-purple: #00C853; | |
| --color-dark-blue: #181818; | |
| --color-dark-red: #181818; | |
| --movie-overlay: radial-gradient(circle at 20% 50%, rgba(0, 0, 0, 1) 5.46%, rgba(46, 125, 50, 0.46)); | |
| --background-pipe: url("https://www.themoviedb.org/assets/1/v4/account_pipes/green-79a9507a08a7e5a9b8c643a69026fe46191c45972cb45b944ab4b5f8a9110b03.svg"); | |
| --gradient-background: radial-gradient(at 30% top, #074034 0%, #081c24 70%); | |
| } | |
| body { | |
| background-color: var(--color-dark-blue); | |
| } | |
| .btn-primary, .label-primary { | |
| background-color: var(--color-purple); | |
| background-image: none; | |
| } | |
| .btn-info, .label-info { | |
| background-color: var(--color-magenta); | |
| background-image: none; | |
| } | |
| .btn-success { | |
| background-color: var(--color-green); | |
| background-image: none; | |
| } | |
| .btn-warning { | |
| background-color: var(--color-yellow); | |
| background-image: none; | |
| } | |
| .btn-danger { | |
| background-color: var(--color-blue); | |
| background-image: none; | |
| } | |
| .btn:active, .btn:hover, .btn:focus, | |
| .btn:active:hover, .btn:active:focus, .btn:active:hover:focus { | |
| background-color: var(--color-light-purple) !important; | |
| background-image: none; | |
| } | |
| .btn-danger:hover { | |
| background-color: var(--color-light-red) !important; | |
| background-image: none; | |
| } | |
| #hoeapp-wrapper, #main-content, .inner-content { | |
| background-color: var(--color-dark-blue); | |
| } | |
| .hoe-right-header[hoe-color-type="header-bg5"] { | |
| background: #1f1f1f; | |
| } | |
| #hoeapp-container[hoe-color-type="lpanel-bg5"].hoe-minimized-lpanel #hoe-left-panel { | |
| background: #1f1f1f; | |
| } | |
| .ratio-bar { | |
| background-color: #2b2b2b; | |
| margin-bottom: 0; | |
| border-bottom: 1em solid black; | |
| } | |
| .ratio-bar .badge-user { | |
| background-color: #373737; | |
| } | |
| .nav-tabs > #active { | |
| background-color: var(--color-dark-green); | |
| } | |
| .btn-primary :hover { | |
| background-color: var(--color-light-purple); | |
| } | |
| /* dark header menus */ | |
| .hoe-right-header .hoe-rheader-submenu > .dropdown-menu > li { | |
| border-bottom: none; | |
| } | |
| .hoe-right-header .hoe-rheader-submenu > .dropdown-menu > li > a, | |
| .hoe-right-header .hoe-rheader-submenu > .dropdown-menu > li > a > .fa { | |
| color: #fff; | |
| } | |
| .hoe-left-header, | |
| #hoeapp-container[hoe-color-type="lpanel-bg5"] #hoe-left-panel, | |
| #hoeapp-container[hoe-color-type="lpanel-bg5"] #hoe-left-panel .panel-list > li > a, | |
| .hoe-right-header .hoe-rheader-submenu > .dropdown-menu > li > a { | |
| background: #1f1f1f; | |
| } | |
| .hoe-right-header .hoe-rheader-submenu > .dropdown-menu > li > a:focus, | |
| .hoe-right-header .hoe-rheader-submenu > .dropdown-menu > li > a:hover, | |
| #hoeapp-container[hoe-color-type="lpanel-bg5"] #hoe-left-panel .panel-list > li > a:hover { | |
| background: #151515; | |
| } | |
| #hoeapp-container[hoe-color-type="lpanel-bg5"] #hoe-left-panel .panel-list > li > a { | |
| border-top: 1px solid #151515; | |
| } | |
| #main-content { | |
| background: url("https://steamcdn-a.akamaihd.net/steamcommunity/public/images/items/335590/9a9adbcf4ff7698ba5ce5d6c122a2b6564971816.jpg"); | |
| background-position: center; | |
| background-size: 125%; | |
| } | |
| .text-green { | |
| color: #3fb618; | |
| } | |
| i.torrent-icon, .carousel-control > .glyphicon { | |
| color: var(--color-blue); | |
| } | |
| .col-md-10 { | |
| background-color:#2b2b2b; | |
| margin-top: 15px; | |
| padding-top: 10px; | |
| } | |
| .panel-chat > .panel-body > #frame > .content { | |
| background-color: var(--color-dark-blue); | |
| } | |
| #l-footer { | |
| background-color:#1f1f1f; | |
| } | |
| .notify .point { | |
| background-color: var(--color-A400); | |
| } | |
| .notify .heartbit { | |
| border: 4px solid var(--color-A200); | |
| } | |
| .message-sent .message-headers, | |
| .message-unread .message-headers, | |
| .message-sent .message-body, | |
| .message-unread .message-body { | |
| background-color: #404040; | |
| } | |
| .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, | |
| .topic-info { | |
| color: #fff; | |
| } | |
| .progress-bar { | |
| background-color: var(--color-magenta); | |
| border-bottom: 4px solid var(--color-red) !important; | |
| } | |
| select, select option { | |
| background-color: #454545 !important; | |
| } | |
| .form-control { | |
| background-color: rgba(255, 255, 255, 0.16); | |
| color: #fff; | |
| border: 2px solid rgba(0, 0, 0, 0.56); | |
| } | |
| .form-control:focus { | |
| box-shadow: 0 0 5px var(--color-light-blue); | |
| border: 1px solid var(--color-light-blue); | |
| } | |
| .form-control > option { | |
| background-color: #616161; | |
| } | |
| .decoda-code, .decoda-quote { | |
| border: 1px solid var(--color-light-blue); | |
| } | |
| .decoda-quote { | |
| margin: 0 15px 15px 15px; | |
| } | |
| .movie-overlay { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background-image: var(--movie-overlay); | |
| } | |
| .text-info, | |
| .disk-good { | |
| color: var(--color-400); | |
| } | |
| .badge-extra { | |
| border: 1px solid rgba(66, 70, 92, 0.61); | |
| border-radius: 0px; | |
| } | |
| .text-purple, | |
| .text-orange, | |
| .text-danger, | |
| .text-success, | |
| .text-pink, | |
| .fa-coins { | |
| color: var(--color-400); | |
| } | |
| .alert-danger, .panel-danger, .panel-danger > .panel-heading, | |
| .alert-success, .panel-success, .panel-success > .panel-heading, | |
| .alert-primary, .panel-primary, .panel-primary > .panel-heading, | |
| .alert-warning, .panel-warning, .panel-warning > .panel-heading, | |
| .alert-default, .panel-default, .panel-default > .panel-heading, | |
| .alert-info, .btn-info, .panel-info, .panel-info > .panel-heading { | |
| background-color: var(--color-magenta) !important; | |
| } | |
| .alert { | |
| color: #424242; | |
| } | |
| .alert > h2, | |
| .alert > h2 > strong, | |
| .panel > .panel-heading > h2, | |
| .panel > .panel-heading > h4, | |
| .panel > .panel-heading > div > h2, | |
| .panel > .panel-heading > div > h4, | |
| .movie-title > a { | |
| color: #000; | |
| } | |
| .panel-chat > .panel-heading > h4 { | |
| color: #fff; | |
| } | |
| .panel-collapse > .panel-heading { | |
| background-color: #1b1b1b !important; | |
| } | |
| .badge-user { | |
| border-radius: 0px; | |
| } | |
| .container.box { | |
| background: #1f1f1f; | |
| box-shadow: 2px 2px 4px 2px rgba(0,0,0,0.20); | |
| } | |
| .list-inline { | |
| color: inherit; | |
| } | |
| .gradient.silver, | |
| .gradient.pink, | |
| .gradient.purple, | |
| .gradient.green, | |
| .gradient.teal, | |
| .gradient.light_blue, | |
| .gradient.blue, | |
| .gradient.orange, | |
| .gradient.yellow, | |
| .gradient.red { | |
| background-image: var(--gradient-background); | |
| } | |
| div.header.silver div.inner_content, | |
| div.header.pink div.inner_content, | |
| div.header.purple div.inner_content, | |
| div.header.green div.inner_content, | |
| div.header.teal div.inner_content, | |
| div.header.light_blue div.inner_content, | |
| div.header.blue div.inner_content, | |
| div.header.orange div.inner_content, | |
| div.header.yellow div.inner_content, | |
| div.header.red div.inner_content, | |
| #l-footer { | |
| background-image: var(--background-pipe) !important; | |
| } | |
| /* tree */ | |
| .banner > .fa-rocket:before, | |
| .banner > .fa-headphones:before { | |
| content: "\f1bb"; | |
| } | |
| /* history table restores */ | |
| .table > tbody > tr > td.text-green { | |
| color: #3fb618 !important; | |
| } | |
| .table > tbody > tr > td.text-red { | |
| color: var(--color-light-red) !important; | |
| } |
Author
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
https://cdn.rawgit.com/werrpy/5749130053677b8e14c293aa6bca5a95/raw/3dea1e40dcb567df45a1b09c12fd16593e721cb7/xmas.css
uses Valve's xmas lights background