aboutsummaryrefslogtreecommitdiff
path: root/webAO/styles/client.css
diff options
context:
space:
mode:
Diffstat (limited to 'webAO/styles/client.css')
-rw-r--r--webAO/styles/client.css568
1 files changed, 568 insertions, 0 deletions
diff --git a/webAO/styles/client.css b/webAO/styles/client.css
new file mode 100644
index 0000000..e736e16
--- /dev/null
+++ b/webAO/styles/client.css
@@ -0,0 +1,568 @@
+#about-logo {
+ padding-top: 5px;
+ height: 30%;
+ image-rendering: auto;
+}
+
+.lm_content :link {
+ color: #4288f2;
+}
+
+.lm_content :visited {
+ color: #a65bd4;
+}
+
+@keyframes error_blink {
+ 0% {
+ color: #fff;
+ }
+
+ 50% {
+ color: red;
+ }
+
+ 100% {
+ color: #fff;
+ }
+}
+
+#client_error {
+ position: absolute;
+ display: flex;
+ flex-direction: column;
+ padding: 10px;
+ top: 50%;
+ left: 50%;
+ margin-right: -50%;
+ transform: translate(-50%, -50%);
+ justify-content: center;
+ align-items: center;
+ background: #a00;
+ color: #fff;
+ font-size: large;
+ animation: error_blink 3s ease-in-out infinite;
+ z-index: 100;
+}
+
+#client_loading {
+ position: absolute;
+ display: flex;
+ flex-direction: column;
+ padding: 10px;
+ top: 50%;
+ left: 50%;
+ margin-right: -50%;
+ transform: translate(-50%, -50%);
+ justify-content: center;
+ align-items: center;
+ background: black;
+ color: lightgreen;
+ font-size: large;
+ z-index: 100;
+}
+
+#client_loadingtext {
+ margin: 30px;
+}
+
+#client_gamewindow {
+ width: 100%;
+}
+
+@keyframes shake {
+ 0%,100% {left: 0; }
+ 20% {left: -10%; }
+ 40% {left: +10%; }
+ 60% {left: -10%; }
+ 80% {left: +10%; }
+}
+
+@keyframes flash {
+ 0%,100% {background-color: transparent; }
+ 50% {background-color: white; }
+}
+
+#client_charselect {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ overflow-y: auto;
+ justify-content: center;
+ align-items: center;
+ vertical-align: middle;
+ margin: 0 auto;
+ background: rgba(70, 70, 70, 0.5);
+ z-index: 50;
+}
+
+#client_chartable {
+ background: #eee;
+}
+
+#client_chartable_container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+.demothing {
+ display: block;
+ height: 60px;
+ width: 60px;
+ max-width: 60px;
+ max-height: 60px;
+ margin: 3px;
+ border: 1px solid #000;
+}
+
+#client_icwrapper {
+ overflow-x: hidden;
+ overflow-y: auto;
+ height: 100%;
+}
+
+@media (max-width: 360px) {
+ #kek {
+ width: fit-content;
+ }
+}
+
+#client_emo {
+ position: relative;
+ top: 10px;
+ width: 95%;
+}
+
+.emote_button {
+ display: inline-block;
+ width: 40px;
+ height: 40px;
+ padding: 1px;
+ cursor: pointer;
+ border: 1px solid #000;
+}
+
+#client_settings {
+ width: 100%;
+}
+
+#client_court {
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ top: 0;
+ left: 0;
+}
+
+#client_char {
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ bottom: 0;
+}
+
+#client_pair_char {
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ bottom: 0;
+}
+
+#client_bench {
+ display: none;
+ position: absolute;
+ height: auto;
+ width: 100%;
+ bottom: 0;
+ left: 0;
+}
+
+#client_fg {
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ bottom: 0;
+ left: 0;
+}
+
+#client_evi {
+ opacity: 0;
+ position: absolute;
+ background-repeat: no-repeat;
+ background-size: contain;
+ height: 0%;
+ width: auto;
+ top: 1.5em;
+ transition: 0.25s linear;
+ transition-property: height, opacity;
+}
+
+#client_shout {
+ display: block;
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ bottom: 0;
+ left: 0;
+}
+
+#client_background {
+ position: relative;
+ padding-bottom: 75%;
+ background-color: transparent;
+ top: 0;
+ left: 0;
+}
+
+.rainbow-text {
+ background-color: rgb(255, 255, 255);
+ background-image: repeating-linear-gradient(to right,
+ red 0% 8%, orange 8% 16%, yellow 16% 24%, green 24% 32%, blue 32% 40%,
+ red 40% 48%, orange 48% 56%, yellow 56% 64%, green 64% 72%, blue 72% 80%,
+ red 80% 88%, orange 88% 96%, yellow 96% 100% );
+ background-size: 40% 40%;
+ background-clip: text;
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ animation: rainbow 4s linear infinite;
+ }
+
+ @keyframes rainbow_alt {
+ 0%,100% {background-position: 0 0; }
+ 50% {background-position: 400% 0; }
+ }
+
+ @keyframes rainbow {
+ 0% {background-position: 0 0; }
+ 100% {background-position: 400% 0; }
+ }
+
+#client_inputbox {
+ font-size: 21px;
+ padding: 2px 10px;
+}
+
+.long {
+ width: 100%;
+ background-color: #ddd;
+ border: 1px solid #555;
+ border-style: solid;
+ box-sizing: border-box;
+ margin: auto;
+}
+
+#client_chatlog {
+ top: 0;
+ right: 0;
+ flex: 1;
+}
+
+#client_log {
+ position: relative;
+ height: 100%;
+ color: #fff;
+ word-break: keep-all;
+ word-wrap: break-word;
+ overflow-wrap: break-word;
+ overflow-y: auto;
+ font-size: medium;
+ background-color: #242424;
+ text-align: start;
+ line-height: .85em;
+}
+
+#client_log>p {
+ line-height: 1.1em;
+}
+
+#iclog_name {
+ font-weight: bold;
+ padding-right: .35em;
+}
+
+#iclog_time {
+ float: right;
+ padding-right: .5em;
+ color: #dbdbdb;
+}
+
+#client_ooclog {
+ position: relative;
+ background-color: #242424;
+ color: #fff;
+ font-family: "Source Code Pro", "Consolas", monospace;
+ font-size: small;
+ overflow-wrap: break-word;
+ overflow-y: auto;
+ text-rendering: optimizelegibility;
+ resize: none;
+ flex: 1 1 auto;
+ border: none;
+}
+
+#client_musiclist {
+ width: 99%;
+ height: 100%;
+ background-color: #222;
+ color: #fff;
+}
+
+#client_bars {
+ position: relative;
+ text-align: center;
+ display: flex;
+ display: -webkit-flex;
+}
+
+#client_testimony {
+ display: block;
+ position: absolute;
+ width: 100%;
+ height: auto;
+}
+
+.evi_icon {
+ width: 70px;
+ height: 70px;
+ background-color: #787878;
+ outline-color:#886060;
+ outline-width: 1px;
+ outline-style: inset;
+ outline-offset: -1px;
+}
+
+#evi_options {
+ display: inline-block;
+ padding-left: 5px;
+}
+
+#evi_options label {
+ display: inline-block;
+ width: 3em;
+}
+
+#evi_desc {
+ flex: 1 auto;
+}
+
+#bg_preview {
+ max-width: 150px;
+ max-height: 112px;
+ width: 100%;
+ height: 100%;
+ border-style: double;
+ border-radius: 7px;
+ border-color: #fff;
+ border-width: 3px;
+}
+
+.slider {
+ padding-right: 4px;
+ width: 80%;
+ align-self: center;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+#client_defense_hp {
+ text-align: left;
+}
+
+#client_defense_hp>.health-bar {
+ background-color: #169de0;
+}
+
+#client_prosecutor_hp {
+ text-align: right;
+}
+
+#client_prosecutor_hp>.health-bar {
+ background-color: #e01f5f;
+}
+
+.health-box {
+ background-color: #555;
+ height: 20px;
+ width: 50%;
+ margin: 0 auto;
+ border: solid 2px #aaa;
+ border-radius: 5px;
+ box-sizing: border-box;
+ display: block;
+}
+
+.health-bar {
+ width: 100%;
+ height: 100%;
+ border-radius: 3px;
+ bottom: 0;
+ position: relative;
+ display: inline-block;
+ transition: 1s linear;
+ transition-property: width;
+}
+
+.judge_button {
+ display: inline-block;
+ min-width: 85px;
+ min-height: 42px;
+ margin: 5px 1px;
+ padding: 2px;
+ cursor: pointer;
+ text-align: center;
+ font-weight: bold;
+ font-family: sans-serif;
+ text-shadow: -2px 0 #fff, 0 2px #fff, 2px 0 #fff, 0 -2px #fff;
+ background-color: #c1c1c1;
+ border-radius: 5px;
+ border-style: solid;
+ border-width: 1px;
+ border-color: #919191;
+ box-shadow: 1px 1px white inset;
+ vertical-align: middle;
+}
+
+.client_button {
+ min-width: 6em;
+ margin: 1px;
+ padding: 6px 2px;
+ clip-path: polygon(75% 0, 100% 50%, 100% 100%, 0 100%, 0 50%, 25% 0);
+ cursor: pointer;
+ text-align: center;
+ color: white;
+ background-color: #7b2900;
+ text-shadow: 0 0 4px #000;
+ border: 1px solid #000;
+}
+
+.client_button.hover_button.inactive {
+ display: none;
+}
+
+.client_button.hover_button:hover {
+ border-color: #FFD081;
+}
+
+.dark {
+ filter: brightness(50%);
+}
+
+.noini {
+ transform: rotate(180deg);
+}
+
+.hrtext {
+ overflow: hidden;
+ text-align: center;
+ font-size: small;
+ color: #c6c6c6;
+}
+
+.hrtext:before,
+.hrtext:after {
+ background-color: #c6c6c6;
+ content: "";
+ display: inline-block;
+ height: 1px;
+ position: relative;
+ vertical-align: middle;
+ width: 50%;
+}
+
+.hrtext:before {
+ right: 0.5em;
+ margin-left: -50%;
+}
+
+.hrtext:after {
+ left: 0.5em;
+ margin-right: -50%;
+}
+
+#client_menu {
+ overflow-y: auto;
+ height: 100%;
+}
+
+.menu_content {
+ margin: 15px 15px;
+ display: none;
+}
+
+.menu_content.active {
+ display: block;
+}
+
+.menu_icon {
+ cursor: pointer;
+ display: inline-table;
+ margin: 10px 15px;
+ opacity: 1;
+}
+
+.menu_icon.active {
+ opacity: 0.25;
+}
+
+.menu_icon:hover {
+ color: #FFD081;
+}
+
+.em-3 {
+ font-size: 3em;
+}
+
+.area-button {
+ border-style: solid;
+ min-width: 120px;
+ margin: 5px;
+ display: inline-block;
+ padding: 6px;
+ border-radius: 5px;
+ border-color: white;
+ border-width: 1px;
+ cursor: pointer;
+ color: #000;
+}
+
+.area-button:hover {
+ border-color: #FFD081;
+}
+
+.area-default {
+ background-color: rgb(54,198,68);
+}
+
+.area-idle {
+ background-color: rgb(54,198,68);
+}
+
+.area-looking-for-players {
+ background-color: rgb(255,255,0);
+}
+
+.area-casing {
+ background-color: rgb(255,166,0);
+}
+
+.area-recess {
+ background-color: rgb(255,190,30);
+}
+
+.area-rp {
+ background-color: rgb(200,52,252);
+}
+
+.area-gaming {
+ background-color: rgb(55,255,255);
+}
+
+.area-locked {
+ background-color: rgb(127,127,127);
+}
+
+.area-spectatable {
+ background-color: rgb(54,198,68);
+} \ No newline at end of file
generated by cgit (git 2.34.1) at 2026-04-23 16:44:48 +0000