default.go 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310
  1. package theme
  2. type Default struct {
  3. }
  4. func (theme *Default) Template() string {
  5. return `
  6. <!DOCTYPE html>
  7. <html lang="en">
  8. <head>
  9. <meta charset="UTF-8">
  10. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  11. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  12. <title>{{ .Page.Title }}</title>
  13. <style>
  14. html {
  15. height: 100%;
  16. }
  17. body {
  18. width: 100% !important;
  19. height: 100%;
  20. margin: 0;
  21. font-size: .96rem;
  22. line-height: 1.4;
  23. background-color: #F2F4F6;
  24. color: #44485E;
  25. -webkit-text-size-adjust: none;
  26. font-family: Helvetica Neue, Tahoma, Arial, PingFangSC-Regular, Hiragino Sans GB, Microsoft Yahei, sans-serif;
  27. -webkit-font-smoothing: antialiased;
  28. touch-action: manipulation;
  29. text-size-adjust: none;
  30. }
  31. .container {
  32. max-width: 560px;
  33. min-height: 100%;
  34. margin: 0 auto;
  35. background-color: white;
  36. }
  37. .container-inner {
  38. padding: 1rem;
  39. width: 100%;
  40. box-sizing: border-box;
  41. }
  42. .action-block{
  43. margin: 30px 0 20px 0;
  44. text-align: center;
  45. }
  46. .table-wrapper{
  47. margin-bottom: 1.5rem;
  48. }
  49. .table-wrapper-inner{
  50. width: 100%;
  51. overflow-x: auto;
  52. display: flex;
  53. }
  54. .table-fixed{
  55. position: absolute;
  56. background: white;
  57. z-index: 999;
  58. }
  59. .table-relative{
  60. flex: 1 1 auto!important;
  61. }
  62. .text-success {
  63. color: #20c55c;
  64. }
  65. .text-danger {
  66. color: #ff0476;
  67. }
  68. .text-center {
  69. text-align: center;
  70. }
  71. article {
  72. line-height: 1.6rem;
  73. }
  74. article h1,
  75. article h2,
  76. article h3,
  77. article h4 {
  78. color: #232323;
  79. margin-bottom: 1.28rem;
  80. }
  81. a {
  82. font-style: none;
  83. text-decoration: none;
  84. }
  85. article p {
  86. margin-bottom: 1rem;
  87. }
  88. .preview-label {
  89. min-width: 4em;
  90. text-align: justify;
  91. text-align-last: justify;
  92. }
  93. .preview-value {
  94. text-align: right;
  95. display: block;
  96. overflow: hidden;
  97. word-break: normal;
  98. word-wrap: break-word;
  99. color: rgba(0, 0, 0, 0.9);
  100. flex: 1 1 auto !important;
  101. }
  102. .grid {
  103. padding: 1rem 0;
  104. }
  105. .grid h4 {
  106. margin-top: 0;
  107. margin-bottom: .68rem;
  108. }
  109. .row {
  110. display: flex;
  111. justify-content: flex-start;
  112. line-height: 2;
  113. }
  114. .timeline {
  115. margin: 0;
  116. list-style: none;
  117. padding-left: 1rem;
  118. }
  119. .timeline-item {
  120. position: relative;
  121. padding-bottom: 1rem;
  122. box-sizing: border-box;
  123. }
  124. .timeline-item-tail {
  125. top: 0;
  126. position: absolute;
  127. left: 4px;
  128. height: 100%;
  129. border-left: 3px solid #e4e7ed;
  130. }
  131. .timeline-item-node {
  132. left: -1px;
  133. width: 13px;
  134. height: 13px;
  135. position: absolute;
  136. background-color: #e4e7ed;
  137. border-color: #e4e7ed;
  138. border-radius: 50%;
  139. box-sizing: border-box;
  140. display: flex;
  141. justify-content: center;
  142. align-items: center;
  143. }
  144. .timeline-item-wrapper {
  145. width: 100%;
  146. position: relative;
  147. padding-left: 28px;
  148. top: -3px;
  149. }
  150. .timeline-item-timestamp{
  151. font-size: .86rem;
  152. color: #64686E;
  153. }
  154. .timeline-item-content{
  155. width:100%;
  156. }
  157. .table {
  158. border: 1px solid #ddd;
  159. width: 100%;
  160. max-width: 100%;
  161. margin-bottom: 20px;
  162. display: table;
  163. border-collapse: separate;
  164. box-sizing: border-box;
  165. text-indent: initial;
  166. border-spacing: 2px;
  167. border-collapse: collapse;
  168. border-spacing: 0;
  169. }
  170. .table-title{
  171. box-sizing: border-box;
  172. margin-bottom: 1rem;
  173. }
  174. .table>thead:first-child>tr:first-child>th {
  175. border-top: 0;
  176. }
  177. .table>thead>tr>th{
  178. vertical-align: bottom;
  179. padding: 8px;
  180. line-height: 1.42857143;
  181. border-bottom-width: 2px;
  182. border: 1px solid #ddd;
  183. text-align: left;
  184. word-break : keep-all;
  185. }
  186. .table>tbody>tr>td{
  187. border: 1px solid #ddd;
  188. padding: 8px;
  189. line-height: 1.42857143;
  190. vertical-align: top;
  191. text-align: left;
  192. word-break : keep-all;
  193. }
  194. .button {
  195. padding: .8rem 2rem;
  196. color: white;
  197. background-color: #727cf5;
  198. border-radius: .25rem;
  199. }
  200. .invite-code {
  201. font-size: 32px;
  202. letter-spacing: .6rem;
  203. color: #35742;
  204. }
  205. .copyright {
  206. text-align: center;
  207. font-size: .86rem;
  208. color: #8c8c86;
  209. margin: 50px 0 10px 0;
  210. }
  211. .cell {
  212. flex: 1 1 auto !important;
  213. }
  214. </style>
  215. </head>
  216. <body>
  217. <div class="container">
  218. <div class="container-inner">
  219. <article>
  220. {{ if .Page.Head }}<h1>{{ .Page.Head }}</h1>{{ end }}
  221. {{ with .Page.Intros }}
  222. {{ if gt (len .) 0 }}
  223. {{ range $text := . }}
  224. {{ $text }}
  225. {{ end }}
  226. {{ end }}
  227. {{ end }}
  228. {{ with .Page.Actions }}
  229. {{ if gt (len .) 0 }}
  230. {{ range $action := . }}
  231. {{ $action }}
  232. {{ end }}
  233. {{ end }}
  234. {{ end }}
  235. {{ with .Page.Entries }}
  236. {{ if gt (len .) 0 }}
  237. {{ range $entry := . }}
  238. {{ $entry }}
  239. {{ end }}
  240. {{ end }}
  241. {{ end }}
  242. {{ with .Page.Timelines }}
  243. {{ if gt (len .) 0 }}
  244. {{ range $timeline := . }}
  245. {{ $timeline }}
  246. {{ end }}
  247. {{ end }}
  248. {{ end }}
  249. {{ with .Page.Tables }}
  250. {{ if gt (len .) 0 }}
  251. {{ range $table := . }}
  252. {{ $table }}
  253. {{ end }}
  254. {{ end }}
  255. {{ end }}
  256. {{ with .Page.Outros }}
  257. {{ if gt (len .) 0 }}
  258. {{ range $text := . }}
  259. {{ $text }}
  260. {{ end }}
  261. {{ end }}
  262. {{ end }}
  263. {{ if .Page.Copyright }}<div class="copyright">{{ .Page.Copyright }}</div>{{ end }}
  264. </article>
  265. </div>
  266. </div>
  267. </body>
  268. </html>
  269. `
  270. }