automatic.css 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. @import url("../static/css/syntax-highlighter.css");
  2. #fehelper_tips {
  3. position: fixed;
  4. top: 0;
  5. left: 0;
  6. z-index: 100;
  7. box-sizing: border-box;
  8. padding: 2px 10px 3px 40px;
  9. width: 100%;
  10. height: 37px;
  11. border-bottom: 1px solid #AAAAAB;
  12. background-image: url('/static/img/fe-16.png'), linear-gradient(to bottom, #FEEFAE, #FAE692);
  13. background-position: 10px 50%, 0 0;
  14. background-repeat: no-repeat, repeat-x;
  15. font: 15px/32px 'Helvetica', 'Segoe UI', Arial, 'Microsoft Yahei', Simsun, sans-serif;
  16. transform: translate3d(0, -37px, 0);
  17. -webkit-user-select: none;
  18. user-select: none;
  19. }
  20. #fehelper_tips .desc {
  21. margin-right: 1em;
  22. vertical-align: middle;
  23. }
  24. #fehelper_tips .desc i {
  25. color:red;
  26. padding: 0 5px;
  27. text-decoration: underline;
  28. }
  29. #fehelper_tips .doing {
  30. color: red;
  31. font-size: 14px;
  32. margin-left: 20px;
  33. }
  34. #fehelper_tips button {
  35. margin: 0 0 0 10px;
  36. height: 28px;
  37. outline: none;
  38. border: 1px solid #968A59;
  39. border-radius: 3px;
  40. background-image: linear-gradient(to bottom, #FFFBEA, #FBEDB1);
  41. vertical-align: middle;
  42. }
  43. #fehelper_tips button:hover {
  44. border-color: #4B452C;
  45. }
  46. #fehelper_tips button:active {
  47. border-color: #4C4733;
  48. background-image: linear-gradient(to bottom, #FDF2C0, #FEF9E3);
  49. }
  50. #fehelper_tips .close {
  51. float: right;
  52. margin: 8px 0 0;
  53. padding: 0;
  54. width: 16px;
  55. height: 16px;
  56. border: none;
  57. cursor: pointer;
  58. background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABs0lEQVQ4EZ2TzWtTQRTFf3d8WrMwGyWLdmGEYkFFFylIaruQ/qMVXOnKnUs11ohGrUptoGBoitRSRZMIUfPeXJk7k/TDjeYt3mHmnjtz5pwZyQ/uKQIoTINZ6FRNvVOgU8YCpkNn6tVH9ROUE+NQd+ikfsh3NinEokBeCJvtTyinEBFUFXGn6XS/GJ7kO4J/6gOg6mhv7/Hg4WseP91CcSAZjxofuHu/SWdnH5KScZ+ZaN0WQ861K/MMhmdZb77COVuf1rtdVm8vcak6ixY/It34EBc4EqEWPeq1Ks4Jz19sGHllaZGbtYvo6CuIHos8ixmaCSAR1ffBDymVSkncTzTvHcn6kJ8FRnQ3GOYRmeHJszYbm3ss12t2uxrNFr+GPZbrlxH8Mb4dIUQZdIlkvH2/w8s3XVZuLVK7PmeVPL9BY71F5cI5FuYrCEXkh+VH+3fUokqR5Vpmu9Pn6kIFPzqwKCU7z8fugOrcGUQHMdpxxL8/r2k6erLA4bIyPv8+tiSiKyO+/5dlk7cQvQj/Ap9/M+nhjYTPsOil4NI4zVvQ0YNocmj4n3G6iXGr4EXc8d/xD6YQKq6fj1B0AAAAAElFTkSuQmCC) no-repeat 50% 50%;
  59. }
  60. #fehelper_tips .close span {
  61. display: block;
  62. height: 100%;
  63. background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACyklEQVQ4EVWTS28URxSFv1tV3dOe7nn6IRsPSAMo4hUnC2QLIhRlA0gRsAJ2WUXKIrvwD/IDss+KRTYIZxXxkJlNVgmWCVIUFLFAToI1gx0YsD1+zUx3V1Q9w0hZXVXVPfeeW/cciV/ftQhgYRAFlAarSA562b3J+1ibAglYO8wb5BuX8f4OPPaabV7+9Aubf/yFSh0IUqWofFindvU8YW0ca/uDXq5W//UdK+4oPs37j3l1f5l8kEN6fbTRGbUkTrG+YXe/x/Tlsxy+9gnWdnE4M2BvaD1Y5k3jKZFnyEcBJlcY0pUsxv0YlSS8/fl3xGhqny9g0y7KWst+6y0bS0/IG6E0XaW0cAGxFnHEhjE8OUdxskxehH8bv7HbbCMiKMSj1VghGvMJyxHB3DzVL25Runwjm99VKV26ztTX35L74DRhNSIKPF41VrBojIim83yNsqsmwkbjIZv7wvGvvhmuBgqXbvLi++9IVh4TlQt4Imw+X0PEYOKDHsqC75uMUmWqwvrSIi9gWIQMvL20yHS9lrHyPYPq9uh39jBuh8oolFYDytgsUUqF4RnCUpF8fXb0rjyNxAo3ntGBD3kPGw+E4VYTXbxO4eKNrLNDuXF2qkW2Hy1mq0vTFBXm0GHgGMQUTxwhXV3Hi1OC+c9G4M6jH7Ou78fpt/6m+2yFdMyncGwGsTHS3/jBHrRj/rl9j4oVtto7xLVTxH/+ykx9NlNca7WJPXySaGuNwkSJNzal/uUVchXtdJAQTIZUL3xEx9cUKyF69ekI7Cxy6Ogs0dZLilNltn3N5KcfkxsPEUlRmReSXSbOnaJ0/gzbgaZ47NDow8R5RYT8kSneGaE4f4Lxc6ch3cWJUHrrt+3IjCqk+26P9vIzdlabqGRoJq0Jj84wsTCHXxlDHHho3qzAwI4DzaM8UAWUHiPuJpl1jaew9gAbd4D4fx75D8MvHH6oTBAOAAAAAElFTkSuQmCC) no-repeat 50% 50%;
  64. opacity: 0;
  65. transition: opacity .2s;
  66. }
  67. #fehelper_tips .close:hover span {
  68. opacity: .85;
  69. }
  70. #fehelper_tips .close:active span {
  71. opacity: 1;
  72. }
  73. #fehelper_tips .forbid {
  74. float: right;
  75. font-size: 12px;
  76. color: #666;
  77. text-decoration: underline;
  78. margin-right:20px;
  79. cursor: pointer;
  80. }
  81. #fehelper_tips .forbid:hover {
  82. color:red;
  83. }
  84. body > * {
  85. transition: .2s linear;
  86. }
  87. body pre {
  88. transform: translate3d(0, 37px, 0);
  89. }
  90. body #fehelper_tips {
  91. transform: none;
  92. }
  93. body.show-tipsbar .copy{
  94. display: none;
  95. }
  96. body.show-beautified {
  97. font-size: 14px;
  98. }
  99. body.show-beautified .copy {
  100. display: inline-block;
  101. }
  102. body.show-beautified .doing {
  103. display: none;
  104. }
  105. body.processing > :not(#fehelper_tips) {
  106. opacity: .5;
  107. pointer-events: none;
  108. cursor: wait;
  109. }