Translator / frontend /src /style.scss
Xin Zhang
[feature]: add frontend src.
7015ba3
:root {
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
line-height: 1.5;
font-weight: 400;
color-scheme: light dark;
color: rgba(255, 255, 255, 0.87);
background-color: #242424;
font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: 100%;
}
a {
font-weight: 500;
color: #646cff;
text-decoration: inherit;
}
a:hover {
color: #535bf2;
}
body {
margin: 0;
display: flex;
place-items: center;
min-width: 320px;
height: auto;
min-height: auto;
color: #333;
background: #fff;
}
h1 {
font-size: 3.2em;
line-height: 1.1;
}
button {
border-radius: 8px;
border: 1px solid transparent;
padding: 0.6em 1.2em;
font-size: 1em;
font-weight: 500;
font-family: inherit;
background-color: #1a1a1a;
cursor: pointer;
transition: border-color 0.25s;
}
//button:hover {
// border-color: #646cff;
//}
//button:focus,
//button:focus-visible {
// outline: 4px auto -webkit-focus-ring-color;
//}
$FormMaxWidth: 1024px;
$FormItemWidth: 1022px;
.card {
border-bottom: solid 2px lightgray;
//border-radius: 4px;
align-items: center;
justify-content: center;
/* padding: 2em; */
margin-top: 40px;
display: flex;
max-width: $FormMaxWidth;
width: 100%;
}
.seg-title {
margin: 24px 0;
font-size: 20px;
font-weight: 500;
}
.seg-co {
width: 1022px;
text-align: left;
border-left: solid 6px midnightblue;
padding-left: 8px;
margin-left: 2px;
margin-top: 36px;
line-height: 24px;
}
#app {
margin: 0 auto;
padding: 0 ;
text-align: center;
width: 100%;
}
.ant-btn {
padding: 4px 12px;
}
@media (prefers-color-scheme: light) {
:root {
color: #213547;
background-color: #ffffff;
}
a:hover {
color: #747bff;
}
button {
background-color: #f9f9f9;
}
}
.ant-card {
background: #f5f6fa;
}
.ant-card .ant-card-actions {
background-color: rgba(232, 232, 248, 0.8) !important;
}
.ant-popover {
max-width: 800px !important;
}
.ant-form-item {
background: transparent;
margin-bottom: 40px !important;
.ant-form-item-explain-error {
color: #ff4d4f;
text-align: left !important;
}
}
.ant-form-item-label {
label {
font-size: 18px !important;
color: #1a1a1a !important;
font-weight: 500 !important;
}
}
.ant-tooltip {
max-width: $FormItemWidth !important;
}
.ant-page-header-heading {
width: 1022px !important;
}
.highlight {
//background: #feffe6;
background: ghostwhite;
}