inviteOrgMemberTemplate.html 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <!DOCTYPE html>
  2. <!--
  3. ~ <<
  4. ~ Davinci
  5. ~ ==
  6. ~ Copyright (C) 2016 - 2018 EDP
  7. ~ ==
  8. ~ Licensed under the Apache License, Version 2.0 (the "License");
  9. ~ you may not use this file except in compliance with the License.
  10. ~ You may obtain a copy of the License at
  11. ~ http://www.apache.org/licenses/LICENSE-2.0
  12. ~ Unless required by applicable law or agreed to in writing, software
  13. ~ distributed under the License is distributed on an "AS IS" BASIS,
  14. ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15. ~ See the License for the specific language governing permissions and
  16. ~ limitations under the License.
  17. ~ >>
  18. -->
  19. <html lang="en" xmlns:th="http://www.thymeleaf.org">
  20. <head>
  21. <meta charset="UTF-8">
  22. <meta name="format-detection" content="telephone=no" />
  23. <meta content="email=no" name="format-detection" />
  24. <title>Join</title>
  25. <style>
  26. html,body,div,header,h2,article,button,p {
  27. margin: 0; padding: 0;
  28. }
  29. html,body{
  30. height: 100%;
  31. width: 100%;
  32. }
  33. .container {
  34. width: 100%;
  35. height: 100%;
  36. background-color: #EAEDF1;
  37. display: flex;
  38. justify-content: center;
  39. align-items: center;
  40. }
  41. .wrapper {
  42. margin: 48px auto;
  43. width: 420px;
  44. display: flex;
  45. flex-direction: column;
  46. }
  47. header{
  48. flex:0;
  49. background-color: #1B98E0;
  50. border-radius: 2px 2px 0 0;
  51. line-height: 56px;
  52. height: 56px;
  53. color: #fff;
  54. }
  55. article {
  56. flex: 1;
  57. background-color: #fff;
  58. border-radius: 0 0 2px 2px;
  59. padding: 32px;
  60. }
  61. .hi {
  62. text-align: left;
  63. }
  64. .title {
  65. text-align: center;
  66. }
  67. .commonTitle {
  68. color: #444444;
  69. font-size: 18px;
  70. font-weight: 600;
  71. margin-bottom: 20px;
  72. }
  73. .sure{
  74. font-size: 16px;
  75. outline: none;
  76. display: inline-block;
  77. margin-bottom: 16px;
  78. padding: 8px 48px;
  79. border-radius: 4px 4px;
  80. background-color: #1B98E0;
  81. color: #fff;
  82. cursor: pointer;
  83. text-decoration:none;
  84. -webkit-touch-callout: none;
  85. -webkit-user-select: none;
  86. -khtml-user-select: none;
  87. -moz-user-select: none;
  88. -ms-user-select: none;
  89. user-select: none;
  90. text-align: center;
  91. }
  92. .detail {
  93. font-size: 12px;
  94. color: rgba(0,0,0,.59);
  95. text-align: center;
  96. }
  97. </style>
  98. </head>
  99. <body>
  100. <div class="container">
  101. <div class="wrapper">
  102. <header class="title">
  103. <h2>欢迎使用davinci</h2>
  104. </header>
  105. <article>
  106. <div class="hi commonTitle">Hi,<span th:text="${username}">username</span>!</div>
  107. <div class="title commonTitle"> <span th:text="${inviter}">inviter</span>邀请您加入<span th:text="${orgName}">organization</span></div>
  108. <a class="sure" th:href="@{http://localhost:5002/#/joinOrganization(token=${token})}">接受邀请<span th:text="${orgName}">organization</span></a>
  109. <!--<a class="sure" th:href="@{{host}/#/joinOrganization(token=${token},host=${host})}">接受邀请<span th:text="${orgName}">organization</span></a>-->
  110. <p class="detail">此邮件为确认邀请邮件。如拒绝加入或已加入该组织,请忽略。</p>
  111. </article>
  112. </div>
  113. </div>
  114. </body>
  115. </html>