OLD | NEW |
(Empty) | |
| 1 .inputview-layoutview { |
| 2 position: relative; |
| 3 -webkit-user-select: none; |
| 4 } |
| 5 .inputview-canvasview, |
| 6 .inputview-skv { |
| 7 display: inline-block; |
| 8 overflow: hidden; |
| 9 } |
| 10 .inputview-sk { |
| 11 margin: 3px 4px 4px 3px; |
| 12 position: relative; |
| 13 background-color: #ffffff; |
| 14 } |
| 15 .inputview-a11y .inputview-sk { |
| 16 margin: 2px 3px 3px 2px; |
| 17 } |
| 18 #us-compact-symbol .inputview-sk, |
| 19 #us-compact-more .inputview-sk, |
| 20 #us-compact-qwerty .inputview-sk { |
| 21 margin: 5px; |
| 22 } |
| 23 #us-compact-qwerty #Globe { |
| 24 margin: 5px 0 5px 0; |
| 25 } |
| 26 .inputview-character { |
| 27 position: absolute; |
| 28 text-align: center; |
| 29 color: #999999; |
| 30 font-size: 16px; |
| 31 display: inline-block; |
| 32 } |
| 33 .inputview-a11y .inputview-character { |
| 34 font-size: 11px; |
| 35 } |
| 36 .inputview-ch { |
| 37 color: #111111; |
| 38 font-size: 23px; |
| 39 } |
| 40 .inputview-digit-character.inputview-ch { |
| 41 font-size: 20px; |
| 42 } |
| 43 .inputview-a11y .inputview-digit-character.inputview-ch { |
| 44 font-size: 16px; |
| 45 } |
| 46 .inputview-a11y .inputview-ch { |
| 47 font-size: 18px; |
| 48 } |
| 49 .inputview-vertical { |
| 50 display: inline-block; |
| 51 overflow: hidden; |
| 52 } |
| 53 .inputview-linear { |
| 54 display: inline-block; |
| 55 } |
| 56 .inputview-extended-transition { |
| 57 transition: margin-left 0.2s; |
| 58 } |
| 59 .inputview-linear-border { |
| 60 display:inline-block; |
| 61 border-bottom-width: 1px; |
| 62 border-bottom-style: solid; |
| 63 border-bottom-color: #dddddd; |
| 64 } |
| 65 .inputview-container { |
| 66 position: fixed; |
| 67 bottom: 0; |
| 68 left: 0; |
| 69 -webkit-box-shadow: -5px 0 5px #ccc; |
| 70 border: 1px solid #eeeeee; |
| 71 background-color: #EBEBEB; |
| 72 -webkit-user-select: none; |
| 73 cursor: default; |
| 74 } |
| 75 .inputview-font { |
| 76 font-family: Roboto2, Roboto, Noto Sans, Sans-Serif; |
| 77 } |
| 78 .inputview-font[lang=am] { |
| 79 font-family: Roboto2, Roboto, Noto Sans Armenian, Sans-Serif; |
| 80 } |
| 81 .inputview-font[lang=il] { |
| 82 font-family: Roboto2, Roboto, Noto Sans Hebrew, Sans-Serif; |
| 83 } |
| 84 .inputview-font[lang=jp] { |
| 85 font-family: Roboto2, Roboto, MotoyaG04Gothic, IPAGothic, Sans-Serif; |
| 86 } |
| 87 .inputview-font[lang=ar] { |
| 88 font-family: Roboto2, Roboto, Noto Arabic Naskh ui, Sans-Serif; |
| 89 } |
| 90 .inputview-font[lang=bn] { |
| 91 font-family: Roboto2, Roboto, Noto Sans Bengali, Sans-Serif; |
| 92 } |
| 93 .inputview-font[lang=ethi] { |
| 94 font-family: Roboto2, Roboto, Noto Sans Ethiopic, Sans-Serif; |
| 95 } |
| 96 .inputview-font[lang=fa] { |
| 97 font-family: Roboto2, Roboto, Noto Arabic Naskh ui, Sans-Serif; |
| 98 } |
| 99 .inputview-font[lang=gu] { |
| 100 font-family: Roboto2, Roboto, Noto Sans Gujarati, Lohit Gujarati, Sans-Serif; |
| 101 } |
| 102 .inputview-font[lang=kn] { |
| 103 font-family: Roboto2, Roboto, Noto Sans Kannada, Lohit Kannada, Sans-Serif; |
| 104 } |
| 105 .inputview-font[lang=ml] { |
| 106 font-family: Roboto2, Roboto, Noto Sans Malayalam, Lohit Malayalam, Sans-Serif
; |
| 107 } |
| 108 .inputview-font[lang=ta] { |
| 109 font-family: Roboto2, Roboto, Noto Sans Tamil, Lohit Tamil, Sans-Serif; |
| 110 } |
| 111 .inputview-font[lang=te] { |
| 112 font-family: Roboto2, Roboto, Noto Sans Telugu, Lohit Telugu, Sans-Serif; |
| 113 } |
| 114 .inputview-font[lang=th] { |
| 115 font-family: Roboto2, Roboto, Noto Sans Thai, Sans-Serif; |
| 116 } |
| 117 .inputview-font[lang=zh-CN] { |
| 118 font-family: Roboto2, Roboto, MYingHeiGB18030, Droid Sans Fallback, Sans-Serif
; |
| 119 } |
| 120 .inputview-font[lang=zh-TW], |
| 121 .inputview-font[lang=zh-HK] { |
| 122 font-family: Roboto2, Roboto, MYingHeiB5HK, Droid Sans Fallback, Sans-Serif; |
| 123 } |
| 124 .inputview-font[lang=kr] { |
| 125 font-family: Roboto2, Roboto, NanumGothic, Sans-Serif; |
| 126 } |
| 127 .inputview-emoji-font { |
| 128 font-family: Noto Color Emoji, Noto Sans Emoji, Droid Emoji; |
| 129 } |
| 130 .inputview-modifier { |
| 131 display: table-cell; |
| 132 vertical-align: middle; |
| 133 font-size: 16px; |
| 134 text-align: center; |
| 135 position: relative; |
| 136 } |
| 137 .inputview-a11y .inputview-modifier { |
| 138 font-size: 10px; |
| 139 } |
| 140 .inputview-menu-list-indicator { |
| 141 background-position: center; |
| 142 background-repeat: no-repeat; |
| 143 background-size: 25px; |
| 144 width: 25%; |
| 145 } |
| 146 .inputview-checked-menu-list .inputview-menu-list-name { |
| 147 background-image: url('images/check.png'); |
| 148 background-position: right 25px center; |
| 149 background-repeat: no-repeat; |
| 150 box-sizing: border-box; |
| 151 font-weight: bold; |
| 152 padding-right: 50px; |
| 153 } |
| 154 .inputview-menu-list-name { |
| 155 height: 100%; |
| 156 width: 75%; |
| 157 overflow: hidden; |
| 158 } |
| 159 .inputview-menu-list-indicator-name { |
| 160 font-weight: bold; |
| 161 height: 100%; |
| 162 text-align: center; |
| 163 } |
| 164 .inputview-menu-list-indicator-name, |
| 165 .inputview-menu-list-name div { |
| 166 line-height: 3; |
| 167 } |
| 168 .inputview-ime-list-container { |
| 169 -webkit-box-orient: vertical; |
| 170 display: -webkit-box; |
| 171 width: 100%; |
| 172 overflow-y: auto; |
| 173 overflow-x: hidden; |
| 174 } |
| 175 .inputview-ime-list-container .inputview-menu-list-item { |
| 176 border-bottom: solid 1px #cccccc; |
| 177 box-sizing: border-box; |
| 178 } |
| 179 .inputview-menu-list-item { |
| 180 -webkit-box-orient: horizontal; |
| 181 display: -webkit-box; |
| 182 font-size: 16px; |
| 183 width: 100%; |
| 184 } |
| 185 .inputview-menu-footer-item { |
| 186 position: relative; |
| 187 } |
| 188 .inputview-menu-footer-item:not(:last-child):after { |
| 189 background-color: #cccccc; |
| 190 content: ''; |
| 191 height: 70%; |
| 192 position: absolute; |
| 193 right: 0; |
| 194 top: 15%; |
| 195 width: 1px; |
| 196 } |
| 197 .inputview-menu-footer-emoji-button { |
| 198 background: url('images/emoji.png') no-repeat center; |
| 199 background-size: 25px; |
| 200 height: 100%; |
| 201 } |
| 202 .inputview-menu-footer-handwriting-button { |
| 203 background: url('images/pencil.png') no-repeat center; |
| 204 background-size: 25px; |
| 205 height: 100%; |
| 206 } |
| 207 .inputview-menu-footer-setting-button { |
| 208 background: url('images/setting.png') no-repeat center; |
| 209 background-size: 25px; |
| 210 height: 100%; |
| 211 } |
| 212 .inputview-menu-footer { |
| 213 -webkit-box-orient: horizontal; |
| 214 background: #f5f5f5; |
| 215 display: -webkit-box; |
| 216 } |
| 217 .inputview-globe-icon { |
| 218 background: transparent url('images/globe.png') 0 0 / 21px 21px no-repeat; |
| 219 display: inline-block; |
| 220 width: 21px; |
| 221 height: 21px; |
| 222 } |
| 223 .inputview-menu-view, |
| 224 .inputview-altdata-view { |
| 225 position: fixed; |
| 226 z-index: 999; |
| 227 border: 1px solid #ccc; |
| 228 background-color: white; |
| 229 -webkit-box-shadow: 0 0 6px rgba(204, 204, 204, 0.65), |
| 230 0 0 2px rgba(136, 136, 136, 0.65), |
| 231 0 0 6px rgba(204, 204, 204, 0.65), |
| 232 0 0 6px rgba(204, 204, 204, 0.65); |
| 233 cursor: default; |
| 234 } |
| 235 .inputview-altdata-separator { |
| 236 height: 20px; |
| 237 border-left: 1px solid #ddd; |
| 238 position: relative; |
| 239 display: inline-block; |
| 240 } |
| 241 .inputview-altdata-key { |
| 242 display: table-cell; |
| 243 font-size: 23px; |
| 244 color: #111111; |
| 245 vertical-align: middle; |
| 246 text-align: center; |
| 247 } |
| 248 .inputview-a11y .inputview-altdata-key { |
| 249 font-size: 18px; |
| 250 } |
| 251 .inputview-candidate.inputview-candidate-default { |
| 252 color: #111111; |
| 253 } |
| 254 .inputview-candidate.inputview-candidate-autocorrect { |
| 255 font-weight: bold; |
| 256 color: #111111; |
| 257 } |
| 258 .inputview-candidate-view { |
| 259 overflow: hidden; |
| 260 display: table-cell; |
| 261 height: 32px; |
| 262 } |
| 263 .inputview-candidate-button { |
| 264 float: right; |
| 265 } |
| 266 .inputview-candidate { |
| 267 display: table-cell; |
| 268 font-size: 18px; |
| 269 color: #555555; |
| 270 vertical-align: middle; |
| 271 text-align: center; |
| 272 } |
| 273 .inputview-a11y .inputview-candidate { |
| 274 font-size: 12px; |
| 275 } |
| 276 .inputview-candidate-separator { |
| 277 border-left: 1px solid #ddd; |
| 278 position: relative; |
| 279 display: inline-block; |
| 280 } |
| 281 .inputview-table-cell { |
| 282 display: table-cell; |
| 283 vertical-align: middle; |
| 284 text-align: center; |
| 285 } |
| 286 .inputview-title { |
| 287 font-size: 16px; |
| 288 color: #AAAAAA; |
| 289 } |
| 290 .inputview-special-key-name { |
| 291 display: block; |
| 292 } |
| 293 .inputview-modifier-state-icon { |
| 294 background-image: url('images/modifier-off.png'); |
| 295 background-repeat: no-repeat; |
| 296 background-size: 16px 4px; |
| 297 display: inline-block; |
| 298 width: 16px; |
| 299 height: 4px; |
| 300 } |
| 301 .inputview-modifier-state-icon.inputview-modifier-on { |
| 302 background: url('images/modifier-on.png'); |
| 303 } |
| 304 .inputview-modifier-state-icon.inputview-hold { |
| 305 -webkit-box-shadow: 0 0 5px 1px #397FFB; |
| 306 opacity: 0.9; |
| 307 } |
| 308 .inputview-altdata-cover { |
| 309 position: fixed; |
| 310 bottom: 0; |
| 311 left: 0; |
| 312 background-color: white; |
| 313 opacity: 0.5; |
| 314 z-index: 1; |
| 315 } |
| 316 .inputview-arrow-key { |
| 317 display: inline-block; |
| 318 height: 13.5px; |
| 319 } |
| 320 .inputview-up-key { |
| 321 background-image: transparent url('images/up.png') 0 0/16px 13.5px no-repeat; |
| 322 width: 16px; |
| 323 } |
| 324 .inputview-down-key { |
| 325 background: transparent url('images/down.png') 0 0/16px 13.5px no-repeat; |
| 326 width: 16px; |
| 327 } |
| 328 .inputview-left-key { |
| 329 background: transparent url('images/left.png') 0 0/9px 13.5px no-repeat; |
| 330 width: 9px; |
| 331 } |
| 332 .inputview-right-key { |
| 333 background: transparent url('images/right.png') 0 0/9px 13.5px no-repeat; |
| 334 width: 9px; |
| 335 } |
| 336 .inputview-special-key-bg { |
| 337 background-color: #DDDDDD; |
| 338 } |
| 339 .inputview-page-up-icon { |
| 340 background: transparent url('images/page_up.png') 0 0 no-repeat; |
| 341 background-size: 10.5px 5.5px; |
| 342 width: 10.5px; |
| 343 height: 5.5px; |
| 344 display: inline-block; |
| 345 } |
| 346 .inputview-page-down-icon { |
| 347 background: transparent url('images/page_down.png') 0 0 no-repeat; |
| 348 background-size: 10.5px 5.5px; |
| 349 width: 10.5px; |
| 350 height: 5.5px; |
| 351 display: inline-block; |
| 352 } |
| 353 .inputview-menu-icon { |
| 354 background: transparent url('images/menu.png') 0 0/4px 17px no-repeat; |
| 355 display: inline-block; |
| 356 width: 4px; |
| 357 height: 17px; |
| 358 } |
| 359 .inputview-hide-keyboard-icon { |
| 360 background: transparent url('images/hide.png') 0 0/20px 14.5px no-repeat; |
| 361 display: inline-block; |
| 362 width: 20px; |
| 363 height: 14.5px; |
| 364 } |
| 365 .inputview-candidate.inputview-candidate-highlight, |
| 366 .inputview-element-highlight { |
| 367 background-color: #dddddd; |
| 368 } |
| 369 .inputview-menu-footer-item.inputview-element-highlight, |
| 370 .inputview-special-key-highlight { |
| 371 background-color: #cccccc; |
| 372 } |
| 373 .inputview-backspace-icon { |
| 374 background: transparent url('images/backspace.png'); |
| 375 background-size: 22.5px 13px; |
| 376 display: inline-block; |
| 377 width: 22.5px; |
| 378 height: 13px; |
| 379 } |
| 380 .inputview-enter-icon { |
| 381 background: transparent url('images/enter.png'); |
| 382 background-size: 18px 13px; |
| 383 display: inline-block; |
| 384 width: 18px; |
| 385 height: 13px; |
| 386 } |
| 387 |
| 388 .inputview-space-icon { |
| 389 background: transparent url('images/space.png'); |
| 390 background-size: 22.5px 8px; |
| 391 display: inline-block; |
| 392 width: 22.5px; |
| 393 height: 8px; |
| 394 } |
| 395 |
| 396 .inputview-shift-icon { |
| 397 background: transparent url('images/shift.png'); |
| 398 background-size: 18.5px 13px; |
| 399 display: inline-block; |
| 400 width: 18.5px; |
| 401 height: 13px; |
| 402 } |
| 403 .inputview-tab-icon { |
| 404 background: transparent url('images/tab.png'); |
| 405 background-size: 19px 18.5px; |
| 406 display: inline-block; |
| 407 width: 19px; |
| 408 height: 18.5px; |
| 409 } |
| 410 .inputview-capslock-dot { |
| 411 background-color: #ccc; |
| 412 width: 4px; |
| 413 height: 4px; |
| 414 position: absolute; |
| 415 top: 8px; |
| 416 right: 8px; |
| 417 } |
| 418 .inputview-capslock-dot-highlight { |
| 419 background-color: #4285f4; |
| 420 } |
| 421 .inputview-hint-text { |
| 422 font-size: 16px; |
| 423 color: #999999; |
| 424 } |
| 425 .inputview-inline-div { |
| 426 display: inline-block; |
| 427 } |
| 428 .inputview-compact-key { |
| 429 font-size: 28px; |
| 430 color: #111111; |
| 431 } |
| 432 .inputview-compact-switcher { |
| 433 background: transparent url('images/compact.png'); |
| 434 background-size: 19px 14px; |
| 435 display: inline-block; |
| 436 width: 19px; |
| 437 height: 14px; |
| 438 } |
| 439 .inputview-regular-switcher { |
| 440 background: transparent url('images/regular_size.png'); |
| 441 background-size: 19px 14px; |
| 442 display: inline-block; |
| 443 width: 19px; |
| 444 height: 14px; |
| 445 } |
| 446 |
| 447 #Space { |
| 448 color: #bbbbbb; |
| 449 font-size: 18px; |
| 450 } |
| 451 #Menu { |
| 452 font-weight: bold; |
| 453 margin-left: 0 !important; |
| 454 } |
| 455 .inputview-a11y #Globe { |
| 456 margin: 2px 0 3px 0; |
| 457 } |
| 458 #Globe { |
| 459 margin: 3px 0 4px 0; |
| 460 } |
| 461 #Globe:after { |
| 462 background-color: #cccccc; |
| 463 content: ''; |
| 464 height: 50%; |
| 465 position: absolute; |
| 466 right: 0; |
| 467 top: 25%; |
| 468 width: 1px; |
| 469 } |
| 470 .inputview-candidates-line { |
| 471 border-bottom: 1px #cfcfcf solid; |
| 472 } |
| 473 .inputview-candidates-top-line { |
| 474 border-top: 1px #cfcfcf solid; |
| 475 } |
| 476 .inputview-three-candidates { |
| 477 text-align: center; |
| 478 vertical-align: middle; |
| 479 } |
| 480 .inputview-candiate-ic { |
| 481 display: inline-block; |
| 482 } |
| 483 |
| 484 .inputview-shrink-candidates-icon { |
| 485 background: transparent url('images/hide_candidates.png') 0 0/17px 16.5px no-r
epeat; |
| 486 height: 17px; |
| 487 width: 16.5px; |
| 488 } |
| 489 |
| 490 .inputview-expand-candidates-icon { |
| 491 background: transparent url('images/show_candidates.png') 0 0/17px 16.5px no-r
epeat; |
| 492 height: 17px; |
| 493 width: 16.5px; |
| 494 } |
| 495 |
| 496 /** |
| 497 * The following css style is for handwriting panel, |
| 498 * please keep it in the end of the file |
| 499 */ |
| 500 |
| 501 .inputview-handwriting .inputview-wrapper{ |
| 502 background-color: #ffffff; |
| 503 box-shadow: 1px -2px 7px 2px rgba(192, 192, 192, 0.65); |
| 504 margin: 11px 0 11px 0; |
| 505 } |
| 506 |
| 507 .inputview-handwriting-switcher { |
| 508 background: url('images/pencil.png'); |
| 509 background-size: 19px 19px; |
| 510 display: inline-block; |
| 511 width: 19px; |
| 512 height: 19px; |
| 513 } |
| 514 |
| 515 .inputview-handwriting-back { |
| 516 float: right; |
| 517 font-size: 18px; |
| 518 color: #111111; |
| 519 text-align: center; |
| 520 } |
| 521 |
| 522 .inputview-canvas { |
| 523 cursor: url('images/pencil.png') 8 42, auto; |
| 524 } |
| 525 |
| 526 #leftSideColumn { |
| 527 position: absolute; |
| 528 left: 0; |
| 529 } |
| 530 |
| 531 #rightSideColumn { |
| 532 position: absolute; |
| 533 right: 0; |
| 534 } |
| 535 .inputview-handwriting .inputview-ch { |
| 536 bottom: 15px !important; |
| 537 } |
| 538 .inputview-handwriting .inputview-sk { |
| 539 background-color: #E9E9E9; |
| 540 margin: 0 0 10 0; |
| 541 font-size: 20px; |
| 542 } |
| 543 |
| 544 .inputview-handwriting .inputview-element-highlight { |
| 545 background-color: #cccccc; |
| 546 } |
| 547 |
| 548 .inputview-handwriting .inputview-special-key-bg { |
| 549 background-color: #E9E9E9; |
| 550 } |
| 551 |
| 552 .inputview-handwriting .inputview-special-key-highlight { |
| 553 background-color: #cccccc; |
| 554 } |
| 555 |
| 556 .inputview-handwriting #candidateView { |
| 557 background-color: #ffffff; |
| 558 border-bottom: 1px #cfcfcf solid; |
| 559 } |
| 560 |
| 561 .inputview-handwriting-network-error { |
| 562 background: no-repeat url('images/error.png'); |
| 563 font-size: 16; |
| 564 padding: 0 0 0 50px; |
| 565 position: absolute; |
| 566 width: 300px; |
| 567 height: 100px; |
| 568 } |
| 569 |
| 570 .inputview-handwriting-privacy-cover { |
| 571 position: relative; |
| 572 bottom: 0; |
| 573 left: 0; |
| 574 background-color: white; |
| 575 opacity: 0.5; |
| 576 z-index: 1; |
| 577 } |
| 578 |
| 579 .inputview-handwriting-privacy-info { |
| 580 position: absolute; |
| 581 width: 300px; |
| 582 height: 100px; |
| 583 z-index: 2; |
| 584 } |
| 585 |
| 586 .inputview-handwriting-privacy-info-hidden { |
| 587 visibility: hidden; |
| 588 opacity: 0; |
| 589 transition: all 2s ease; |
| 590 } |
| 591 |
| 592 .inputview-handwriting-privacy-info .inputview-sk { |
| 593 margin-top: 10px; |
| 594 } |
| 595 |
| 596 .inputview-handwriting-privacy-info .inputview-special-key-name { |
| 597 font-size: 16px; |
| 598 } |
| 599 |
| 600 .inputview-jp-ime-switch { |
| 601 text-align: left; |
| 602 font-size: 12px; |
| 603 display: inline-block; |
| 604 } |
| 605 |
| 606 .inputview-switcher-chinese { |
| 607 display: inline-block; |
| 608 background: url('images/english.png') no-repeat center; |
| 609 background-size: 50px 20px; |
| 610 height: 20px; |
| 611 width: 50px; |
| 612 } |
| 613 .inputview-switcher-english { |
| 614 display: inline-block; |
| 615 background: url('images/chinese.png') no-repeat center; |
| 616 background-size: 50px 20px; |
| 617 height: 20px; |
| 618 width: 50px; |
| 619 } |
| 620 .inputview-pinyin .inputview-en-switcher-default { |
| 621 display: inline-block; |
| 622 background: url('images/chinese_small.png') no-repeat center; |
| 623 background-size: 40px 16px; |
| 624 height: 16px; |
| 625 width: 40px; |
| 626 } |
| 627 .inputview-pinyin .inputview-en-switcher-english { |
| 628 display: inline-block; |
| 629 background: url('images/english_small.png') no-repeat center; |
| 630 background-size: 40px 16px; |
| 631 height: 16px; |
| 632 width: 40px; |
| 633 } |
OLD | NEW |