about/internal.html at master · todd-lers/about · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
---
layout: default
title: Internal Portal
---

<!--
    Internal Portal Hub (Dashboard)
    Location: Root directory
-->

<div class="max-w-6xl mx-auto px-4 py-12">

    <!-- Header -->
    <div class="text-center mb-16">
        <h1 class="text-5xl font-extrabold text-brand-dark mb-6">Internal Portal</h1>
        <p class="text-xl text-slate-500 max-w-3xl mx-auto leading-relaxed">
            The central hub for The Todd Group members. Access protocols, safety guidelines, administrative codes, and research philosophy here.
        </p>
    </div>

    <!-- Navigation Grid -->
    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">

        <!-- 1. Getting Started -->
        <a href="./internal/getting-started.html" class="group bg-white p-8 rounded-xl shadow-sm border border-slate-200 hover:shadow-xl hover:border-brand-primary transition-all duration-300 flex flex-col h-full no-underline">
            <div class="w-12 h-12 bg-brand-light rounded-lg flex items-center justify-center text-brand-primary mb-6 group-hover:bg-brand-primary group-hover:text-white transition-colors">
                <i class="fas fa-rocket text-2xl"></i>
            </div>
            <h3 class="text-2xl font-bold text-brand-dark mb-3 group-hover:text-brand-primary transition-colors">Getting Started</h3>
            <p class="text-slate-500 leading-relaxed flex-grow">
                Essential checklist for new members. Accounts, safety training, and first-week priorities.
            </p>
            <div class="mt-6 text-sm font-bold text-brand-primary uppercase tracking-wider group-hover:underline">View Checklist &rarr;</div>
        </a>

        <!-- 2. Mentoring & Philosophy -->
        <a href="./internal/mentoring.html" class="group bg-white p-8 rounded-xl shadow-sm border border-slate-200 hover:shadow-xl hover:border-brand-primary transition-all duration-300 flex flex-col h-full no-underline">
            <div class="w-12 h-12 bg-brand-light rounded-lg flex items-center justify-center text-brand-primary mb-6 group-hover:bg-brand-primary group-hover:text-white transition-colors">
                <i class="fas fa-user-graduate text-2xl"></i>
            </div>
            <h3 class="text-2xl font-bold text-brand-dark mb-3 group-hover:text-brand-primary transition-colors">Mentoring & Philosophy</h3>
            <p class="text-slate-500 leading-relaxed flex-grow">
                How we work, meeting structures, writing advice, and research philosophy.
            </p>
            <div class="mt-6 text-sm font-bold text-brand-primary uppercase tracking-wider group-hover:underline">Read Philosophy &rarr;</div>
        </a>

        <!-- 3. Experimental & Write-up -->
        <a href="./internal/experimental.html" class="group bg-white p-8 rounded-xl shadow-sm border border-slate-200 hover:shadow-xl hover:border-brand-primary transition-all duration-300 flex flex-col h-full no-underline">
            <div class="w-12 h-12 bg-brand-light rounded-lg flex items-center justify-center text-brand-primary mb-6 group-hover:bg-brand-primary group-hover:text-white transition-colors">
                <i class="fas fa-book text-2xl"></i>
            </div>
            <h3 class="text-2xl font-bold text-brand-dark mb-3 group-hover:text-brand-primary transition-colors">Experimental</h3>
            <p class="text-slate-500 leading-relaxed flex-grow">
                Reaction numbering, ELN guidelines, characterisation requirements, and write-up standards.
            </p>
            <div class="mt-6 text-sm font-bold text-brand-primary uppercase tracking-wider group-hover:underline">View Guidelines &rarr;</div>
        </a>

        <!-- 4. Lab Operations -->
        <a href="./internal/lab-operations.html" class="group bg-white p-8 rounded-xl shadow-sm border border-slate-200 hover:shadow-xl hover:border-brand-primary transition-all duration-300 flex flex-col h-full no-underline">
            <div class="w-12 h-12 bg-brand-light rounded-lg flex items-center justify-center text-brand-primary mb-6 group-hover:bg-brand-primary group-hover:text-white transition-colors">
                <i class="fas fa-flask text-2xl"></i>
            </div>
            <h3 class="text-2xl font-bold text-brand-dark mb-3 group-hover:text-brand-primary transition-colors">Lab Operations</h3>
            <p class="text-slate-500 leading-relaxed flex-grow">
                Safety, housekeeping, waste disposal, lab shutdown protocols, and chemical inventory.
            </p>
            <div class="mt-6 text-sm font-bold text-brand-primary uppercase tracking-wider group-hover:underline">View Protocols &rarr;</div>
        </a>

        <!-- 5. Equipment -->
        <a href="./internal/equipment.html" class="group bg-white p-8 rounded-xl shadow-sm border border-slate-200 hover:shadow-xl hover:border-brand-primary transition-all duration-300 flex flex-col h-full no-underline">
            <div class="w-12 h-12 bg-brand-light rounded-lg flex items-center justify-center text-brand-primary mb-6 group-hover:bg-brand-primary group-hover:text-white transition-colors">
                <i class="fas fa-microscope text-2xl"></i>
            </div>
            <h3 class="text-2xl font-bold text-brand-dark mb-3 group-hover:text-brand-primary transition-colors">Equipment & Manuals</h3>
            <p class="text-slate-500 leading-relaxed flex-grow">
                Guides for LCMS, Biotage, and general equipment troubleshooting.
            </p>
            <div class="mt-6 text-sm font-bold text-brand-primary uppercase tracking-wider group-hover:underline">View Manuals &rarr;</div>
        </a>

        <!-- 6. Admin & Finance -->
        <a href="./internal/admin.html" class="group bg-white p-8 rounded-xl shadow-sm border border-slate-200 hover:shadow-xl hover:border-brand-primary transition-all duration-300 flex flex-col h-full no-underline">
            <div class="w-12 h-12 bg-brand-light rounded-lg flex items-center justify-center text-brand-primary mb-6 group-hover:bg-brand-primary group-hover:text-white transition-colors">
                <i class="fas fa-folder-open text-2xl"></i>
            </div>
            <h3 class="text-2xl font-bold text-brand-dark mb-3 group-hover:text-brand-primary transition-colors">Admin & Finance</h3>
            <p class="text-slate-500 leading-relaxed flex-grow">
                Project codes, ordering from stores, MyFinance, and funding information.
            </p>
            <div class="mt-6 text-sm font-bold text-brand-primary uppercase tracking-wider group-hover:underline">View Codes &rarr;</div>
        </a>

        <!-- 7. Group Meetings -->
        <a href="./internal/meetings.html" class="group bg-white p-8 rounded-xl shadow-sm border border-slate-200 hover:shadow-xl hover:border-brand-primary transition-all duration-300 flex flex-col h-full no-underline">
            <div class="w-12 h-12 bg-brand-light rounded-lg flex items-center justify-center text-brand-primary mb-6 group-hover:bg-brand-primary group-hover:text-white transition-colors">
                <i class="fas fa-users text-2xl"></i>
            </div>
            <h3 class="text-2xl font-bold text-brand-dark mb-3 group-hover:text-brand-primary transition-colors">Group Meetings</h3>
            <p class="text-slate-500 leading-relaxed flex-grow">
                Schedule, format for research updates, lit club, and mini-problems.
            </p>
            <div class="mt-6 text-sm font-bold text-brand-primary uppercase tracking-wider group-hover:underline">View Schedule &rarr;</div>
        </a>

         <!-- 8. Resources -->
         <a href="./internal/resources.html" class="group bg-white p-8 rounded-xl shadow-sm border border-slate-200 hover:shadow-xl hover:border-brand-primary transition-all duration-300 flex flex-col h-full no-underline">
            <div class="w-12 h-12 bg-brand-light rounded-lg flex items-center justify-center text-brand-primary mb-6 group-hover:bg-brand-primary group-hover:text-white transition-colors">
                <i class="fas fa-globe text-2xl"></i>
            </div>
            <h3 class="text-2xl font-bold text-brand-dark mb-3 group-hover:text-brand-primary transition-colors">Chemistry Resources</h3>
            <p class="text-slate-500 leading-relaxed flex-grow">
                Useful links, spectral databases, and educational tools.
            </p>
            <div class="mt-6 text-sm font-bold text-brand-primary uppercase tracking-wider group-hover:underline">View Resources &rarr;</div>
        </a>

    </div>
</div>