Last active
November 25, 2024 22:51
-
-
Save Nick2bad4u/a35889f3eae7d70d4cd2496515a19777 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
| /* ==UserStyle== | |
| A collection of SteamStat.us Userstyles | |
| ==/UserStyle== */ |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Brawlhalla | |
| @version 20241115.16.05 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Brawlhalla Theme with Advanced CSS | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with Brawlhalla colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #0078ff; | |
| /* Brawlhalla Blue */ | |
| text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.21); | |
| background: linear-gradient(135deg, #0078ff 30%, #ffd700 70%); | |
| -webkit-text-stroke-width: 2px; | |
| -webkit-text-stroke-color: black; | |
| /* Blue to Gold gradient */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 2s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: scale(1); | |
| } | |
| 100% { | |
| transform: scale(1.05); | |
| } | |
| } | |
| /* Logo addition with scaling effect */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 200px; | |
| height: 60px; | |
| background: url('https://static.wikia.nocookie.net/brawlhalla_gamepedia/images/1/14/Brawlhalla_Logo_100M_Full.png') | |
| no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.2); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #0078ff; | |
| /* Brawlhalla Blue */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #ffd700; | |
| /* Brawlhalla Gold */ | |
| text-decoration: underline; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); | |
| } | |
| /* Status colors with Brawlhalla theme */ | |
| .good { | |
| color: #ffd700; | |
| /* Brawlhalla Gold */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ffffff; | |
| /* White for minor status */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #0078ff; | |
| /* Brawlhalla Blue */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling with hover effect */ | |
| #js-refresh { | |
| color: #0078ff; | |
| /* Brawlhalla Blue */ | |
| text-shadow: 0 0 2px rgb(0, 0, 0); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #ffd700; | |
| /* Brawlhalla Gold */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with blue background and gold accents */ | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(135deg, #0078ff 30%, #ffd700 70%); | |
| /* Brawlhalla Blue */ | |
| border: 1px solid #ffd700; | |
| /* Brawlhalla Gold border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 2px rgb(0, 0, 1); | |
| box-shadow: 0px 4px 8px rgb(0, 0, 0); | |
| color: #ffffff; | |
| /* White text */ | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover { | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.5); | |
| background: rgba(0, 0, 0, 0.94); | |
| /* Blue on hover */ | |
| } | |
| /* Body styling with blue and gold gradient */ | |
| body { | |
| margin: 0; | |
| color: #0078ff; | |
| /* Brawlhalla Blue */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: url('https://cms.brawlhalla.com/c/uploads/2023/05/AllUnlocked_1920x1080.jpg') | |
| repeat-y; | |
| /* Blue to Gold gradient */ | |
| text-shadow: 1px 1px 3px rgb(0, 0, 0); | |
| transition: background 0.3s ease; | |
| } | |
| body:hover { | |
| background: url('https://cms.brawlhalla.com/c/uploads/2023/05/AllUnlocked_1920x1080.jpg') | |
| repeat-y; | |
| /* White to Blue gradient */ | |
| } | |
| /* Tooltip customization with smooth transition */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #0078ff; | |
| /* Brawlhalla Blue background */ | |
| color: #ffd700; | |
| /* Brawlhalla Gold text */ | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| font-style: italic; | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Advanced feature: Gradient border with transition */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 10px; | |
| border-radius: 5px; | |
| background-color: #ffd700; | |
| /* Brawlhalla Gold */ | |
| color: #ffffff; | |
| /* White text */ | |
| font-weight: bold; | |
| text-align: center; | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #ffd700, #0078ff, #ffd700, #0078ff); | |
| /* Gold to Blue */ | |
| background-size: 400% 400%; | |
| border-radius: 5px; | |
| z-index: -1; | |
| animation: gradient-border 3s linear infinite; | |
| } | |
| /* Animation for gradient border */ | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 400% 0%; | |
| } | |
| 50% { | |
| background-position: 0% 100%; | |
| } | |
| 100% { | |
| background-position: 400% 0%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered Christmas Theme | |
| @version 20241115.16.06 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description Christmas style! | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Christmas-Themed Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #ffffff; | |
| text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8); | |
| background: linear-gradient(180deg, #ff0000, #ffffff, #008000); /* Red, White, Green */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| a { | |
| /* Christmas Links */ | |
| color: #ff4500; /* Festive Orange-Red */ | |
| text-decoration: none; | |
| text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #008000; /* Green for Hover */ | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Holly Green */ | |
| color: #008000; | |
| text-shadow: 1px 1px 1px rgb(0, 0, 0); | |
| } | |
| .minor { | |
| /* Festive Gold */ | |
| color: #ffd700; | |
| text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9); | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Bright Christmas Red */ | |
| color: #ff0000; | |
| text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9); | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refresh Indicator */ | |
| color: #ffd700; | |
| text-shadow: 0 0 1px rgba(255, 215, 0, 0.8); | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(180deg, #ff0000, #ffffff, #008000); /* Candy Cane Stripe Effect */ | |
| border: 2px solid #ffd700; /* Gold Border */ | |
| border-radius: 6px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 1px 0px 3px rgb(0, 0, 1, 1); | |
| text-decoration-color: black; | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8); | |
| outline: black; | |
| outline-style: auto; | |
| color: #ffffff; | |
| } | |
| body { | |
| margin: 0; | |
| color: #ffffff; | |
| background: linear-gradient(0deg, #ff0000, #008000); /* Christmas Red and Green */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.8); | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:before { | |
| /* Tooltip Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #008000; /* Green Background for Tooltip */ | |
| color: #ffd700; /* Gold Text */ | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.8); | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered Detroit Lions | |
| @version 20241115.16.03 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description Detroit Lions theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Detroit Lions Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #0076b6; | |
| /* Honolulu Blue */ | |
| text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); | |
| /* Subtle black shadow */ | |
| background: linear-gradient(145deg, #0076b6, #b0b7bc); | |
| /* Blue to Silver gradient */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| .title::after { | |
| /* Add Lions Logo to the Right */ | |
| content: ''; | |
| display: inline-block; | |
| width: 60px; | |
| height: 60px; | |
| background: url('https://upload.wikimedia.org/wikipedia/en/7/71/Detroit_Lions_logo.svg') | |
| no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| } | |
| a { | |
| color: #0076b6; | |
| /* Honolulu Blue */ | |
| text-decoration: none; | |
| text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); | |
| /* Light shadow */ | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #b0b7bc; | |
| /* Silver */ | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Blue for good statuses */ | |
| color: #0076b6; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| } | |
| .minor { | |
| /* Silver for minor issues */ | |
| color: #b0b7bc; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* White for major issues */ | |
| color: #ffffff; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in seconds */ | |
| color: #b0b7bc; | |
| text-shadow: 0 0 2px rgb(0, 0, 0); | |
| /* Subtle shadow */ | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #0076b6, #b0b7bc); | |
| /* Blue to Silver */ | |
| border: 1px solid #ffffff; | |
| /* White border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 1px rgb(0, 0, 1); | |
| /* Subtle shadow */ | |
| box-shadow: 0px 4px 8px rgb(0, 0, 0); | |
| color: #ffffff; | |
| /* White text */ | |
| } | |
| body { | |
| margin: 0; | |
| color: #0076b6; | |
| /* Honolulu Blue text */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgb(0, 0, 0); | |
| /* Subtle shadow */ | |
| font-weight: 300; | |
| background: linear-gradient(145deg, #0076b6, #b0b7bc); | |
| /* Blue to Silver background */ | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #ffffff; | |
| /* White box */ | |
| color: #0076b6; | |
| /* Honolulu Blue text */ | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| /* Subtle shadow */ | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Detroit Tigers | |
| @version 20241115.16.04 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Detroit Tigers Theme with Advanced CSS | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with Detroit Tigers colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #0c2340; | |
| /* Detroit Tigers Navy Blue */ | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6); | |
| background: linear-gradient(135deg, #0c2340 30%, #ffffff 70%); | |
| /* Navy Blue to White gradient */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 2s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: rotate(0deg); | |
| } | |
| 100% { | |
| transform: rotate(10deg); | |
| } | |
| } | |
| /* Logo addition with scaling effect */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 60px; | |
| height: 60px; | |
| background: url('https://upload.wikimedia.org/wikipedia/commons/e/e3/Detroit_Tigers_logo.svg') | |
| no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.2); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #0c2340; | |
| /* Detroit Tigers Navy Blue */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #fb4f14; | |
| /* Detroit Tigers Orange */ | |
| text-decoration: underline; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); | |
| } | |
| /* Status colors with Detroit Tigers theme */ | |
| .good { | |
| color: #fb4f14; | |
| /* Detroit Tigers Orange */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ffffff; | |
| /* White for minor status */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #0c2340; | |
| /* Detroit Tigers Navy Blue */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling with hover effect */ | |
| #js-refresh { | |
| color: #0c2340; | |
| /* Detroit Tigers Navy Blue */ | |
| text-shadow: 0 0 2px rgb(0, 0, 0); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #fb4f14; | |
| /* Detroit Tigers Orange */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with navy blue background and orange accents */ | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: #0c2340; | |
| /* Detroit Tigers Navy Blue */ | |
| border: 1px solid #fb4f14; | |
| /* Detroit Tigers Orange border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 1px rgb(0, 0, 1); | |
| box-shadow: 0px 4px 8px rgb(0, 0, 0); | |
| color: #ffffff; | |
| /* White text */ | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover { | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.5); | |
| background: rgba(0, 0, 0, 0.6); | |
| /* Navy Blue on hover */ | |
| } | |
| /* Body styling with navy blue and orange gradient */ | |
| body { | |
| margin: 0; | |
| color: #0c2340; | |
| /* Detroit Tigers Navy Blue */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: linear-gradient(135deg, #0c2340 30%, #fb4f14 70%); | |
| /* Navy Blue to White gradient */ | |
| text-shadow: 1px 1px 3px rgb(0, 0, 0); | |
| transition: background 0.3s ease; | |
| } | |
| body:hover { | |
| background: linear-gradient(135deg, #ffffff 30%, #0c2340 70%); | |
| /* White to Navy Blue gradient */ | |
| } | |
| /* Tooltip customization with smooth transition */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #0c2340; | |
| /* Detroit Tigers Navy Blue background */ | |
| color: #fb4f14; | |
| /* Detroit Tigers Orange text */ | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| font-style: italic; | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Advanced feature: Gradient border with transition */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 10px; | |
| border-radius: 5px; | |
| background-color: #fb4f14; | |
| /* Detroit Tigers Orange */ | |
| color: #ffffff; | |
| /* White text */ | |
| font-weight: bold; | |
| text-align: center; | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #fb4f14, #0c2340, #fb4f14, #0c2340); | |
| /* Orange to Navy Blue */ | |
| background-size: 400% 400%; | |
| border-radius: 5px; | |
| z-index: -1; | |
| animation: gradient-border 3s linear infinite; | |
| } | |
| /* Animation for gradient border */ | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 400% 0%; | |
| } | |
| 50% { | |
| background-position: 0% 100%; | |
| } | |
| 100% { | |
| background-position: 400% 0%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered Easter Style | |
| @version 20241115.16.03 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Re-Remastered Easter theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Easter Pastel Title - Improved Readability */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #ff69b4; | |
| /* Hot Pink for better contrast */ | |
| text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); | |
| /* Subtle black shadow for visibility */ | |
| background: linear-gradient(145deg, #ffd700, #ff69b4, #87ceeb); | |
| /* Bright Yellow, Hot Pink, Sky Blue */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| a { | |
| color: #6a5acd; | |
| /* Medium Slate Blue */ | |
| text-decoration: none; | |
| text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4); | |
| /* Light shadow */ | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #32cd32; | |
| /* Light Green */ | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Pastel Green */ | |
| color: #98fb98; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| } | |
| .minor { | |
| /* Lavender */ | |
| color: #e6e6fa; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Bright Yellow */ | |
| color: #ffd700; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #ff69b4; | |
| /* Hot Pink */ | |
| text-shadow: 0 0 2px rgba(255, 182, 193, 0.8); | |
| /* Pink shadow */ | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #ffdab9, #fffacd, #87ceeb); | |
| /* Peach, Lemon Chiffon, Sky Blue gradient */ | |
| border: 1px solid #ffd700; | |
| /* Bright Yellow border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4); | |
| /* Light shadow */ | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); | |
| color: #4b0082; | |
| /* Indigo */ | |
| } | |
| body { | |
| margin: 0; | |
| color: #6a5acd; | |
| /* Medium Slate Blue text */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| /* Light shadow */ | |
| font-weight: 300; | |
| background: linear-gradient(145deg, #ffb6c1, #ffdab9, #87ceeb); | |
| /* Pink, Peach, Sky Blue gradient */ | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #f0e68c; | |
| /* Khaki */ | |
| color: #32cd32; | |
| /* Light Green */ | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| /* Light shadow */ | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered - Green/Black Style | |
| @version 20241115.16.02 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Re-Remastered - Green/Black theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Black/Green Status Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #00ff00; | |
| text-shadow: 2px 2px 8px rgba(0, 255, 0, 0.8); | |
| } | |
| a { | |
| color: #32cd32; | |
| text-decoration: none; | |
| text-shadow: 1px 1px 4px rgba(50, 205, 50, 0.6); | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #ffffff; | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Bright Green */ | |
| color: #32cd32; | |
| text-shadow: 1px 1px 6px rgba(50, 205, 50, 0.8); | |
| } | |
| .minor { | |
| /* Light Green */ | |
| color: #98fb98; | |
| text-shadow: 1px 1px 6px rgba(152, 251, 152, 0.8); | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Dark Green */ | |
| color: #006400; | |
| text-shadow: 1px 1px 6px rgba(0, 100, 0, 0.8); | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #32cd32; | |
| text-shadow: 0 0 8px rgba(50, 205, 50, 0.8); | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #282a36, #191a21); | |
| border: 1px solid #32cd32; | |
| border-radius: 6px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.6); | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4); | |
| color: #f8f8f2; | |
| } | |
| body { | |
| margin: 0; | |
| color: #00ff00; | |
| background: #121212; | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #21222c; | |
| color: #00ff00; | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered Halloween Style | |
| @version 20241115.16.04 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description Halloween Style theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Halloween Orange/Purple/Black Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #ffa500; | |
| /* Bright Orange */ | |
| text-shadow: 1px 1px 1px rgba(75, 0, 130, 0.9); | |
| /* Purple shadow */ | |
| background: linear-gradient(145deg, #ffa500, #4b0082); | |
| /* Orange to Purple gradient */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| a { | |
| color: #4b0082; | |
| /* Purple */ | |
| text-decoration: none; | |
| text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #ffa500; | |
| /* Orange */ | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Pumpkin Orange */ | |
| color: #ff7518; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); | |
| /* Black shadow */ | |
| } | |
| .minor { | |
| /* Deep Purple */ | |
| color: #9932cc; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Blood Red */ | |
| color: #8b0000; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #4b0082; | |
| /* Purple */ | |
| text-shadow: 0 0 2px rgba(255, 165, 0, 0.8); | |
| /* Orange shadow */ | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #ffa500, #4b0082); | |
| /* Orange to Purple gradient */ | |
| border: 1px solid #ff7518; | |
| /* Pumpkin Orange border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8); | |
| /* Black shadow */ | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4); | |
| color: #f8f8f2; | |
| /* Ghost White */ | |
| } | |
| body { | |
| margin: 0; | |
| color: #ffa500; | |
| /* Bright Orange text */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| /* Black shadow */ | |
| font-weight: 300; | |
| background: linear-gradient(145deg, #000000, #4b0082); | |
| /* Black to Purple gradient */ | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #2c2c2c; | |
| /* Dark Gray */ | |
| color: #ffa500; | |
| /* Orange text */ | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(75, 0, 130, 0.8); | |
| /* Purple shadow */ | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered - Lime Green/Purple Style | |
| @version 20241115.16.03 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description Lime Green/Purple Theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Lime Green/Purple Status Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #32cd32; | |
| text-shadow: 1px 1px 1px rgba(55, 10, 63, 0.9); /* Black shadow added */ | |
| background: linear-gradient(145deg, #32cd32, #8a2be2); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| a { | |
| color: #8a2be2; | |
| text-decoration: none; | |
| text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); /* Black shadow added */ | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #32cd32; | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Lime Green */ | |
| color: #32cd32; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); /* Black shadow added */ | |
| } | |
| .minor { | |
| /* Light Purple */ | |
| color: #9370db; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); /* Black shadow added */ | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Bright Lime */ | |
| color: #adff2f; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); /* Black shadow added */ | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #8a2be2; | |
| text-shadow: 0 0 2px rgba(0, 0, 0, 0.8); /* Black shadow added */ | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #1c8e1c, #7016c3); | |
| border: 1px solid #8a2be2; | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8); /* Black shadow added */ | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4); | |
| color: #f8f8f2; | |
| } | |
| body { | |
| margin: 0; | |
| color: #32cd32; | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); /* Black shadow added */ | |
| font-weight: 300; | |
| background: linear-gradient(145deg, #32cd32, #8a2be2); | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #21222c; | |
| color: #32cd32; | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); /* Black shadow added */ | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Miami Heat Red & Black | |
| @version 20241115.16.04 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Miami Heat Red & Black Theme with Advanced CSS | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with red and black */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #98002e; | |
| /* Miami Heat Red */ | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6); | |
| background: linear-gradient(135deg, #98002e 30%, #fff 70%); | |
| /* Red to Black gradient */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 2s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: rotate(0deg); | |
| } | |
| 100% { | |
| transform: rotate(10deg); | |
| } | |
| } | |
| /* Logo addition with scaling effect */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 60px; | |
| height: 60px; | |
| background: url('https://upload.wikimedia.org/wikipedia/de/thumb/f/fb/Miami_Heat_logo.svg/442px-Miami_Heat_logo.svg.png') | |
| no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.2); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #98002e; | |
| /* Miami Heat Red */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #ffffff; | |
| /* White on hover for contrast */ | |
| text-decoration: underline; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); | |
| } | |
| /* Status colors with red and black theme */ | |
| .good { | |
| color: #98002e; | |
| /* Miami Heat Red */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ffffff; | |
| /* White for minor status */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #000000; | |
| /* Black for major status */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling with hover effect */ | |
| #js-refresh { | |
| color: #98002e; | |
| /* Miami Heat Red */ | |
| text-shadow: 0 0 2px rgb(0, 0, 0); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #ffffff; | |
| /* White on hover */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with black background and red accents */ | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: #000000; | |
| /* Black background */ | |
| border: 1px solid #98002e; | |
| /* Miami Heat Red border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 1px rgb(0, 0, 1); | |
| box-shadow: 0px 4px 8px rgb(0, 0, 0); | |
| color: #ffffff; | |
| /* White text */ | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover { | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.5); | |
| background: rgba(0, 0, 0, 0.6); | |
| /* Miami Heat Red on hover */ | |
| } | |
| /* Body styling with black and red gradient */ | |
| body { | |
| margin: 0; | |
| color: #98002e; | |
| /* Miami Heat Red */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: linear-gradient(135deg, #98002e 30%, #000000 70%); | |
| /* Red to Black gradient */ | |
| text-shadow: 1px 1px 3px rgb(0, 0, 0); | |
| transition: background 0.3s ease; | |
| } | |
| body:hover { | |
| background: linear-gradient(135deg, #000000 30%, #98002e 70%); | |
| /* Black to Red gradient */ | |
| } | |
| /* Tooltip customization with smooth transition */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #000000; | |
| /* Black background */ | |
| color: #98002e; | |
| /* Miami Heat Red text */ | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| font-style: italic; | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Advanced feature: Gradient border with transition */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 10px; | |
| border-radius: 5px; | |
| background-color: #98002e; | |
| /* Miami Heat Red */ | |
| color: #ffffff; | |
| /* White text */ | |
| font-weight: bold; | |
| text-align: center; | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #98002e, #000000, #98002e, #000000); | |
| /* Red to Black */ | |
| background-size: 400% 400%; | |
| border-radius: 5px; | |
| z-index: -1; | |
| animation: gradient-border 3s linear infinite; | |
| } | |
| /* Animation for gradient border */ | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 400% 0%; | |
| } | |
| 50% { | |
| background-position: 0% 100%; | |
| } | |
| 100% { | |
| background-position: 400% 0%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - NASCAR Theme | |
| @version 20241117.22.05 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - NASCAR Theme with Advanced CSS | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with NASCAR colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #00529b; | |
| /* NASCAR Blue */ | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6); | |
| background: linear-gradient(135deg, #d71920 30%, #ffd700 70%); | |
| /* Red to Yellow gradient */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 2s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| h1.title::after { | |
| filter: invert(1); | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: scale(1); | |
| } | |
| 100% { | |
| transform: scale(1.05); | |
| } | |
| } | |
| /* Logo placeholder (replace with your own logo URL if you have rights) */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 200px; | |
| height: 60px; | |
| background: url('https://upload.wikimedia.org/wikipedia/commons/6/67/NASCAR_logo_2017.svg') | |
| no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.2); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #00529b; | |
| /* NASCAR Blue */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #d71920; | |
| /* NASCAR Red */ | |
| text-decoration: underline; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); | |
| } | |
| /* Status colors with NASCAR theme */ | |
| .good { | |
| color: #ffd700; | |
| /* NASCAR Yellow */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ffffff; | |
| /* White for minor status */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #000000; | |
| /* Black for major status */ | |
| text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling with hover effect */ | |
| #js-refresh { | |
| color: #00529b; | |
| /* NASCAR Blue */ | |
| text-shadow: 0 0 2px rgb(0, 0, 0); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #d71920; | |
| /* NASCAR Red */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with dark background and bright accents */ | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: rgba(0, 0, 0, 0.5); | |
| /* Black background */ | |
| border: 1px solid #ffd700; | |
| /* Yellow border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 1px rgb(255, 255, 255); | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5); | |
| color: #ffffff; | |
| /* White text */ | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover { | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.7); | |
| background: rgba(0, 0, 0, 0.93); | |
| } | |
| /* Body styling with NASCAR-inspired gradient */ | |
| body { | |
| margin: 0; | |
| color: #ffffff; | |
| /* White text */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: linear-gradient(135deg, #000000 30%, #00529b 70%); | |
| /* Black to Blue gradient */ | |
| text-shadow: 1px 1px 3px rgb(0, 0, 0); | |
| transition: background 0.3s ease; | |
| } | |
| body:hover { | |
| background: linear-gradient(135deg, #ffd700 30%, #d71920 70%); | |
| /* Yellow to Red gradient */ | |
| } | |
| /* Tooltip customization with smooth transition */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #000000; | |
| /* Black background */ | |
| color: #ffd700; | |
| /* Yellow text */ | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| font-style: italic; | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Advanced feature: Animated border with NASCAR colors */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 10px; | |
| border-radius: 5px; | |
| background-color: #000000; | |
| /* Black background */ | |
| color: #ffffff; | |
| /* White text */ | |
| font-weight: bold; | |
| text-align: center; | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: -2px; | |
| left: -2px; | |
| right: -2px; | |
| bottom: -2px; | |
| background: linear-gradient(45deg, #d71920, #ffd700, #00529b, #d71920); | |
| /* Red, Yellow, Blue */ | |
| background-size: 600% 600%; | |
| border-radius: 7px; | |
| z-index: -1; | |
| animation: gradient-border 5s linear infinite; | |
| } | |
| /* Animation for gradient border */ | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 0% 50%; | |
| } | |
| 50% { | |
| background-position: 100% 50%; | |
| } | |
| 100% { | |
| background-position: 0% 50%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered - Orange/Black Style | |
| @version 20241115.16.02 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description Orange/Black! | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Black/Orange Status Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #ffa500; | |
| text-shadow: 2px 2px 8px rgba(255, 165, 0, 0.8); | |
| } | |
| a { | |
| color: #ff8c00; | |
| text-decoration: none; | |
| text-shadow: 1px 1px 4px rgba(255, 140, 0, 0.6); | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #ffffff; | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Neon Orange */ | |
| color: #ff8c00; | |
| text-shadow: 1px 1px 6px rgba(255, 140, 0, 0.8); | |
| } | |
| .minor { | |
| /* Light Orange */ | |
| color: #ffa07a; | |
| text-shadow: 1px 1px 6px rgba(255, 160, 122, 0.8); | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Dark Orange */ | |
| color: #ff4500; | |
| text-shadow: 1px 1px 6px rgba(255, 69, 0, 0.8); | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #ff8c00; | |
| text-shadow: 0 0 8px rgba(255, 140, 0, 0.8); | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #282a36, #191a21); | |
| border: 1px solid #ff8c00; | |
| border-radius: 6px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.6); | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4); | |
| color: #f8f8f2; | |
| } | |
| body { | |
| margin: 0; | |
| color: #ffa500; | |
| background: #121212; | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #21222c; | |
| color: #ffa500; | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - /r/pcmasterrace Theme | |
| @version 20241119.00.05 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - /r/pcmasterrace style | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with /r/pcmasterrace colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #ffd700; /* Gold */ | |
| text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6); | |
| background: linear-gradient(135deg, #ffffff 30%, #ffd700 70%); /* White to Gold */ | |
| -webkit-text-stroke-width: 1px; | |
| -webkit-text-stroke-color: #000000; | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 3s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: scale(1); | |
| } | |
| 100% { | |
| transform: scale(1.08); | |
| } | |
| } | |
| /* Logo addition with /r/pcmasterrace emblem */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 200px; | |
| height: 60px; | |
| background: url('https://i.gyazo.com/ad80b30c1872cee5a8f4da207d06917d.png') no-repeat center; /* Replace with /r/pcmasterrace logo URL */ | |
| background-size: auto 100%; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.5); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #ffd700; /* Gold */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #ffffff; /* White */ | |
| text-decoration: underline; | |
| text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.7); | |
| } | |
| /* Status colors with /r/pcmasterrace theme */ | |
| .good { | |
| color: #ffffff; /* White */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ffd700; /* Gold */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #ff4500; /* Bright Red */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling */ | |
| #js-refresh { | |
| color: #ffd700; /* Gold */ | |
| text-shadow: 0 0 3px rgba(0, 0, 0, 0.8); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #ffffff; /* White */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with /r/pcmasterrace-inspired accents */ | |
| .services, | |
| #psa, | |
| noscript, | |
| footer { | |
| position: relative; | |
| background: linear-gradient(135deg, rgba(255, 215, 0, 0.8) 30%, rgba(255, 255, 255, 0.8) 70%); | |
| border: 1px solid #ffd700; | |
| border-radius: 4px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.9); | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8); | |
| color: #000000; | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover, | |
| footer:hover { | |
| box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.9); | |
| background: rgba(0, 0, 0, 0.95); | |
| color: #ffffff; | |
| } | |
| /* Body styling with /r/pcmasterrace backdrop */ | |
| body { | |
| margin: 0; | |
| color: #ffd700; /* Gold */ | |
| font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: url('https://i.gyazo.com/144fb81227c6f8e81bc6b9eaada78fc2.jpg') no-repeat center | |
| center fixed; /* Replace with /r/pcmasterrace background URL */ | |
| background-size: cover; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); | |
| transition: background 0.3s ease; | |
| } | |
| /* Tooltip customization */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: rgba(255, 215, 0, 0.9); /* Gold */ | |
| color: #000000; | |
| padding: 8px; | |
| border-radius: 8px; | |
| z-index: 1; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Advanced feature: Animated gold border */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 12px; | |
| border-radius: 6px; | |
| background-color: rgba(0, 0, 0, 0.9); | |
| color: #ffffff; | |
| font-weight: bold; | |
| text-align: center; | |
| box-shadow: 0px 0px 10px rgba(255, 215, 0, 0.8); | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #ffd700, #ffffff, #ffd700); /* Gold to White */ | |
| background-size: 300% 300%; | |
| border-radius: 6px; | |
| z-index: -1; | |
| animation: gradient-border 4s linear infinite; | |
| } | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 0% 50%; | |
| } | |
| 50% { | |
| background-position: 100% 50%; | |
| } | |
| 100% { | |
| background-position: 0% 50%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered - Pink/Black Style | |
| @version 20241115.16.02 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Re-Remastered - Pink/Black theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Black/Pink Status Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #ff79c6; | |
| text-shadow: 2px 2px 8px rgba(255, 0, 128, 0.8); | |
| } | |
| a { | |
| color: #ff92df; | |
| text-decoration: none; | |
| text-shadow: 1px 1px 4px rgba(255, 20, 147, 0.6); | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #ffffff; | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Neon Green */ | |
| color: #50fa7b; | |
| text-shadow: 1px 1px 6px rgba(0, 128, 0, 0.8); | |
| } | |
| .minor { | |
| /* Neon Blue */ | |
| color: #8be9fd; | |
| text-shadow: 1px 1px 6px rgba(0, 0, 255, 0.8); | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Neon Yellow */ | |
| color: #f1fa8c; | |
| text-shadow: 1px 1px 6px rgba(255, 255, 0, 0.8); | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #ff92df; | |
| text-shadow: 0 0 8px rgba(255, 105, 180, 0.8); | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #282a36, #191a21); | |
| border: 1px solid #5a2a5b; | |
| border-radius: 6px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.6); | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4); | |
| color: #f8f8f2; | |
| } | |
| body { | |
| margin: 0; | |
| color: #ff79c6; | |
| background: #121212; | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #21222c; | |
| color: #ff79c6; | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-remastered | |
| @version 20241115.16.00 | |
| @namespace https://userstyles.world/user/Nick2bad4u | |
| @description SteamStat.us - Re-Remastered - Purple | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document url("https://steamstat.us/") | |
| { | |
| .title { | |
| /* Steam Status Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #d4b5ff; | |
| text-shadow: 2px 2px 8px #4a0072; | |
| } | |
| a { | |
| color: #9e86ff; | |
| text-decoration: none; | |
| text-shadow: 2px 2px 6px #3e045f; | |
| font-weight: bold; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Soft Green */ | |
| color: #57e39b; | |
| text-shadow: 2px 2px 6px #154d47; | |
| } | |
| .minor { | |
| /* Soft Teal */ | |
| color: #63d1ff; | |
| text-shadow: 2px 2px 6px #005f72; | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Soft Yellow */ | |
| color: #ffd700; | |
| text-shadow: 2px 2px 6px #705c00; | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #a569ff; | |
| text-shadow: 0 0 8px #a569ff; | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background-color: #1f1b2e; | |
| border: 1px solid #3a1e5d; | |
| border-radius: 6px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 6px #000; | |
| } | |
| body { | |
| margin: 0; | |
| color: #c2a3e8; | |
| background: #000; | |
| font-family: 'Open Sans', Helvetica, Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 2px 2px 6px #000; | |
| font-weight: lighter; | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 97%; | |
| background: #221936; | |
| color: #e6d5ff; | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 10px #000; | |
| font-style: italic; | |
| font-weight: lighter; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered - Rainbow Style | |
| @version 20241115.16.20 | |
| @namespace https://userstyles.world/user/Nick2bad4u | |
| @description SteamStat.us - Re-Remastered - Rainbow Style! | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document url("https://steamstat.us/") | |
| { | |
| .title { | |
| /* Steam Status Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| background: linear-gradient(90deg, red, orange, yellow, green, blue, indigo, violet); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| text-shadow: 1px 1px 6px #000; | |
| -webkit-text-stroke: 0.4px black; | |
| } | |
| a { | |
| background: linear-gradient(90deg, red, orange, yellow, green, blue, indigo, violet); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| text-decoration: none; | |
| text-shadow: 3px 3px 6px #000; | |
| font-weight: bold; | |
| -webkit-text-stroke: 0.4px black; | |
| } | |
| .good, | |
| .minor, | |
| .major, | |
| #js-refresh { | |
| /* Status Text */ | |
| background: linear-gradient(90deg, red, orange, yellow, green, blue, indigo, violet); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| -webkit-text-stroke: 0.4px black; | |
| font-weight: bold; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(180deg, red, orange, yellow, green, blue, indigo, violet); | |
| color: #ffffff; | |
| border: 1px solid #191921; | |
| border-radius: 6px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 6px black; | |
| } | |
| body { | |
| margin: 0; | |
| color: #ffffff; | |
| background: linear-gradient(180deg, violet, indigo, blue, green, yellow, orange, red); | |
| font-family: 'Open Sans', Helvetica, Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 6px #000; | |
| font-weight: lighter; | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| -webkit-text-stroke: 0.4px black; | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 97%; | |
| background: rgba(0, 0, 0, 0.8); | |
| color: #ffffff; | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 10px #000; | |
| font-style: italic; | |
| font-weight: lighter; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered - Steam Style | |
| @version 20241115.16.02 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Re-Remastered - Steam theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document url("https://steamstat.us/") | |
| { | |
| .title { | |
| /* Steam Status Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #b4d2ff; | |
| text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8); | |
| } | |
| a { | |
| color: #66c0f4; | |
| text-decoration: none; | |
| text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #ffffff; | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Soft Green */ | |
| color: #8bc34a; | |
| text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.8); | |
| } | |
| .minor { | |
| /* Soft Teal */ | |
| color: #03a9f4; | |
| text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.8); | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Soft Yellow */ | |
| color: #ffeb3b; | |
| text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.8); | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #82cffd; | |
| text-shadow: 0 0 8px rgba(0, 0, 0, 0.8); | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #2a2a2a, #1c1c1c); | |
| border: 1px solid #4b4b4b; | |
| border-radius: 6px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.6); | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4); | |
| color: #eaeaea; | |
| } | |
| body { | |
| margin: 0; | |
| color: #b8c6dc; | |
| background: #171a21; | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #1b2838; | |
| color: #c7d5e0; | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Sunset Theme | |
| @version 20241115.16.04 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Bright and Vibrant Style | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Bright Gradient Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #fff; | |
| text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8); | |
| background: linear-gradient(145deg, #ff7f50, #00ffff, #ffd700); | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| a { | |
| /* Vibrant Links */ | |
| color: #00ffff; | |
| text-decoration: none; | |
| text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #ffd700; | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Bright Lime Green */ | |
| color: #32cd32; | |
| text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.9); | |
| } | |
| .minor { | |
| /* Electric Purple */ | |
| color: #ba55d3; | |
| text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.9); | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Bright Gold */ | |
| color: #ffd700; | |
| text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.9); | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refresh Indicator */ | |
| color: #ff4500; | |
| text-shadow: 0 0 8px rgba(255, 69, 0, 0.8); | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #ff4500, #1e90ff); | |
| border: 2px solid #ffd700; | |
| border-radius: 6px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.8); | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.6); | |
| color: #ffffff; | |
| } | |
| body { | |
| margin: 0; | |
| color: #ffffff; | |
| background: linear-gradient(145deg, #ff7f50, #1e90ff, #ffd700); | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.8); | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:before { | |
| /* Tooltip Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: linear-gradient(145deg, #ffd700, #ba55d3, #1e90ff); | |
| color: #ffffff; | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.8); | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Team Fortress 2 | |
| @version 20241118.23.52 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Team Fortress 2 Theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with Team Fortress 2 colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #b8383b; /* TF2 Red Team color */ | |
| text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5); | |
| background: linear-gradient(135deg, #b8383b 30%, #5e76a8 70%); /* Red to Blue gradient */ | |
| -webkit-text-stroke-width: 1px; | |
| -webkit-text-stroke-color: #000000; | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 3s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: scale(1); | |
| } | |
| 100% { | |
| transform: scale(1.08); | |
| } | |
| } | |
| /* Logo addition with scaling effect */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 250px; | |
| height: 60px; | |
| background: url('https://i.gyazo.com/5981acdc7b93ea0caca2462c8a01dc7b.png') no-repeat center; /* TF2 logo */ | |
| background-size: auto 200%; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.2); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #b8383b; /* TF2 Red */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #5e76a8; /* TF2 Blue */ | |
| text-decoration: underline; | |
| text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.7); | |
| } | |
| /* Status colors with TF2 theme */ | |
| .good { | |
| color: #5e76a8; /* TF2 Blue */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ffffff; /* White for minor status */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #b8383b; /* TF2 Red */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling with hover effect */ | |
| #js-refresh { | |
| color: #b8383b; /* TF2 Red */ | |
| text-shadow: 0 0 3px rgb(0, 0, 0); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #5e76a8; /* TF2 Blue */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with team colors */ | |
| .services, | |
| #psa, | |
| noscript, | |
| footer { | |
| position: relative; | |
| background: linear-gradient( | |
| 135deg, | |
| rgba(184, 56, 59, 0.8) 30%, | |
| rgba(94, 118, 168, 0.8) 70% | |
| ); /* Red to Blue gradient */ | |
| border: 1px solid #b8383b; /* Red border */ | |
| border-radius: 4px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.9); | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8); | |
| color: #ffffff; | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover, | |
| footer:hover { | |
| box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.9); | |
| background: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Body styling with Team Fortress 2 background */ | |
| body { | |
| margin: 0; | |
| color: #b8383b; /* TF2 Red */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: url('https://i.gyazo.com/38db4c4bdeca3e407043a778ee558475.jpg') no-repeat center | |
| center fixed; /* TF2 background image */ | |
| background-size: cover; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); | |
| transition: background 0.3s ease; | |
| } | |
| /* Tooltip customization */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: rgba(184, 56, 59, 0.9); /* Red background */ | |
| color: #ffffff; | |
| padding: 8px; | |
| border-radius: 8px; | |
| z-index: 1; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Advanced feature: Animated team colors border */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 12px; | |
| border-radius: 6px; | |
| background-color: rgba(0, 0, 0, 0.9); | |
| color: #ffffff; | |
| font-weight: bold; | |
| text-align: center; | |
| box-shadow: 0px 0px 10px rgba(184, 56, 59, 0.8); | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #b8383b, #5e76a8, #b8383b); /* Red to Blue */ | |
| background-size: 300% 300%; | |
| border-radius: 6px; | |
| z-index: -1; | |
| animation: gradient-border 4s linear infinite; | |
| } | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 0% 50%; | |
| } | |
| 50% { | |
| background-position: 100% 50%; | |
| } | |
| 100% { | |
| background-position: 0% 50%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - The Crew: Motorfest | |
| @version 20241115.16.04 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - The Crew: Motorfest Theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with Motorfest colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #ff4500; | |
| /* Motorfest Orange */ | |
| text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5); | |
| background: linear-gradient(135deg, #ff4500 30%, #00ced1 70%); | |
| /* Orange to Teal gradient */ | |
| -webkit-text-stroke-width: 1px; | |
| -webkit-text-stroke-color: #000000; | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 3s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: scale(1); | |
| } | |
| 100% { | |
| transform: scale(1.08); | |
| } | |
| } | |
| /* Logo addition with scaling effect */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 250px; | |
| height: 60px; | |
| background: url('https://i.gyazo.com/f1273792dc6be70cae0d37b490fdd03a.png') no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.2); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #ff4500; | |
| /* Motorfest Orange */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #00ced1; | |
| /* Motorfest Teal */ | |
| text-decoration: underline; | |
| text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.7); | |
| } | |
| /* Status colors with Motorfest theme */ | |
| .good { | |
| color: #00ced1; | |
| /* Motorfest Teal */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ffffff; | |
| /* White for minor status */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #ff4500; | |
| /* Motorfest Orange */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling with hover effect */ | |
| #js-refresh { | |
| color: #ff4500; | |
| text-shadow: 0 0 3px rgb(0, 0, 0); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #00ced1; | |
| transform: scale(1.1); | |
| } | |
| /* Container with neon accents */ | |
| .services, | |
| #psa, | |
| noscript, | |
| footer { | |
| position: relative; | |
| background: linear-gradient(135deg, rgba(255, 69, 0, 0.8) 30%, rgba(0, 206, 209, 0.8) 70%); | |
| border: 1px solid #ff4500; | |
| border-radius: 4px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.9); | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8); | |
| color: #ffffff; | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover, | |
| footer:hover { | |
| box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.9); | |
| background: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Body styling with vibrant tropical backdrop */ | |
| body { | |
| margin: 0; | |
| color: #ff4500; | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: url('https://i.gyazo.com/2107a4c02a92a0a2b651a56eeb87bf64.jpg') no-repeat center | |
| center fixed; | |
| background-size: cover; | |
| background-position-x: 1px; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); | |
| transition: background 0.3s ease; | |
| } | |
| /* Tooltip customization */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: rgba(255, 69, 0, 0.9); | |
| color: #ffffff; | |
| padding: 8px; | |
| border-radius: 8px; | |
| z-index: 1; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Advanced feature: Animated neon border */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 12px; | |
| border-radius: 6px; | |
| background-color: rgba(0, 0, 0, 0.9); | |
| color: #ffffff; | |
| font-weight: bold; | |
| text-align: center; | |
| box-shadow: 0px 0px 10px rgba(255, 69, 0, 0.8); | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #ff4500, #00ced1, #ff4500); | |
| background-size: 300% 300%; | |
| border-radius: 6px; | |
| z-index: -1; | |
| animation: gradient-border 4s linear infinite; | |
| } | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 0% 50%; | |
| } | |
| 50% { | |
| background-position: 100% 50%; | |
| } | |
| 100% { | |
| background-position: 0% 50%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Tour de France | |
| @version 20241115.16.04 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Tour de France Theme with Advanced CSS | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with Tour de France theme */ | |
| .title { | |
| text-align: center; | |
| margin: 20px 0; | |
| font-size: 3em; | |
| font-weight: 700; | |
| color: #ffd700; | |
| /* Yellow Jersey */ | |
| text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6); | |
| background: linear-gradient(135deg, #ffd700 40%, #008000 70%); | |
| /* Yellow to Green */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: pulse-title 3s ease-in-out infinite; | |
| font-family: 'Merriweather', serif; | |
| } | |
| /* Animation for title pulsing effect */ | |
| @keyframes pulse-title { | |
| 0%, | |
| 100% { | |
| transform: scale(1); | |
| } | |
| 50% { | |
| transform: scale(1.1); | |
| } | |
| } | |
| /* Tour de France bicycle logo effect */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 100px; | |
| height: 100px; | |
| background: url('https://i.gyazo.com/9823ea6d0dccc361361cfacc1a6df950.png') no-repeat center; | |
| background-size: contain; | |
| margin-left: 15px; | |
| animation: rotate-bike 6s linear infinite; | |
| } | |
| /* Rotate animation for logo */ | |
| @keyframes rotate-bike { | |
| 0% { | |
| transform: rotate(0deg); | |
| } | |
| 100% { | |
| transform: rotate(360deg); | |
| } | |
| } | |
| /* Link styling with cycling-theme hover effects */ | |
| a { | |
| color: #ffd700; | |
| /* Yellow Jersey */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); | |
| } | |
| a:hover { | |
| color: #008000; | |
| /* Green Jersey */ | |
| text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8); | |
| } | |
| /* Container with bright accents and animation */ | |
| .services, | |
| #psa, | |
| footer, | |
| div.regions-title.sep { | |
| position: relative; | |
| background: linear-gradient(135deg, #ffd700 30%, #008000 70%); | |
| /* Yellow to Green */ | |
| border: 2px solid #ffd700; | |
| border-radius: 10px; | |
| padding: 10px; | |
| box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3); | |
| font-size: 1em; | |
| color: #ffffff; | |
| transition: | |
| box-shadow 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| footer:hover, | |
| div.regions-title.sep:hover { | |
| transform: scale(1.05); | |
| box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.5); | |
| } | |
| /* Gradient border for status panels */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 10px; | |
| border-radius: 10px; | |
| background-color: #ffd700; | |
| /* Yellow Jersey */ | |
| color: #ffffff; | |
| font-weight: bold; | |
| text-align: center; | |
| font-size: 1.2em; | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #ffd700, #008000, #ffd700, #008000); | |
| background-size: 200% 200%; | |
| border-radius: 10px; | |
| z-index: -1; | |
| animation: gradient-flow 5s linear infinite; | |
| } | |
| @keyframes gradient-flow { | |
| 0% { | |
| background-position: 0% 50%; | |
| } | |
| 100% { | |
| background-position: 100% 50%; | |
| } | |
| } | |
| /* Status colors with vibrant cycling palette */ | |
| .good { | |
| color: #008000; | |
| /* Green Jersey */ | |
| text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); | |
| font-weight: bold; | |
| } | |
| .minor { | |
| color: #ffa500; | |
| /* Orange - minor alerts */ | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); | |
| } | |
| .major { | |
| color: #ff0000; | |
| /* Red - major issues */ | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| } | |
| /* Background with cycling road theme */ | |
| body { | |
| margin: 0; | |
| font-family: 'Merriweather', serif; | |
| font-size: 16px; | |
| background: url('https://i.gyazo.com/ebf59cbe7c55a3df90ae7d8c62c9584c.jpg') no-repeat center; | |
| background-size: cover; | |
| color: #ffffff; | |
| text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.8); | |
| } | |
| /* Tooltip with cycling theme */ | |
| [data-tooltip]:before { | |
| content: attr(data-tooltip); | |
| visibility: hidden; | |
| opacity: 0; | |
| position: absolute; | |
| top: -40px; | |
| left: 50%; | |
| transform: translateX(-50%); | |
| background: #ffd700; | |
| color: #000; | |
| padding: 5px 10px; | |
| border-radius: 5px; | |
| font-size: 0.9em; | |
| font-weight: bold; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease; | |
| white-space: nowrap; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| @keyframes ride-bike { | |
| 0% { | |
| transform: translateX(0); | |
| } | |
| 50% { | |
| transform: translateX(calc(100vw - 100px)); | |
| /* Moves to the far right */ | |
| } | |
| 100% { | |
| transform: translateX(0); | |
| /* Returns to the starting point */ | |
| } | |
| } | |
| .bike-container { | |
| position: fixed; | |
| bottom: 20px; | |
| left: 0; | |
| width: 100px; | |
| height: 100px; | |
| background: url('https://i.gyazo.com/9823ea6d0dccc361361cfacc1a6df950.png') no-repeat center; | |
| background-size: contain; | |
| animation: ride-bike 5s infinite ease-in-out; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Re-Remastered USA Style | |
| @version 20241115.16.03 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Re-Remastered USA Red/White/Blue Style | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* USA Red/White/Blue Status Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 300; | |
| color: #ff0000; /* Red */ | |
| text-shadow: 1px 1px 1px rgba(0, 0, 128, 0.9); /* Navy blue shadow */ | |
| background: linear-gradient(145deg, #ff0000, #0000ff); /* Red to Blue gradient */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| } | |
| a { | |
| color: #0000ff; /* Blue */ | |
| text-decoration: none; | |
| text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.6); /* White shadow */ | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #ff0000; /* Red */ | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* White */ | |
| color: #ffffff; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); /* Black shadow */ | |
| } | |
| .minor { | |
| /* Sky Blue */ | |
| color: #87ceeb; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* Bright Red */ | |
| color: #ff4500; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in idk seconds */ | |
| color: #0000ff; /* Blue */ | |
| text-shadow: 0 0 2px rgba(255, 255, 255, 0.8); /* White shadow */ | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #ff0000, #0000ff); /* Red to Blue gradient */ | |
| border: 1px solid #ffffff; /* White border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8); /* Black shadow */ | |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4); | |
| color: #ffffff; /* White text */ | |
| } | |
| body { | |
| margin: 0; | |
| color: #ffffff; /* White text */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); /* Black shadow */ | |
| font-weight: 300; | |
| background: linear-gradient(145deg, #ff0000, #0000ff); /* Red to Blue gradient */ | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #000000; /* Black background for contrast */ | |
| color: #ffffff; /* White text */ | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(255, 0, 0, 0.8); /* Red shadow */ | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Windows 95 Theme | |
| @version 20241119.00.11 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Windows 95 theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with Windows 95 look */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2em; | |
| font-weight: bold; | |
| color: black; | |
| background-color: #c0c0c0; /* Light gray background */ | |
| padding: 5px; | |
| border: 2px solid #ffffff; | |
| border-bottom-color: #808080; | |
| border-right-color: #808080; | |
| font-family: 'MS Sans Serif', Tahoma, Verdana, Arial, sans-serif; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Logo addition with Windows 95 logo */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 150px; | |
| height: 50px; | |
| background: url('https://i.gyazo.com/e96376514655b9307ce82826b1ae2691.png') no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| } | |
| /* Link styling */ | |
| a { | |
| color: #0000ee; /* Standard link color */ | |
| text-decoration: underline; | |
| font-weight: normal; | |
| font-family: 'MS Sans Serif', Tahoma, Verdana, Arial, sans-serif; | |
| } | |
| a:hover { | |
| color: #551a8b; /* Visited link color */ | |
| } | |
| /* Status colors */ | |
| .good { | |
| color: black; | |
| } | |
| .minor { | |
| color: #808080; /* Dark gray */ | |
| } | |
| .major { | |
| color: #ff0000; /* Red */ | |
| } | |
| /* Refresh button styling */ | |
| #js-refresh { | |
| color: black; | |
| font-weight: bold; | |
| font-family: 'MS Sans Serif', Tahoma, Verdana, Arial, sans-serif; | |
| background-color: #c0c0c0; | |
| border: 2px solid #ffffff; | |
| border-bottom-color: #808080; | |
| border-right-color: #808080; | |
| padding: 2px 5px; | |
| cursor: pointer; | |
| } | |
| #js-refresh:active { | |
| border-top-color: #808080; | |
| border-left-color: #808080; | |
| border-bottom-color: #ffffff; | |
| border-right-color: #ffffff; | |
| } | |
| /* Container styling */ | |
| .services, | |
| #psa, | |
| noscript, | |
| footer, | |
| div.regions-title.sep { | |
| background-color: #c0c0c0; /* Light gray */ | |
| border: 2px solid #ffffff; | |
| border-bottom-color: #808080; | |
| border-right-color: #808080; | |
| padding: 10px; | |
| font-family: 'MS Sans Serif', Tahoma, Verdana, Arial, sans-serif; | |
| color: black; | |
| margin: 10px; | |
| } | |
| /* Body styling */ | |
| body { | |
| margin: 0; | |
| background-color: #008080; /* Teal background */ | |
| font-family: 'MS Sans Serif', Tahoma, Verdana, Arial, sans-serif; | |
| } | |
| /* Tooltip customization */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.8em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: -30px; | |
| left: 0; | |
| width: 200px; | |
| background-color: #ffffe0; /* Light yellow */ | |
| color: black; | |
| padding: 5px; | |
| border: 1px solid #000000; | |
| font-family: 'MS Sans Serif', Tahoma, Verdana, Arial, sans-serif; | |
| z-index: 1000; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Buttons */ | |
| button { | |
| font-family: 'MS Sans Serif', Tahoma, Verdana, Arial, sans-serif; | |
| background-color: #c0c0c0; | |
| color: black; | |
| border: 2px solid #ffffff; | |
| border-bottom-color: #808080; | |
| border-right-color: #808080; | |
| padding: 2px 5px; | |
| cursor: pointer; | |
| } | |
| button:active { | |
| border-top-color: #808080; | |
| border-left-color: #808080; | |
| border-bottom-color: #ffffff; | |
| border-right-color: #ffffff; | |
| } | |
| /* Remove modern scrollbars */ | |
| ::-webkit-scrollbar { | |
| width: 16px; | |
| } | |
| ::-webkit-scrollbar-track { | |
| background: #c0c0c0; | |
| border-left: 2px solid #ffffff; | |
| border-top: 2px solid #ffffff; | |
| border-right: 2px solid #808080; | |
| border-bottom: 2px solid #808080; | |
| } | |
| ::-webkit-scrollbar-thumb { | |
| background: #e0e0e0; | |
| border: 1px solid #808080; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Witcher 3 Theme | |
| @version 20241115.16.04 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - Witcher 3 style | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with Witcher-inspired colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #b22222; /* Witcher Red */ | |
| text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6); | |
| background: linear-gradient(135deg, #8b0000 30%, #ffd700 70%); /* Dark Red to Gold */ | |
| -webkit-text-stroke-width: 1px; | |
| -webkit-text-stroke-color: #ffffff96; | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 3s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: scale(1); | |
| } | |
| 100% { | |
| transform: scale(1.08); | |
| } | |
| } | |
| /* Logo addition with Witcher medallion effect */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 200px; | |
| height: 60px; | |
| background: url('https://i.gyazo.com/f2d821c47cc5df51c893d7333c1c93b1.png') no-repeat center; /* Witcher medallion */ | |
| background-size: auto 100%; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.5); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #ffd700; /* Gold */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #b22222; /* Witcher Red */ | |
| text-decoration: underline; | |
| text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.7); | |
| } | |
| /* Status colors with Witcher theme */ | |
| .good { | |
| color: #6b8e23; /* Olive Green */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ffffff; /* White */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #b22222; /* Witcher Red */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling */ | |
| #js-refresh { | |
| color: #ffd700; /* Gold */ | |
| text-shadow: 0 0 3px rgba(0, 0, 0, 0.8); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #8b0000; /* Dark Red */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with Witcher-inspired accents */ | |
| .services, | |
| #psa, | |
| noscript, | |
| footer { | |
| position: relative; | |
| background: linear-gradient(135deg, rgba(139, 0, 0, 0.8) 30%, rgba(218, 165, 32, 0.8) 70%); | |
| border: 1px solid #b22222; | |
| border-radius: 4px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.9); | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8); | |
| color: #ffffff; | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover, | |
| footer:hover { | |
| box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.9); | |
| background: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Body styling with Witcher backdrop */ | |
| body { | |
| margin: 0; | |
| color: #ffd700; /* Gold */ | |
| font-family: 'Georgia', serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: url('https://i.gyazo.com/1ebf57cc6e04b6d589057fdc5b637365.jpg') no-repeat center | |
| center fixed; /* Witcher backdrop */ | |
| background-size: cover; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); | |
| transition: background 0.3s ease; | |
| } | |
| /* Tooltip customization */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: rgba(139, 0, 0, 0.9); /* Dark Red */ | |
| color: #ffffff; | |
| padding: 8px; | |
| border-radius: 8px; | |
| z-index: 1; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Advanced feature: Animated border */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 12px; | |
| border-radius: 6px; | |
| background-color: rgba(0, 0, 0, 0.9); | |
| color: #ffffff; | |
| font-weight: bold; | |
| text-align: center; | |
| box-shadow: 0px 0px 10px rgba(139, 0, 0, 0.8); | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #8b0000, #ffd700, #8b0000); | |
| background-size: 300% 300%; | |
| border-radius: 6px; | |
| z-index: -1; | |
| animation: gradient-border 4s linear infinite; | |
| } | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 0% 50%; | |
| } | |
| 50% { | |
| background-position: 100% 50%; | |
| } | |
| 100% { | |
| background-position: 0% 50%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - University of Michigan Wolverines | |
| @version 20241115.16.03 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - University of Michigan Wolverines Theme | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| .title { | |
| /* Michigan Wolverines Title */ | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #00274c; | |
| /* Maize and Blue - Dark Blue */ | |
| text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); | |
| /* Subtle black shadow */ | |
| background: linear-gradient(145deg, #00274c, #ffcb05); | |
| /* Blue to Maize gradient */ | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| .title::after { | |
| /* Add Michigan Wolverines Logo to the Right */ | |
| content: ''; | |
| display: inline-block; | |
| width: 60px; | |
| height: 60px; | |
| background: url('https://upload.wikimedia.org/wikipedia/commons/f/fb/Michigan_Wolverines_logo.svg') | |
| no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| } | |
| a { | |
| color: #00274c; | |
| /* Dark Blue */ | |
| text-decoration: none; | |
| text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); | |
| /* Light shadow */ | |
| font-weight: bold; | |
| } | |
| a:hover { | |
| color: #ffcb05; | |
| /* Maize */ | |
| text-decoration: underline; | |
| } | |
| .pull-right, | |
| .service .status { | |
| text-align: right; | |
| float: right; | |
| } | |
| .good { | |
| /* Blue for good statuses */ | |
| color: #00274c; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| } | |
| .minor { | |
| /* Maize for minor issues */ | |
| color: #ffcb05; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| .major { | |
| /* White for major issues */ | |
| color: #ffffff; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| /* Black shadow */ | |
| font-weight: bold; | |
| } | |
| #js-refresh { | |
| /* Refreshing in seconds */ | |
| color: #ffcb05; | |
| text-shadow: 0 0 2px rgb(0, 0, 0); | |
| /* Subtle shadow */ | |
| font-weight: bolder; | |
| } | |
| .services, | |
| #psa, | |
| noscript { | |
| position: relative; | |
| background: linear-gradient(145deg, #00274c, #ffcb05); | |
| /* Blue to Maize */ | |
| border: 1px solid #ffffff; | |
| /* White border */ | |
| border-radius: 3px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 1px rgb(0, 0, 1); | |
| /* Subtle shadow */ | |
| box-shadow: 0px 4px 8px rgb(0, 0, 0); | |
| color: #ffffff; | |
| /* White text */ | |
| } | |
| body { | |
| margin: 0; | |
| color: #00274c; | |
| /* Dark Blue text */ | |
| font-family: 'Roboto', Arial, sans-serif; | |
| font-size: 16px; | |
| text-shadow: 1px 1px 3px rgb(0, 0, 0); | |
| /* Subtle shadow */ | |
| font-weight: 300; | |
| background: linear-gradient(145deg, #00274c, #ffcb05); | |
| /* Blue to Maize background */ | |
| } | |
| [data-tooltip]:before { | |
| /* Time since last status change Box */ | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| overflow: hidden; | |
| white-space: pre; | |
| word-wrap: break-word; | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #ffffff; | |
| /* White box */ | |
| color: #00274c; | |
| /* Dark Blue text */ | |
| text-align: left; | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| /* Subtle shadow */ | |
| font-style: italic; | |
| font-weight: 300; | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - World of Warcraft | |
| @version 20241115.16.04 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description SteamStat.us - World of Warcraft Theme with Advanced CSS | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with WoW colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #ffd700; | |
| /* WoW Gold */ | |
| text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.4); | |
| background: linear-gradient(135deg, #ffd700 30%, #4a3a1c 70%); | |
| /* Gold to Brown */ | |
| -webkit-text-stroke-width: 1px; | |
| -webkit-text-stroke-color: black; | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 2s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| font-family: 'Merriweather', serif; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: scale(1); | |
| } | |
| 100% { | |
| transform: scale(1.05); | |
| } | |
| } | |
| /* Logo addition with scaling effect */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 100px; | |
| height: 60px; | |
| background: url('https://i.gyazo.com/cc0548ce7f1b051ade8a24d5dc5ad508.png') no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| } | |
| .title:hover::after { | |
| transform: scale(1.2); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #ffd700; | |
| /* WoW Gold */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #4a3a1c; | |
| /* WoW Dark Brown */ | |
| text-decoration: underline; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); | |
| } | |
| /* Status colors with WoW theme */ | |
| .good { | |
| color: #ffd700; | |
| /* WoW Gold */ | |
| text-shadow: 1px 1px 2px rgb(0, 0, 0); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #790303; | |
| /* White for minor status */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #4a3a1c; | |
| /* WoW Dark Brown */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling with hover effect */ | |
| #js-refresh { | |
| color: #ffd700; | |
| /* WoW Gold */ | |
| text-shadow: 0 0 2px rgb(0, 0, 0); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #4a3a1c; | |
| /* WoW Dark Brown */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with dark background and gold accents */ | |
| .services, | |
| #psa, | |
| noscript, | |
| footer, | |
| div.regions-title.sep { | |
| position: relative; | |
| background: linear-gradient(135deg, #4a3a1c 30%, #ffd700 70%); | |
| /* WoW Dark Brown to Gold */ | |
| border: 1px solid #ffd700; | |
| /* WoW Gold border */ | |
| border-radius: 5px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 2px rgb(0, 0, 0); | |
| box-shadow: 0px 4px 8px rgb(0, 0, 0); | |
| color: #ffffff; | |
| /* White text */ | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover, | |
| footer:hover, | |
| div.regions-title.sep:hover { | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.5); | |
| background: rgba(0, 0, 0, 0.9); | |
| } | |
| /* Body styling with a WoW background */ | |
| body { | |
| margin: 0; | |
| color: #ffd700; | |
| /* WoW Gold */ | |
| font-family: 'Merriweather', serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: url('https://i.gyazo.com/32e11566c0e73d25ed470ab687959359.jpg') repeat-y; | |
| /* WoW Background */ | |
| text-shadow: 1px 1px 3px rgb(0, 0, 0); | |
| transition: background 0.3s ease; | |
| } | |
| /* Tooltip customization */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: #4a3a1c; | |
| /* WoW Dark Brown */ | |
| color: #ffd700; | |
| /* WoW Gold */ | |
| padding: 8px; | |
| border-radius: 6px; | |
| z-index: 1; | |
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| font-style: italic; | |
| font-weight: 300; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| /* Gradient border with WoW-themed animation */ | |
| .gradient-border { | |
| position: relative; | |
| padding: 10px; | |
| border-radius: 5px; | |
| background-color: #ffd700; | |
| /* WoW Gold */ | |
| color: #ffffff; | |
| /* White text */ | |
| font-weight: bold; | |
| text-align: center; | |
| } | |
| .gradient-border::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| right: 0; | |
| bottom: 0; | |
| background: linear-gradient(45deg, #ffd700, #4a3a1c, #ffd700, #4a3a1c); | |
| /* Gold to Dark Brown */ | |
| background-size: 400% 400%; | |
| border-radius: 5px; | |
| z-index: -1; | |
| animation: gradient-border 3s linear infinite; | |
| } | |
| @keyframes gradient-border { | |
| 0% { | |
| background-position: 400% 0%; | |
| } | |
| 50% { | |
| background-position: 0% 100%; | |
| } | |
| 100% { | |
| background-position: 400% 0%; | |
| } | |
| } | |
| } |
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
| /* ==UserStyle== | |
| @name SteamStat.us - Zwift Cycling Game Theme | |
| @version 20241119.00.01 | |
| @namespace https://github.com/Nick2bad4u/UserStyles | |
| @description Custom theme inspired by Zwift cycling game | |
| @homepageURL https://github.com/Nick2bad4u/UserStyles | |
| @author Nick2bad4u | |
| @license UnLicense | |
| ==/UserStyle== */ | |
| @-moz-document domain("steamstat.us") { | |
| /* Main title styling with Zwift colors */ | |
| .title { | |
| text-align: center; | |
| margin: 10px 0; | |
| font-size: 2.6em; | |
| font-weight: 700; | |
| color: #ff7f00; | |
| /* Zwift Orange */ | |
| text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6); | |
| background: linear-gradient(135deg, #ffffff 30%, #ff7f00 70%); | |
| /* White to Orange */ | |
| -webkit-text-stroke-width: 1px; | |
| -webkit-text-stroke-color: #000000; | |
| -webkit-background-clip: text; | |
| -webkit-text-fill-color: transparent; | |
| animation: title-animation 3s ease-in-out infinite alternate; | |
| position: relative; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| /* Animation for the title */ | |
| @keyframes title-animation { | |
| 0% { | |
| transform: scale(1); | |
| } | |
| 100% { | |
| transform: scale(1.08); | |
| } | |
| } | |
| /* Logo addition with Zwift emblem */ | |
| .title::after { | |
| content: ''; | |
| display: inline-block; | |
| width: 150px; | |
| height: 60px; | |
| background: url('https://i.gyazo.com/2a07deee44f8b2da87394d4393fcff0b.jpg') no-repeat center; | |
| background-size: contain; | |
| margin-left: 10px; | |
| transition: transform 0.3s ease; | |
| clip-path: circle(); | |
| } | |
| .title:hover::after { | |
| transform: scale(1.5); | |
| } | |
| /* Link styling with hover effect */ | |
| a { | |
| color: #ff7f00; | |
| /* Zwift Orange */ | |
| text-decoration: none; | |
| font-weight: bold; | |
| transition: | |
| color 0.3s ease, | |
| text-shadow 0.3s ease; | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); | |
| } | |
| a:hover { | |
| color: #ffffff; | |
| /* White */ | |
| text-decoration: underline; | |
| text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.7); | |
| } | |
| /* Status colors with Zwift theme */ | |
| .good { | |
| color: #ffffff; | |
| /* White */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| transition: color 0.3s ease; | |
| } | |
| .minor { | |
| color: #ff7f00; | |
| /* Orange */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| .major { | |
| color: #0073e6; | |
| /* Bright Blue */ | |
| text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6); | |
| font-weight: bold; | |
| transition: color 0.3s ease; | |
| } | |
| /* Refresh button styling */ | |
| #js-refresh { | |
| color: #ff7f00; | |
| /* Orange */ | |
| text-shadow: 0 0 3px rgba(0, 0, 0, 0.8); | |
| font-weight: bolder; | |
| transition: | |
| color 0.3s ease, | |
| transform 0.3s ease; | |
| } | |
| #js-refresh:hover { | |
| color: #ffffff; | |
| /* White */ | |
| transform: scale(1.1); | |
| } | |
| /* Container with Zwift-inspired accents */ | |
| .services, | |
| #psa, | |
| noscript, | |
| footer { | |
| position: relative; | |
| background: linear-gradient(135deg, rgba(255, 127, 0, 0.8) 30%, rgba(255, 255, 255, 0.8) 70%); | |
| border: 1px solid #ff7f00; | |
| border-radius: 4px; | |
| font-size: 1em; | |
| line-height: 1.5; | |
| text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.9); | |
| box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.8); | |
| color: #000000; | |
| transition: | |
| box-shadow 0.3s ease, | |
| background 0.3s ease; | |
| } | |
| .services:hover, | |
| #psa:hover, | |
| noscript:hover, | |
| footer:hover { | |
| box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.9); | |
| background: rgba(0, 0, 0, 0.95); | |
| color: #ffffff; | |
| } | |
| /* Body styling with Zwift cycling backdrop */ | |
| body { | |
| margin: 0; | |
| color: #ff7f00; | |
| /* Orange */ | |
| font-family: 'Lato', sans-serif; | |
| font-size: 16px; | |
| font-weight: 300; | |
| background: url('https://i.gyazo.com/8eb3d105728604bc85421637d6605692.jpg') no-repeat center | |
| center fixed; | |
| /* Zwift background URL */ | |
| background-size: cover; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); | |
| transition: background 0.3s ease; | |
| } | |
| /* Tooltip customization */ | |
| [data-tooltip]:before { | |
| visibility: hidden; | |
| opacity: 0; | |
| font-size: 0.9em; | |
| content: attr(data-tooltip); | |
| position: absolute; | |
| top: 0; | |
| left: 2%; | |
| width: 96%; | |
| background: rgba(255, 127, 0, 0.9); | |
| /* Orange */ | |
| color: #000000; | |
| padding: 8px; | |
| border-radius: 8px; | |
| z-index: 1; | |
| text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); | |
| transition: | |
| visibility 0s, | |
| opacity 0.3s ease-in-out; | |
| } | |
| [data-tooltip]:hover:before { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment