blboun3/personal-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

Added 3XL

Browse Source 
Added tailwind selector 3XL (width: 1900px )
Modified Layouts and Navigation to be wider for 2xl
This commit is contained in:
Cyril Šebek
2024-07-06 15:52:20 +02:00
parent 992c5fa86e
commit cdfc43024b
4 changed files with 6 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/NavbarSkeleton.astro
View File

@@ -4,7 +4,7 @@
class="sm:grid sm:grid-cols-6 lg:grid-cols-12" class="sm:grid sm:grid-cols-6 lg:grid-cols-12"
> >
<div <div
class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 2xl:col-start-4 2xl:col-end-10 " class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 3xl:col-start-4 3xl:col-end-10 "
> >
<div <div
class="container mx-auto px-6 py-2 flex items-center justify-between" class="container mx-auto px-6 py-2 flex items-center justify-between"

2
src/layouts/SinglePage.astro
View File

@@ -1,7 +1,7 @@
<div class="snap-start h-screen overflow-clip pt-14"> <div class="snap-start h-screen overflow-clip pt-14">
<div class="bg-bkg h-full w-full sm:grid sm:grid-cols-6 lg:grid-cols-12"> <div class="bg-bkg h-full w-full sm:grid sm:grid-cols-6 lg:grid-cols-12">
<div <div
class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 xl:col-start-3 xl:col-end-11 2xl:col-start-4 2xl:col-end-10 h-full p-2 sm:p-6" class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 xl:col-start-3 xl:col-end-11 3xl:col-start-4 3xl:col-end-10 h-full p-2 sm:p-6"
> >
<slot /> <slot />
</div> </div>

2
src/layouts/SinglePageBlogMode.astro
View File

@@ -1,7 +1,7 @@
<div class="h-screen pt-14"> <div class="h-screen pt-14">
<div class="bg-bkg h-full w-full sm:grid sm:grid-cols-6 lg:grid-cols-12"> <div class="bg-bkg h-full w-full sm:grid sm:grid-cols-6 lg:grid-cols-12">
<div <div
class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 xl:col-start-3 xl:col-end-11 2xl:col-start-4 2xl:col-end-10 h-full p-2 sm:p-6" class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 xl:col-start-3 xl:col-end-11 3xl:col-start-4 3xl:col-end-10 h-full p-2 sm:p-6"
> >
<slot /> <slot />
</div> </div>

3
tailwind.config.mjs
View File

@@ -27,6 +27,9 @@ module.exports = {
}, },
}, },
extend: { extend: {
screens: {
"3xl": "1900px"
},
colors: { colors: {
bkg: withOpacity('--color-bkg'), bkg: withOpacity('--color-bkg'),
bkgNavbar: withOpacity('--color-bkgNavbar'), bkgNavbar: withOpacity('--color-bkgNavbar'),