Styles & html for a single post

main
Araozu 2023-12-03 07:54:10 -05:00
parent 7d305f911d
commit a9869e23ef
9 changed files with 102 additions and 61 deletions

View File

@ -1,19 +0,0 @@
package dev.araozu.jerguero;
import org.springframework.context.annotation.Bean;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestParam;
@Controller
public class GreetingController {
@GetMapping("/greeting")
public String greeting(
@RequestParam(name = "name", required = false, defaultValue = "World") String name,
Model model
) {
model.addAttribute("name", name);
return "greeting";
}
}

View File

@ -0,0 +1,17 @@
package dev.araozu.jerguero.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class IndexController {
@GetMapping("/")
public String index(Model model) {
model.addAttribute("time", System.currentTimeMillis());
return "views/index";
}
}

View File

@ -1,11 +1,21 @@
package dev.araozu.jerguero.controller.post;
import dev.araozu.jerguero.model.Post;
import dev.araozu.jerguero.model.PostRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;
@Controller
public class PostController {
PostRepository postRepository;
public PostController(PostRepository postRepository) {
this.postRepository = postRepository;
}
@GetMapping("/crear")
public String createEntry() {
return "post/create";
@ -22,13 +32,11 @@ public class PostController {
@RequestParam("definition-content") String content,
Model model
) {
postRepository.save(new Post(title, content));
model.addAttribute("title", title);
model.addAttribute("content", content);
return "post/create_result";
}
}
class PostInfo {
}

View File

@ -8,6 +8,7 @@
--chicha-yellow: #ffff00;
--chicha-orange: #ffaa00;
--chicha-pink: #ff007a;
--gray-1: #9ca3af;
}
/* Dark theme by default */
@ -21,6 +22,7 @@
:root {
--c-bg: white;
--c-on-bg: black;
--c-outline: var(--gray-1);
}
}

View File

@ -5,11 +5,7 @@ module.exports = {
"../static/**/*.{html,js}",
],
theme: {
extend: {
fontFamily: {
"mono": ["Iosevka", "monospace"],
}
},
extend: {},
colors: {
"c-bg": "var(--c-bg)",
"c-on-bg": "var(--c-on-bg)",
@ -17,10 +13,13 @@ module.exports = {
"c-chicha-pink": "var(--chicha-pink)",
"c-chicha-yellow": "var(--chicha-yellow)",
"c-chicha-orange": "var(--chicha-orange)",
"c-outline": "var(--c-outline)",
},
fontFamily: {
"chicha": ["Lobster", "serif"],
"rubik": ["Rubik", "sans-serif"],
"vina-sans": ["Vina Sans", "sans-serif"],
"mono": ["Iosevka", "monospace"],
}
},
plugins: [],

View File

@ -0,0 +1,43 @@
<div class="m-2 p-4 border-2 border-c-chicha-green rounded-md">
<h2 class="text-4xl font-vina-sans text-c-chicha-pink pb-1">
Palta
</h2>
<div class="pb-4 text-xl">
<span class="text-sm opacity-50">
Usado en:
</span>
<br>
<span title="Perú" class="cursor-pointer mr-1">
🇵🇪
</span>
<span title="Chile" class="cursor-pointer mr-1">
🇨🇱
</span>
</div>
<p>
- Problema, dificultad, obstáculo.
<br>
<span class="pl-4 opacity-75">Esa ya no es mi palta causita</span>
</p>
<p>
- Otro nombre para "Aguacate"
<br>
<span class="pl-4 opacity-75">Corre a la tienda y compra 1 kilo de palta</span>
</p>
<div class="pt-4">
<span class="text-xs opacity-50">
Creado por:
</span>
<br>
<a href="/usuario/1" class="relative
before:block before:absolute before:-inset-1 before:-skew-y-1 before:bg-c-chicha-orange">
<span class="relative text-[black] hover:underline font-vina-sans text-xl">
pablito de los backyardigans
</span>
</a>
</div>
</div>

View File

@ -1,9 +1,23 @@
<nav class="p-1 border-b-4 border-c-chicha-green" th:fragment="nav">
<div class="text-4xl font-bold font-chicha inline-block px-2 pt-2 pb-4 bg-[black] rounded-xl">
<span class="text-c-chicha-green">
J</span><span class="text-c-chicha-orange">e</span><span class="text-c-chicha-pink">r</span><span
class="text-c-chicha-yellow">g</span><span class="text-c-chicha-green">u</span><span
class="text-c-chicha-orange">e</span><span class="text-c-chicha-pink">r</span><span
class="text-c-chicha-yellow">o</span>
<div class="grid grid-cols-[9.5rem_auto] gap-2">
<div class="text-4xl font-bold font-vina-sans inline-block px-2 pt-2 pb-4
bg-[black] rounded-xl">
<span class="text-c-chicha-green inline-block relative -translate-y-1">
J</span><span
class="text-c-chicha-orange">e</span><span
class="text-c-chicha-pink inline-block relative translate-y-1">r</span><span
class="text-c-chicha-yellow">g</span><span
class="text-c-chicha-green inline-block relative translate-y-1">u</span><span
class="text-c-chicha-orange">e</span><span
class="text-c-chicha-pink inline-block relative translate-y-1">r</span><span
class="text-c-chicha-yellow">o</span>
</div>
<div class="flex items-center">
<input
class="border border-c-outline rounded-xl px-2 py-2 w-full"
type="text"
placeholder="Buscar"
>
</div>
</div>
</nav>

View File

@ -1,25 +0,0 @@
<!doctype html>
<html lang="es" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Jerguero</title>
<!-- tailwind -->
<link href="/main.css" rel="stylesheet">
</head>
<body>
<div class="bg-teal-900 text-white rounded-xl p-4 m-4 shadow">
<p th:text="|Oh hi ${name}, thanks for checking in, im|" />
<p class="bg-white text-teal-900 p-2 my-2 rounded-xl shadow-inner">
still a piece of garbage
</p>
</div>
<!-- htmx -->
<script src="https://unpkg.com/htmx.org@1.9.8/dist/htmx.min.js"></script>
</body>
</html>

View File

@ -8,11 +8,11 @@
<title>Jerguero</title>
<!-- tailwind -->
<link href="/main.css" rel="stylesheet">
<link th:href="|/main.css?t=${time}|" href="/main.css" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lobster&family=Vina+Sans&display=swap" rel="stylesheet">
</head>
<body>
@ -34,6 +34,8 @@
carita feliz :D
</button>
<div th:replace="fragments/definition"></div>
<!-- htmx -->
<script src="https://unpkg.com/htmx.org@1.9.8/dist/htmx.min.js"></script>
</body>