hubert/SimpleNotes
1
0
Fork 0
Code Projects Releases Activity

Use btn css class

Browse Source
This commit is contained in:
Hubert Van De Walle 2020-08-14 15:56:41 +02:00
parent b90df61020
commit 90f6709885
7 changed files with 41 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/src/main/kotlin/views/NoteView.kt
View File

@ -55,8 +55,7 @@ class NoteView(staticFileResolver: StaticFileResolver) : View(staticFileResolver
h1("text-2xl underline") { +"Notes" }
a(
href = "/notes/new",
classes = "text-gray-800 bg-green-500 hover:bg-green-700 " +
"inline ml-2 text-md font-semibold rounded px-4 py-2"
classes = "btn btn-green"
) { +"New" }
}
if (notes.isNotEmpty()) {

3
app/src/main/kotlin/views/components/Forms.kt
View File

@ -30,8 +30,7 @@ fun FlowContent.submitButton(text: String) {
div("flex items-center mt-6") {
button(
type = submit,
classes = "bg-teal-500 hover:bg-teal-600 focus:bg-teal-600" +
" w-full focus:outline-none text-white font-bold py-2 px-4 rounded"
classes = "btn btn-teal w-full"
) { +text }
}
}

11
app/src/main/kotlin/views/components/Navbar.kt
View File

@ -11,17 +11,14 @@ fun BODY.navbar(jwtPayload: JwtPayload?) {
li("inline text-gray-100 ml-2 text-md font-semibold") {
a(href = "/notes") { +"Notes" }
}
li(
"text-gray-800 bg-green-500 hover:bg-green-700" +
" inline ml-2 text-md font-semibold rounded px-4 py-2"
) {
li("inline ml-2") {
form(classes = "inline", action = "/logout", method = FormMethod.post) {
button(type = ButtonType.submit) { +"Logout" }
button(type = ButtonType.submit, classes = "btn btn-green") { +"Logout" }
}
}
} else {
li("inline text-gray-100 pl-2 text-md font-semibold") {
a(href = "/login") { +"Sign In" }
li("inline pl-2") {
a(href = "/login", classes = "btn btn-green") { +"Sign In" }
}
}
}

1
css/package.json
View File

@ -10,6 +10,7 @@
"cssnano": "^4.1.10",
"postcss-cli": "^7.1.1",
"postcss-hash": "^2.0.0",
"postcss-nested": "^4.2.3",
"tailwindcss": "^1.5.1"
}
}

1
css/postcss.config.js
View File

@ -1,5 +1,6 @@
module.exports = {
plugins: [
require('postcss-nested'),
require('tailwindcss'),
require('autoprefixer'),
require('cssnano')({

32
css/styles.css
View File

@ -2,6 +2,38 @@
@tailwind components;
.btn {
@apply font-semibold py-2 px-4 rounded;
&:focus {
@apply outline-none shadow-outline;
}
}
.btn-teal {
@apply bg-teal-500 text-white;
&:focus {
@apply bg-teal-600;
}
&:hover {
@apply bg-teal-600;
}
}
.btn-green {
@apply bg-green-500 text-white;
&:focus {
@apply bg-green-600;
}
&:hover {
@apply bg-green-600;
}
}
.nav {
height: 64px;
}

2
css/yarn.lock
View File

@ -1324,7 +1324,7 @@ postcss-minify-selectors@^4.0.2:
postcss "^7.0.0"
postcss-selector-parser "^3.0.0"
postcss-nested@^4.1.1:
postcss-nested@^4.1.1, postcss-nested@^4.2.3:
version "4.2.3"
resolved "https://registry.yarnpkg.com/postcss-nested/-/postcss-nested-4.2.3.tgz#c6f255b0a720549776d220d00c4b70cd244136f6"
integrity sha512-rOv0W1HquRCamWy2kFl3QazJMMe1ku6rCFoAAH+9AcxdbpDeBr6k968MLWuLjvjMcGEip01ak09hKOEgpK9hvw==