You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

124 lines
1.8 KiB

  1. .preview-wrapper {
  2. padding-bottom: 30px;
  3. }
  4. html {
  5. min-height:100%;
  6. position: relative;
  7. }
  8. #download {
  9. padding-bottom:240px;
  10. footer {
  11. bottom: 0;
  12. left: 0;
  13. width: 100%;
  14. position: absolute;
  15. z-index: -1;
  16. }
  17. }
  18. .qrcode {
  19. img {
  20. width: 150px;
  21. height: 150px;
  22. border: 0 solid black;
  23. }
  24. }
  25. .preview-image {
  26. img {
  27. margin: 0 auto;
  28. display:block;
  29. max-width: 800px;
  30. max-width: 100%;
  31. }
  32. padding: 0;
  33. padding: 0px;
  34. }
  35. .overlay {
  36. position: fixed;
  37. z-index: 100;
  38. top: 0;
  39. left: 0;
  40. right: 0;
  41. bottom: 0;
  42. background-color: rgba(0,0,0,0.10);
  43. visibility: hidden;
  44. opacity: 0;
  45. transition: opacity 0.2s ease;
  46. .active & {
  47. visibility: visible;
  48. opacity: 1;
  49. }
  50. }
  51. .copy-link-wrapper {
  52. z-index: 200;
  53. padding: 2em;
  54. position: fixed;
  55. top: 50%;
  56. left: 50%;
  57. width: 50%;
  58. max-width: 500px;
  59. min-width: 300px;
  60. background-color: @blue;
  61. border-radius: 2px;
  62. transform: translateX(-50%) translateY(-50%);
  63. opacity: 0;
  64. transition: opacity 0.2s ease;
  65. clip:rect(1px 1px 1px 1px);
  66. opacity: 0;
  67. top: -9999999px;
  68. left: -9999999px;
  69. .active & {
  70. clip: auto;
  71. opacity: 1;
  72. top: 50%;
  73. left: 50%;
  74. }
  75. p {
  76. font-size: 20px;
  77. color: #fff;
  78. }
  79. input {
  80. background-color: @light-gray;
  81. color: @text-color;
  82. border: 0;
  83. font-size: 1em;
  84. padding: 1em;
  85. margin: 0;
  86. width: 100%;
  87. border-radius: 2px;
  88. white-space: nowrap;
  89. overflow: hidden;
  90. text-overflow: ellipsis;
  91. }
  92. .error {
  93. text-align: center;
  94. color: #E7483B;
  95. display: block;
  96. padding: 0.5em;
  97. }
  98. }
  99. #md-preview {
  100. padding-bottom: 30px;
  101. }
  102. video, audio {
  103. margin: 0 auto;
  104. width: 100%;
  105. }
  106. .wrap {
  107. width: 40%;
  108. height: 40%;
  109. margin: 20px auto;
  110. }
  111. ::-webkit-media-slider-thumb {
  112. -webkit-appearance: none;
  113. background: red;
  114. }