1
0

designer.tmpl 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. <html>
  2. <head>
  3. <style>
  4. /*! CSS Used from: https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css */
  5. body{margin:0;}
  6. a{background-color:transparent;}
  7. a:active,a:hover{outline:0;}
  8. img{border:0;}
  9. button{margin:0;font:inherit;color:inherit;}
  10. button{overflow:visible;}
  11. button{text-transform:none;}
  12. button{-webkit-appearance:button;cursor:pointer;}
  13. button::-moz-focus-inner{padding:0;border:0;}
  14. table{border-spacing:0;border-collapse:collapse;}
  15. td,th{padding:0;}
  16. @media print{
  17. *,:after,:before{color:#000!important;text-shadow:none!important;background:0 0!important;-webkit-box-shadow:none!important;box-shadow:none!important;}
  18. a,a:visited{text-decoration:underline;}
  19. a[href]:after{content:" (" attr(href) ")";}
  20. thead{display:table-header-group;}
  21. img,tr{page-break-inside:avoid;}
  22. img{max-width:100%!important;}
  23. h2{orphans:3;widows:3;}
  24. h2{page-break-after:avoid;}
  25. .table{border-collapse:collapse!important;}
  26. .table td,.table th{background-color:#fff!important;}
  27. }
  28. *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
  29. :after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
  30. body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fff;}
  31. button{font-family:inherit;font-size:inherit;line-height:inherit;}
  32. a{color:#337ab7;text-decoration:none;}
  33. a:focus,a:hover{color:#23527c;text-decoration:underline;}
  34. a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px;}
  35. img{vertical-align:middle;}
  36. h2{font-family:inherit;font-weight:500;line-height:1.1;color:inherit;}
  37. h2{margin-top:20px;margin-bottom:10px;}
  38. h2{font-size:30px;}
  39. .container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto;}
  40. @media (min-width:768px){
  41. .container{width:750px;}
  42. }
  43. @media (min-width:992px){
  44. .container{width:970px;}
  45. }
  46. @media (min-width:1200px){
  47. .container{width:1170px;}
  48. }
  49. table{background-color:transparent;}
  50. th{text-align:left;}
  51. .table{width:100%;max-width:100%;margin-bottom:20px;}
  52. .table>tbody>tr>td,.table>thead>tr>th{padding:8px;line-height:1.42857143;vertical-align:top;border-top:1px solid #ddd;}
  53. .table>thead>tr>th{vertical-align:bottom;border-bottom:2px solid #ddd;}
  54. .table>thead:first-child>tr:first-child>th{border-top:0;}
  55. .btn{display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-image:none;border:1px solid transparent;border-radius:4px;}
  56. .btn:active:focus,.btn:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px;}
  57. .btn:focus,.btn:hover{color:#333;text-decoration:none;}
  58. .btn:active{background-image:none;outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125);}
  59. .btn-primary{color:#fff;background-color:#337ab7;border-color:#2e6da4;}
  60. .btn-primary:focus{color:#fff;background-color:#286090;border-color:#122b40;}
  61. .btn-primary:hover{color:#fff;background-color:#286090;border-color:#204d74;}
  62. .btn-primary:active{color:#fff;background-color:#286090;border-color:#204d74;}
  63. .btn-primary:active:focus,.btn-primary:active:hover{color:#fff;background-color:#204d74;border-color:#122b40;}
  64. .btn-primary:active{background-image:none;}
  65. .btn-primary .badge{color:#337ab7;background-color:#fff;}
  66. .btn-danger{color:#fff;background-color:#d9534f;border-color:#d43f3a;}
  67. .btn-danger:focus{color:#fff;background-color:#c9302c;border-color:#761c19;}
  68. .btn-danger:hover{color:#fff;background-color:#c9302c;border-color:#ac2925;}
  69. .btn-danger:active{color:#fff;background-color:#c9302c;border-color:#ac2925;}
  70. .btn-danger:active:focus,.btn-danger:active:hover{color:#fff;background-color:#ac2925;border-color:#761c19;}
  71. .btn-danger:active{background-image:none;}
  72. .btn-danger .badge{color:#d9534f;background-color:#fff;}
  73. .badge{display:inline-block;min-width:10px;padding:3px 7px;font-size:12px;font-weight:700;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:middle;background-color:#777;border-radius:10px;}
  74. .badge:empty{display:none;}
  75. .btn .badge{position:relative;top:-1px;}
  76. .container:after,.container:before{display:table;content:" ";}
  77. .container:after{clear:both;}
  78. /*! CSS Used from: Embedded */
  79. body{background-color:#bdc3c7;}
  80. .table{width:100%;background-color:#f3f3f3;}
  81. </style>
  82. </head>
  83. <body>
  84. <img src="http://ai.choozmo.com/img/logo_choozmo.webp" style="display: block; margin-left: auto; margin-right: auto; width: 150px;" >
  85. <h2 style="text-align:center;">幸福空間設計師SEO報告</h2>
  86. <div class="container">
  87. <table class="table">
  88. <thead>
  89. <tr style="background-color: #8600FF;">
  90. <th style="color: #eeeeee ;">設計師</th>
  91. <th style="color: #eeeeee ;">優先</th>
  92. <th style="color: #eeeeee ;">次之</th>
  93. <th style="color: #eeeeee ;">資料時間</th>
  94. </tr>
  95. </thead>
  96. <tbody>
  97. {% for item in displaydata %}
  98. <tr>
  99. <td>{{ item.designer |safe}}</td>
  100. <td>{{ item.first |safe }}</td>
  101. <td>{{ item.second |safe }}</td>
  102. <td>{{ item.dt |safe }}</td>
  103. </tr>
  104. {% endfor %}
  105. </tbody>
  106. </table>
  107. </div>
  108. </body>
  109. </html>