Remove deprecated scripts for adding head-matter to wt_config.xml, including Python and Bash implementations, to streamline configuration management.
This commit is contained in:
Torsten Schulz (local)
398
client/src/style.css
Normal file
398
client/src/style.css
Normal file
@@ -0,0 +1,398 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&family=Noto+Sans+JP&family=Noto+Sans+SC&family=Noto+Sans+Thai&display=swap');
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html, body, #app {
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
font-family: 'Noto Sans', 'Noto Sans JP', 'Noto Sans SC', 'Noto Sans Thai', sans-serif;
|
||||
}
|
||||
|
||||
.chat-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: #ffffff;
|
||||
color: #005100;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.header > div,
|
||||
.header > span {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.header h1 {
|
||||
padding: 0 0.5em;
|
||||
margin: 0;
|
||||
display: inline-block;
|
||||
color: #005100;
|
||||
}
|
||||
|
||||
.menu {
|
||||
background-color: #2E7D32;
|
||||
height: 2.6em;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 0.4em;
|
||||
}
|
||||
|
||||
.menu > * {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.menu button {
|
||||
background-color: #429043;
|
||||
color: #ffffff;
|
||||
height: 2em;
|
||||
margin: 0.2em 0.4em;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
padding: 0 0.5em;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.menu button:hover {
|
||||
background-color: #52a052;
|
||||
}
|
||||
|
||||
.menu span {
|
||||
display: inline-block;
|
||||
padding: 0.375em 0.4em;
|
||||
color: #2E7D32;
|
||||
border: 1px solid #fff;
|
||||
background-color: lightgray;
|
||||
margin: 0.1em 0.2em;
|
||||
}
|
||||
|
||||
.horizontal-box {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.user-list {
|
||||
width: 15em;
|
||||
background-color: lightgray;
|
||||
overflow-y: auto;
|
||||
flex-shrink: 0;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.user-list h3 {
|
||||
margin-bottom: 0.5em;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.user-item {
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 0.3em 0.5em;
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
|
||||
.user-item:hover {
|
||||
background-color: #b0b0b0;
|
||||
}
|
||||
|
||||
.user-item.gender-M {
|
||||
background-color: #0066CC;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.user-item.gender-F {
|
||||
background-color: #FF4081;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.user-item.gender-P {
|
||||
background-color: #FFC107;
|
||||
}
|
||||
|
||||
.user-item.gender-TM {
|
||||
background-color: #90caf9;
|
||||
}
|
||||
|
||||
.user-item.gender-TF {
|
||||
background-color: #8E24AA;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.content {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.chat-window {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 20px;
|
||||
background-color: white;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.output-box-format {
|
||||
border: 1px solid #999;
|
||||
padding: 1px 6px;
|
||||
margin-bottom: 0.2em;
|
||||
border-radius: 3px;
|
||||
line-height: 2em;
|
||||
}
|
||||
|
||||
.ouput-box-format-self {
|
||||
background-color: #eaeaea;
|
||||
}
|
||||
|
||||
.output-box-format-other {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.chat-input-container {
|
||||
padding: 10px;
|
||||
background-color: #f0f0f0;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.chat-input-container input {
|
||||
flex: 1;
|
||||
padding: 8px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.chat-input-container button {
|
||||
padding: 8px 15px;
|
||||
background-color: #429043;
|
||||
color: white;
|
||||
border: solid 1px #999;
|
||||
border-radius: 0;
|
||||
cursor: pointer;
|
||||
min-height: 2.3em;
|
||||
}
|
||||
|
||||
.chat-input-container button:hover {
|
||||
background-color: #52a052;
|
||||
}
|
||||
|
||||
.chat-input-container .no-style {
|
||||
border: none;
|
||||
background: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
width: 31px !important;
|
||||
height: 29px !important;
|
||||
}
|
||||
|
||||
.chat-input-container .no-style > img {
|
||||
width: 31px;
|
||||
height: 31px;
|
||||
}
|
||||
|
||||
.imprint-container {
|
||||
background-color: #f0f0f0;
|
||||
padding: 10px 20px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.imprint-container a {
|
||||
color: #005100;
|
||||
text-decoration: none;
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
.imprint-container a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.login-form {
|
||||
padding: 20px;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.login-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
max-width: 40em;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.form-row label {
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
.form-row input,
|
||||
.form-row select {
|
||||
flex: 1;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.form-row button {
|
||||
padding: 8px 15px;
|
||||
background-color: #429043;
|
||||
color: white;
|
||||
border: solid 1px #999;
|
||||
border-radius: 0;
|
||||
cursor: pointer;
|
||||
justify-self: start;
|
||||
min-height: 2.3em;
|
||||
}
|
||||
|
||||
.form-row button:hover {
|
||||
background-color: #52a052;
|
||||
}
|
||||
|
||||
.welcome-message {
|
||||
margin-top: 20px;
|
||||
padding: 20px;
|
||||
background-color: #f9f9f9;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.search-form {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.search-form .form-row {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.search-results {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.search-result-item {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-result-item:hover {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.inbox-list,
|
||||
.history-list {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.inbox-item,
|
||||
.history-item {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.inbox-item:hover,
|
||||
.history-item:hover {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.partners-view {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.back-link {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.back-link a {
|
||||
color: #429043;
|
||||
text-decoration: underline;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.back-link a:hover {
|
||||
color: #2E7D32;
|
||||
}
|
||||
|
||||
.partners-list {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.partners-list li {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.partners-list a {
|
||||
color: #005100;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.imprint-container a {
|
||||
color: #005100;
|
||||
text-decoration: none;
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
.flag-icon {
|
||||
margin: 0.25em 0.5em 0 0;
|
||||
width: 16px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.smiley-bar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
max-width: 200px;
|
||||
bottom: 89px;
|
||||
position: absolute;
|
||||
font-size: 24pt;
|
||||
right: 3px;
|
||||
background-color: #fff;
|
||||
border: 1px solid #ccc;
|
||||
padding: 0.3em;
|
||||
border-radius: 4px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.smiley-item {
|
||||
cursor: pointer;
|
||||
padding: 0.2em;
|
||||
margin: 0.1em;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.smiley-item:hover {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.partners-list a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user