readlist.html 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>{{.Strings.Readlist.title}}</title>
  7. <link rel="stylesheet" href="/static/style/style.css" />
  8. <link rel="icon" type="image/svg+xml" href="/static/img/logo.svg">
  9. <link rel="apple-touch-icon" type="image/svg+xml" href="/static/img/logo.svg">
  10. </head>
  11. <body>
  12. <header class="w12 padding-bottom-_25 flex flex-row flex-justify-space flex-align-centre">
  13. <a href="/" class="decoration-none">
  14. <h1 class="inline valign-mid text sans margin-lr-1">a·muse</h1>
  15. </a>
  16. <div class="margin-lr-1 text">
  17. <nav>
  18. <label for="hamburger" class="cursor-hand">
  19. <img src="/users/{{.State.User.Username}}/avatar?size=small" class="border-radius-25 width-1_5"/>
  20. </label>
  21. <input type="checkbox" id="hamburger" class="display-none" />
  22. <ul class="absolute right top-1 padding-lr-1 padding-tb-_5 bg align-right list-style-none sans">
  23. <!--<li><a href="/users/{{.State.User.Username}}" class="decoration-none text-accent">{{.Strings.Global.account}}</a><span class="material-icon padding-lr-_5">&#xe851;</span></li>-->
  24. <li><a href="/users/{{.State.User.Username}}/watchlist" class="decoration-none text-accent">{{.Strings.Global.watchlist}}</a><span class="material-icon padding-lr-_5">&#xe04a;</span></li>
  25. <li><a href="/users/{{.State.User.Username}}/tvqueue" class="decoration-none text-accent">{{.Strings.Global.tv_queue}}</a><span class="material-icon padding-lr-_5">&#xe1b2;</span></li>
  26. <li><a href="/users/{{.State.User.Username}}/readlist" class="decoration-none text-accent">{{.Strings.Global.readlist}}</a><span class="material-icon padding-lr-_5">&#xe431;</span></li>
  27. <li><a href="/users/{{.State.User.Username}}/experiences" class="decoration-none text-accent">{{.Strings.Global.experiences}}</a><span class="material-icon padding-lr-_5">&#xe042;</span></li>
  28. <li class="bg-error">
  29. <form action="/users/{{.State.User.Username}}/sessions/{{.State.User.Session}}" method="POST" class="inline">
  30. <input type="hidden" value="DELETE" name="method" />
  31. <input type="submit" value="{{.Strings.Global.log_out}}" class="border-none bg-none font-normal text-accent padding-lr-0 cursor-hand font-1" />
  32. </form><span class="material-icon padding-lr-_5">&#xe7ff;</span>
  33. </li>
  34. </ul>
  35. </nav>
  36. </div>
  37. </header>
  38. <main class="margin-lr-1">
  39. <!-- search, filter, order -->
  40. <div class="flex flex-row flex-wrap flex-centre flex-align-start margin-top-1">
  41. <form method="GET" class="flex inline margin-lr-1 border-bottom">
  42. <input type="search" name="filter" class="border-none bg-none sans text" placeholder="{{.Strings.Readlist.filter}}" value="{{.Data.Query}}" />
  43. </form>
  44. </div>
  45. {{if .Data.List}}
  46. <div class="flex flex-row flex-wrap flex-justify-space flex-align-start margin-top-1">
  47. <div>
  48. {{if gt .Data.Page 1}}
  49. <a href="/users/{{.State.User.Username}}/readlist?filter={{.Data.Query}}&page={{.Data.PrevPage}}" class="decoration-none" title="{{.Strings.Search.prev_link_title}}"><span class="material-icon font-2">&#xe408;</span></a>
  50. {{end}}
  51. </div>
  52. <div>Page {{.Data.Page}}/{{.Data.Pages}}</div>
  53. <div>
  54. {{if lt .Data.Page .Data.Pages}}
  55. <a href="/users/{{.State.User.Username}}/readlist?filter={{.Data.Query}}&page={{.Data.NextPage}}" class="decoration-none" title="{{.Strings.Search.next_link_title}}"><span class="material-icon font-2">&#xe409;</span></a>
  56. {{end}}
  57. </div>
  58. </div>
  59. <div class="flex flex-row flex-wrap flex-justify-space flex-align-start">
  60. {{range .Data.List}}
  61. <a href="/books/{{.Id}}" class="decoration-none force-width-18 margin-tb-1 no-outline border-solid border-gradient border-tb-transparent border-_5 padding-tb-_25 padding-lr-_25">
  62. <div class="flex">
  63. <div>
  64. {{if .Cover}}
  65. <img src="{{.Cover}}" class="min-height-231px width-154px" />
  66. {{else}}
  67. <img src="/static/img/book_empty.webp" class="min-height-231px width-154px" />
  68. {{end}}
  69. </div>
  70. <div class="margin-lr-1">
  71. <p class="sans">{{.Title}}</p>
  72. {{if gt .YearStart 1}}
  73. <p class="sans font-_875 text-grey">{{.YearStart}}</p>
  74. {{end}}
  75. <p class="sans font-_875">
  76. {{.GetGenres $.Data.Genres}}
  77. </p>
  78. <p class="font-_875 text-grey">
  79. {{if .HasPrevious}}<span class="material-icon" title="Read previous part first">&#xe02c;</span>{{end}}
  80. <!-- todo based on -->
  81. </p>
  82. </div>
  83. </div>
  84. </a>
  85. {{end}}
  86. </div>
  87. <div class="flex flex-row flex-wrap flex-justify-space flex-align-start margin-top-1">
  88. <div>
  89. {{if gt .Data.Page 1}}
  90. <a href="/users/{{.State.User.Username}}/readlist?filter={{.Data.Query}}&page={{.Data.PrevPage}}" class="decoration-none" title="{{.Strings.Search.prev_link_title}}"><span class="material-icon font-2">&#xe408;</span></a>
  91. {{end}}
  92. </div>
  93. <div>
  94. {{if lt .Data.Page .Data.Pages}}
  95. <a href="/users/{{.State.User.Username}}/readlist?filter={{.Data.Query}}&page={{.Data.NextPage}}" class="decoration-none" title="{{.Strings.Search.next_link_title}}"><span class="material-icon font-2">&#xe409;</span></a>
  96. {{end}}
  97. </div>
  98. </div>
  99. {{else if and (gt .Data.Page .Data.Pages) (gt .Data.Pages 0)}}
  100. <div class="font-2 w12 flex flex-centre margin-top-10">
  101. <div>
  102. <p>{{.Strings.Global.too_far_quote}}</p>
  103. <p class="indent-2 sans">—{{.Strings.Global.too_far_character}} (<span class="italic sans">{{.Strings.Global.too_far_title}}</span>, {{.Strings.Global.too_far_code}} {{.Strings.Global.too_far_episode}})</p>
  104. </div>
  105. </div>
  106. {{else}}
  107. <div class="font-2 w12 flex flex-centre margin-top-10">
  108. <div>
  109. <p>{{.Strings.Global.empty_quote}}</p>
  110. <p class="indent-2 sans">—{{.Strings.Global.empty_character}} (<span class="italic sans">{{.Strings.Global.empty_title}}</span>)</p>
  111. </div>
  112. </div>
  113. {{end}}
  114. </main>
  115. </body>
  116. </html>