116 lines
5.2 KiB
Kotlin
116 lines
5.2 KiB
Kotlin
package be.simplenotes.app.views
|
|
|
|
import be.simplenotes.app.utils.StaticFileResolver
|
|
import be.simplenotes.domain.security.JwtPayload
|
|
import kotlinx.html.*
|
|
import kotlinx.html.div
|
|
import org.intellij.lang.annotations.Language
|
|
|
|
class BaseView(staticFileResolver: StaticFileResolver) : View(staticFileResolver) {
|
|
fun renderHome(jwtPayload: JwtPayload?) = renderPage(
|
|
title = "Home",
|
|
description = "A fast and simple note taking website",
|
|
jwtPayload = jwtPayload
|
|
) {
|
|
section("text-center my-2 p-2") {
|
|
h1("text-5xl casual") {
|
|
span("text-teal-300") { +"Simplenotes " }
|
|
+"- access your notes anywhere"
|
|
}
|
|
}
|
|
|
|
div("container mx-auto flex flex-wrap justify-center content-center") {
|
|
|
|
unsafe {
|
|
@Language("html")
|
|
val html =
|
|
"""
|
|
<div aria-label="demo" class="md:order-1 order-2 flipped p-4 my-10 w-full md:w-1/2">
|
|
<div class="flex justify-between mb-4">
|
|
<h1 class="text-2xl underline">Notes</h1>
|
|
<span>
|
|
<span class="btn btn-teal pointer-events-none">Trash (3)</span>
|
|
<span class="ml-2 btn btn-green pointer-events-none">New</span>
|
|
</span>
|
|
</div>
|
|
<form class="md:space-x-2" id="search">
|
|
<input aria-label="demo-search" name="search" disabled="" value="tag:"demo"">
|
|
<span id="buttons">
|
|
<button type="button" disabled="" class="btn btn-green pointer-events-none">search</button>
|
|
<span class="btn btn-red pointer-events-none">clear</span>
|
|
</span>
|
|
</form>
|
|
<div class="overflow-x-auto">
|
|
<table id="notes">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="w-1/2">Title</th>
|
|
<th scope="col" class="w-1/4">Updated</th>
|
|
<th scope="col" class="w-1/4">Tags</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><span class="text-blue-200 font-semibold underline">Formula 1</span></td>
|
|
<td class="text-center">moments ago</td>
|
|
<td>
|
|
<ul class="inline flex flex-wrap justify-center">
|
|
<li class="mx-2 my-1"><span class="tag disabled">#demo</span ></li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="text-blue-200 font-semibold underline">Syntax highlighting</span></td>
|
|
<td class="text-center">2 hours ago</td>
|
|
<td>
|
|
<ul class="inline flex flex-wrap justify-center">
|
|
<li class="mx-2 my-1"><span class="tag disabled">#features</span></li>
|
|
<li class="mx-2 my-1"><span class="tag disabled">#demo</span></li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="text-blue-200 font-semibold underline">report</span></td>
|
|
<td class="text-center">5 days ago</td>
|
|
<td>
|
|
<ul class="inline flex flex-wrap justify-center">
|
|
<li class="mx-2 my-1"><span class="tag disabled">#study</span></li>
|
|
<li class="mx-2 my-1"><span class="tag disabled">#demo</span></li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
""".trimIndent()
|
|
|
|
+html
|
|
}
|
|
|
|
welcome()
|
|
}
|
|
}
|
|
|
|
@Suppress("NOTHING_TO_INLINE")
|
|
private inline fun DIV.welcome() {
|
|
div("w-full my-auto md:w-1/2 md:order-2 order-1 text-center") {
|
|
div("m-4 rounded-lg p-6") {
|
|
p("text-teal-400") {
|
|
h2("text-3xl text-teal-400 underline") { +"Features:" }
|
|
ul("list-disc text-lg list-inside") {
|
|
li { +"Markdown support" }
|
|
li { +"Full text search" }
|
|
li { +"Structured search" }
|
|
li { +"Code highlighting" }
|
|
li { +"Fast and lightweight" }
|
|
li { +"No tracking" }
|
|
li { +"Works without javascript" }
|
|
li { +"Data export" }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|