diff options
Diffstat (limited to 'webAO/styles/chatbox/trilogy.css')
| -rw-r--r-- | webAO/styles/chatbox/trilogy.css | 143 |
1 files changed, 143 insertions, 0 deletions
diff --git a/webAO/styles/chatbox/trilogy.css b/webAO/styles/chatbox/trilogy.css new file mode 100644 index 0000000..7de2fa8 --- /dev/null +++ b/webAO/styles/chatbox/trilogy.css @@ -0,0 +1,143 @@ +.text_white { + color: #fff; +} + +.text_green { + color: #00c900; +} + +.text_red { + color: #ff1700; +} + +.text_orange { + color: #ffa500; +} + +.text_blue { + color: #67b7ed; +} + +.text_yellow { + color: #ff0; +} + +.text_pink { + color: #ffc0cb; +} + +.text_cyan { + color: #0ff; +} + +.text_rainbow { + background-color: #fff; + 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_chatcontainer { + position: absolute; + bottom: 0; + height: 30%; + width: 100%; + font-family: "FOTK-Yoon Mincho 740", serif; +} + +#client_name { + display: block; + background-color: #2989bd; + top: 0; + left: 10%; + padding: 0 10px; + height: 20%; + min-width: 15%; + border: 1px white; + border-style: solid none solid none; + position: absolute; + z-index: 1; +} + +#client_inner_name { + margin: 0; +} + +#client_chat { + font-size: 1em; + display: block; + width: 100%; + margin: auto; + height: 90%; + top: 10%; + position: absolute; + word-break: keep-all; + word-wrap: break-word; + overflow-wrap: break-word; + text-align: left; + overflow: hidden; + scroll-behavior: smooth; + background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAL0lEQVQImWOQ98nYzGsVupnXKnSzvE8GCmaASWBTgF8S3VhkNgOySnRTiJdENxYAYC1Ff2vnYrkAAAAASUVORK5CYII=) repeat; + border: 1px white; + border-style: solid none solid none; +} + +#client_chat p { + margin: 4px; + padding: 2% 5%; +} + +#client_chatwaiting { + display: block; + color: transparent; + right: 0.6em; + bottom: 0.6em; + width: 1em; + height: 1em; + background-image: url("chatwaiting_triology.svg"); + background-size: contain; + position: absolute; + animation: idling 0.5s ease infinite; +} + +@keyframes idling { + 0% { + right: 0.6em; + } + + 25% { + right: 0.7em; + } + + 100% { + right: 0.6em; + } +}
\ No newline at end of file |
