grain.social is a photo sharing platform built on atproto.
grain.social
1body {
2 background: #fff;
3 margin: 0;
4 padding: 0;
5 font-family: "DejaVu Sans", "Liberation Sans", Arial, sans-serif;
6 position: relative;
7 width: 1200px;
8 height: 630px;
9}
10
11.content {
12 position: absolute;
13 top: 15px;
14 left: 15px;
15 width: 1170px;
16 height: 480px;
17}
18
19.adaptive-grid {
20 position: relative;
21 width: 100%;
22 height: 100%;
23}
24
25.adaptive-grid img {
26 position: absolute;
27 object-fit: cover;
28 border-radius: 4px;
29}
30
31.footer {
32 position: absolute;
33 bottom: 0;
34 left: 0;
35 width: 1200px;
36 height: 135px;
37 display: flex;
38 align-items: center;
39 justify-content: space-between;
40 padding: 0 15px;
41 box-sizing: border-box;
42}
43
44.title {
45 font-weight: 400;
46 color: #212529;
47 line-height: 1.1;
48 max-width: 600px;
49 font-size: clamp(24px, 4vw, 48px);
50 word-wrap: break-word;
51 overflow-wrap: break-word;
52}
53
54.handle {
55 font-size: 28px;
56 font-weight: bold;
57 color: #212529;
58 line-height: 1.1;
59}
60
61.grain {
62 font-size: 24px;
63 font-weight: bold;
64 color: #6c757d;
65 line-height: 1.1;
66 margin-top: 6px;
67}