hubert/SimpleNotes
1
0
Fork 0
Code Projects Releases Activity

Html + css improvements

Browse Source
This commit is contained in:
Hubert Van De Walle 2020-08-22 18:57:33 +02:00
parent 5573dd45d6
commit f73a9d0b96
4 changed files with 20 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
app/src/main/kotlin/views/BaseView.kt
View File

@ -25,17 +25,17 @@ class BaseView(staticFileResolver: StaticFileResolver) : View(staticFileResolver
@Language("html") @Language("html")
val html = val html =
""" """
<div aria-label="demo" class="md:order-1 order-2 flipped flipped-left p-4 my-10 w-full md:w-1/2"> <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"> <div class="flex justify-between mb-4">
<h1 class="text-2xl underline">Notes</h1> <h1 class="text-2xl underline">Notes</h1>
<span> <span>
<a href="#" class="underline font-semibold">Trash (3)</a> <span class="underline font-semibold">Trash (3)</span>
<a href="#" class="ml-2 btn btn-green">New</a> <span class="ml-2 btn btn-green pointer-events-none">New</span>
</span> </span>
</div> </div>
<form class="md:space-x-2" id="search"> <form class="md:space-x-2" id="search">
<input aria-label="demo-search" name="search" disabled="" value="tag:&quot;demo&quot;"> <input aria-label="demo-search" name="search" disabled="" value="tag:&quot;demo&quot;">
<span id="buttons"><button disabled="">search</button><a href="#">clear</a></span> <span id="buttons"><button disabled="" class="pointer-events-none">search</button><span>clear</span></span>
</form> </form>
<div class="overflow-x-auto"> <div class="overflow-x-auto">
<table id="notes"> <table id="notes">
@ -48,31 +48,31 @@ class BaseView(staticFileResolver: StaticFileResolver) : View(staticFileResolver
</thead> </thead>
<tbody> <tbody>
<tr> <tr>
<td><a href="#" class="text-blue-200 font-semibold underline">Formula 1</a></td> <td><span class="text-blue-200 font-semibold underline">Formula 1</span></td>
<td class="text-center">moments ago</td> <td class="text-center">moments ago</td>
<td> <td>
<ul class="inline flex flex-wrap justify-center"> <ul class="inline flex flex-wrap justify-center">
<li class="mx-2 my-1"><a href="#" class="tag">#demo</a></li> <li class="mx-2 my-1"><span class="tag disabled">#demo</span ></li>
</ul> </ul>
</td> </td>
</tr> </tr>
<tr> <tr>
<td><a href="#" class="text-blue-200 font-semibold underline">Syntax highlighting</a></td> <td><span class="text-blue-200 font-semibold underline">Syntax highlighting</span></td>
<td class="text-center">2 hours ago</td> <td class="text-center">2 hours ago</td>
<td> <td>
<ul class="inline flex flex-wrap justify-center"> <ul class="inline flex flex-wrap justify-center">
<li class="mx-2 my-1"><a href="#" class="tag">#features</a></li> <li class="mx-2 my-1"><span class="tag disabled">#features</span></li>
<li class="mx-2 my-1"><a href="#" class="tag">#demo</a></li> <li class="mx-2 my-1"><span class="tag disabled">#demo</span></li>
</ul> </ul>
</td> </td>
</tr> </tr>
<tr> <tr>
<td><a href="#" class="text-blue-200 font-semibold underline">report</a></td> <td><span class="text-blue-200 font-semibold underline">report</span></td>
<td class="text-center">5 days ago</td> <td class="text-center">5 days ago</td>
<td> <td>
<ul class="inline flex flex-wrap justify-center"> <ul class="inline flex flex-wrap justify-center">
<li class="mx-2 my-1"><a href="#" class="tag">#study</a></li> <li class="mx-2 my-1"><span class="tag disabled">#study</span></li>
<li class="mx-2 my-1"><a href="#" class="tag">#demo</a></li> <li class="mx-2 my-1"><span class="tag disabled">#demo</span></li>
</ul> </ul>
</td> </td>
</tr> </tr>
@ -95,7 +95,7 @@ class BaseView(staticFileResolver: StaticFileResolver) : View(staticFileResolver
div("m-4 rounded-lg p-6") { div("m-4 rounded-lg p-6") {
p("text-teal-400") { p("text-teal-400") {
h2("text-3xl text-teal-400 underline") { +"Features:" } h2("text-3xl text-teal-400 underline") { +"Features:" }
ul("list-disc text-lg") { ul("list-disc text-lg list-inside") {
li { +"Markdown support" } li { +"Markdown support" }
li { +"Full text search" } li { +"Full text search" }
li { +"Structured search" } li { +"Structured search" }

2
app/src/main/kotlin/views/components/DeletedNoteTable.kt
View File

@ -44,7 +44,7 @@ private fun FlowContent.tags(tags: List<String>) {
ul("inline flex flex-wrap justify-center") { ul("inline flex flex-wrap justify-center") {
tags.forEach { tag -> tags.forEach { tag ->
li("mx-2 my-1") { li("mx-2 my-1") {
span("tag") { +"#$tag" } span("tag disabled") { +"#$tag" }
} }
} }
} }

10
css/src/other.pcss
View File

@ -8,6 +8,10 @@
&:hover { &:hover {
@apply bg-teal-800 text-white; @apply bg-teal-800 text-white;
} }
&.disabled {
@apply pointer-events-none;
}
} }
@screen md { @screen md {
@ -15,11 +19,7 @@
perspective: 1000px; perspective: 1000px;
} }
.flipped-left > * { .flipped > * {
transform: rotateY(25deg); transform: rotateY(25deg);
} }
.flipped-right > * {
transform: rotateY(-25deg);
}
} }

2
css/src/search.pcss
View File

@ -16,7 +16,7 @@
@apply flex-1 btn btn-green; @apply flex-1 btn btn-green;
} }
a { a, span {
@apply ml-2 flex-1 btn btn-red inline-block text-center; @apply ml-2 flex-1 btn btn-red inline-block text-center;
} }
} }