Thread viewer for Bluesky
1<script lang="ts">
2 let { children } = $props();
3</script>
4
5<main class="search-page">
6 {@render children()}
7</main>
8
9<style>
10 .search-page :global {
11 input[type="submit"] {
12 font-size: 12pt;
13 margin: 5px 0px;
14 padding: 5px 10px;
15 }
16
17 progress {
18 width: 300px;
19 margin-left: 10px;
20 vertical-align: middle;
21 }
22
23 .search-query {
24 font-size: 12pt;
25 border: 1px solid #ccc;
26 border-radius: 6px;
27 padding: 5px 6px;
28 margin-left: 8px;
29 }
30
31 .results {
32 margin-top: 30px;
33 }
34
35 .results > .post {
36 margin-left: -15px;
37 padding-left: 15px;
38 border-bottom: 1px solid #ddd;
39 padding-bottom: 10px;
40 margin-top: 24px;
41 }
42
43 .results-end {
44 font-size: 12pt;
45 color: #333;
46 }
47
48 .post + .results-end {
49 font-size: 11pt;
50 }
51 }
52
53 @media (prefers-color-scheme: dark) {
54 .search-page :global {
55 .search-query {
56 border: 1px solid #666;
57 }
58
59 .results-end {
60 color: #888;
61 }
62
63 .results > .post {
64 border-bottom: 1px solid #555;
65 }
66 }
67 }
68</style>