oier/pole-book
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

basic styles

Browse Source
This commit is contained in:
Oier Bravo
2025-06-22 01:16:31 +02:00
parent 3eddcc5f6a
commit b49ddf4b7c
2 changed files with 147 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
client/src/components/Navigation.astro
View File

@@ -20,15 +20,6 @@
<a href="/elements" class="text-gray-600 hover:text-gray-900 transition-colors font-medium">
Elements
</a>
<a href="/techniques" class="text-gray-600 hover:text-gray-900 transition-colors font-medium">
Techniques
</a>
<a href="/training" class="text-gray-600 hover:text-gray-900 transition-colors font-medium">
Training
</a>
<a href="/about" class="text-gray-600 hover:text-gray-900 transition-colors font-medium">
About
</a>
</div>
<!-- Mobile menu button -->
@@ -50,15 +41,6 @@
<a href="/elements" class="block px-3 py-2 text-gray-600 hover:text-gray-900 hover:bg-gray-50 rounded-md font-medium">
Elements
</a>
<a href="/techniques" class="block px-3 py-2 text-gray-600 hover:text-gray-900 hover:bg-gray-50 rounded-md font-medium">
Techniques
</a>
<a href="/training" class="block px-3 py-2 text-gray-600 hover:text-gray-900 hover:bg-gray-50 rounded-md font-medium">
Training
</a>
<a href="/about" class="block px-3 py-2 text-gray-600 hover:text-gray-900 hover:bg-gray-50 rounded-md font-medium">
About
</a>
</div>
</div>
</div>

148
client/src/styles/global.css
View File

@@ -1 +1,147 @@
@import "tailwindcss";
@import "tailwindcss";
/* Typography Styles */
@layer base {
/* Headings */
h1 {
@apply text-4xl font-bold text-gray-900 mb-6 mt-8;
line-height: 1.2;
}
h2 {
@apply text-3xl font-semibold text-gray-800 mb-5 mt-7;
line-height: 1.3;
}
h3 {
@apply text-2xl font-semibold text-gray-800 mb-4 mt-6;
line-height: 1.4;
}
h4 {
@apply text-xl font-medium text-gray-700 mb-3 mt-5;
line-height: 1.4;
}
h5 {
@apply text-lg font-medium text-gray-700 mb-2 mt-4;
line-height: 1.5;
}
h6 {
@apply text-base font-medium text-gray-600 mb-2 mt-4;
line-height: 1.5;
}
/* Lists */
ul {
@apply list-disc list-inside mb-4 space-y-1;
}
ol {
@apply list-decimal list-inside mb-4 space-y-1;
}
li {
@apply text-gray-700 leading-relaxed;
}
/* Nested lists */
ul ul, ol ol, ul ol, ol ul {
@apply mt-2 ml-6;
}
ul ul {
@apply list-[circle];
}
ul ul ul {
@apply list-[square];
}
/* Blockquotes */
blockquote {
@apply border-l-4 border-blue-500 bg-blue-50 pl-6 py-4 my-6 italic text-gray-700;
position: relative;
}
blockquote::before {
content: '"';
@apply text-4xl text-blue-400 font-serif absolute -left-2 top-2;
}
blockquote p {
@apply mb-0;
}
blockquote cite {
@apply block text-sm text-gray-500 mt-2 not-italic;
}
/* Inline quotes */
q {
@apply text-gray-600;
}
q::before {
content: '"';
}
q::after {
content: '"';
}
/* Paragraphs */
p {
@apply text-gray-700 leading-relaxed mb-4;
}
/* Links */
a {
@apply text-blue-600 hover:text-blue-800 underline transition-colors duration-200;
}
/* Code blocks */
pre {
@apply bg-gray-100 p-4 rounded-lg overflow-x-auto mb-4;
}
code {
@apply bg-gray-100 px-1 py-0.5 rounded text-sm font-mono;
}
pre code {
@apply bg-transparent p-0;
}
/* Tables */
table {
@apply w-full border-collapse border border-gray-300 mb-4;
}
th, td {
@apply border border-gray-300 px-4 py-2 text-left;
}
th {
@apply bg-gray-100 font-semibold;
}
/* Horizontal rule */
hr {
@apply border-t border-gray-300 my-8;
}
/* Definition lists */
dl {
@apply mb-4;
}
dt {
@apply font-semibold text-gray-800 mb-1;
}
dd {
@apply text-gray-700 mb-3 ml-4;
}
}