|
127 | 127 | line-height: 1.35; |
128 | 128 | } |
129 | 129 |
|
| 130 | +.canvasTextEntry { |
| 131 | + position: fixed; |
| 132 | + inset: 0; |
| 133 | + display: none; |
| 134 | + align-items: center; |
| 135 | + justify-content: center; |
| 136 | + background: rgba(0, 0, 0, 0.32); |
| 137 | + z-index: 9400; |
| 138 | +} |
| 139 | + |
| 140 | +.canvasTextEntry.open { |
| 141 | + display: flex; |
| 142 | +} |
| 143 | + |
| 144 | +.canvasTextEntryCard { |
| 145 | + width: min(420px, calc(100vw - 24px)); |
| 146 | + border: 1px solid rgba(255, 255, 255, 0.16); |
| 147 | + background: rgba(16, 20, 28, 0.96); |
| 148 | + border-radius: 10px; |
| 149 | + box-shadow: 0 16px 42px rgba(0, 0, 0, 0.45); |
| 150 | + padding: 12px; |
| 151 | + display: grid; |
| 152 | + gap: 10px; |
| 153 | +} |
| 154 | + |
| 155 | +.canvasTextEntryLabel { |
| 156 | + font-size: 12px; |
| 157 | + color: #c7d0db; |
| 158 | + letter-spacing: 0.04em; |
| 159 | + text-transform: uppercase; |
| 160 | +} |
| 161 | + |
| 162 | +.canvasTextEntryInput { |
| 163 | + width: 100%; |
| 164 | + min-height: 36px; |
| 165 | + border: 1px solid rgba(255, 255, 255, 0.14); |
| 166 | + background: rgba(0, 0, 0, 0.28); |
| 167 | + color: #e2e8f0; |
| 168 | + border-radius: 8px; |
| 169 | + padding: 8px 10px; |
| 170 | +} |
| 171 | + |
| 172 | +.canvasTextEntryInput:focus { |
| 173 | + outline: none; |
| 174 | + border-color: rgba(92, 179, 255, 0.8); |
| 175 | + box-shadow: 0 0 0 2px rgba(92, 179, 255, 0.2); |
| 176 | +} |
| 177 | + |
| 178 | +.canvasTextEntryOptions { |
| 179 | + display: grid; |
| 180 | + grid-template-columns: repeat(2, minmax(0, 1fr)); |
| 181 | + gap: 8px; |
| 182 | +} |
| 183 | + |
| 184 | +.canvasTextEntryOpt { |
| 185 | + display: grid; |
| 186 | + gap: 4px; |
| 187 | +} |
| 188 | + |
| 189 | +.canvasTextEntryOpt > span { |
| 190 | + font-size: 11px; |
| 191 | + color: #b7c3d2; |
| 192 | + letter-spacing: 0.03em; |
| 193 | +} |
| 194 | + |
| 195 | +.canvasTextEntrySelect, |
| 196 | +.canvasTextEntryNum { |
| 197 | + width: 100%; |
| 198 | + min-height: 32px; |
| 199 | + border: 1px solid rgba(255, 255, 255, 0.14); |
| 200 | + background: rgba(0, 0, 0, 0.28); |
| 201 | + color: #e2e8f0; |
| 202 | + border-radius: 8px; |
| 203 | + padding: 6px 8px; |
| 204 | +} |
| 205 | + |
| 206 | +.canvasTextEntrySelect:focus, |
| 207 | +.canvasTextEntryNum:focus { |
| 208 | + outline: none; |
| 209 | + border-color: rgba(92, 179, 255, 0.8); |
| 210 | + box-shadow: 0 0 0 2px rgba(92, 179, 255, 0.2); |
| 211 | +} |
| 212 | + |
| 213 | +.canvasTextEntryOptCheck { |
| 214 | + align-items: center; |
| 215 | + grid-template-columns: auto 1fr; |
| 216 | + gap: 8px; |
| 217 | + border: 1px solid rgba(255, 255, 255, 0.12); |
| 218 | + border-radius: 8px; |
| 219 | + background: rgba(255, 255, 255, 0.04); |
| 220 | + padding: 6px 8px; |
| 221 | +} |
| 222 | + |
| 223 | +.canvasTextEntryOptCheck input { |
| 224 | + margin: 0; |
| 225 | +} |
| 226 | + |
| 227 | +.canvasTextEntryActions { |
| 228 | + display: flex; |
| 229 | + justify-content: flex-end; |
| 230 | + gap: 8px; |
| 231 | +} |
| 232 | + |
| 233 | +.canvasTextEntryBtn { |
| 234 | + min-height: 34px; |
| 235 | + padding: 0 12px; |
| 236 | + border-radius: 8px; |
| 237 | + border: 1px solid rgba(255, 255, 255, 0.14); |
| 238 | + background: rgba(255, 255, 255, 0.06); |
| 239 | + color: #d0d8e2; |
| 240 | +} |
| 241 | + |
| 242 | +.canvasTextEntryBtnPrimary { |
| 243 | + border-color: rgba(92, 179, 255, 0.6); |
| 244 | + background: rgba(92, 179, 255, 0.18); |
| 245 | + color: #9fd5ff; |
| 246 | +} |
| 247 | + |
130 | 248 | /* Modal Card */ |
131 | 249 | .modalBackdrop{ |
132 | 250 | position: fixed; |
|
0 commit comments