Files
VOREStation/code/modules/vchat/css/ss13styles.css
VerySoft 9327ccb9a1 Fancy!!!
Makes a few changes to things, most of which are functionally identical to before.

Changes the shadekin empathy color to something unique, and more visible in dark mode than the changeling color. Also gives it a special font.

Makes a slightly lighter color as an alt color for dark mode

Makes it so that hivemind languages don't HAVE to be italics, but makes it so all the existing hivemind languages minus shadekin empathy are italicized. (The font I picked for empathy was hard to read while italics)
2023-09-11 18:18:12 -04:00

257 lines
7.5 KiB
CSS

/* VChat Styles */
body.inverted {
background-color: #111111;
}
#topmenu {
overflow-x: auto;
overflow-y: hidden;
}
#contentbox {
margin-top: 3.3rem; /* Make room for the fixed top menu */
overflow-wrap: break-word;
word-wrap: break-word; /* IE, blah */
}
.menu, .item {
padding-top: 0.2em !important;
padding-bottom: 0.2em !important;
}
.ui.menu .item > .label:not(.floating) {
margin-left: 0;
padding-bottom: 0;
padding-top: 0;
text-align: center;
font-size: 10px;
}
.item {
cursor: pointer;
}
.inputbox {
width: 5em !important;
padding: 0.1em !important;
}
.icon-left-open-outline:hover, .icon-right-open-outline:hover, .icon-cancel-circled-outline:hover {
color: red;
}
.blinkwarn {
color: #FF0000;
animation: blink-animation 1s steps(5, start) infinite;
}
@keyframes blink-animation {
to {
visibility: hidden;
}
}
/* SS13 Styles */
#messagebox {font-family: Verdana, sans-serif;}
#messagebox h1, #messagebox h2, #messagebox h3, #messagebox h4, #messagebox h5, #messagebox h6 {color: #0000ff; font-family: Georgia, Verdana, sans-serif;}
#messagebox em {font-style: normal; font-weight: bold;}
#messagebox a {text-decoration: underline;}
.motd {color: #638500;font-family: Verdana, sans-serif;}
.motd h1, .motd h2, .motd h3, .motd h4, .motd h5, .motd h6
{color: #638500;text-decoration: underline;}
.motd a, .motd a:link, .motd a:visited, .motd a:active, .motd a:hover
{color: #638500;}
.prefix {font-weight: bold;}
.log_message {color: #386AFF; font-weight: bold;}
/*.inverted .message {color: #386AFF; font-weight: bold;}*/
/* OOC */
.ooc {font-weight: bold;}
.ooc img.text_tag {width: 32px; height: 10px;}
.ooc .everyone {color: #002eb8;}
.inverted .ooc .everyone {color: #004ed8;} /* Dark mode */
.looc {color: #3A9696; font-weight: bold}
.rlooc {color: #3ABB96; font-weight: bold}
.ooc .elevated {color: #2e78d9;}
.ooc .moderator {color: #184880;}
.ooc .developer {color: #1b521f;}
.ooc .admin {color: #b82e00;}
.ooc .event_manager {color: #660033;}
.ooc .aooc {color: #960018;}
/* Admin: Private Messages */
.pm .howto {color: #ff0000; font-weight: bold; font-size: 200%;}
.pm .in {color: #ff0000;}
.pm .out {color: #ff0000;}
.pm .other {color: #0000ff;}
/* Admin: Channels */
.mentor {color: #808000;}
.mentor_channel {color: #808000; font-weight: bold;}
.mod_channel {color: #735638; font-weight: bold;}
.mod_channel .admin {color: #b82e00; font-weight: bold;}
.admin_channel {color: #9611D4; font-weight: bold;}
.event_channel {color: #cc3399; font-weight: bold;}
/* Radio: Misc */
.deadsay {color: #530FAD;}
.inverted .deadsay {color: #732FCD;} /* Dark mode */
.radio {color: #008000;}
.deptradio {color: #ff00ff;} /* when all other department colors fail */
.newscaster {color: #750000;}
/* Radio Channels */
.comradio {color: #193A7A;}
.inverted .comradio {color: #395A9A;} /* Dark mode */
.syndradio {color: #6D3F40;}
.centradio {color: #5C5C8A;}
.airadio {color: #FF00FF;}
.entradio {color: #339966;}
.secradio {color: #A30000;}
.engradio {color: #A66300;}
.medradio {color: #008160;}
.sciradio {color: #993399;}
.supradio {color: #5F4519;}
.srvradio {color: #6eaa2c;}
.expradio {color: #555555;}
/* Miscellaneous */
.name {font-weight: bold;}
.say {color: #000000;}
.inverted .say {color: #FFFFFF;}
.emote {color: #000000;}
.inverted .emote {color: #FFFFFF;}
.alert {color: #ff0000;}
h1.alert, h2.alert {color: #000000;}
.nif {} /* VOREStation Add */
/* Game Messages */
.attack {color: #ff0000;}
.moderate {color: #CC0000;}
.disarm {color: #990000;}
.passive {color: #660000;}
.critical {color: #ff0000; font-weight: bold; font-size: 150%;}
.danger {color: #ff0000; font-weight: bold;}
.warning {color: #ff0000; font-style: italic;}
.rose {color: #ff5050;}
.info {color: #0000CC;}
.inverted .info {color: #6060c9;} /* Dark mode */
.notice {color: #000099;}
.inverted .notice {color: #6060c9;} /* Dark mode */
.alium {color: #00ff00;}
.cult {color: #800080; font-weight: bold; font-style: italic;}
.reflex_shoot {color: #000099; font-style: italic;}
/* Languages */
.alien {color: #543354;font-style: italic;}
.tajaran {color: #803B56;}
.tajaran_signlang {color: #941C1C;}
.akhani {color: #AC398C;}
.skrell {color: #00B0B3;}
.skrellfar {color: #70FCFF;}
.soghun {color: #50BA6C;}
.solcom {color: #3333CE;}
.inverted .solcom {color: #6da6f0;}
.changeling {color: #800080;font-style: italic;}
.inverted .changeling {color: #b000b1;}
.sergal {color: #0077FF;}
.birdsongc {color: #CC9900;}
.vulpkanin {color: #B97A57;}
.tavan {color: #f54298; font-family: Arial}
.echosong {color: #826D8C;}
.enochian {color: #848A33; letter-spacing:-1pt; word-spacing:4pt; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;}
.daemon {color: #5E339E; letter-spacing:-1pt; word-spacing:0pt; font-family: "Courier New", Courier, monospace;}
.drudakar {color: #bb2463; word-spacing:0pt; font-family: "High Tower Text", monospace;}
.bug {color: #9e9e39;}
.vox {color: #AA00AA;}
.promethean {color: #5A5A5A; font-family:"Comic Sans MS","Comic Sans",cursive;}
.inverted .promethean {color: #A5A5A5; font-family:"Comic Sans MS","Comic Sans",cursive;}
.zaddat {color: #941C1C;}
.rough {font-family: "Trebuchet MS", cursive, sans-serif;}
.say_quote {font-family: Georgia, Verdana, sans-serif;}
.say_quote_italics {font-style: italic; font-family: Georgia, Verdana, sans-serif;}
.terminus {font-family: "Times New Roman", Times, serif, sans-serif}
.interface {color: #330033;}
.spacer {color: #9c660b;} /* VOREStation Add */
.blob {color: #ff950d; font-weight: bold; font-style: italic;}
.teppi {color: #816540; word-spacing:4pt; font-family: "Segoe Script Bold","Segoe Script",sans-serif,Verdana;}
.shadekin {color: #be3cc5; font-size: 150%; font-weight: bold; font-family: "Gabriola", cursive, sans-serif;}
.black {color: #000000;}
.darkgray {color: #808080;}
.gray {color: #A9A9A9;}
.red {color: #FF0000;}
.orange {color: #FF8C00;}
.blue {color: #0000FF;}
.green {color: #00DD00;}
.inverted .black {color: #606060;}
.inverted .darkgray {color: #808080;}
.inverted .gray {color: #A9A9A9;}
.inverted .red {color: #FF4444;}
.inverted .orange {color: #FF8C00;}
.inverted .blue {color: #6666FF;}
.inverted .green {color: #44FF44;}
.pnarrate {color: #009AB2;}
/*BIG IMG.icon {width: 32px; height: 32px;}*/
img.icon {vertical-align: middle; max-height: 1em;}
img.icon.bigicon {max-height: 32px;}
/* Zoom levels - Replaced with arbitrary font sizes
.zoom_normal {
font-size: 0.9em;
line-height: 1.35;
}
.zoom_more {
font-size: 1.2em;
line-height: 1.4;
}
.zoom_less {
font-size: 0.8em;
line-height: 1.2;
}
*/
/* Debug Logs */
.debug_error {color:#FF0000; font-weight:bold}
.debug_warning {color:#FF0000;}
.debug_info {color:#000000;}
.inverted .debug_info {color: #FFFFFF;}
.debug_debug {color:#0000FF;}
.debug_trace {color:#888888;}
/* Log animations */
.msgsanim-enter-active {
transition: opacity 0.5s, transform 0.5s;
}
.msgsanim-enter {
opacity: 0;
transform: translateX(15px);
}
/* Dog mode */
.woof {
background-color: rgba(255,255,255,0) !important;
background-image: url('dog.gif') !important;
background-size: cover !important;
transition: background-color 15s;
}
.woof div, .woof span {
background-color: rgba(0,0,0,0) !important;
transition: background-color 15s;
}