123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128 |
- .loginContainer {
- display: flex;
- flex-direction: column;
- min-height: 100vh;
- background-color: #e8f0fe;
- position: relative;
- overflow: hidden;
- color: #160a19;
- }
- .leftSection {
- flex: 1;
- display: flex;
- width: 390px;
- margin: auto;
- flex-direction: column;
- }
- .platformTitle {
- font-size: 36px;
- font-weight: bold;
- letter-spacing: 0.64px;
- color: #333;
- position: relative;
- }
- .platformTitle::after {
- content: '';
- position: absolute;
- bottom: -8px;
- left: 0;
- width: 70px;
- height: 5px;
- border-radius: 4px;
- background-color: #1890FF;
- }
- .rightSection {
- flex: 1;
- display: flex;
- justify-content: center;
- align-items: center;
- margin-top: 2em;
- }
- .loginBox {
- background-color: white;
- border-radius: 10px;
- padding: 2rem;
- width: 100%;
- max-width: 450px;
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
- }
- .tabsContainer :global(.ant-tabs-nav::before) {
- border-bottom: none !important;
- }
- .tabsContainer :global(.ant-tabs-tab) {
- padding: 12px 16px;
- font-size: 16px;
- }
- .tabsContainer :global(.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn) {
- color: #1890ff;
- font-weight: 500;
- }
- .phonePrefix {
- width: 30px;
- text-align: center;
- color: #333;
- text-align: left;
- }
- .phoneInput {
- width: 100%;
- font-size: 16px;
- }
- .codeRow {
- display: flex;
- gap: 12px;
- }
- .codeInput {
- width: 100%;
- font-size: 16px;
- flex: 1;
- }
- .getCodeBtn {
- width: 120px;
- background-color: #fff;
- border: none;
- color: #1890ff;
- font-weight: 500;
- }
- .loginBtn {
- height: 48px;
- font-size: 16px;
- font-weight: 500;
- margin-top: 16px;
- background-color: #1890ff;
- }
- .decorationTop {
- flex: 1;
- display: flex;
- align-items: center;
- justify-content: center;
- }
- .decorationBottom {
- position: absolute;
- bottom: 0;
- right: 0;
- width: 100%;
- height: 70px;
- text-align: center;
- font-size: 12px;
- }
- @media (max-width: 992px) {
- .leftSection {
- display: none;
- }
- }
|