naturvardarna/app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Updated the docs

Browse Source
This commit is contained in:
WilliamSoderberg
2026-03-15 23:36:33 +01:00 Verified
parent 3d3ab6b268
commit 1ad7361fa2
7 changed files with 37448 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/Documents.tsx
+23 -10
View File
@@ -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>