pacnpal/thrillwiki_django_no_react
1
1
Fork 0
mirror of https://github.com/pacnpal/thrillwiki_django_no_react.git synced 2025-12-20 02:31:08 -05:00
Code Issues Packages Projects Releases Wiki Activity

right

Browse Source
This commit is contained in:
pacnpal
2024-10-29 20:36:49 -04:00
parent a6c33cf50f
commit 4e970400ef
9 changed files with 822 additions and 335 deletions
Download Patch File Download Diff File Expand all files Collapse all files

177
assets/css/src/input.css
View File

@@ -3,49 +3,146 @@
@tailwind utilities;
@layer components {
/* Button Styles */
.btn-primary {
@apply inline-flex items-center px-6 py-2.5 border border-transparent rounded-full shadow-md text-sm font-medium text-white bg-gradient-to-r from-primary to-secondary hover:from-primary/90 hover:to-secondary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/50 transform hover:scale-105 transition-all;
}
/* Default icon style (moon icon) */
#theme-toggle+.theme-toggle-btn i::before {
content: "\f186";
/* Moon icon */
font-family: "Font Awesome 5 Free";
font-weight: 900;
/* Solid icon */
}
/* Change to sun icon and color when checkbox is checked */
#theme-toggle:checked+.theme-toggle-btn i::before {
content: "\f185";
/* Sun icon */
color: theme('colors.yellow.400');
/* Tailwind yellow-400 color */
}
.btn-secondary {
@apply inline-flex items-center px-6 py-2.5 border border-gray-200 dark:border-gray-700 rounded-full shadow-md text-sm font-medium text-gray-700 dark:text-gray-200 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/50 transform hover:scale-105 transition-all;
}
/* [Previous styles remain unchanged until mobile menu section...] */
/* Mobile Menu */
#mobileMenu {
@apply overflow-hidden transition-all duration-300 ease-in-out opacity-0 max-h-0;
}
#mobileMenu.show {
@apply max-h-[300px] opacity-100;
}
#mobileMenu .space-y-4 {
@apply pb-6;
}
.mobile-nav-link {
@apply flex items-center justify-center px-6 py-3 text-gray-700 transition-all border border-transparent rounded-lg dark:text-gray-200 hover:bg-primary/10 dark:hover:bg-primary/20 hover:text-primary dark:hover:text-primary hover:border-primary/20 dark:hover:border-primary/30;
}
.mobile-nav-link i {
@apply text-xl transition-colors;
}
@media (max-width: 540px) {
.mobile-nav-link i {
@apply text-lg;
}
}
.mobile-nav-link.primary {
@apply text-white bg-gradient-to-r from-primary to-secondary hover:from-primary/90 hover:to-secondary/90;
}
.mobile-nav-link.primary i {
@apply mr-3 text-white;
}
.mobile-nav-link.secondary {
@apply text-gray-700 bg-gray-100 dark:bg-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-600;
}
.mobile-nav-link.secondary i {
@apply mr-3 text-gray-500 dark:text-gray-400;
}
/* Theme Toggle */
#theme-toggle+.theme-toggle-btn i::before {
content: "\f186";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
#theme-toggle:checked+.theme-toggle-btn i::before {
content: "\f185";
color: theme('colors.yellow.400');
}
/* Navigation Components */
.nav-link {
@apply flex items-center px-6 py-2.5 rounded-lg font-medium text-gray-700 dark:text-gray-200 hover:bg-primary/10 dark:hover:bg-primary/20 hover:text-primary dark:hover:text-primary transition-all border border-transparent hover:border-primary/20 dark:hover:border-primary/30;
@apply flex items-center text-gray-700 transition-all dark:text-gray-200;
}
/* Extra small screens (540px and below) */
@media (max-width: 540px) {
.nav-link {
@apply px-2 py-2 text-sm;
}
.nav-link i {
@apply mr-1 text-base;
}
.nav-link span {
@apply text-sm;
}
.site-logo {
@apply px-1 text-lg;
}
.nav-container {
@apply px-2;
}
}
/* Small screens (541px to 767px) */
@media (min-width: 541px) and (max-width: 767px) {
.nav-link {
@apply px-3 py-2;
}
.nav-link i {
@apply mr-2;
}
.site-logo {
@apply px-2 text-xl;
}
.nav-container {
@apply px-4;
}
}
/* Medium screens and up */
@media (min-width: 768px) {
.nav-link {
@apply px-6 py-2.5 rounded-lg font-medium border border-transparent hover:border-primary/20 dark:hover:border-primary/30;
}
.nav-link i {
@apply mr-3 text-lg;
}
.site-logo {
@apply px-3 text-2xl;
}
.nav-container {
@apply px-6;
}
}
.nav-link:hover {
@apply text-primary dark:text-primary bg-primary/10 dark:bg-primary/20;
}
.nav-link i {
@apply mr-3 text-lg text-gray-500 transition-colors dark:text-gray-400;
@apply text-gray-500 transition-colors dark:text-gray-400;
}
.nav-link:hover i {
@apply text-primary;
}
.mobile-nav-link {
@apply flex items-center px-6 py-3 text-gray-700 transition-all border border-transparent rounded-lg dark:text-gray-200 hover:bg-primary/10 dark:hover:bg-primary/20 hover:text-primary dark:hover:text-primary hover:border-primary/20 dark:hover:border-primary/30;
}
.mobile-nav-link i {
@apply mr-3 text-lg text-gray-500 dark:text-gray-400;
@media (min-width: 1024px) {
#mobileMenu {
@apply hidden !important;
}
}
/* Menu Items */
.menu-item {
@apply flex items-center w-full px-4 py-3 text-sm text-gray-700 transition-all dark:text-gray-200 hover:bg-primary/10 dark:hover:bg-primary/20 hover:text-primary dark:hover:text-primary first:rounded-t-lg last:rounded-b-lg;
}
@@ -54,6 +151,7 @@
@apply mr-3 text-base text-gray-500 dark:text-gray-400;
}
/* Form Components */
.form-input {
@apply w-full px-4 py-3 text-gray-900 transition-all border border-gray-200 rounded-lg shadow-sm dark:border-gray-700 bg-white/70 dark:bg-gray-800/70 backdrop-blur-sm dark:text-white focus:ring-2 focus:ring-primary/50 focus:border-primary;
}
@@ -70,7 +168,7 @@
@apply mt-2 text-sm text-red-600 dark:text-red-400;
}
/* Status Badge Styles */
/* Status Badges */
.status-badge {
@apply inline-flex items-center px-3 py-1 text-sm font-medium rounded-full;
}
@@ -87,7 +185,7 @@
@apply text-yellow-800 bg-yellow-100 dark:bg-yellow-600 dark:text-yellow-50;
}
/* Auth Card Styles */
/* Auth Components */
.auth-card {
@apply w-full max-w-md p-8 mx-auto border shadow-xl bg-white/90 dark:bg-gray-800/90 rounded-2xl backdrop-blur-sm border-gray-200/50 dark:border-gray-700/50;
}
@@ -130,6 +228,7 @@
@apply text-gray-700 bg-white border-gray-200 hover:bg-gray-50 shadow-gray-200/50 dark:shadow-gray-900/50;
}
/* Alert Components */
.alert {
@apply p-4 mb-4 shadow-lg rounded-xl backdrop-blur-sm;
}
@@ -150,6 +249,32 @@
@apply text-blue-800 border border-blue-200 bg-blue-100/90 dark:bg-blue-800/30 dark:text-blue-100 dark:border-blue-700;
}
/* Layout Components */
.card {
@apply p-6 bg-white border rounded-lg shadow-lg dark:bg-gray-800 border-gray-200/50 dark:border-gray-700/50;
}
.card-hover {
@apply transition-transform transform hover:-translate-y-1;
}
.grid-cards {
@apply grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3;
}
/* Typography */
.heading-1 {
@apply mb-6 text-3xl font-bold text-gray-900 dark:text-white;
}
.heading-2 {
@apply mb-4 text-2xl font-bold text-gray-900 dark:text-white;
}
.text-body {
@apply text-gray-600 dark:text-gray-300;
}
/* Turnstile Widget */
.turnstile {
@apply flex items-center justify-center my-4;

519
static/css/tailwind.css
View File

@@ -1386,6 +1386,8 @@ select {
left: 0;
}
/* Button Styles */
.btn-primary {
display: inline-flex;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1435,25 +1437,6 @@ select {
--tw-ring-offset-width: 2px;
}
/* Default icon style (moon icon) */
#theme-toggle+.theme-toggle-btn i::before {
content: "\f186";
/* Moon icon */
font-family: "Font Awesome 5 Free";
font-weight: 900;
/* Solid icon */
}
/* Change to sun icon and color when checkbox is checked */
#theme-toggle:checked+.theme-toggle-btn i::before {
content: "\f185";
/* Sun icon */
color: #facc15;
/* Tailwind yellow-400 color */
}
.btn-secondary {
display: inline-flex;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1513,67 +1496,32 @@ select {
background-color: rgb(55 65 81 / var(--tw-bg-opacity));
}
.nav-link {
display: flex;
align-items: center;
border-radius: 0.5rem;
border-width: 1px;
border-color: transparent;
padding-left: 1.5rem;
padding-right: 1.5rem;
padding-top: 0.625rem;
padding-bottom: 0.625rem;
font-weight: 500;
--tw-text-opacity: 1;
color: rgb(55 65 81 / var(--tw-text-opacity));
/* [Previous styles remain unchanged until mobile menu section...] */
/* Mobile Menu */
#mobileMenu {
max-height: 0px;
overflow: hidden;
opacity: 0;
transition-property: all;
transition-duration: 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
.nav-link:hover {
border-color: rgb(79 70 229 / 0.2);
background-color: rgb(79 70 229 / 0.1);
--tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity));
#mobileMenu.show {
max-height: 300px;
opacity: 1;
}
.nav-link:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(229 231 235 / var(--tw-text-opacity));
}
.nav-link:hover:is(.dark *) {
border-color: rgb(79 70 229 / 0.3);
background-color: rgb(79 70 229 / 0.2);
--tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity));
}
.nav-link i {
margin-right: 0.75rem;
font-size: 1.125rem;
line-height: 1.75rem;
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity));
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
.nav-link i:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(156 163 175 / var(--tw-text-opacity));
}
.nav-link:hover i {
--tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity));
#mobileMenu .space-y-4 {
padding-bottom: 1.5rem;
}
.mobile-nav-link {
display: flex;
align-items: center;
justify-content: center;
border-radius: 0.5rem;
border-width: 1px;
border-color: transparent;
@@ -1608,18 +1556,250 @@ select {
}
.mobile-nav-link i {
margin-right: 0.75rem;
font-size: 1.125rem;
font-size: 1.25rem;
line-height: 1.75rem;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
@media (max-width: 540px) {
.mobile-nav-link i {
font-size: 1.125rem;
line-height: 1.75rem;
}
}
.mobile-nav-link.primary {
background-image: linear-gradient(to right, var(--tw-gradient-stops));
--tw-gradient-from: #4f46e5 var(--tw-gradient-from-position);
--tw-gradient-to: rgb(79 70 229 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
--tw-gradient-to: #e11d48 var(--tw-gradient-to-position);
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.mobile-nav-link.primary:hover {
--tw-gradient-from: rgb(79 70 229 / 0.9) var(--tw-gradient-from-position);
--tw-gradient-to: rgb(79 70 229 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
--tw-gradient-to: rgb(225 29 72 / 0.9) var(--tw-gradient-to-position);
}
.mobile-nav-link.primary i {
margin-right: 0.75rem;
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.mobile-nav-link.secondary {
--tw-bg-opacity: 1;
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: rgb(55 65 81 / var(--tw-text-opacity));
}
.mobile-nav-link.secondary:hover {
--tw-bg-opacity: 1;
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}
.mobile-nav-link.secondary:is(.dark *) {
--tw-bg-opacity: 1;
background-color: rgb(55 65 81 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color: rgb(209 213 219 / var(--tw-text-opacity));
}
.mobile-nav-link.secondary:hover:is(.dark *) {
--tw-bg-opacity: 1;
background-color: rgb(75 85 99 / var(--tw-bg-opacity));
}
.mobile-nav-link.secondary i {
margin-right: 0.75rem;
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity));
}
.mobile-nav-link i:is(.dark *) {
.mobile-nav-link.secondary i:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(156 163 175 / var(--tw-text-opacity));
}
/* Theme Toggle */
#theme-toggle+.theme-toggle-btn i::before {
content: "\f186";
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
#theme-toggle:checked+.theme-toggle-btn i::before {
content: "\f185";
color: #facc15;
}
/* Navigation Components */
.nav-link {
display: flex;
align-items: center;
--tw-text-opacity: 1;
color: rgb(55 65 81 / var(--tw-text-opacity));
transition-property: all;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
.nav-link:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(229 231 235 / var(--tw-text-opacity));
}
/* Extra small screens (540px and below) */
@media (max-width: 540px) {
.nav-link {
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
font-size: 0.875rem;
line-height: 1.25rem;
}
.nav-link i {
margin-right: 0.25rem;
font-size: 1rem;
line-height: 1.5rem;
}
.nav-link span {
font-size: 0.875rem;
line-height: 1.25rem;
}
.site-logo {
padding-left: 0.25rem;
padding-right: 0.25rem;
font-size: 1.125rem;
line-height: 1.75rem;
}
.nav-container {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
}
/* Small screens (541px to 767px) */
@media (min-width: 541px) and (max-width: 767px) {
.nav-link {
padding-left: 0.75rem;
padding-right: 0.75rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.nav-link i {
margin-right: 0.5rem;
}
.site-logo {
padding-left: 0.5rem;
padding-right: 0.5rem;
font-size: 1.25rem;
line-height: 1.75rem;
}
.nav-container {
padding-left: 1rem;
padding-right: 1rem;
}
}
/* Medium screens and up */
@media (min-width: 768px) {
.nav-link {
border-radius: 0.5rem;
border-width: 1px;
border-color: transparent;
padding-left: 1.5rem;
padding-right: 1.5rem;
padding-top: 0.625rem;
padding-bottom: 0.625rem;
font-weight: 500;
}
.nav-link:hover {
border-color: rgb(79 70 229 / 0.2);
}
.nav-link:hover:is(.dark *) {
border-color: rgb(79 70 229 / 0.3);
}
.nav-link i {
margin-right: 0.75rem;
font-size: 1.125rem;
line-height: 1.75rem;
}
.site-logo {
padding-left: 0.75rem;
padding-right: 0.75rem;
font-size: 1.5rem;
line-height: 2rem;
}
.nav-container {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
}
.nav-link:hover {
background-color: rgb(79 70 229 / 0.1);
--tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity));
}
.nav-link:hover:is(.dark *) {
background-color: rgb(79 70 229 / 0.2);
--tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity));
}
.nav-link i {
--tw-text-opacity: 1;
color: rgb(107 114 128 / var(--tw-text-opacity));
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
.nav-link i:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(156 163 175 / var(--tw-text-opacity));
}
.nav-link:hover i {
--tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity));
}
@media (min-width: 1024px) {
#mobileMenu {
display: none !important;
}
}
/* Menu Items */
.menu-item {
display: flex;
width: 100%;
@@ -1677,6 +1857,8 @@ select {
color: rgb(156 163 175 / var(--tw-text-opacity));
}
/* Form Components */
.form-input {
width: 100%;
border-radius: 0.5rem;
@@ -1768,7 +1950,7 @@ select {
color: rgb(248 113 113 / var(--tw-text-opacity));
}
/* Status Badge Styles */
/* Status Badges */
.status-badge {
display: inline-flex;
@@ -1825,7 +2007,7 @@ select {
color: rgb(254 252 232 / var(--tw-text-opacity));
}
/* Auth Card Styles */
/* Auth Components */
.auth-card {
margin-left: auto;
@@ -2015,6 +2197,8 @@ select {
--tw-shadow: var(--tw-shadow-colored);
}
/* Alert Components */
.alert {
margin-bottom: 1rem;
border-radius: 0.75rem;
@@ -2095,6 +2279,96 @@ select {
color: rgb(219 234 254 / var(--tw-text-opacity));
}
/* Layout Components */
.card {
border-radius: 0.5rem;
border-width: 1px;
border-color: rgb(229 231 235 / 0.5);
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
padding: 1.5rem;
--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.card:is(.dark *) {
border-color: rgb(55 65 81 / 0.5);
--tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity));
}
.card-hover {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
transition-property: transform;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
.card-hover:hover {
--tw-translate-y: -0.25rem;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.grid-cards {
display: grid;
grid-template-columns: repeat(1, minmax(0, 1fr));
gap: 1.5rem;
}
@media (min-width: 768px) {
.grid-cards {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 1024px) {
.grid-cards {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
/* Typography */
.heading-1 {
margin-bottom: 1.5rem;
font-size: 1.875rem;
line-height: 2.25rem;
font-weight: 700;
--tw-text-opacity: 1;
color: rgb(17 24 39 / var(--tw-text-opacity));
}
.heading-1:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.heading-2 {
margin-bottom: 1rem;
font-size: 1.5rem;
line-height: 2rem;
font-weight: 700;
--tw-text-opacity: 1;
color: rgb(17 24 39 / var(--tw-text-opacity));
}
.heading-2:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-body {
--tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity));
}
.text-body:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(209 213 219 / var(--tw-text-opacity));
}
/* Turnstile Widget */
.turnstile {
@@ -2260,6 +2534,10 @@ select {
height: 2rem;
}
.max-h-\[300px\] {
max-height: 300px;
}
.min-h-\[calc\(100vh-16rem\)\] {
min-height: calc(100vh - 16rem);
}
@@ -2296,6 +2574,10 @@ select {
max-width: 48rem;
}
.max-w-lg {
max-width: 32rem;
}
.max-w-md {
max-width: 28rem;
}
@@ -2386,18 +2668,6 @@ select {
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-6 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(1.5rem * var(--tw-space-x-reverse));
margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-8 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(2rem * var(--tw-space-x-reverse));
margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse: 0;
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
@@ -2564,6 +2834,10 @@ select {
background-color: rgb(220 252 231 / 0.9);
}
.bg-primary\/10 {
background-color: rgb(79 70 229 / 0.1);
}
.bg-red-100 {
--tw-bg-opacity: 1;
background-color: rgb(254 226 226 / var(--tw-bg-opacity));
@@ -2654,6 +2928,11 @@ select {
padding: 2rem;
}
.px-1 {
padding-left: 0.25rem;
padding-right: 0.25rem;
}
.px-2 {
padding-left: 0.5rem;
padding-right: 0.5rem;
@@ -2878,6 +3157,10 @@ select {
color: rgb(133 77 14 / var(--tw-text-opacity));
}
.opacity-0 {
opacity: 0;
}
.shadow {
--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
@@ -2939,14 +3222,6 @@ select {
backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
.transition-all {
transition-property: all;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -2965,6 +3240,14 @@ select {
transition-duration: 150ms;
}
.duration-300 {
transition-duration: 300ms;
}
.ease-in-out {
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.content-\[\'\'\] {
--tw-content: '';
content: var(--tw-content);
@@ -3041,6 +3324,11 @@ select {
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}
.hover\:bg-gray-200:hover {
--tw-bg-opacity: 1;
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}
.hover\:bg-gray-50:hover {
--tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
@@ -3093,11 +3381,6 @@ select {
border-color: rgb(59 130 246 / var(--tw-border-opacity));
}
.focus\:border-primary:focus {
--tw-border-opacity: 1;
border-color: rgb(79 70 229 / var(--tw-border-opacity));
}
.focus\:underline:focus {
text-decoration-line: underline;
}
@@ -3266,6 +3549,11 @@ select {
color: rgb(220 252 231 / var(--tw-text-opacity));
}
.dark\:text-primary:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(79 70 229 / var(--tw-text-opacity));
}
.dark\:text-red-100:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(254 226 226 / var(--tw-text-opacity));
@@ -3310,11 +3598,6 @@ select {
--tw-ring-color: rgb(250 204 21 / 0.3);
}
.dark\:hover\:bg-gray-600:hover:is(.dark *) {
--tw-bg-opacity: 1;
background-color: rgb(75 85 99 / var(--tw-bg-opacity));
}
.dark\:hover\:bg-gray-700:hover:is(.dark *) {
--tw-bg-opacity: 1;
background-color: rgb(55 65 81 / var(--tw-bg-opacity));
@@ -3338,6 +3621,18 @@ select {
.sm\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sm\:space-x-4 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(1rem * var(--tw-space-x-reverse));
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
.sm\:space-x-6 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(1.5rem * var(--tw-space-x-reverse));
margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
}
}
@media (min-width: 768px) {
@@ -3345,14 +3640,6 @@ select {
margin-top: 0px;
}
.md\:flex {
display: flex;
}
.md\:hidden {
display: none;
}
.md\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
@@ -3393,6 +3680,14 @@ select {
grid-column: span 2 / span 2;
}
.lg\:flex {
display: flex;
}
.lg\:hidden {
display: none;
}
.lg\:grid-cols-1 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}

51
static/js/main.js
View File

@@ -36,15 +36,50 @@ document.addEventListener('submit', (e) => {
}
});
// Mobile menu toggle
const mobileMenuBtn = document.getElementById('mobileMenuBtn');
const mobileMenu = document.getElementById('mobileMenu');
// Mobile menu toggle with transitions
document.addEventListener('DOMContentLoaded', () => {
const mobileMenuBtn = document.getElementById('mobileMenuBtn');
const mobileMenu = document.getElementById('mobileMenu');
if (mobileMenuBtn && mobileMenu) {
mobileMenuBtn.addEventListener('click', () => {
mobileMenu.classList.toggle('hidden');
});
}
if (mobileMenuBtn && mobileMenu) {
let isMenuOpen = false;
const toggleMenu = () => {
isMenuOpen = !isMenuOpen;
mobileMenu.classList.toggle('show', isMenuOpen);
mobileMenuBtn.setAttribute('aria-expanded', isMenuOpen.toString());
// Update icon
const icon = mobileMenuBtn.querySelector('i');
icon.classList.remove(isMenuOpen ? 'fa-bars' : 'fa-times');
icon.classList.add(isMenuOpen ? 'fa-times' : 'fa-bars');
};
mobileMenuBtn.addEventListener('click', toggleMenu);
// Close menu when clicking outside
document.addEventListener('click', (e) => {
if (isMenuOpen && !mobileMenu.contains(e.target) && !mobileMenuBtn.contains(e.target)) {
toggleMenu();
}
});
// Close menu when pressing escape
document.addEventListener('keydown', (e) => {
if (isMenuOpen && e.key === 'Escape') {
toggleMenu();
}
});
// Handle viewport changes
const mediaQuery = window.matchMedia('(min-width: 1024px)');
mediaQuery.addEventListener('change', (e) => {
if (e.matches && isMenuOpen) {
toggleMenu();
}
});
}
});
// User dropdown toggle
const userMenuBtn = document.getElementById('userMenuBtn');

236
templates/account/login.html
View File

@@ -8,112 +8,144 @@
{% block content %}
<div class="flex items-center justify-center min-h-[calc(100vh-16rem)]">
<div class="w-full max-w-md">
<div class="auth-card">
<h1 class="auth-title">{% trans "Welcome Back" %}</h1>
<div class="w-full max-w-lg">
<div class="auth-card">
<h1 class="auth-title">{% trans "Welcome Back" %}</h1>
{% get_providers as socialaccount_providers %}
{% if socialaccount_providers %}
<div class="space-y-3">
{% for provider in socialaccount_providers %}
<a href="{% provider_login_url provider.id process='login' %}"
class="btn-social {% if provider.id == 'discord' %}btn-discord{% elif provider.id == 'google' %}btn-google{% endif %}"
role="button"
tabindex="0"
onkeydown="if(event.key === 'Enter' || event.key === ' ') { this.click(); event.preventDefault(); }">
{% if provider.id == 'google' %}
<img src="{% static 'images/google-icon.svg' %}" alt="Google" class="w-5 h-5 mr-3">
<span>Continue with Google</span>
{% elif provider.id == 'discord' %}
<img src="{% static 'images/discord-icon.svg' %}" alt="Discord" class="w-5 h-5 mr-3">
<span>Continue with Discord</span>
{% endif %}
</a>
{% endfor %}
</div>
<div class="auth-divider">
<span>Or continue with email</span>
</div>
{% endif %}
{% get_providers as socialaccount_providers %}
{% if socialaccount_providers %}
<div class="space-y-3">
{% for provider in socialaccount_providers %}
<a
href="{% provider_login_url provider.id process='login' %}"
class="btn-social {% if provider.id == 'discord' %}btn-discord{% elif provider.id == 'google' %}btn-google{% endif %}"
role="button"
tabindex="0"
onkeydown="if(event.key === 'Enter' || event.key === ' ') { this.click(); event.preventDefault(); }"
>
{% if provider.id == 'google' %}
<img
src="{% static 'images/google-icon.svg' %}"
alt="Google"
class="w-5 h-5 mr-3"
/>
<span>Continue with Google</span>
{% elif provider.id == 'discord' %}
<img
src="{% static 'images/discord-icon.svg' %}"
alt="Discord"
class="w-5 h-5 mr-3"
/>
<span>Continue with Discord</span>
{% endif %}
</a>
{% endfor %}
</div>
<form class="space-y-6" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
{% if form.non_field_errors %}
<div class="alert alert-error">
<div class="text-sm">{{ form.non_field_errors }}</div>
</div>
{% endif %}
<div class="auth-divider">
<span>Or continue with email</span>
</div>
{% endif %}
<div>
<label for="id_login" class="form-label">
{% trans "Username or Email" %}
</label>
<input type="text" name="login" id="id_login" required
autocomplete="username email"
class="form-input">
{% if form.login.errors %}
<p class="form-error">{{ form.login.errors }}</p>
{% endif %}
</div>
<div>
<label for="id_password" class="form-label">
{% trans "Password" %}
</label>
<input type="password" name="password" id="id_password" required
autocomplete="current-password"
class="form-input">
{% if form.password.errors %}
<p class="form-error">{{ form.password.errors }}</p>
{% endif %}
</div>
<div class="flex items-center justify-between">
<div class="flex items-center">
<input type="checkbox" name="remember" id="id_remember"
class="w-4 h-4 border-gray-300 rounded text-primary focus:ring-primary/50 dark:border-gray-700">
<label for="id_remember" class="block ml-2 text-sm text-gray-700 dark:text-gray-300">
{% trans "Remember me" %}
</label>
</div>
<div class="text-sm">
<a href="{% url 'account_reset_password' %}"
class="font-medium transition-colors text-primary hover:text-primary/80 focus:outline-none focus:underline"
onkeydown="if(event.key === 'Enter') { this.click(); }">
{% trans "Forgot Password?" %}
</a>
</div>
</div>
{% turnstile_widget %}
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}">
{% endif %}
<div>
<button type="submit" class="w-full btn-primary">
<i class="mr-2 fas fa-sign-in-alt"></i>
{% trans "Sign In" %}
</button>
</div>
</form>
<div class="mt-6 text-sm text-center">
<p class="text-gray-600 dark:text-gray-400">
{% trans "Don't have an account?" %}
<a href="{% url 'account_signup' %}"
class="ml-1 font-medium transition-colors text-primary hover:text-primary/80 focus:outline-none focus:underline"
onkeydown="if(event.key === 'Enter') { this.click(); }">
{% trans "Sign up" %}
</a>
</p>
</div>
<form class="space-y-6" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
{% if form.non_field_errors %}
<div class="alert alert-error">
<div class="text-sm">{{ form.non_field_errors }}</div>
</div>
{% endif %}
<div>
<label for="id_login" class="form-label">
{% trans "Username or Email" %}
</label>
<input
type="text"
name="login"
id="id_login"
required
autocomplete="username email"
class="form-input"
/>
{% if form.login.errors %}
<p class="form-error">{{ form.login.errors }}</p>
{% endif %}
</div>
<div>
<label for="id_password" class="form-label">
{% trans "Password" %}
</label>
<input
type="password"
name="password"
id="id_password"
required
autocomplete="current-password"
class="form-input"
/>
{% if form.password.errors %}
<p class="form-error">{{ form.password.errors }}</p>
{% endif %}
</div>
<div class="flex items-center justify-between">
<div class="flex items-center">
<input
type="checkbox"
name="remember"
id="id_remember"
class="w-4 h-4 border-gray-300 rounded text-primary focus:ring-primary/50 dark:border-gray-700"
/>
<label
for="id_remember"
class="block ml-2 text-sm text-gray-700 dark:text-gray-300"
>
{% trans "Remember me" %}
</label>
</div>
<div class="text-sm">
<a
href="{% url 'account_reset_password' %}"
class="font-medium transition-colors text-primary hover:text-primary/80 focus:outline-none focus:underline"
onkeydown="if(event.key === 'Enter') { this.click(); }"
>
{% trans "Forgot Password?" %}
</a>
</div>
</div>
{% turnstile_widget %}
{% if redirect_field_value %}
<input
type="hidden"
name="{{ redirect_field_name }}"
value="{{ redirect_field_value }}"
/>
{% endif %}
<div>
<button type="submit" class="w-full btn-primary">
<i class="mr-2 fas fa-sign-in-alt"></i>
{% trans "Sign In" %}
</button>
</div>
</form>
<div class="mt-6 text-sm text-center">
<p class="text-gray-600 dark:text-gray-400">
{% trans "Don't have an account?" %}
<a
href="{% url 'account_signup' %}"
class="ml-1 font-medium transition-colors text-primary hover:text-primary/80 focus:outline-none focus:underline"
onkeydown="if(event.key === 'Enter') { this.click(); }"
>
{% trans "Sign up" %}
</a>
</p>
</div>
</div>
</div>
</div>
{% endblock %}

17
templates/account/signup.html
View File

@@ -8,7 +8,7 @@
{% block content %}
<div class="flex items-center justify-center min-h-[calc(100vh-16rem)]">
<div class="w-full max-w-md">
<div class="w-full max-w-lg">
<div class="auth-card">
<h1 class="auth-title">{% trans "Create Account" %}</h1>
@@ -24,10 +24,18 @@
onkeydown="if(event.key === 'Enter' || event.key === ' ') { this.click(); event.preventDefault(); }"
>
{% if provider.id == 'google' %}
<img src="{% static 'images/google-icon.svg' %}" alt="Google" class="w-5 h-5 mr-3">
<img
src="{% static 'images/google-icon.svg' %}"
alt="Google"
class="w-5 h-5 mr-3"
/>
<span>Continue with Google</span>
{% elif provider.id == 'discord' %}
<img src="{% static 'images/discord-icon.svg' %}" alt="Discord" class="w-5 h-5 mr-3">
<img
src="{% static 'images/discord-icon.svg' %}"
alt="Discord"
class="w-5 h-5 mr-3"
/>
<span>Continue with Discord</span>
{% endif %}
</a>
@@ -135,8 +143,7 @@
{% endif %}
</div>
{% turnstile_widget %}
{% turnstile_widget %}
{% if redirect_field_value %}
<input
type="hidden"

22
templates/accounts/turnstile_widget.html
View File

@@ -1,4 +1,22 @@
<script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script>
<script
src="https://challenges.cloudflare.com/turnstile/v0/api.js"
async
defer
></script>
<div class="turnstile">
<div class="cf-turnstile" data-sitekey="{{ site_key }}" data-theme="light"></div>
<div
id="turnstile-widget"
class="cf-turnstile"
data-sitekey="{{ site_key }}"
></div>
</div>
<script>
// Apply theme to the Turnstile widget based on the retrieved theme
document.addEventListener("DOMContentLoaded", function () {
const turnstileWidget = document.getElementById("turnstile-widget");
if (turnstileWidget) {
turnstileWidget.setAttribute("data-theme", theme);
}
});
</script>

133
templates/base/base.html
View File

@@ -1,11 +1,13 @@
{% load static %}
<!DOCTYPE html>
<html lang="en">
<!-- [Previous head content remains unchanged...] -->
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>{% block title %}ThrillWiki{% endblock %}</title>
<!-- [Previous head content remains unchanged...] -->
<!-- Google Fonts -->
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap"
@@ -14,7 +16,6 @@
<!-- Prevent flash of wrong theme -->
<script>
// Get theme from localStorage or system preference
let theme = localStorage.getItem("theme");
if (!theme) {
theme = window.matchMedia("(prefers-color-scheme: dark)").matches
@@ -22,7 +23,6 @@
: "light";
localStorage.setItem("theme", theme);
}
// Apply theme immediately before page loads
if (theme === "dark") {
document.documentElement.classList.add("dark");
}
@@ -41,86 +41,63 @@
/>
{% block extra_head %}{% endblock %}
<style>
/* Smooth theme transitions */
:root {
--theme-transition-duration: 200ms;
}
body {
transition: background-color var(--theme-transition-duration) ease-in-out,
color var(--theme-transition-duration) ease-in-out;
}
/* Ensure theme toggle button has consistent size */
#theme-toggle {
width: 40px;
height: 40px;
align-items: center;
justify-content: center;
}
</style>
</head>
<body
class="flex flex-col min-h-screen text-gray-900 bg-gradient-to-br from-white via-blue-50 to-indigo-50 dark:from-gray-950 dark:via-indigo-950 dark:to-purple-950 dark:text-white"
>
<body class="flex flex-col min-h-screen text-gray-900 bg-gradient-to-br from-white via-blue-50 to-indigo-50 dark:from-gray-950 dark:via-indigo-950 dark:to-purple-950 dark:text-white">
<!-- Header -->
<header
class="border-b shadow-lg bg-white/90 dark:bg-gray-800/90 backdrop-blur-lg border-gray-200/50 dark:border-gray-700/50"
>
<nav class="container px-6 py-4 mx-auto">
<header class="border-b shadow-lg bg-white/90 dark:bg-gray-800/90 backdrop-blur-lg border-gray-200/50 dark:border-gray-700/50">
<nav class="container mx-auto nav-container">
<div class="flex items-center justify-between">
<!-- Logo -->
<div class="flex items-center">
<a
href="{% url 'home' %}"
class="px-3 text-2xl font-bold text-transparent transition-transform bg-gradient-to-r from-primary to-secondary bg-clip-text hover:scale-105"
class="font-bold text-transparent transition-transform site-logo bg-gradient-to-r from-primary to-secondary bg-clip-text hover:scale-105"
>
ThrillWiki
</a>
</div>
<!-- Desktop Navigation -->
<div class="items-center hidden space-x-8 md:flex">
<a href="{% url 'parks:park_list' %}" class="nav-link group">
<!-- Navigation Links (Always Visible) -->
<div class="flex items-center space-x-2 sm:space-x-4">
<a href="{% url 'parks:park_list' %}" class="nav-link">
<i class="fas fa-map-marker-alt"></i>
<span>Parks</span>
</a>
<a href="{% url 'rides:ride_list' %}" class="nav-link group">
<a href="{% url 'rides:ride_list' %}" class="nav-link">
<i class="fas fa-rocket"></i>
<span>Rides</span>
</a>
</div>
<!-- Search Bar -->
<div class="flex-1 hidden max-w-md mx-8 md:flex">
<div class="flex-1 hidden max-w-md mx-8 lg:flex">
<form action="{% url 'search' %}" method="get" class="w-full">
<div class="relative">
<input
type="text"
name="q"
placeholder="Search parks and rides..."
class="w-full px-4 py-2 text-gray-900 transition-all border border-gray-200 rounded-full dark:border-gray-700 bg-white/70 dark:bg-gray-800/70 backdrop-blur-sm dark:text-white focus:ring-2 focus:ring-primary/50 focus:border-primary"
class="form-input"
/>
</div>
</form>
</div>
<!-- Right Side Menu -->
<div class="flex items-center space-x-6">
<div class="flex items-center space-x-2 sm:space-x-6">
<!-- Theme Toggle -->
<label for="theme-toggle" class="cursor-pointer">
<input type="checkbox" id="theme-toggle" class="hidden" />
<div
class="inline-flex items-center justify-center p-2 text-gray-500 transition-all bg-white border border-gray-200 rounded-lg theme-toggle-btn hover:bg-gray-50 dark:bg-gray-700 dark:text-gray-400 dark:border-gray-600 dark:hover:bg-gray-600"
class="inline-flex items-center justify-center p-2 text-gray-500 transition-colors hover:text-primary dark:text-gray-400 dark:hover:text-primary theme-toggle-btn"
role="button"
aria-label="Toggle dark mode"
>
<i class="text-lg fas"></i>
<i class="text-xl fas"></i>
</div>
</label>
<!-- [Rest of the content remains unchanged...] -->
<!-- User Menu -->
{% if user.is_authenticated %}
<div class="relative">
@@ -135,9 +112,7 @@
class="w-8 h-8 rounded-full ring-2 ring-primary/20"
/>
{% else %}
<div
class="flex items-center justify-center w-8 h-8 text-white rounded-full bg-gradient-to-br from-primary to-secondary"
>
<div class="flex items-center justify-center w-8 h-8 text-white rounded-full bg-gradient-to-br from-primary to-secondary">
{{ user.username.0|upper }}
</div>
{% endif %}
@@ -146,10 +121,7 @@
<!-- Dropdown Menu -->
<div id="userDropdown" class="dropdown-menu">
<div class="py-1">
<a
href="{% url 'user_profile' user.username %}"
class="menu-item"
>
<a href="{% url 'user_profile' user.username %}" class="menu-item">
<i class="w-5 fas fa-user"></i>
<span>Profile</span>
</a>
@@ -174,7 +146,8 @@
</div>
</div>
{% else %}
<div class="flex space-x-3">
<!-- Login/Register (Desktop) -->
<div class="hidden space-x-3 lg:flex">
<a href="{% url 'account_login' %}" class="btn-secondary">
<i class="mr-2 fas fa-sign-in-alt"></i>
Login
@@ -189,45 +162,51 @@
<!-- Mobile Menu Button -->
<button
id="mobileMenuBtn"
class="p-2 text-gray-500 rounded-lg md:hidden hover:bg-gray-100 dark:hover:bg-gray-700 dark:text-gray-400"
class="p-2 text-gray-500 rounded-lg lg:hidden hover:bg-gray-100 dark:hover:bg-gray-700 dark:text-gray-400"
aria-label="Toggle mobile menu"
>
<i class="fas fa-bars"></i>
<i class="text-2xl fas fa-bars"></i>
</button>
</div>
</div>
<!-- Mobile Menu -->
<div
id="mobileMenu"
class="hidden py-2 mt-4 md:hidden bg-white/90 dark:bg-gray-800/90 backdrop-blur-lg rounded-xl"
>
<a href="{% url 'parks:park_list' %}" class="mobile-nav-link">
<i class="w-5 fas fa-map-marker-alt"></i>
<span>Parks</span>
</a>
<a href="{% url 'rides:ride_list' %}" class="mobile-nav-link">
<i class="w-5 fas fa-rocket"></i>
<span>Rides</span>
</a>
<form action="{% url 'search' %}" method="get" class="px-4 py-2">
<input
type="text"
name="q"
placeholder="Search parks and rides..."
class="w-full px-4 py-2 text-gray-900 border border-gray-200 rounded-full dark:border-gray-700 bg-white/70 dark:bg-gray-800/70 backdrop-blur-sm dark:text-white"
/>
</form>
<div id="mobileMenu">
<div class="space-y-4">
<!-- Search (Mobile) -->
<form action="{% url 'search' %}" method="get" class="mb-4">
<input
type="text"
name="q"
placeholder="Search parks and rides..."
class="form-input"
/>
</form>
{% if not user.is_authenticated %}
<!-- Login/Register (Mobile) -->
<div class="flex items-center space-x-3">
<a href="{% url 'account_login' %}" class="flex-1 mobile-nav-link secondary">
<i class="fas fa-sign-in-alt"></i>
<span>Login</span>
</a>
<a href="{% url 'account_signup' %}" class="flex-1 mobile-nav-link primary">
<i class="fas fa-user-plus"></i>
<span>Register</span>
</a>
</div>
{% endif %}
</div>
</div>
</nav>
</header>
<!-- [Rest of the content remains unchanged...] -->
<!-- Flash Messages -->
{% if messages %}
<div class="container px-6 mx-auto mt-4">
{% for message in messages %}
<div
class="alert {% if message.tags %}alert-{{ message.tags }}{% endif %}"
>
<div class="alert {% if message.tags %}alert-{{ message.tags }}{% endif %}">
{{ message }}
</div>
{% endfor %}
@@ -240,9 +219,7 @@
</main>
<!-- Footer -->
<footer
class="mt-auto border-t bg-white/90 dark:bg-gray-800/90 backdrop-blur-lg border-gray-200/50 dark:border-gray-700/50"
>
<footer class="mt-auto border-t bg-white/90 dark:bg-gray-800/90 backdrop-blur-lg border-gray-200/50 dark:border-gray-700/50">
<div class="container px-6 py-6 mx-auto">
<div class="flex items-center justify-between">
<div class="text-gray-600 dark:text-gray-400">
@@ -252,13 +229,11 @@
<a
href="{% url 'terms' %}"
class="text-gray-600 transition-colors hover:text-primary dark:text-gray-400 dark:hover:text-primary"
>Terms</a
>
>Terms</a>
<a
href="{% url 'privacy' %}"
class="text-gray-600 transition-colors hover:text-primary dark:text-gray-400 dark:hover:text-primary"
>Privacy</a
>
>Privacy</a>
</div>
</div>
</div>

BIN
thrillwiki/__pycache__/settings.cpython-312.pyc
View File

Binary file not shown.

2
thrillwiki/settings.py
View File

@@ -12,7 +12,7 @@ SECRET_KEY = 'django-insecure-=0)^0#h#k$0@$8$ys=^$0#h#k$0@$8$ys=^'
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True
ALLOWED_HOSTS = ['localhost', '127.0.0.1']
ALLOWED_HOSTS = ['localhost', '127.0.0.1', 'thrillwiki.com']
# Application definition
INSTALLED_APPS = [