Updated the docs
This commit is contained in:
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
Binary file not shown.
+23
-10
@@ -1,18 +1,24 @@
|
||||
// src/pages/Documents.tsx
|
||||
|
||||
import React from 'react';
|
||||
import { Map, Droplets, ShieldAlert, Download, ExternalLink, Folder } from 'lucide-react';
|
||||
import { Map, WavesLadder, BookCopy, Download, ExternalLink, Folder, MapPinned, MapPlus } from 'lucide-react';
|
||||
|
||||
export const Documents: React.FC = () => {
|
||||
const docs = [
|
||||
{ title: 'Turistkarta Kullaberg', icon: <Map size={24} />, file: '/Turistkarta - Kullaberg.pdf' },
|
||||
{ title: 'Badplatser att besöka', icon: <Droplets size={24} />, file: '/Badplatser att besöka.pdf' },
|
||||
{ title: 'Checklista Nödsituationer', icon: <ShieldAlert size={24} />, file: '/2025 Checklista vid nödsituationer Kullabergs naturreservat.docx' }
|
||||
{ title: 'Turistkarta', icon: <Map size={24} />, file: '/files/Turistkarta - Kullaberg.pdf', size: '2.51 MB' },
|
||||
{ title: 'Orienteringskarta', icon: <MapPlus size={24} />, file: '/files/Orienteringskarta - Kullaberg.pdf', size: '7.23 MB' },
|
||||
{ title: 'Badplatser att besöka', icon: <WavesLadder size={24} />, file: '/files/Badplatser på Kullaberg.pdf', size: '7.07 MB' },
|
||||
{ title: 'Vandringsrutter', icon: <MapPinned size={24} />, file: '/files/Vandringsrutter.pdf', size: '4.42 MB' },
|
||||
{ title: 'Underlag för guidediplomering', icon: <BookCopy size={24} />, file: '/files/Underlag för guidediplomering.pptx', size: '3.83 MB' },
|
||||
{ title: 'Destinationskunskap Kullahalvön', icon: <BookCopy size={24} />, file: '/files/Destinationskunskap 2026.pptx', size: '24.2 MB' }
|
||||
];
|
||||
|
||||
const links = [
|
||||
{ title: 'Kullabergs Naturreservat', url: 'https://www.kullabergsnatur.se/' },
|
||||
{ title: 'Väderprognos Mölle', url: 'https://www.smhi.se' }
|
||||
{ title: 'Vandra på Kullahalvön', url: 'https://www.kullahalvon.com/upptacka--uppleva/friluftsliv--natur/vandra-pa-kullahalvon.html' },
|
||||
{ title: 'Naturkartan', url: 'https://www.naturkartan.se/en/explore' },
|
||||
{ title: 'Skåneleden', url: 'https://www.skaneleden.se/en' },
|
||||
{ title: 'Väderprognos Mölle', url: 'https://www.smhi.se/vader/prognoser-och-varningar/vaderprognos/q/H%C3%B6gan%C3%A4s/M%C3%B6lle/2691501' }
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -33,10 +39,17 @@ export const Documents: React.FC = () => {
|
||||
className="group flex items-center justify-between bg-white/60 backdrop-blur-sm p-5 rounded-2xl border border-white hover:-translate-y-1 hover:shadow-xl hover:shadow-moss/10 transition-all duration-300"
|
||||
>
|
||||
<div className="flex items-center text-slate-teal">
|
||||
<div className="bg-linear-to-br from-seafoam to-slate-teal p-3 rounded-xl mr-4 text-eggshell shadow-inner">{doc.icon}</div>
|
||||
<span className="font-bold text-sm">{doc.title}</span>
|
||||
<div className="bg-linear-to-br from-seafoam to-slate-teal p-3 rounded-xl mr-4 text-eggshell shadow-inner shrink-0">
|
||||
{doc.icon}
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<span className="font-bold text-sm leading-tight">{doc.title}</span>
|
||||
<span className="text-[10px] font-bold text-moss bg-moss/10 px-2 py-0.5 rounded-md w-fit mt-1.5 uppercase tracking-wider border border-moss/10">
|
||||
{doc.size}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<Download size={20} className="text-moss group-hover:text-slate-teal transition-colors" />
|
||||
<Download size={20} className="text-moss group-hover:text-slate-teal transition-colors shrink-0 ml-2" />
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
@@ -49,8 +62,8 @@ export const Documents: React.FC = () => {
|
||||
<a key={idx} href={link.url} target="_blank" rel="noopener noreferrer"
|
||||
className="group flex items-center justify-between bg-white/60 backdrop-blur-sm p-5 rounded-2xl border border-white hover:-translate-y-1 hover:shadow-xl hover:shadow-moss/10 transition-all duration-300"
|
||||
>
|
||||
<span className="font-bold text-slate-teal text-sm">{link.title}</span>
|
||||
<div className="bg-eggshell rounded-full p-2 group-hover:bg-seafoam group-hover:text-eggshell transition-colors">
|
||||
<span className="font-bold text-slate-teal text-sm leading-tight pr-4">{link.title}</span>
|
||||
<div className="bg-eggshell rounded-full p-2 group-hover:bg-seafoam group-hover:text-eggshell transition-colors shrink-0">
|
||||
<ExternalLink size={16} className="text-slate-teal group-hover:text-eggshell" />
|
||||
</div>
|
||||
</a>
|
||||
|
||||
Reference in New Issue
Block a user