gsoftware.org/credits.html at main · grey-software/gsoftware.org · 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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Credits | Grey Software</title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;700&family=IBM+Plex+Mono:ital,wght@0,300;0,400;1,300&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="style.css">
</head>
<body class="font-mono text-sm antialiased selection:bg-blood selection:text-paper">
  <div class="fixed top-0 left-0 w-full h-12 border-b frame-border z-40 flex items-center justify-between px-4 sm:px-6 lg:px-12 bg-ink/80 backdrop-blur-md text-paper">
    <a href="index.html" class="flex items-center">
      <img src="logos/logo-white-unpadded.png" alt="Grey Software" class="h-4 sm:h-5 w-auto object-contain" />
    </a>
    <nav class="flex items-center gap-5 sm:gap-8 lg:gap-10 text-xs tracking-widest uppercase">
      <a href="impact.html" class="relative nav-link opacity-60">Impact</a>
      <a href="lineage.html" class="relative nav-link opacity-60">Lineage</a>
      <a href="credits.html" class="relative nav-link opacity-100 font-bold">Credits</a>
    </nav>
  </div>
  <div class="fixed top-12 right-0 w-12 h-[calc(100vh-3rem)] border-l frame-border z-30 hidden md:block"></div>

  <main class="pt-12 md:pl-12 md:pr-12 min-h-screen">

    <!-- HERO -->
    <header class="min-h-[60vh] relative flex flex-col justify-center border-b frame-border">
      <div class="crosshair top-0 left-0 -translate-x-[6px] -translate-y-[6px]"></div>
      <div class="crosshair bottom-0 right-0 translate-x-[6px] translate-y-[6px]"></div>

      <div class="max-w-7xl mx-auto px-6 lg:px-16 relative w-full reveal">
        <div class="text-[10px] tracking-[0.2em] uppercase opacity-50 mb-8 flex items-center gap-4">
          <span class="w-12 h-px bg-current opacity-30"></span> The People Who Made It Possible
        </div>
        <h1 class="font-sans font-bold tracking-tight italic text-6xl md:text-8xl leading-[0.95] text-paper mb-10">
          Thank you.
        </h1>
        <p class="text-xl md:text-2xl font-light opacity-80 max-w-2xl leading-relaxed">
          Grey Software runs on small, recurring acts of generosity. Some sent a few dollars a month for years. Every name here helped keep open software, open education, and open collaboration funded.
        </p>
      </div>
    </header>

    <!-- GITHUB SPONSORS -->
    <section class="py-24 md:py-32 relative border-b frame-border">
      <div class="max-w-7xl mx-auto px-6 lg:px-16">
        <div class="reveal mb-16">
          <div class="text-xs uppercase tracking-widest text-blood mb-6">GitHub Sponsors</div>
          <h2 class="font-sans font-bold tracking-tight text-4xl md:text-5xl leading-[1.1] max-w-3xl">
            Everyone who has sponsored us on GitHub since 2020.
          </h2>
          <p class="opacity-60 max-w-xl mt-6 leading-relaxed">
            Listed by handle, in alphabetical order. Some sponsorships are still active, some have ended. The thanks do not expire.
          </p>
        </div>

        <div class="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-px bg-paper/10 border frame-border reveal">
          <a href="https://github.com/AKhan2021" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">AKhan2021</span></a>
          <a href="https://github.com/AngelaKwan" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">AngelaKwan</span></a>
          <a href="https://github.com/ArsalaBangash" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">ArsalaBangash</span></a>
          <a href="https://github.com/arthursoenarto" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">arthursoenarto</span></a>
          <a href="https://github.com/bangashghaffar" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">bangashghaffar</span></a>
          <a href="https://github.com/BKMAPK" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">BKMAPK</span></a>
          <a href="https://github.com/daveavi" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">daveavi</span></a>
          <a href="https://github.com/distinctmind" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">distinctmind</span></a>
          <a href="https://github.com/dokom" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">dokom</span></a>
          <a href="https://github.com/hiimchrislim" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">hiimchrislim</span></a>
          <a href="https://github.com/khans218" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">khans218</span></a>
          <a href="https://github.com/Luid101" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">Luid101</span></a>
          <a href="https://github.com/lunaroyster" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">lunaroyster</span></a>
          <a href="https://github.com/lunavarro22" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">lunavarro22</span></a>
          <a href="https://github.com/masterrom" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">masterrom</span></a>
          <a href="https://github.com/maticzav" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">maticzav</span></a>
          <a href="https://github.com/MGMoose" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">MGMoose</span></a>
          <a href="https://github.com/milindvishnoi" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">milindvishnoi</span></a>
          <a href="https://github.com/mkbangash" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">mkbangash</span></a>
          <a href="https://github.com/NimJay" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">NimJay</span></a>
          <a href="https://github.com/ninaricci29" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">ninaricci29</span></a>
          <a href="https://github.com/noumanjee" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">noumanjee</span></a>
          <a href="https://github.com/OsamaSaleh289" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">OsamaSaleh289</span></a>
          <a href="https://github.com/saminabangash" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">saminabangash</span></a>
          <a href="https://github.com/SantiagoOrdonez" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">SantiagoOrdonez</span></a>
          <a href="https://github.com/saraelshawa" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">saraelshawa</span></a>
          <a href="https://github.com/ShoaibKhan" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">ShoaibKhan</span></a>
          <a href="https://github.com/ujan75" target="_blank" rel="noopener noreferrer" class="bg-ink p-5 lg:p-6 group hover:bg-paper hover:text-ink transition-colors duration-300"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg break-all">ujan75</span></a>
          <div class="bg-ink p-5 lg:p-6"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg opacity-60">Anonymous</span></div>
        </div>
      </div>
    </section>

    <!-- INDIVIDUAL DONORS -->
    <section class="py-24 md:py-32 relative border-b frame-border bg-paper-dark/5">
      <div class="max-w-7xl mx-auto px-6 lg:px-16">
        <div class="reveal mb-16">
          <div class="text-xs uppercase tracking-widest text-blood mb-6">Individual Donors</div>
          <h2 class="font-sans font-bold tracking-tight text-4xl md:text-5xl leading-[1.1] max-w-3xl">
            People who gave directly.
          </h2>
          <p class="opacity-60 max-w-xl mt-6 leading-relaxed">
            One-time and direct contributions, from friends, colleagues, and strangers who believed in the work.
          </p>
        </div>

        <div class="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-px bg-paper/10 border frame-border reveal">
          <div class="bg-ink p-5 lg:p-6"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg">J. Mukherjee</span></div>
          <div class="bg-ink p-5 lg:p-6"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg">S. Hu</span></div>
          <div class="bg-ink p-5 lg:p-6"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg">S. El-Shawa</span></div>
          <div class="bg-ink p-5 lg:p-6"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg">U. Jan</span></div>
          <div class="bg-ink p-5 lg:p-6"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg">A. Malpani</span></div>
          <div class="bg-ink p-5 lg:p-6"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg">J. Jacks</span></div>
          <div class="bg-ink p-5 lg:p-6"><span class="font-sans font-semibold tracking-tight text-base lg:text-lg">S. Bangash</span></div>
        </div>
      </div>
    </section>

    <!-- CLOSING -->
    <section class="py-24 md:py-40 relative overflow-hidden">
      <div class="absolute inset-0 overflow-hidden pointer-events-none opacity-20 flex items-center justify-center">
        <svg class="w-[60vw] h-[60vw] md:w-[30vw] md:h-[30vw] animate-slow-spin text-paper" viewBox="0 0 100 100" fill="none" stroke="currentColor" stroke-width="0.2">
          <circle cx="50" cy="50" r="48" stroke-dasharray="2 4"/>
          <circle cx="50" cy="50" r="35" />
          <path d="M 50 2 L 50 98 M 2 50 L 98 50" />
        </svg>
      </div>
      <div class="crosshair top-0 left-0 -translate-x-[6px] -translate-y-[6px]"></div>
      <div class="crosshair bottom-0 right-0 translate-x-[6px] translate-y-[6px]"></div>
      <div class="max-w-3xl mx-auto px-6 text-center relative reveal">
        <h3 class="font-sans font-bold tracking-tight italic text-4xl md:text-6xl leading-[1.1] mb-8">
          Want to join them?
        </h3>
        <p class="opacity-60 text-base md:text-lg leading-relaxed max-w-xl mx-auto mb-10">
          Sponsorship keeps this work going and pays it forward to the next builder who needs it.
        </p>
        <a href="https://github.com/grey-software" target="_blank" rel="noopener noreferrer" class="inline-block font-sans font-bold tracking-tight text-lg border frame-border px-8 py-4 hover:bg-paper hover:text-ink transition-colors duration-300">
          Sponsor on GitHub
        </a>
      </div>
    </section>

    <footer class="py-24 relative overflow-hidden border-t frame-border">
      <div class="max-w-7xl mx-auto px-6 lg:px-16 flex flex-col md:flex-row justify-between items-start md:items-end gap-16 relative z-10">
        <div>
          <img src="logos/logo-white-unpadded.png" alt="Grey Software" class="h-10 md:h-14 w-auto mb-8 object-contain" />
        </div>

        <div class="flex gap-12 sm:gap-16 text-xs uppercase tracking-widest">
          <ul class="space-y-4">
            <li class="opacity-40 border-b frame-border pb-2 mb-4">Internal</li>
            <li><a href="index.html" class="nav-link relative pb-1">Home</a></li>
            <li><a href="impact.html" class="nav-link relative pb-1">Impact Ledger</a></li>
            <li><a href="lineage.html" class="nav-link relative pb-1">The Lineage</a></li>
            <li><a href="credits.html" class="nav-link relative pb-1">Credits</a></li>
          </ul>
          <ul class="space-y-4">
            <li class="opacity-40 border-b frame-border pb-2 mb-4">Social</li>
            <li><a href="https://www.linkedin.com/company/grey-software" target="_blank" rel="noopener noreferrer" class="nav-link relative pb-1">LinkedIn</a></li>
            <li><a href="https://www.instagram.com/greysoftware" target="_blank" rel="noopener noreferrer" class="nav-link relative pb-1">Instagram</a></li>
            <li><a href="https://github.com/grey-software" target="_blank" rel="noopener noreferrer" class="nav-link relative pb-1">GitHub</a></li>
          </ul>
        </div>
      </div>
    </footer>
  </main>

  <script>
    const revealElements = document.querySelectorAll('.reveal');
    const revealOnScroll = () => {
      for (let i = 0; i < revealElements.length; i++) {
        const windowHeight = window.innerHeight;
        const elementTop = revealElements[i].getBoundingClientRect().top;
        const elementVisible = 100;
        if (elementTop < windowHeight - elementVisible) {
          revealElements[i].classList.add('active');
        }
      }
    };
    window.addEventListener('scroll', revealOnScroll);
    revealOnScroll();
  </script>
</body>
</html>