fix links, use framework
This commit is contained in:
parent
b508efd50f
commit
8bc01d5fd9
@ -1,5 +1,8 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"tailwindcss": "^3.4.14"
|
||||
},
|
||||
"devDependencies": {
|
||||
"daisyui": "^4.12.13"
|
||||
}
|
||||
}
|
||||
|
@ -15,7 +15,7 @@ mod entities;
|
||||
#[derive(Debug, Template)]
|
||||
#[template(path = "recipe_card.html")]
|
||||
struct RecipeCard {
|
||||
id: i64,
|
||||
id: i32,
|
||||
author: Option<String>,
|
||||
image_url: String,
|
||||
title: String,
|
||||
|
@ -4,17 +4,16 @@
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
/* overflow-hidden is to prevent overflow within the card */
|
||||
/*
|
||||
.card {
|
||||
@apply bg-white rounded overflow-hidden shadow-md relative;
|
||||
}
|
||||
|
||||
/* object-cover is to prevent distortion */
|
||||
.badge {
|
||||
@apply bg-secondary-100 text-secondary-200 text-xs uppercase font-bold rounded-full p-2 absolute top-0 ml-2 mt-2;
|
||||
}
|
||||
|
||||
/* tracking-wider is for space between letters */
|
||||
.btn {
|
||||
@apply rounded-full py-2 px-3 uppercase text-xs font-bold cursor-pointer tracking-wider;
|
||||
}
|
||||
*/
|
||||
|
@ -1,7 +1,6 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
module.exports = {
|
||||
content: ["./templates/**/*.html"],
|
||||
darkMode: true,
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
@ -19,5 +18,17 @@ module.exports = {
|
||||
variants: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [],
|
||||
};
|
||||
plugins: [
|
||||
require('daisyui'),
|
||||
],
|
||||
daisyui: {
|
||||
themes: ['light', 'dark'], // false: only light + dark | true: all themes | array: specific themes like this ["light", "dark", "cupcake"]
|
||||
darkTheme: "light", // name of one of the included themes for dark mode
|
||||
base: true, // applies background color and foreground color for root element by default
|
||||
styled: true, // include daisyUI colors and design decisions for all components
|
||||
utils: true, // adds responsive and modifier utility classes
|
||||
prefix: "", // prefix for daisyUI classnames (components, modifiers and responsive class names. Not colors)
|
||||
logs: true, // Shows info about daisyUI version and used config in the console when building your CSS
|
||||
themeRoot: ":root", // The element that receives theme color CSS variables
|
||||
},
|
||||
};
|
||||
|
@ -1,8 +1,7 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block content %}
|
||||
<!-- main content -->
|
||||
<main class="px-16 py-6 bg-gray-100 md:col-span-3">
|
||||
<main class="px-16 py-6 md:col-span-3">
|
||||
<div class="flex justify-center md:justify-end">
|
||||
<a href="/sign-in" class="btn text-primary border-primary md:border-2 hover:shadow-lg transition ease-out duration-300">Login</a>
|
||||
</div>
|
||||
@ -25,5 +24,4 @@
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
{% endblock %}
|
||||
|
@ -14,7 +14,7 @@
|
||||
</div>
|
||||
<ul class="text-sm mt-6 hidden md:block" id="menu">
|
||||
<li class="text-gray-700 font-bold py-2">
|
||||
<a href="#" class="px-4 flex justify-end border-r-4 border-primary hover:shadow-md">
|
||||
<a href="/" class="px-4 flex justify-end border-r-4 border-primary hover:shadow-md">
|
||||
<span>Home</span>
|
||||
<svg class="w-5 ml-2" xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path
|
||||
@ -22,16 +22,6 @@
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="py-2">
|
||||
<a href="#" class="px-4 flex justify-end border-r-4 border-white hover:shadow-md">
|
||||
<span>About</span>
|
||||
<svg class="w-5 ml-2" xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd"
|
||||
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z"
|
||||
clip-rule="evenodd" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
@ -1,4 +1,4 @@
|
||||
<a class="card hover:shadow-lg transition ease-linear transform hover:scale-105" href="/recipies/{{id}}">
|
||||
<a class="card hover:shadow-lg transition ease-linear transform hover:scale-105" href="/recipe/{{id}}">
|
||||
<img src={{image_url}} alt="noodles" class="w-full h-32 md:h-48 object-cover">
|
||||
<div class="m-4">
|
||||
<span class="font-bold">{{title}}</span>
|
||||
|
@ -1,15 +1,14 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block content %}
|
||||
<!-- main content -->
|
||||
<main class="px-16 py-6 bg-gray-100 md:col-span-3">
|
||||
<main class="px-16 py-md:col-span-3">
|
||||
<div class="flex justify-center md:justify-end">
|
||||
<a href="/sign-in" class="btn text-primary border-primary md:border-2 hover:shadow-lg transition ease-out duration-300">Login</a>
|
||||
</div>
|
||||
|
||||
<div class="sm:bg-white sm:w-[50%] sm:ml-auto sm:mr-auto sm:mt-[10rem] sm:p-10 sm:rounded-3xl">
|
||||
<div>
|
||||
<img src={{ recipe.image_url.clone().unwrap_or_default() }} alt="omelette" class="sm:rounded-xl">
|
||||
<div class="sm:ml-auto sm:mr-auto sm:rounded-3xl">
|
||||
<div class="sm:mx-auto text-center">
|
||||
<img src={{ recipe.image_url.clone().unwrap_or_default() }} alt="{{recipe.title}}" class="sm:rounded-xl">
|
||||
</div>
|
||||
<div class="pl-[1.7rem] mt-8 sm:p-0 sm:mt-9">
|
||||
<h1 class="font-young-serif text-[37px] text-stone-700 leading-10 mb-7 sm:text-stone-800">{{ recipe.title }}</h1>
|
||||
@ -36,6 +35,16 @@
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
<div class="border-bottom marker:text-rose-900 marker:font-outfit-semibold border-b-[2px] ml-auto mr-auto w-[20.2rem] pb-4 mt-8 sm:w-auto">
|
||||
<p class="Title mb-5">Tags</p>
|
||||
<ol class="list-disc ml-6">
|
||||
{% for tag in tags %}
|
||||
<li class="font-outfit-regular text-stone-500 text-[17px] mb-3 pl-3 text-base">
|
||||
<div>{{ tag.name }}</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
|
1021
templates/styles.css
1021
templates/styles.css
File diff suppressed because it is too large
Load Diff
32
yarn.lock
32
yarn.lock
@ -187,11 +187,34 @@ cross-spawn@^7.0.0:
|
||||
shebang-command "^2.0.0"
|
||||
which "^2.0.1"
|
||||
|
||||
css-selector-tokenizer@^0.8:
|
||||
version "0.8.0"
|
||||
resolved "https://registry.yarnpkg.com/css-selector-tokenizer/-/css-selector-tokenizer-0.8.0.tgz#88267ef6238e64f2215ea2764b3e2cf498b845dd"
|
||||
integrity sha512-Jd6Ig3/pe62/qe5SBPTN8h8LeUg/pT4lLgtavPf7updwwHpvFzxvOQBHYj2LZDMjUnBzgvIUSjRcf6oT5HzHFg==
|
||||
dependencies:
|
||||
cssesc "^3.0.0"
|
||||
fastparse "^1.1.2"
|
||||
|
||||
cssesc@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
|
||||
integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
|
||||
|
||||
culori@^3:
|
||||
version "3.3.0"
|
||||
resolved "https://registry.yarnpkg.com/culori/-/culori-3.3.0.tgz#e33530adbd124d53bd6550394397e695eaaed739"
|
||||
integrity sha512-pHJg+jbuFsCjz9iclQBqyL3B2HLCBF71BwVNujUYEvCeQMvV97R59MNK3R2+jgJ3a1fcZgI9B3vYgz8lzr/BFQ==
|
||||
|
||||
daisyui@^4.12.13:
|
||||
version "4.12.13"
|
||||
resolved "https://registry.yarnpkg.com/daisyui/-/daisyui-4.12.13.tgz#e386c54dd7a55e77dc865f12e1556b37229dfb4e"
|
||||
integrity sha512-BnXyQoOByUF/7wSdIKubyhXxbtL8gxwY3u2cNMkxGP39TSVJqMmlItqtpY903fQnLI/NokC+bc+ZV+PEPsppPw==
|
||||
dependencies:
|
||||
css-selector-tokenizer "^0.8"
|
||||
culori "^3"
|
||||
picocolors "^1"
|
||||
postcss-js "^4"
|
||||
|
||||
didyoumean@^1.2.2:
|
||||
version "1.2.2"
|
||||
resolved "https://registry.yarnpkg.com/didyoumean/-/didyoumean-1.2.2.tgz#989346ffe9e839b4555ecf5666edea0d3e8ad037"
|
||||
@ -228,6 +251,11 @@ fast-glob@^3.3.0:
|
||||
merge2 "^1.3.0"
|
||||
micromatch "^4.0.4"
|
||||
|
||||
fastparse@^1.1.2:
|
||||
version "1.1.2"
|
||||
resolved "https://registry.yarnpkg.com/fastparse/-/fastparse-1.1.2.tgz#91728c5a5942eced8531283c79441ee4122c35a9"
|
||||
integrity sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==
|
||||
|
||||
fastq@^1.6.0:
|
||||
version "1.17.1"
|
||||
resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.17.1.tgz#2a523f07a4e7b1e81a42b91b8bf2254107753b47"
|
||||
@ -445,7 +473,7 @@ path-scurry@^1.11.1:
|
||||
lru-cache "^10.2.0"
|
||||
minipass "^5.0.0 || ^6.0.2 || ^7.0.0"
|
||||
|
||||
picocolors@^1.0.0, picocolors@^1.1.0:
|
||||
picocolors@^1, picocolors@^1.0.0, picocolors@^1.1.0:
|
||||
version "1.1.1"
|
||||
resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.1.1.tgz#3d321af3eab939b083c8f929a1d12cda81c26b6b"
|
||||
integrity sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==
|
||||
@ -474,7 +502,7 @@ postcss-import@^15.1.0:
|
||||
read-cache "^1.0.0"
|
||||
resolve "^1.1.7"
|
||||
|
||||
postcss-js@^4.0.1:
|
||||
postcss-js@^4, postcss-js@^4.0.1:
|
||||
version "4.0.1"
|
||||
resolved "https://registry.yarnpkg.com/postcss-js/-/postcss-js-4.0.1.tgz#61598186f3703bab052f1c4f7d805f3991bee9d2"
|
||||
integrity sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==
|
||||
|
Loading…
Reference in New Issue
Block a user