203 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			203 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
| /* CLI Traffic 页面样式 */
 | |
| html,
 | |
| body,
 | |
| #app {
 | |
|   padding: 0;
 | |
|   margin: 0;
 | |
|   width: 100%;
 | |
|   height: 100%;
 | |
|   font-family: DMSans-Regular;
 | |
| }
 | |
| 
 | |
| .header {
 | |
|   display: flex;
 | |
|   justify-content: space-between;
 | |
|   align-items: center;
 | |
|   height: 60px;
 | |
|   background-color: #fff;
 | |
|   border-bottom: 1px solid #eee;
 | |
|   padding: 0 20px;
 | |
| }
 | |
| 
 | |
| .parentx-static {
 | |
|   overflow: hidden;
 | |
|   height: 500px;
 | |
|   position: relative;
 | |
| }
 | |
| 
 | |
| .logo {
 | |
|   font-weight: bold;
 | |
|   font-size: 20px;
 | |
|   padding: 15px 0px 15px 15px;
 | |
|   height: 100%;
 | |
|   cursor: pointer;
 | |
| }
 | |
| 
 | |
| .main-area {
 | |
|   display: flex;
 | |
|   height: calc(100vh - 60px); /* 减去 header 高度 */
 | |
| }
 | |
| 
 | |
| .sidebar {
 | |
|   width: 200px;
 | |
|   background-color: #ffffff;
 | |
|   border-right: 1px solid #eee;
 | |
| }
 | |
| 
 | |
| .sidebar .vs-content-sidebar .vs-sidebar {
 | |
|   background-color: unset !important;
 | |
| }
 | |
| 
 | |
| .content {
 | |
|   flex: 1;
 | |
|   padding: 8px;
 | |
|   overflow: auto;
 | |
|   background: #eeeeee;
 | |
| }
 | |
| 
 | |
| .content-conter {
 | |
|   background-color: white;
 | |
|   padding: 16px;
 | |
|   height: 100%;
 | |
| }
 | |
| 
 | |
| /* .user-dropdown{
 | |
|     color: #000;
 | |
| } */
 | |
| .dropdown-menu {
 | |
|   width: 100px;
 | |
| }
 | |
| 
 | |
| .tablex {
 | |
|   width: 100%;
 | |
|   padding-top: 10px;
 | |
| }
 | |
| 
 | |
| .popup-content {
 | |
|   padding-bottom: 15px;
 | |
| }
 | |
| 
 | |
| .popup-bottom {
 | |
|   text-align: right;
 | |
|   padding-top: 10px;
 | |
| }
 | |
| 
 | |
| .qr-code {
 | |
|   height: 155px;
 | |
| }
 | |
| 
 | |
| .success-contianer {
 | |
|   height: 100%;
 | |
|   line-height: 155px;
 | |
| }
 | |
| 
 | |
| .success-contianer img {
 | |
|   height: 40px;
 | |
| }
 | |
| 
 | |
| .content-conter-header {
 | |
|   display: flex;
 | |
|   padding-bottom: 5px;
 | |
| }
 | |
| 
 | |
| /* .content-conter-header > *:not(:first-child) {
 | |
|   margin-left: 10px;
 | |
| } */
 | |
| 
 | |
| .balance-btn[data-v-d585ebde] {
 | |
|   padding: 0 10px;
 | |
|   box-sizing: border-box;
 | |
|   max-width: max-content;
 | |
|   height: 30px;
 | |
|   line-height: 30px;
 | |
|   background: #ff916f33;
 | |
|   border-radius: 4px;
 | |
|   font-weight: 700;
 | |
|   font-size: 14px;
 | |
|   color: #ff916f;
 | |
|   margin-right: 28px;
 | |
|   cursor: pointer;
 | |
| }
 | |
| 
 | |
| .table-cell-center {
 | |
|   text-align: left;
 | |
| }
 | |
| 
 | |
| .btn-group {
 | |
|   display: flex;
 | |
|   gap: 10px;
 | |
|   place-items: end;
 | |
|   padding-left: 10px;
 | |
| }
 | |
| 
 | |
| .operat-btn {
 | |
|   margin-top: 10px;
 | |
| }
 | |
| 
 | |
| .form-item {
 | |
|   padding-top: 10px;
 | |
| }
 | |
| 
 | |
| .content-conter-container {
 | |
|   height: calc(100% - 45px);
 | |
|   overflow-y: auto;
 | |
| }
 | |
| 
 | |
| .content-conter-footer {
 | |
|   height: 45px;
 | |
| }
 | |
| 
 | |
| /* API管理样式 */
 | |
| .api-management {
 | |
|   padding: 20px;
 | |
| }
 | |
| 
 | |
| .api-section h3 {
 | |
|   margin-bottom: 20px;
 | |
|   color: #333;
 | |
|   font-size: 18px;
 | |
|   font-weight: 600;
 | |
| }
 | |
| 
 | |
| .api-key-container {
 | |
|   background: #f8f9fa;
 | |
|   padding: 20px;
 | |
|   border-radius: 8px;
 | |
|   border: 1px solid #e9ecef;
 | |
| }
 | |
| 
 | |
| .api-key-item, .api-status-item {
 | |
|   margin-bottom: 20px;
 | |
| }
 | |
| 
 | |
| .api-key-item:last-child, .api-status-item:last-child {
 | |
|   margin-bottom: 0;
 | |
| }
 | |
| 
 | |
| .api-key-item label, .api-status-item label {
 | |
|   display: block;
 | |
|   margin-bottom: 8px;
 | |
|   font-weight: 500;
 | |
|   color: #495057;
 | |
| }
 | |
| 
 | |
| .api-key-display {
 | |
|   display: flex;
 | |
|   align-items: center;
 | |
|   gap: 10px;
 | |
| }
 | |
| 
 | |
| .api-key-display .vs-input {
 | |
|   flex: 1;
 | |
| }
 | |
| 
 | |
| .api-status-display {
 | |
|   display: flex;
 | |
|   align-items: center;
 | |
|   gap: 10px;
 | |
| }
 | |
| 
 | |
| .status-text {
 | |
|   font-weight: 500;
 | |
|   color: #495057;
 | |
| } |