added footer module and link to app in readme
This commit is contained in:
parent
850eec73bb
commit
921854e4c0
3
app.py
3
app.py
@ -256,6 +256,9 @@ def get_breeding_info(breed_id):
|
||||
|
||||
return base_combinations, mate_combinations
|
||||
|
||||
@app.route("/footer")
|
||||
def show_footer():
|
||||
return render_template("footer.html")
|
||||
|
||||
if __name__ == "__main__":
|
||||
app.run(debug=True)
|
||||
|
||||
@ -4,6 +4,8 @@
|
||||
|
||||
This Flask app is designed to use data from Dragon Warrior Monsters 2 to create an intuitive web UI. The app allows users to lookup monster information, and eventually breeding pairs and skills. Inspired by the [dwm2-tools](https://github.com/MetroWind/dwm2-tools) project.
|
||||
|
||||
### You can try the current release [here](https://dwm.happytavern.co) !
|
||||
|
||||
<img src=https://git.happytavern.co/OceanSlim/dwm-app/raw/branch/main/static/img/appScreen.png style="border-radius: 10px; width: 400px;">
|
||||
|
||||
## Features
|
||||
|
||||
@ -540,6 +540,40 @@ video {
|
||||
--tw-backdrop-sepia: ;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.container {
|
||||
max-width: 640px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.container {
|
||||
max-width: 768px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.container {
|
||||
max-width: 1024px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1280px) {
|
||||
.container {
|
||||
max-width: 1280px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1536px) {
|
||||
.container {
|
||||
max-width: 1536px;
|
||||
}
|
||||
}
|
||||
|
||||
.static {
|
||||
position: static;
|
||||
}
|
||||
@ -552,6 +586,19 @@ video {
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
.m-2 {
|
||||
margin: 0.5rem;
|
||||
}
|
||||
|
||||
.mx-auto {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mb-6 {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.ml-4 {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
@ -564,6 +611,10 @@ video {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.mt-6 {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
@ -616,11 +667,6 @@ video {
|
||||
background-color: rgb(30 41 59 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-purple-500 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(168 85 247 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.p-2 {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
@ -629,6 +675,11 @@ video {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.py-10 {
|
||||
padding-top: 2.5rem;
|
||||
padding-bottom: 2.5rem;
|
||||
}
|
||||
|
||||
.pl-2 {
|
||||
padding-left: 0.5rem;
|
||||
}
|
||||
@ -645,11 +696,20 @@ video {
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
}
|
||||
|
||||
.font-sans {
|
||||
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
}
|
||||
|
||||
.text-2xl {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.text-3xl {
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.25rem;
|
||||
}
|
||||
|
||||
.text-lg {
|
||||
font-size: 1.125rem;
|
||||
line-height: 1.75rem;
|
||||
@ -668,12 +728,50 @@ video {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.leading-7 {
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.text-gray-700 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(55 65 81 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-teal-500 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(20 184 166 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-white {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-purple-600 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(147 51 234 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-purple-400 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(192 132 252 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.hover\:text-red-700:hover {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(185 28 28 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.hover\:text-purple-700:hover {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(126 34 206 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.hover\:text-purple-200:hover {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(233 213 255 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.hover\:underline:hover {
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
29
templates/footer.html
Normal file
29
templates/footer.html
Normal file
@ -0,0 +1,29 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>About</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
|
||||
</head>
|
||||
<body class="font-mono text-white bg-slate-700">
|
||||
|
||||
|
||||
<div class="container mx-auto">
|
||||
<h2 class="m-2 text-2xl font-bold">About The App</h2>
|
||||
<p class="leading-7">
|
||||
Dragon Warrior Monsters 2 App, an open-source project where you can explore information about monsters, breeding pairs, and more.
|
||||
</p>
|
||||
<p class="mt-4 leading-7">
|
||||
You can contribute to the development and improvement of this app on our Git repository. Feel free to explore the code, report issues, and submit pull requests.
|
||||
</p>
|
||||
<div class="mt-4 text-purple-400 hover:text-purple-200">
|
||||
<a href="https://git.happytavern.co/oceanslim/dwm-app" target="_blank" class="text-teal-500 hover:underline">
|
||||
View the git repository
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -38,7 +38,18 @@
|
||||
width="272"
|
||||
>
|
||||
</iframe>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<iframe
|
||||
id="footerIframe"
|
||||
src="http://localhost:5000/footer"
|
||||
class="p-2 mt-4 ml-4 border-2 border-teal-500 rounded-md float-end"
|
||||
height="240"
|
||||
width="800"
|
||||
>
|
||||
</iframe>
|
||||
</div>
|
||||
<script src="{{ url_for('static', filename='js/index.js') }}"></script>
|
||||
<script src="{{ url_for('static', filename='js/breeding.js') }}"></script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user