You've already forked framexEngine-pro
Firts up
This commit is contained in:
2
public/css/responsive.css
Normal file
2
public/css/responsive.css
Normal file
@@ -0,0 +1,2 @@
|
||||
/* Tailwind responsive utilities are included automatically via the main styles.
|
||||
Add any extra responsive overrides here if needed. */
|
||||
2
public/css/src/responsive.css
Normal file
2
public/css/src/responsive.css
Normal file
@@ -0,0 +1,2 @@
|
||||
/* Tailwind responsive utilities are included automatically via the main styles.
|
||||
Add any extra responsive overrides here if needed. */
|
||||
449
public/css/src/style.css
Normal file
449
public/css/src/style.css
Normal file
@@ -0,0 +1,449 @@
|
||||
@import url("https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&display=swap");
|
||||
@import "tailwindcss";
|
||||
|
||||
@custom-variant dark (&:where(.dark, .dark *));
|
||||
|
||||
@source "../../../templates/**/*.php";
|
||||
@source "../../../app/**/*.php";
|
||||
@source "../../../app/**/*.md";
|
||||
|
||||
@theme {
|
||||
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
|
||||
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
}
|
||||
|
||||
@layer base {
|
||||
html {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
html.dark {
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
body {
|
||||
@apply flex min-h-screen flex-col bg-slate-50 text-slate-950 antialiased transition-colors duration-300 dark:bg-slate-950 dark:text-slate-100;
|
||||
font-feature-settings:
|
||||
"cv02",
|
||||
"cv03",
|
||||
"cv04",
|
||||
"cv11";
|
||||
}
|
||||
|
||||
::selection {
|
||||
@apply bg-blue-600 text-white;
|
||||
}
|
||||
|
||||
a {
|
||||
@apply transition-colors;
|
||||
}
|
||||
|
||||
:focus-visible {
|
||||
@apply outline-2 outline-offset-2 outline-blue-500;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
@apply grow shrink-0 basis-auto;
|
||||
}
|
||||
|
||||
.contain, .band {
|
||||
@apply mx-auto w-full max-w-6xl px-4 sm:px-6 lg:px-8;
|
||||
}
|
||||
|
||||
.contain-narrow, .band-narrow {
|
||||
@apply mx-auto w-full max-w-3xl px-4 sm:px-6 lg:px-8;
|
||||
}
|
||||
|
||||
.contain-wide, .band-wide {
|
||||
@apply mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8;
|
||||
}
|
||||
}
|
||||
|
||||
@layer components {
|
||||
footer {
|
||||
@apply grow-0;
|
||||
}
|
||||
|
||||
.wrp {
|
||||
@apply mx-auto w-full max-w-6xl px-4 sm:px-6 lg:px-8;
|
||||
}
|
||||
|
||||
.section, section {
|
||||
@apply py-10 md:py-16;
|
||||
}
|
||||
|
||||
.section-tight {
|
||||
@apply py-10 md:py-14;
|
||||
}
|
||||
|
||||
.text-gradient {@apply bg-linear-to-r from-indigo-400 to-pink-600 bg-clip-text text-transparent}
|
||||
|
||||
.eyebrow {
|
||||
@apply font-semibold tracking-widest text-blue-600 dark:text-blue-400;
|
||||
}
|
||||
|
||||
.btn {
|
||||
@apply inline-flex min-h-11 items-center justify-center gap-2 rounded-lg px-5 py-2.5 text-sm font-semibold leading-none transition duration-200 focus-visible:outline-2 focus-visible:outline-offset-2 disabled:pointer-events-none disabled:opacity-50;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@apply bg-blue-600 text-white shadow-sm shadow-blue-600/25 hover:bg-blue-500 focus-visible:outline-blue-500 dark:bg-blue-500 dark:hover:bg-blue-400;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@apply border border-slate-200 bg-white text-slate-900 hover:border-slate-300 hover:bg-slate-100 focus-visible:outline-blue-500 dark:border-slate-800 dark:bg-slate-900 dark:text-slate-100 dark:hover:border-slate-700 dark:hover:bg-slate-800;
|
||||
}
|
||||
|
||||
.btn-ghost {
|
||||
@apply text-slate-700 hover:bg-slate-100 hover:text-slate-950 focus-visible:outline-blue-500 dark:text-slate-300 dark:hover:bg-slate-900 dark:hover:text-white;
|
||||
}
|
||||
|
||||
.card {
|
||||
@apply rounded-lg border border-slate-200 bg-white p-6 shadow-sm shadow-slate-950/5 transition-colors dark:border-slate-800 dark:bg-slate-900/80 dark:shadow-black/20;
|
||||
}
|
||||
|
||||
.bg-pre-blue {
|
||||
@apply bg-blue-50 text-blue-950 dark:bg-blue-950/35 dark:text-blue-50;
|
||||
}
|
||||
|
||||
.bg-pre-emerald {
|
||||
@apply bg-emerald-50 text-emerald-950 dark:bg-emerald-950/35 dark:text-emerald-50;
|
||||
}
|
||||
|
||||
.bg-pre-amber {
|
||||
@apply bg-amber-50 text-amber-950 dark:bg-amber-950/35 dark:text-amber-50;
|
||||
}
|
||||
|
||||
.bg-pre-rose {
|
||||
@apply bg-rose-50 text-rose-950 dark:bg-rose-950/35 dark:text-rose-50;
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
@apply rounded-md px-3 py-2 text-sm font-medium text-slate-700 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-300 dark:hover:bg-slate-900 dark:hover:text-white;
|
||||
}
|
||||
|
||||
.prose-shell {
|
||||
@apply mx-auto max-w-4xl px-4 py-16 sm:px-6 lg:px-8;
|
||||
}
|
||||
|
||||
.prose {
|
||||
color: #475569;
|
||||
line-height: 1.75;
|
||||
}
|
||||
|
||||
.dark .prose {
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
.prose > * + * {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
|
||||
.prose h1,
|
||||
.prose h2,
|
||||
.prose h3,
|
||||
.prose h4,
|
||||
.prose h5,
|
||||
.prose h6 {
|
||||
color: #0f172a;
|
||||
font-weight: 700;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.dark .prose h1,
|
||||
.dark .prose h2,
|
||||
.dark .prose h3,
|
||||
.dark .prose h4,
|
||||
.dark .prose h5,
|
||||
.dark .prose h6 {
|
||||
color: #f8fafc;
|
||||
}
|
||||
|
||||
.prose h1 {
|
||||
font-size: 2.25rem;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.prose h2 {
|
||||
font-size: 1.75rem;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 0.75em;
|
||||
padding-bottom: 0.4em;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
.dark .prose h2 {
|
||||
border-bottom-color: rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.prose h3 {
|
||||
font-size: 1.375rem;
|
||||
margin-top: 1.75em;
|
||||
margin-bottom: 0.6em;
|
||||
}
|
||||
|
||||
.prose h4 {
|
||||
font-size: 1.125rem;
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.prose h5,
|
||||
.prose h6 {
|
||||
font-size: 1rem;
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 0.5em;
|
||||
color: #334155;
|
||||
}
|
||||
|
||||
.dark .prose h5,
|
||||
.dark .prose h6 {
|
||||
color: #cbd5e1;
|
||||
}
|
||||
|
||||
.prose p {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
.prose a {
|
||||
color: #2563eb;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
transition: color 0.15s ease;
|
||||
}
|
||||
|
||||
.dark .prose a {
|
||||
color: #60a5fa;
|
||||
}
|
||||
|
||||
.prose a:hover {
|
||||
color: #1d4ed8;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.dark .prose a:hover {
|
||||
color: #93c5fd;
|
||||
}
|
||||
|
||||
.prose strong,
|
||||
.prose b {
|
||||
color: #0f172a;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.dark .prose strong,
|
||||
.dark .prose b {
|
||||
color: #f1f5f9;
|
||||
}
|
||||
|
||||
.prose em,
|
||||
.prose i {
|
||||
color: #334155;
|
||||
}
|
||||
|
||||
.dark .prose em,
|
||||
.dark .prose i {
|
||||
color: #cbd5e1;
|
||||
}
|
||||
|
||||
.prose ul,
|
||||
.prose ol {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
padding-left: 1.625em;
|
||||
}
|
||||
|
||||
.prose ul {
|
||||
list-style-type: disc;
|
||||
}
|
||||
|
||||
.prose ol {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
|
||||
.prose ul > li,
|
||||
.prose ol > li {
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
padding-left: 0.375em;
|
||||
}
|
||||
|
||||
.prose ul > li::marker,
|
||||
.prose ol > li::marker {
|
||||
color: #2563eb;
|
||||
}
|
||||
|
||||
.dark .prose ul > li::marker,
|
||||
.dark .prose ol > li::marker {
|
||||
color: #3b82f6;
|
||||
}
|
||||
|
||||
.prose ul ul,
|
||||
.prose ul ol,
|
||||
.prose ol ul,
|
||||
.prose ol ol {
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.prose pre {
|
||||
background-color: #f1f5f9;
|
||||
border: 1px solid rgba(0, 0, 0, 0.08);
|
||||
border-radius: 0.5rem;
|
||||
padding: 1.25em;
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 1.5em;
|
||||
overflow-x: auto;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.dark .prose pre {
|
||||
background-color: #141f38;
|
||||
border-color: rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.prose pre code {
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
font-size: inherit;
|
||||
color: #334155;
|
||||
font-family:
|
||||
ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
||||
"Courier New", monospace;
|
||||
}
|
||||
|
||||
.dark .prose pre code {
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
.prose code {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
border: 1px solid rgba(0, 0, 0, 0.06);
|
||||
border-radius: 0.375rem;
|
||||
padding: 0.2em 0.4em;
|
||||
font-size: 0.875em;
|
||||
color: #1d4ed8;
|
||||
font-family:
|
||||
ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
||||
"Courier New", monospace;
|
||||
}
|
||||
|
||||
.dark .prose code {
|
||||
background-color: rgba(255, 255, 255, 0.06);
|
||||
border-color: rgba(255, 255, 255, 0.06);
|
||||
color: #93c5fd;
|
||||
}
|
||||
|
||||
.prose blockquote {
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 1.5em;
|
||||
padding-left: 1.25em;
|
||||
border-left: 3px solid #2563eb;
|
||||
font-style: italic;
|
||||
color: #475569;
|
||||
}
|
||||
|
||||
.dark .prose blockquote {
|
||||
border-left-color: #3b82f6;
|
||||
color: #cbd5e1;
|
||||
}
|
||||
|
||||
.prose blockquote p:first-of-type {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.prose blockquote p:last-of-type {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.prose table {
|
||||
width: 100%;
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 1.5em;
|
||||
border-collapse: collapse;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.prose thead {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.dark .prose thead {
|
||||
border-bottom-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.prose th {
|
||||
padding: 0.75em 1em;
|
||||
text-align: left;
|
||||
font-weight: 600;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
.dark .prose th {
|
||||
color: #f1f5f9;
|
||||
}
|
||||
|
||||
.prose td {
|
||||
padding: 0.625em 1em;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.dark .prose td {
|
||||
border-bottom-color: rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
.prose tbody tr:nth-child(even) {
|
||||
background-color: rgba(0, 0, 0, 0.02);
|
||||
}
|
||||
|
||||
.dark .prose tbody tr:nth-child(even) {
|
||||
background-color: rgba(255, 255, 255, 0.02);
|
||||
}
|
||||
|
||||
.prose tbody tr:hover {
|
||||
background-color: rgba(0, 0, 0, 0.03);
|
||||
}
|
||||
|
||||
.dark .prose tbody tr:hover {
|
||||
background-color: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
.prose img {
|
||||
border-radius: 0.5rem;
|
||||
margin-top: 1.5em;
|
||||
margin-bottom: 1.5em;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
display: block;
|
||||
box-shadow:
|
||||
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
||||
0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.prose hr {
|
||||
margin-top: 2.5em;
|
||||
margin-bottom: 2.5em;
|
||||
border: 0;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.dark .prose hr {
|
||||
border-top-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.prose li > p,
|
||||
.prose blockquote > p {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
|
||||
}
|
||||
2
public/css/src/vendors.css
Normal file
2
public/css/src/vendors.css
Normal file
@@ -0,0 +1,2 @@
|
||||
/* Vendor styles — add third-party CSS here or @import them.
|
||||
Tailwind is NOT imported here by default. */
|
||||
2787
public/css/style.css
Normal file
2787
public/css/style.css
Normal file
File diff suppressed because it is too large
Load Diff
2
public/css/vendors.css
Normal file
2
public/css/vendors.css
Normal file
@@ -0,0 +1,2 @@
|
||||
/* Vendor styles — add third-party CSS here or @import them.
|
||||
Tailwind is NOT imported here by default. */
|
||||
Reference in New Issue
Block a user