Privacy-preserving location sharing with end-to-end encryption
coord.is
1@import "tailwindcss";
2
3/* Override card colors for "For builders" section */
4.sl-heading-wrapper:has(#for-builders) + .card-grid .card:nth-child(1) {
5 --sl-card-border: var(--sl-color-green);
6 --sl-card-bg: var(--sl-color-green-low);
7}
8.sl-heading-wrapper:has(#for-builders) + .card-grid .card:nth-child(2) {
9 --sl-card-border: var(--sl-color-blue);
10 --sl-card-bg: var(--sl-color-blue-low);
11}
12
13.bubble {
14 display: inline-block;
15 background-color: rgb(59 130 246);
16 color: white;
17 padding: 0.75rem 1.5rem;
18 border-radius: 1.25rem;
19 border-bottom-right-radius: 0;
20 position: relative;
21}
22
23.bubble::after {
24 content: '';
25 position: absolute;
26 bottom: calc(-0.35em + 1px);
27 right: 0;
28 width: 0;
29 height: 0;
30 border-top: 0.35em solid rgb(59 130 246);
31 border-left: 0.35em solid transparent;
32}
33
34/* Style hero primary button to match bubble */
35.hero .actions a.sl-link-button:not([data-variant]) {
36 background-color: rgb(59 130 246) !important;
37 color: white !important;
38 border-color: rgb(59 130 246) !important;
39}
40
41.hero .actions a.sl-link-button:not([data-variant]):hover {
42 background-color: rgb(37 99 235) !important;
43 border-color: rgb(37 99 235) !important;
44}
45
46/* Style hero secondary button */
47.hero .actions a.sl-link-button.secondary {
48 background-color: transparent !important;
49 color: rgb(59 130 246) !important;
50 border-color: rgb(59 130 246) !important;
51}
52
53.hero .actions a.sl-link-button.secondary:hover {
54 background-color: rgb(59 130 246 / 0.1) !important;
55}
56
57/* Give hero image more space */
58@media (min-width: 50rem) {
59 .hero {
60 grid-template-columns: 7fr 5fr;
61 }
62}