source for getorbyt.com getorbyt.com/
client bsky orbytapp app orbyt bluesky getorbyt orbytvideo atproto video
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Refactor logo and styling in contact and index pages

- Update logo image source in contact.astro to use SVG format for better scalability.
- Adjust header margins and paddings for improved layout consistency.
- Modify background color handling in index.astro to utilize CSS variables for better maintainability.
- Increase logo sizes and update color properties to enhance visual appeal and consistency across pages.

+74 -15
+11
public/images/orbyt-logo.svg
··· 1 + <svg xmlns="http://www.w3.org/2000/svg" width="894" height="894" viewBox="65 65 894 894"> 2 + <!-- White border/outline for sticker effect (drawn first, behind everything) --> 3 + <path fill="none" stroke="#fff" stroke-width="65" stroke-linejoin="round" stroke-linecap="round" d="M349 129.3c-23.9 5.4-36.8 31.5-26.1 53.2 8 16.2 25.2 24.4 42.1 20.1 7.4-1.9 5.3-3.4 18.5 13.9 10.3 13.6 33.6 44.2 36.7 48.4 3.5 4.6 3.5 4.6-1.1 8.9-5.9 5.6-14.1 16.9-19 26-5 9.4-3.4 8.6-22.1 10.2-136.2 11.1-177 34.7-192.6 111.5-16.5 81.2-16.5 193.6.1 276.7 10.5 52.9 39.8 83.7 89.3 93.9 6 1.3 6 1.3 2.5 8.8-18.4 39.4-5.4 73.1 30 78.1 24.5 3.5 32.3-1.8 73.7-50 20.8-24.3 16.8-22.1 37-20.5 50.9 4.1 138.2 4.1 189 0 20.2-1.6 16.2-3.8 37 20.5 41.4 48.2 49.2 53.5 73.7 50 35.4-5 48.4-38.7 30-78.1-3.5-7.5-3.5-7.5 2.5-8.8 49.5-10.2 78.8-41 89.3-93.9 16.6-83.1 16.6-195.5.1-276.7C824 344.7 783.2 321.1 647 310c-18.7-1.6-17.1-.8-22.1-10.2-4.9-9.1-13.1-20.4-19-26-4.6-4.3-4.6-4.3-1.1-8.9 3.1-4.2 26.4-34.8 36.7-48.4 13.2-17.3 11.1-15.8 18.5-13.9 41.5 10.6 64.2-49.2 26.3-69.3-32-17.1-68 17.2-51.7 49.3 3.1 6.1 3.1 6.1-11.8 25.5-8.2 10.7-20 26-26.1 34.1-11.1 14.8-11.1 14.8-14.7 12.6-44.5-26.5-94.5-26.5-139 0-3.6 2.2-3.6 2.2-14.7-12.6-6.1-8.1-17.9-23.4-26.1-34.1-14.9-19.4-14.9-19.4-11.8-25.5 13.8-27.1-11.7-59.8-41.4-53.3m249.3 243.2C752 381.3 773.8 399.3 781.1 523c5.8 98.9-9.4 168.3-41.5 189.8-59.5 39.8-394.7 39.8-454.2 0-32.1-21.5-47.3-90.9-41.5-189.8 7.7-130.5 28.8-144.8 226.1-152.4 19.3-.8 104.3.5 128.3 1.9"/> 4 + <!-- White screen fill --> 5 + <rect fill="#fff" x="210" y="340" width="604" height="420" rx="80" ry="80"/> 6 + <!-- Black TV body on top --> 7 + <path fill="#000" d="M349 129.3c-23.9 5.4-36.8 31.5-26.1 53.2 8 16.2 25.2 24.4 42.1 20.1 7.4-1.9 5.3-3.4 18.5 13.9 10.3 13.6 33.6 44.2 36.7 48.4 3.5 4.6 3.5 4.6-1.1 8.9-5.9 5.6-14.1 16.9-19 26-5 9.4-3.4 8.6-22.1 10.2-136.2 11.1-177 34.7-192.6 111.5-16.5 81.2-16.5 193.6.1 276.7 10.5 52.9 39.8 83.7 89.3 93.9 6 1.3 6 1.3 2.5 8.8-18.4 39.4-5.4 73.1 30 78.1 24.5 3.5 32.3-1.8 73.7-50 20.8-24.3 16.8-22.1 37-20.5 50.9 4.1 138.2 4.1 189 0 20.2-1.6 16.2-3.8 37 20.5 41.4 48.2 49.2 53.5 73.7 50 35.4-5 48.4-38.7 30-78.1-3.5-7.5-3.5-7.5 2.5-8.8 49.5-10.2 78.8-41 89.3-93.9 16.6-83.1 16.6-195.5.1-276.7C824 344.7 783.2 321.1 647 310c-18.7-1.6-17.1-.8-22.1-10.2-4.9-9.1-13.1-20.4-19-26-4.6-4.3-4.6-4.3-1.1-8.9 3.1-4.2 26.4-34.8 36.7-48.4 13.2-17.3 11.1-15.8 18.5-13.9 41.5 10.6 64.2-49.2 26.3-69.3-32-17.1-68 17.2-51.7 49.3 3.1 6.1 3.1 6.1-11.8 25.5-8.2 10.7-20 26-26.1 34.1-11.1 14.8-11.1 14.8-14.7 12.6-44.5-26.5-94.5-26.5-139 0-3.6 2.2-3.6 2.2-14.7-12.6-6.1-8.1-17.9-23.4-26.1-34.1-14.9-19.4-14.9-19.4-11.8-25.5 13.8-27.1-11.7-59.8-41.4-53.3m249.3 243.2C752 381.3 773.8 399.3 781.1 523c5.8 98.9-9.4 168.3-41.5 189.8-59.5 39.8-394.7 39.8-454.2 0-32.1-21.5-47.3-90.9-41.5-189.8 7.7-130.5 28.8-144.8 226.1-152.4 19.3-.8 104.3.5 128.3 1.9"/> 8 + <!-- Black eyes on white screen --> 9 + <rect fill="#000" x="378" y="485" width="70" height="130" rx="35" ry="35"/> 10 + <rect fill="#000" x="576" y="485" width="70" height="130" rx="35" ry="35"/> 11 + </svg>
+3
src/pages/@[handle].astro
··· 135 135 font-size: 42px; 136 136 letter-spacing: -0.02em; 137 137 line-height: 1; 138 + text-box-trim: trim-start; 139 + text-box-edge: cap alphabetic; 138 140 color: #ccd7e9; 139 141 } 140 142 .install-button { ··· 147 149 transition: all 0.2s ease; 148 150 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); 149 151 padding: 0 18px; 152 + margin-top: 0; 150 153 } 151 154 .install-button:hover { 152 155 transform: translateY(-1px);
+18 -1
src/pages/@[handle]/[postId].astro
··· 141 141 font-size: 42px; 142 142 letter-spacing: -0.02em; 143 143 line-height: 1; 144 + text-box-trim: trim-start; 145 + text-box-edge: cap alphabetic; 144 146 } 145 147 @media screen and (max-width: 699px) { 146 148 .logo-overlay.mobile-overlay .logo-text { ··· 212 214 transition: all 0.2s ease !important; 213 215 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important; 214 216 padding: 0 18px !important; 217 + margin-top: 0 !important; 215 218 } 216 219 .install-button:hover { 217 220 background-color: #e8eefc !important; ··· 227 230 } 228 231 /* Desktop-specific logo text styling */ 229 232 @media screen and (min-width: 700px) { 233 + .desktop-title { 234 + align-items: center; 235 + } 236 + .desktop-title .logo { 237 + display: flex; 238 + align-items: center; 239 + line-height: 1; 240 + } 241 + .desktop-title .logo-wordmark { 242 + display: flex; 243 + align-items: center; 244 + line-height: 1; 245 + } 230 246 .desktop-title .logo-text { 231 247 font-size: 42px; 232 248 color: #f3f5fe; 233 249 margin: 0; 234 250 padding: 0; 251 + text-box-trim: trim-both; 252 + text-box-edge: cap alphabetic; 235 253 } 236 254 .desktop-title .install-button { 237 255 display: flex; 238 256 align-items: center; 239 - height: 42px; 240 257 } 241 258 } 242 259 </style>
+7 -6
src/pages/contact.astro
··· 57 57 58 58 .header { 59 59 text-align: left; 60 - margin-bottom: 1.5rem; 61 - padding-bottom: 2rem; 60 + margin-bottom: 0.5rem; 61 + padding-bottom: 0.5rem; 62 62 } 63 63 64 64 .header a { ··· 67 67 } 68 68 69 69 .logo-icon { 70 - width: 65px; 70 + width: 100px; 71 71 height: auto; 72 72 display: block; 73 - margin: 0 auto 2px auto; 73 + margin: 0; 74 74 } 75 75 76 76 .logo-text { ··· 79 79 font-size: 32px; 80 80 color: #f3f5fe; 81 81 text-align: center; 82 + text-box-trim: trim-start; 83 + text-box-edge: cap alphabetic; 82 84 display: block; 83 85 } 84 86 ··· 197 199 <div class="container"> 198 200 <div class="header"> 199 201 <a href="/"> 200 - <img src="/TV-Raw.webp" alt="orbyt logo" class="logo-icon"/> 201 - <div class="logo-text">orbyt</div> 202 + <img src="/images/orbyt-logo.svg" alt="orbyt logo" class="logo-icon"/> 202 203 </a> 203 204 </div> 204 205
+2
src/pages/discord.astro
··· 56 56 font-size: 48px; 57 57 color: #f3f5fe; 58 58 position: absolute; 59 + text-box-trim: trim-start; 60 + text-box-edge: cap alphabetic; 59 61 bottom: 40px; 60 62 } 61 63 </style>
+33 -8
src/pages/index.astro
··· 60 60 } 61 61 62 62 body { 63 - background: #000; 63 + --bg-color: #000; 64 + --fg-color: #f3f5fe; 65 + background: var(--bg-color); 64 66 font-family: 'Figtree', sans-serif; 65 67 position: relative; 66 68 display: flex; ··· 118 120 } 119 121 120 122 .logo-icon { 121 - width: 140px; 123 + width: 160px; 122 124 height: auto; 123 125 display: block; 124 126 margin: 0 auto 0px auto; 127 + color: var(--fg-color); 128 + } 129 + 130 + .logo-icon .logo-bg { 131 + fill: var(--bg-color); 132 + } 133 + 134 + .logo-icon .logo-fg { 135 + fill: var(--fg-color); 136 + stroke: var(--fg-color); 137 + } 138 + 139 + .logo-icon .logo-outline { 140 + fill: none; 125 141 } 126 142 127 143 .logo-text { 128 144 font-family: 'Figtree', sans-serif; 129 145 font-weight: 900; 130 146 font-size: 48px; 131 - color: #f3f5fe; 147 + color: var(--fg-color); 132 148 text-align: center; 149 + text-box-trim: trim-start; 150 + text-box-edge: cap alphabetic; 133 151 display: block; 134 152 margin: 0 auto; 135 153 } ··· 218 236 } 219 237 220 238 .logo-icon { 221 - width: 100px; 239 + width: 115px; 222 240 height: auto; 223 241 } 224 242 ··· 268 286 <div class="main-content"> 269 287 <div class="row first"> 270 288 <div class="logo twelve columns"> 271 - <picture> 272 - <source srcset="/TV-Raw.webp" type="image/webp"> 273 - <img src="/TV-Raw.png" alt="orbyt logo" class="logo-icon"/> 274 - </picture> 289 + <svg class="logo-icon" xmlns="http://www.w3.org/2000/svg" viewBox="65 65 894 894"> 290 + <!-- White border/outline for sticker effect (drawn first, behind everything) --> 291 + <path class="logo-fg logo-outline" fill="none" stroke-width="65" stroke-linejoin="round" stroke-linecap="round" d="M349 129.3c-23.9 5.4-36.8 31.5-26.1 53.2 8 16.2 25.2 24.4 42.1 20.1 7.4-1.9 5.3-3.4 18.5 13.9 10.3 13.6 33.6 44.2 36.7 48.4 3.5 4.6 3.5 4.6-1.1 8.9-5.9 5.6-14.1 16.9-19 26-5 9.4-3.4 8.6-22.1 10.2-136.2 11.1-177 34.7-192.6 111.5-16.5 81.2-16.5 193.6.1 276.7 10.5 52.9 39.8 83.7 89.3 93.9 6 1.3 6 1.3 2.5 8.8-18.4 39.4-5.4 73.1 30 78.1 24.5 3.5 32.3-1.8 73.7-50 20.8-24.3 16.8-22.1 37-20.5 50.9 4.1 138.2 4.1 189 0 20.2-1.6 16.2-3.8 37 20.5 41.4 48.2 49.2 53.5 73.7 50 35.4-5 48.4-38.7 30-78.1-3.5-7.5-3.5-7.5 2.5-8.8 49.5-10.2 78.8-41 89.3-93.9 16.6-83.1 16.6-195.5.1-276.7C824 344.7 783.2 321.1 647 310c-18.7-1.6-17.1-.8-22.1-10.2-4.9-9.1-13.1-20.4-19-26-4.6-4.3-4.6-4.3-1.1-8.9 3.1-4.2 26.4-34.8 36.7-48.4 13.2-17.3 11.1-15.8 18.5-13.9 41.5 10.6 64.2-49.2 26.3-69.3-32-17.1-68 17.2-51.7 49.3 3.1 6.1 3.1 6.1-11.8 25.5-8.2 10.7-20 26-26.1 34.1-11.1 14.8-11.1 14.8-14.7 12.6-44.5-26.5-94.5-26.5-139 0-3.6 2.2-3.6 2.2-14.7-12.6-6.1-8.1-17.9-23.4-26.1-34.1-14.9-19.4-14.9-19.4-11.8-25.5 13.8-27.1-11.7-59.8-41.4-53.3m249.3 243.2C752 381.3 773.8 399.3 781.1 523c5.8 98.9-9.4 168.3-41.5 189.8-59.5 39.8-394.7 39.8-454.2 0-32.1-21.5-47.3-90.9-41.5-189.8 7.7-130.5 28.8-144.8 226.1-152.4 19.3-.8 104.3.5 128.3 1.9"/> 292 + <!-- White screen fill --> 293 + <rect class="logo-fg" x="210" y="340" width="604" height="420" rx="80" ry="80"/> 294 + <!-- Black TV body on top --> 295 + <path class="logo-bg" d="M349 129.3c-23.9 5.4-36.8 31.5-26.1 53.2 8 16.2 25.2 24.4 42.1 20.1 7.4-1.9 5.3-3.4 18.5 13.9 10.3 13.6 33.6 44.2 36.7 48.4 3.5 4.6 3.5 4.6-1.1 8.9-5.9 5.6-14.1 16.9-19 26-5 9.4-3.4 8.6-22.1 10.2-136.2 11.1-177 34.7-192.6 111.5-16.5 81.2-16.5 193.6.1 276.7 10.5 52.9 39.8 83.7 89.3 93.9 6 1.3 6 1.3 2.5 8.8-18.4 39.4-5.4 73.1 30 78.1 24.5 3.5 32.3-1.8 73.7-50 20.8-24.3 16.8-22.1 37-20.5 50.9 4.1 138.2 4.1 189 0 20.2-1.6 16.2-3.8 37 20.5 41.4 48.2 49.2 53.5 73.7 50 35.4-5 48.4-38.7 30-78.1-3.5-7.5-3.5-7.5 2.5-8.8 49.5-10.2 78.8-41 89.3-93.9 16.6-83.1 16.6-195.5.1-276.7C824 344.7 783.2 321.1 647 310c-18.7-1.6-17.1-.8-22.1-10.2-4.9-9.1-13.1-20.4-19-26-4.6-4.3-4.6-4.3-1.1-8.9 3.1-4.2 26.4-34.8 36.7-48.4 13.2-17.3 11.1-15.8 18.5-13.9 41.5 10.6 64.2-49.2 26.3-69.3-32-17.1-68 17.2-51.7 49.3 3.1 6.1 3.1 6.1-11.8 25.5-8.2 10.7-20 26-26.1 34.1-11.1 14.8-11.1 14.8-14.7 12.6-44.5-26.5-94.5-26.5-139 0-3.6 2.2-3.6 2.2-14.7-12.6-6.1-8.1-17.9-23.4-26.1-34.1-14.9-19.4-14.9-19.4-11.8-25.5 13.8-27.1-11.7-59.8-41.4-53.3m249.3 243.2C752 381.3 773.8 399.3 781.1 523c5.8 98.9-9.4 168.3-41.5 189.8-59.5 39.8-394.7 39.8-454.2 0-32.1-21.5-47.3-90.9-41.5-189.8 7.7-130.5 28.8-144.8 226.1-152.4 19.3-.8 104.3.5 128.3 1.9"/> 296 + <!-- Black eyes on white screen --> 297 + <rect class="logo-bg" x="378" y="485" width="70" height="130" rx="35" ry="35"/> 298 + <rect class="logo-bg" x="576" y="485" width="70" height="130" rx="35" ry="35"/> 299 + </svg> 275 300 <div class="logo-text">orbyt</div> 276 301 </div> 277 302 </div>