My Marlin configs for Fabrikator Mini and CTC i3 Pro B
Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.

marlin.css 3.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. /* CSS reset */
  2. html, body, div, span, applet, object, iframe,
  3. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  4. a, abbr, acronym, address, big, cite, code,
  5. del, dfn, em, img, ins, kbd, q, s, samp,
  6. small, strike, strong, sub, sup, tt, var,
  7. b, u, i, center,
  8. dl, dt, dd, ol, ul, li,
  9. fieldset, form, label, legend,
  10. table, caption, tbody, tfoot, thead, tr, th, td,
  11. article, aside, canvas, details, embed,
  12. figure, figcaption, footer, header, hgroup,
  13. menu, nav, output, ruby, section, summary,
  14. time, mark, audio, video {
  15. margin: 0;
  16. padding: 0;
  17. border: 0;
  18. font-size: 100%;
  19. font: inherit;
  20. vertical-align: baseline;
  21. font-family: Impact, Charcoal, sans-serif;
  22. }
  23. article, aside, details, figcaption, figure,
  24. footer, header, hgroup, menu, nav, section {
  25. display: block;
  26. }
  27. body { line-height: 1; }
  28. ol, ul { list-style: none; }
  29. blockquote, q { quotes: none; }
  30. blockquote:before, blockquote:after,
  31. q:before, q:after { content: ''; content: none; }
  32. table {
  33. border-collapse: collapse;
  34. border-spacing: 0;
  35. }
  36. /* Custom */
  37. /* Tabs */
  38. * { box-sizing: border-box; }
  39. body {
  40. display: flex;
  41. justify-content: center;
  42. padding: 0px;
  43. background: #1e1e1e;
  44. color: #efefef;
  45. }
  46. h1 {
  47. margin: 0;
  48. font-size: 2em;
  49. }
  50. .tabs {
  51. display: flex;
  52. width: 100%;
  53. flex-wrap: wrap;
  54. background: #e5e5e5;
  55. }
  56. .input {
  57. position: absolute;
  58. opacity: 0;
  59. }
  60. .label {
  61. width: 100%;
  62. padding: 18px 28px;
  63. background: #e5e5e5;
  64. cursor: pointer;
  65. font-weight: bold;
  66. font-size: 18px;
  67. color: #7f7f7f;
  68. transition: background 0.1s, color 0.1s;
  69. border-style: solid;
  70. border-width: 0 0 4px 0;
  71. border-color: #acacac;
  72. }
  73. .label:hover {
  74. background: #d8d8d8;
  75. }
  76. .label:active {
  77. background: #ccc;
  78. }
  79. .input:focus + .label {
  80. z-index: 1;
  81. }
  82. .input:checked + .label {
  83. background: #1e1e1e;
  84. color: #efefef;
  85. border-width: 4px 0 0 0;
  86. border-color: #65a57d;
  87. }
  88. .panel {
  89. display: none;
  90. width: 100%;
  91. padding: 20px 30px 30px;
  92. background: #1e1e1e;
  93. color: #e5e5e5;
  94. }
  95. .panel .panel-content {
  96. width: 100%;
  97. max-width: 800px;
  98. }
  99. @media (min-width: 600px) {
  100. .label { width: auto; }
  101. .panel { order: 99; }
  102. }
  103. .input:checked + .label + .panel { display: block; }
  104. #logo {
  105. width: 130px;
  106. height: 58px;
  107. margin-right: 20px;
  108. background: url(marlin-logo.png) no-repeat center center;
  109. }
  110. input[type="text"], textarea {
  111. background-color: #2c2c2c;
  112. border: solid 2px #314b3b;
  113. color: #e5e5e5;
  114. outline: none;
  115. }
  116. input[type="text"]:focus, textarea:focus {
  117. border-color: #4d7a5e;
  118. }
  119. ul#serial-output {
  120. width: 100%;
  121. height: 300px;
  122. overflow-y: scroll;
  123. background-color: #2c2c2c;
  124. border: solid 2px #314b3b;
  125. }
  126. ul#serial-output li {
  127. padding: 4px;
  128. font-family: "Lucida Console", Monaco, monospace;
  129. font-size: 0.8em;
  130. }
  131. ul#serial-output li:nth-child(odd) {
  132. background-color: #3c3c3c;
  133. }
  134. div.form-wrapper {
  135. display: flex;
  136. width: 100%;
  137. margin: 6px 0;
  138. }
  139. div.form-wrapper input {
  140. font-size: 1.2em;
  141. padding: 4px 6px;
  142. }
  143. div.form-wrapper input[type="text"] {
  144. flex: 1 1 auto;
  145. }
  146. div.form-wrapper input[type="submit"],
  147. div.form-wrapper button {
  148. border: solid 2px #314b3b;
  149. background-color: #4d7a5e;
  150. color: #e5e5e5;
  151. }