MediaWiki:Fandomdesktop.css

/* navbox classes */ .navtop { background: var(--primary-color-normal); border: 1px solid var(--primary-color-dark); color: #fff; border-top-left-radius: 10px; border-top-right-radius: 10px; box-shadow: 0 3px 10px rgba(0,0,0,0.2) } .navinfo { color: #fff; background: var(--base-color-dark); width: 25%; border: 1px solid; margin: 10px 0; overflow: hidden; box-shadow: var(--box-shadow-normal) text-align: center; } /* roblox interwiki template classes */ .RobloxWikis-Head { background-color: var(--primary-color-normal) !important; } .RobloxWikis-Head img { filter: drop-shadow(var(--img-shadow-normal)); } .RobloxWikis-HeadButton { background-color: var(--secondary-color-dark) !important; border-color: var(--secondary-color-normal) !important; border-radius: var(--radius) !important; box-shadow: var(--box-shadow-normal); font-family: Rubik; font-weight: bold; font-size: 12.5px; transition-duration: 0.3s; transition-property: background-color, border-color, color, box-shadow; } .RobloxWikis-HeadButton:hover { background-color: var(--secondary-color-normal) !important; border-color: var(--secondary-color-light) !important; } .RobloxWikis-HeadButton:active { background-color: var(--secondary-color-light) !important; border-color: var(--secondary-color-lightest) !important; } .RobloxWikis-HeadButton:focus { border-color: var(--secondary-color-lightest) !important; } .RobloxWikis-HeadButton a { text-shadow: var(--text-shadow-header); } .RobloxWikis-OddRow { background-color: var(--base-color-normal) !important; font-family: Rubik !important; } .RobloxWikis-EvenRow { background-color: var(--base-color-normal) !important; font-family: Rubik !important; } /* container classes */ .ContainerColumn { background-color: var(--base-color-normal); border-radius: var(--radius); border: 1px solid var(--primary-border-color); box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); margin: 0 0 10px; padding: 0; overflow: hidden; } .ContainerBody { color: #FFFFFF; height: auto; margin: 0; overflow-x: hidden; padding: 5px 10px; } .ContainerColumn.ImageContainer { position: relative; } .ContainerColumn.ImageContainer img { border-radius: var(--radius); height: auto; width: 100%; } .ContainerColumn.ImageContainer .PlayButton { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; background-color: #02b757; border-color: #02b757; border-radius: 5px; border: 1px solid transparent; color: #fff; cursor: pointer; font-size: 21px; font-weight: 400; left: 50%; opacity: 0; position: absolute; text-align: center; top: 70%; transform: translate(-50%, -50%); transition: top cubic-bezier(.29, 1.18, .25, 1) .5s, opacity 0.25s, background-color 0.25s, border-color 0.25s, box-shadow 0.25s; white-space: nowrap; } .ContainerColumn.ImageContainer .PlayButton a { color: #fff; display: inline-block; padding: 10px; text-decoration: none; } .ContainerColumn.ImageContainer:hover .PlayButton, .ContainerColumn.ImageContainer:focus-within .PlayButton { opacity: 1; top: 50%; } .ContainerColumn.ImageContainer .PlayButton:hover, .ContainerColumn.ImageContainer .PlayButton:focus-within { background-color: #3fc679; border-color: #3fc679; box-shadow: 0 1px 3px rgba(150, 150, 150, 0.74); } .ContainerColumn.ImageContainer .PlayButton:focus-within { background-color: #3fc679; border-color: #3fc679; box-shadow: 0 1px 3px rgba(150, 150, 150, 0.74); } .ContainerColumn.ActivityFeed ul.activityfeed { margin: 0 0 0 25px !important; } .ContainerColumn.ActivityFeed ul.activityfeed li, .ContainerColumn.ActivityFeed div > div li { list-style: none !important; } .ContainerColumn.ActivityFeed .TextHeader + .ContainerBody { padding: 0 !important; } .ContainerColumn.ActivityFeed .ContainerBody { padding-top: 0 !important; } .ContainerColumn.ActivityFeed ul.activityfeed li .activityfeed-diff { display: none; } .ContainerColumn.DiscordContainer { background: #2c2f33; border-color: #23272a; } .ContainerColumn.DiscordContainer .TextHeader { background-color: #7289da !important; } .ContainerColumn.DiscordContainer .ContainerBody { padding: 10px 10px 0; } .ContainerColumn.DiscordContainer .DiscordButton { background-color: #7289da; border-radius: 3px; border: 1px solid #677bc4; color: #fff; font-size: 15px; margin: 0 0 10px; text-align: center; text-transform: uppercase; top: 0; transition: all 0.12s ease-out; } .ContainerColumn.DiscordContainer .DiscordButton:hover, .ContainerColumn.DiscordContainer .DiscordButton:focus-within { background-color: #677bc4; border-color: #5b6eae; box-shadow: 0 4px 14px 0 rgba(0, 0, 0, .4); transform: translate3d(0, -1px, 0); } .ContainerColumn.DiscordContainer .DiscordButton:active { background-color: #5b6eae; border-color: #4f5f99; } .ContainerColumn.DiscordContainer .DiscordButton p { margin: 0 !important; } .ContainerColumn.DiscordContainer .DiscordButton a { color: #fff !important; display: block; font-family: Whitney, Helvetica Neue, Helvetica, Arial, sans-serif; font-weight: bold; padding: 10px; text-decoration: none; } .ContainerColumn.DiscordContainer .DiscordButton a.external::after { display: none; }

/* textheader classes */

.TextHeader { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; background-color: var(--primary-color-normal); box-shadow: var(--box-shadow-normal); color: #fff !important; font-family: var(--font) !important; font-weight: bold; letter-spacing: var(--font-spacing) !important; font-size: 14px; line-height: 23px; padding: 7px 15px !important; text-shadow: var(--text-shadow-header); } .TextHeader h1 { margin: 0 !important; font-size: 20px !important; text-shadow: inherit; } .TextHeader h3 { margin: 0 !important; text-shadow: inherit; } .TextHeader h1 a { color: #fff; } .TextHeader a:hover { text-decoration: none; } .TextHeader a:active { text-decoration: underline; }

/* the funny */ .lcs-container .ContainerColumn:nth-child(2) .TextHeader { height: 20px; } .lcs-container .ContainerColumn:nth-child(2) .TextHeader #normal { animation: furrylight-1 20s infinite; visibility: hidden; } .lcs-container .ContainerColumn:nth-child(2) .TextHeader #furry { transform: translateY(-20px); animation: furrylight-2 20s infinite; } @keyframes furrylight-1 { 10% {opacity: 0; visibility: hidden} 13% {opacity: 1; visibility: visible} 93% {opacity: 1; visibility: visible} 95% {opacity: 0; visibility: hidden} } @keyframes furrylight-2 { 8% {opacity: 1} 10% {opacity: 0} 93% {opacity: 0} 100% {opacity: 1} }

/* table colors */ td.Highlight-Black { background-image: linear-gradient(rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.5) 100%) !important; color: #fff; } td.Highlight-Red { background-image: linear-gradient(rgba(255, 54, 28, 0.7) 0, rgba(255, 54, 28, 0.7) 100%) !important; color: #fff; } td.Highlight-Green { background-image: linear-gradient(rgba(65, 247, 24, 0.7) 0, rgba(65, 247, 24, 0.7) 100%) !important; color: #fff; }

/* other */ .highlight { background-image: linear-gradient(rgba(0, 0, 0, 0.15) 0, rgba(0, 0, 0, 0.15) 100%) !important;