Hugging Face's logo

Spaces:
dqy08
/
InfoRadar
Running

App Files Community
InfoRadar
File size: 3,827 Bytes
e5d8d3a
31238dd
 
 
 
 
 
 
e5d8d3a
e9dea0f
e5d8d3a
b4c1b2f
e5d8d3a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
4030987
e5d8d3a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
31238dd
 
b0c525b
31238dd
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
// 按钮样式模块

// 按钮 inactive 状态公共样式
%button-inactive {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

// 主要按钮样式（Analyze、Upload）
.primary-btn {
  padding: 3px 16px; 
  border: 1px solid var(--button-border);
  border-radius: 4px;
  background-color: var(--button-bg);
  color: var(--button-text);
  font-family: inherit;
  font-size: 10pt;  // 字号保持不变
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);

  &:hover:not(.inactive) {
    background-color: var(--button-hover-bg);
    border-color: var(--button-border);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
  }

  &:active:not(.inactive) {
    background-color: var(--button-active-bg);
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  }

  &.selected {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1976d2;
  }

  &.inactive {
    @extend %button-inactive;
  }
}

// 文本操作按钮样式（Clear、Paste）- 无边框黑灰色调次要按钮
.text-action-btn {
  padding: 1.5px 8px;  // 保持较小高度
  border: none;  // 无边框
  border-radius: 4px;
  background-color: transparent;  // 透明背景
  color: var(--text-color); 
  font-family: inherit;
  font-size: 9pt;  // 字号保持不变
  font-weight: 400;
  cursor: pointer;
  transition: all 0.15s ease;
  
  &.inactive {
    @extend %button-inactive;
  }

  &:hover:not(.inactive) {
    background-color: var(--text-action-btn-hover);  // hover时浅灰色背景
  }

  &:active:not(.inactive) {
    background-color: var(--text-action-btn-hover);  // active时更深的灰色背景
    opacity: 0.8;
  }
}

// 刷新按钮样式
.refresh-btn {
  padding: 4px;
  font-size: 14pt;
  cursor: pointer;
  background-color: transparent;
  border: none;  // 去掉边框
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  transition: all 0.15s ease;
  color: var(--refresh-btn-color);  // 颜色变浅
  
  &:hover {
    background-color: var(--refresh-btn-hover);
  }
  
  &:active {
    background-color: var(--refresh-btn-hover);
    transform: scale(0.95);  // 按下效果
  }
  
  // 移除旋转动画，只保留按下效果
}

// 通用按钮样式（保持向后兼容，但特定类按钮会覆盖这些样式）
button {
  -webkit-transition-duration: 0.15s;
  transition-duration: 0.15s;
  font-family: inherit;
  cursor: pointer;
  border-radius: 4px;
  outline: none;  // 移除默认的outline

  // 如果没有特定类，使用默认样式（通用按钮样式，支持夜间模式）
  &:not(.primary-btn):not(.text-action-btn):not(.refresh-btn):not(.demoBtn):not(.dialog-button):not(.demo-delete-btn):not(.demo-history-promote-btn) {    border: 1px solid var(--button-border);
    padding: 6px 16px;
    background-color: var(--button-bg);
    color: var(--button-text);
    font-weight: 500;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;

    &:hover:not(.inactive) {
      background-color: var(--button-hover-bg);
      border-color: var(--button-border);
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    &:active:not(.inactive) {
      background-color: var(--button-active-bg);
      transform: scale(0.98);
    }

    &.selected {
      background-color: #e3f2fd;
      border-color: #90caf9;
      color: #1976d2;
    }

    &.inactive {
      @extend %button-inactive;
    }
  }
}

button:active :focus {
  background-color: #98b7d9;
}

// 超链接样式
.compare-link,
.chat-link,
.home-link {
  color: var(--primary-color, #3b82f6);
  text-decoration: underline;
  
  &:hover {
    color: var(--primary-color, #2563eb);
  }
}