✨feature: Mock up front end interface
This commit is contained in:
Keith Solomon
@@ -12,10 +12,10 @@
|
|||||||
* @link https://github.com/your-repo/AI_Fantasy_NFL
|
* @link https://github.com/your-repo/AI_Fantasy_NFL
|
||||||
*/
|
*/
|
||||||
|
|
||||||
return [
|
return array(
|
||||||
'host' => 'localhost',
|
'host' => 'localhost',
|
||||||
'port' => 3306,
|
'port' => 3306,
|
||||||
'database' => 'ff-ai',
|
'database' => 'ff-ai',
|
||||||
'user' => 'ff-ai',
|
'user' => 'ff-ai',
|
||||||
'password' => 'lkvQm69$3!xZ',
|
'password' => 'lkvQm69$3!xZ',
|
||||||
];
|
);
|
||||||
|
|||||||
16
public/app.php
Normal file
16
public/app.php
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* Entry point for frontend PHP
|
||||||
|
* This file can be used to bootstrap the PHP frontend logic
|
||||||
|
*
|
||||||
|
* PHP version: PHP 8.3+
|
||||||
|
*
|
||||||
|
* @category Frontend
|
||||||
|
* @package AI_Fantasy_NFL
|
||||||
|
* @author Keith Solomon <keith@keithsolomon.net>
|
||||||
|
* @license https://opensource.org/licenses/MIT MIT License
|
||||||
|
* @version GIT: $Id$
|
||||||
|
* @link https://github.com/your-repo/AI_Fantasy_NFL
|
||||||
|
*/
|
||||||
|
|
||||||
|
echo '<!-- AI Fantasy NFL PHP frontend loaded -->';
|
||||||
@@ -1,12 +1,25 @@
|
|||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html>
|
<html lang="en" class="dark">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<link href="./output.css" rel="stylesheet">
|
<link href="./output.css" rel="stylesheet">
|
||||||
<title>AI Fantasy NFL</title>
|
<title>AI Fantasy NFL</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
|
||||||
<h1 class="text-3xl font-bold underline">Hello world!</h1>
|
<body class="bg-gray-900 text-gray-100 min-h-screen">
|
||||||
|
<div class="flex flex-col min-h-screen">
|
||||||
|
<header class="p-4 border-b border-gray-800 text-center text-2xl font-bold">AI Fantasy NFL</header>
|
||||||
|
|
||||||
|
<main class="flex flex-1">
|
||||||
|
<aside class="hidden md:block w-1/5 p-4 border-r border-gray-800 bg-gray-950">Left Column</aside>
|
||||||
|
<section class="w-full md:w-3/5 p-4">Main Content</section>
|
||||||
|
<aside class="hidden md:block w-1/5 p-4 border-l border-gray-800 bg-gray-950">Right Column</aside>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer class="p-4 border-t border-gray-800 text-center text-sm text-gray-400">© 2025 AI Fantasy NFL</footer>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../src/app.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -7,6 +7,16 @@
|
|||||||
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||||
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
||||||
"Courier New", monospace;
|
"Courier New", monospace;
|
||||||
|
--color-gray-100: oklch(96.7% 0.003 264.542);
|
||||||
|
--color-gray-400: oklch(70.7% 0.022 261.325);
|
||||||
|
--color-gray-800: oklch(27.8% 0.033 256.848);
|
||||||
|
--color-gray-900: oklch(21% 0.034 264.665);
|
||||||
|
--color-gray-950: oklch(13% 0.028 261.692);
|
||||||
|
--spacing: 0.25rem;
|
||||||
|
--text-sm: 0.875rem;
|
||||||
|
--text-sm--line-height: calc(1.25 / 0.875);
|
||||||
|
--text-2xl: 1.5rem;
|
||||||
|
--text-2xl--line-height: calc(2 / 1.5);
|
||||||
--text-3xl: 1.875rem;
|
--text-3xl: 1.875rem;
|
||||||
--text-3xl--line-height: calc(2.25 / 1.875);
|
--text-3xl--line-height: calc(2.25 / 1.875);
|
||||||
--font-weight-bold: 700;
|
--font-weight-bold: 700;
|
||||||
@@ -163,17 +173,91 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
@layer utilities {
|
@layer utilities {
|
||||||
.text-3xl {
|
.flex {
|
||||||
font-size: var(--text-3xl);
|
display: flex;
|
||||||
line-height: var(--tw-leading, var(--text-3xl--line-height));
|
}
|
||||||
|
.hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.min-h-screen {
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
.w-1\/5 {
|
||||||
|
width: calc(1/5 * 100%);
|
||||||
|
}
|
||||||
|
.w-full {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.flex-1 {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.flex-col {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.border-t {
|
||||||
|
border-top-style: var(--tw-border-style);
|
||||||
|
border-top-width: 1px;
|
||||||
|
}
|
||||||
|
.border-r {
|
||||||
|
border-right-style: var(--tw-border-style);
|
||||||
|
border-right-width: 1px;
|
||||||
|
}
|
||||||
|
.border-b {
|
||||||
|
border-bottom-style: var(--tw-border-style);
|
||||||
|
border-bottom-width: 1px;
|
||||||
|
}
|
||||||
|
.border-l {
|
||||||
|
border-left-style: var(--tw-border-style);
|
||||||
|
border-left-width: 1px;
|
||||||
|
}
|
||||||
|
.border-gray-800 {
|
||||||
|
border-color: var(--color-gray-800);
|
||||||
|
}
|
||||||
|
.bg-gray-900 {
|
||||||
|
background-color: var(--color-gray-900);
|
||||||
|
}
|
||||||
|
.bg-gray-950 {
|
||||||
|
background-color: var(--color-gray-950);
|
||||||
|
}
|
||||||
|
.p-4 {
|
||||||
|
padding: calc(var(--spacing) * 4);
|
||||||
|
}
|
||||||
|
.text-center {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.text-2xl {
|
||||||
|
font-size: var(--text-2xl);
|
||||||
|
line-height: var(--tw-leading, var(--text-2xl--line-height));
|
||||||
|
}
|
||||||
|
.text-sm {
|
||||||
|
font-size: var(--text-sm);
|
||||||
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
||||||
}
|
}
|
||||||
.font-bold {
|
.font-bold {
|
||||||
--tw-font-weight: var(--font-weight-bold);
|
--tw-font-weight: var(--font-weight-bold);
|
||||||
font-weight: var(--font-weight-bold);
|
font-weight: var(--font-weight-bold);
|
||||||
}
|
}
|
||||||
.underline {
|
.text-gray-100 {
|
||||||
text-decoration-line: underline;
|
color: var(--color-gray-100);
|
||||||
}
|
}
|
||||||
|
.text-gray-400 {
|
||||||
|
color: var(--color-gray-400);
|
||||||
|
}
|
||||||
|
.md\:block {
|
||||||
|
@media (width >= 48rem) {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.md\:w-3\/5 {
|
||||||
|
@media (width >= 48rem) {
|
||||||
|
width: calc(3/5 * 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@property --tw-border-style {
|
||||||
|
syntax: "*";
|
||||||
|
inherits: false;
|
||||||
|
initial-value: solid;
|
||||||
}
|
}
|
||||||
@property --tw-font-weight {
|
@property --tw-font-weight {
|
||||||
syntax: "*";
|
syntax: "*";
|
||||||
@@ -182,6 +266,7 @@
|
|||||||
@layer properties {
|
@layer properties {
|
||||||
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
||||||
*, ::before, ::after, ::backdrop {
|
*, ::before, ::after, ::backdrop {
|
||||||
|
--tw-border-style: solid;
|
||||||
--tw-font-weight: initial;
|
--tw-font-weight: initial;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
6
src/ai-env.md
Normal file
6
src/ai-env.md
Normal file
@@ -0,0 +1,6 @@
|
|||||||
|
# AI Environment Setup
|
||||||
|
|
||||||
|
- Prepare for integration with Ollama or other AI services via API
|
||||||
|
- Document endpoints and authentication for AI services
|
||||||
|
- Add instructions for local Ollama setup and API usage
|
||||||
|
- Note: Actual integration will be implemented in the backend and feature stages
|
||||||
2
src/app.js
Normal file
2
src/app.js
Normal file
@@ -0,0 +1,2 @@
|
|||||||
|
// Entry point for frontend JavaScript
|
||||||
|
console.log('AI Fantasy NFL frontend loaded');
|
||||||
Reference in New Issue
Block a user