gandc/x-ui
1
0
Fork 0
mirror of https://github.com/alireza0/x-ui.git synced 2026-03-21 16:25:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

UI improvements (#708)

Browse Source 
* Improved login page

* Improved login page

* Update inbound_client_table.html

* Update external_proxy.html

* Update custom.css
This commit is contained in:
Tara Rostami
2023-12-06 13:57:20 +03:30
committed by GitHub
parent ed5db9390d
commit 5b20505515
4 changed files with 186 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

172
web/assets/css/custom.css
View File

@@ -741,9 +741,27 @@ style attribute {
border-right-color: #2C3950;
}
.has-warning .ant-input, .has-warning .ant-input:hover {
background-color: #fff6E6;
border-color: #ffd98c;
}
.has-warning .ant-input::placeholder {
color: #faad14;
}
.has-warning .ant-input:not([disabled]):hover {
border-color: #ffd98c;
}
.dark .has-warning .ant-input,
.dark .has-warning .ant-input:hover {
border-color: #faad14;
border-color: #784e1d;
background: rgb(49, 35, 19);
}
.dark .has-warning .ant-input::placeholder {
color:rgb(255 160 49 / 70%);
}
.dark .has-warning .anticon {
@@ -811,3 +829,155 @@ li.ant-select-dropdown-menu-item:empty:after {
font-weight:normal;
color:rgb(0 0 0 / 25%);
}
.dark li.ant-select-dropdown-menu-item:empty:after {
content: "None";
font-weight:normal;
color:rgb(255 255 255 / 30%);
}
.ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item:hover .ant-select-selected-icon {
color: rgba(0,0,0,.87)
}
.dark.ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item:hover .ant-select-selected-icon {
color: rgb(255, 255, 255)
}
.ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item-selected .ant-select-selected-icon,.ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item-selected:hover .ant-select-selected-icon {
color: #3c89e8
}
.ant-btn-primary-login {
color: #0e49b5;
background-color: #edf4fa;
border-color: #a9c5e7;
text-shadow: 0 -1px 0 rgba(0,0,0,.12);
box-shadow: none;
width: 100%;
}
.ant-btn-primary-login:focus,
.ant-btn-primary-login:hover {
color: #fff;
background-color: #0c3f9d;
border-color: #0e49b5;
background-image: linear-gradient(
270deg,
rgba(123, 199, 77, 0) 30%,
#2f67c2,
rgba(123, 199, 77, 0) 100%
);
background-repeat: no-repeat;
animation: ma-bg-move ease-in-out 5s infinite;
background-position-x: -500px;
width: 95%;
animation-delay: -.5s;
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045);
}
.ant-btn-primary-login.active, .ant-btn-primary-login:active {
color: #fff;
background-color: #04308f;
border-color: #04308f;
}
@keyframes ma-bg-move {
0% {
background-position: -500px 0;
}
50% {
background-position: 1000px 0;
}
100% {
background-position: 1000px 0;
}
}
.wave-btn-bg {
position: relative;
border-radius: 25px;
width: 100%;
}
.dark .wave-btn-bg {
color: #ffffff;
position: relative;
background: #0e49b5;
border: 2px double transparent;
background-origin: border-box;
background-clip: padding-box, border-box;
background-size: 300%;
animation: wave-btn-tara 4s ease infinite;
transition: all 0.5s ease;
width: 100%;
}
.dark .wave-btn-bg-cl {
background-image: linear-gradient(rgb(13 14 33 / 0%), rgb(13 14 33 / 0%)), radial-gradient(circle at left top, #0e49b5, #387eff, #0e49b5) !important;
border-radius: 3em;
}
.dark .wave-btn-bg-cl:hover {
width:95%;
}
.dark .wave-btn-bg-cl:before {
position: absolute;
content: "";
top: -5px;
left: -5px;
bottom: -5px;
right: -5px;
z-index: -1;
background: inherit;
background-size: inherit;
border-radius: 4em;
opacity: 0;
transition: 0.5s;
}
.dark .wave-btn-bg-cl:hover::before {
opacity: 1;
filter: blur(20px);
animation: wave-btn-tara 8s linear infinite;
}
@keyframes wave-btn-tara {
to {
background-position: 300%;
}
}
.dark .ant-btn-primary-login {
font-size: 14px;
color: #ffffff;
text-align: center;
background-image: linear-gradient(rgb(13 14 33 / 45%), rgb(13 14 33 / 35%));
border-radius: 2rem;
border: none;
outline: none;
background-color: transparent;
height: 46px;
position: relative;
white-space: nowrap;
cursor: pointer;
touch-action: manipulation;
padding: 0 15px;
width: 100%;
animation:none;
background-position-x:0;
box-shadow: none;
}
.ant-input-number-focused, .ant-input-number:hover {
background-color: #edf4fa;
}
.ant-select-selection:hover {
background-color: #edf4fa;
}
.dark .ant-input-number-handler:active {
background: #0e49b5;
}