+1

package.json

··· 74 74 "@atproto/api": "^0.16.7", 75 75 "@bitdrift/react-native": "^0.6.8", 76 76 "@braintree/sanitize-url": "^6.0.2", 77 77 + "@bsky.app/alf": "^0.1.2", 77 78 "@discord/bottom-sheet": "bluesky-social/react-native-bottom-sheet", 78 79 "@emoji-mart/react": "^1.1.1", 79 80 "@expo/html-elements": "^0.12.5",

+4 -997

src/alf/atoms.ts

··· 1 1 - import { 2 2 - Platform, 3 3 - type StyleProp, 4 4 - StyleSheet, 5 5 - type ViewStyle, 6 6 - } from 'react-native' 1 1 + import {type StyleProp, type ViewStyle} from 'react-native' 2 2 + import {atoms as baseAtoms} from '@bsky.app/alf' 7 3 8 8 - import * as tokens from '#/alf/tokens' 9 9 - import {ios, native, platform, web} from '#/alf/util/platform' 4 4 + import {native, platform, web} from '#/alf/util/platform' 10 5 import * as Layout from '#/components/Layout' 11 6 12 7 export const atoms = { 13 13 - debug: { 14 14 - borderColor: 'red', 15 15 - borderWidth: 1, 16 16 - }, 17 17 - 18 18 - /* 19 19 - * Positioning 20 20 - */ 21 21 - fixed: { 22 22 - position: Platform.select({web: 'fixed', native: 'absolute'}) as 'absolute', 23 23 - }, 24 24 - absolute: { 25 25 - position: 'absolute', 26 26 - }, 27 27 - relative: { 28 28 - position: 'relative', 29 29 - }, 30 30 - static: { 31 31 - position: 'static', 32 32 - }, 33 33 - sticky: web({ 34 34 - position: 'sticky', 35 35 - }), 36 36 - inset_0: { 37 37 - top: 0, 38 38 - left: 0, 39 39 - right: 0, 40 40 - bottom: 0, 41 41 - }, 42 42 - top_0: { 43 43 - top: 0, 44 44 - }, 45 45 - right_0: { 46 46 - right: 0, 47 47 - }, 48 48 - bottom_0: { 49 49 - bottom: 0, 50 50 - }, 51 51 - left_0: { 52 52 - left: 0, 53 53 - }, 54 54 - z_10: { 55 55 - zIndex: 10, 56 56 - }, 57 57 - z_20: { 58 58 - zIndex: 20, 59 59 - }, 60 60 - z_30: { 61 61 - zIndex: 30, 62 62 - }, 63 63 - z_40: { 64 64 - zIndex: 40, 65 65 - }, 66 66 - z_50: { 67 67 - zIndex: 50, 68 68 - }, 69 69 - 70 70 - overflow_visible: { 71 71 - overflow: 'visible', 72 72 - }, 73 73 - overflow_x_visible: { 74 74 - overflowX: 'visible', 75 75 - }, 76 76 - overflow_y_visible: { 77 77 - overflowY: 'visible', 78 78 - }, 79 79 - overflow_hidden: { 80 80 - overflow: 'hidden', 81 81 - }, 82 82 - overflow_x_hidden: { 83 83 - overflowX: 'hidden', 84 84 - }, 85 85 - overflow_y_hidden: { 86 86 - overflowY: 'hidden', 87 87 - }, 88 88 - /** 89 89 - * @platform web 90 90 - */ 91 91 - overflow_auto: web({ 92 92 - overflow: 'auto', 93 93 - }), 8 8 + ...baseAtoms, 94 9 95 95 - /* 96 96 - * Width & Height 97 97 - */ 98 98 - w_full: { 99 99 - width: '100%', 100 100 - }, 101 101 - h_full: { 102 102 - height: '100%', 103 103 - }, 104 10 h_full_vh: web({ 105 11 height: '100vh', 106 12 }), 107 107 - max_w_full: { 108 108 - maxWidth: '100%', 109 109 - }, 110 110 - max_h_full: { 111 111 - maxHeight: '100%', 112 112 - }, 113 13 114 14 /** 115 15 * Used for the outermost components on screens, to ensure that they can fill ··· 132 32 }, 133 33 134 34 /* 135 135 - * Border radius 136 136 - */ 137 137 - rounded_0: { 138 138 - borderRadius: 0, 139 139 - }, 140 140 - rounded_2xs: { 141 141 - borderRadius: tokens.borderRadius._2xs, 142 142 - }, 143 143 - rounded_xs: { 144 144 - borderRadius: tokens.borderRadius.xs, 145 145 - }, 146 146 - rounded_sm: { 147 147 - borderRadius: tokens.borderRadius.sm, 148 148 - }, 149 149 - rounded_md: { 150 150 - borderRadius: tokens.borderRadius.md, 151 151 - }, 152 152 - rounded_lg: { 153 153 - borderRadius: tokens.borderRadius.lg, 154 154 - }, 155 155 - rounded_full: { 156 156 - borderRadius: tokens.borderRadius.full, 157 157 - }, 158 158 - 159 159 - /* 160 160 - * Flex 161 161 - */ 162 162 - gap_0: { 163 163 - gap: 0, 164 164 - }, 165 165 - gap_2xs: { 166 166 - gap: tokens.space._2xs, 167 167 - }, 168 168 - gap_xs: { 169 169 - gap: tokens.space.xs, 170 170 - }, 171 171 - gap_sm: { 172 172 - gap: tokens.space.sm, 173 173 - }, 174 174 - gap_md: { 175 175 - gap: tokens.space.md, 176 176 - }, 177 177 - gap_lg: { 178 178 - gap: tokens.space.lg, 179 179 - }, 180 180 - gap_xl: { 181 181 - gap: tokens.space.xl, 182 182 - }, 183 183 - gap_2xl: { 184 184 - gap: tokens.space._2xl, 185 185 - }, 186 186 - gap_3xl: { 187 187 - gap: tokens.space._3xl, 188 188 - }, 189 189 - gap_4xl: { 190 190 - gap: tokens.space._4xl, 191 191 - }, 192 192 - gap_5xl: { 193 193 - gap: tokens.space._5xl, 194 194 - }, 195 195 - flex: { 196 196 - display: 'flex', 197 197 - }, 198 198 - flex_col: { 199 199 - flexDirection: 'column', 200 200 - }, 201 201 - flex_row: { 202 202 - flexDirection: 'row', 203 203 - }, 204 204 - flex_col_reverse: { 205 205 - flexDirection: 'column-reverse', 206 206 - }, 207 207 - flex_row_reverse: { 208 208 - flexDirection: 'row-reverse', 209 209 - }, 210 210 - flex_wrap: { 211 211 - flexWrap: 'wrap', 212 212 - }, 213 213 - flex_nowrap: { 214 214 - flexWrap: 'nowrap', 215 215 - }, 216 216 - flex_0: { 217 217 - flex: web('0 0 auto') || (native(0) as number), 218 218 - }, 219 219 - flex_1: { 220 220 - flex: 1, 221 221 - }, 222 222 - flex_grow: { 223 223 - flexGrow: 1, 224 224 - }, 225 225 - flex_grow_0: { 226 226 - flexGrow: 0, 227 227 - }, 228 228 - flex_shrink: { 229 229 - flexShrink: 1, 230 230 - }, 231 231 - flex_shrink_0: { 232 232 - flexShrink: 0, 233 233 - }, 234 234 - justify_start: { 235 235 - justifyContent: 'flex-start', 236 236 - }, 237 237 - justify_center: { 238 238 - justifyContent: 'center', 239 239 - }, 240 240 - justify_between: { 241 241 - justifyContent: 'space-between', 242 242 - }, 243 243 - justify_end: { 244 244 - justifyContent: 'flex-end', 245 245 - }, 246 246 - align_center: { 247 247 - alignItems: 'center', 248 248 - }, 249 249 - align_start: { 250 250 - alignItems: 'flex-start', 251 251 - }, 252 252 - align_end: { 253 253 - alignItems: 'flex-end', 254 254 - }, 255 255 - align_baseline: { 256 256 - alignItems: 'baseline', 257 257 - }, 258 258 - align_stretch: { 259 259 - alignItems: 'stretch', 260 260 - }, 261 261 - self_auto: { 262 262 - alignSelf: 'auto', 263 263 - }, 264 264 - self_start: { 265 265 - alignSelf: 'flex-start', 266 266 - }, 267 267 - self_end: { 268 268 - alignSelf: 'flex-end', 269 269 - }, 270 270 - self_center: { 271 271 - alignSelf: 'center', 272 272 - }, 273 273 - self_stretch: { 274 274 - alignSelf: 'stretch', 275 275 - }, 276 276 - self_baseline: { 277 277 - alignSelf: 'baseline', 278 278 - }, 279 279 - 280 280 - /* 281 281 - * Text 282 282 - */ 283 283 - text_left: { 284 284 - textAlign: 'left', 285 285 - }, 286 286 - text_center: { 287 287 - textAlign: 'center', 288 288 - }, 289 289 - text_right: { 290 290 - textAlign: 'right', 291 291 - }, 292 292 - text_2xs: { 293 293 - fontSize: tokens.fontSize._2xs, 294 294 - letterSpacing: tokens.TRACKING, 295 295 - }, 296 296 - text_xs: { 297 297 - fontSize: tokens.fontSize.xs, 298 298 - letterSpacing: tokens.TRACKING, 299 299 - }, 300 300 - text_sm: { 301 301 - fontSize: tokens.fontSize.sm, 302 302 - letterSpacing: tokens.TRACKING, 303 303 - }, 304 304 - text_md: { 305 305 - fontSize: tokens.fontSize.md, 306 306 - letterSpacing: tokens.TRACKING, 307 307 - }, 308 308 - text_lg: { 309 309 - fontSize: tokens.fontSize.lg, 310 310 - letterSpacing: tokens.TRACKING, 311 311 - }, 312 312 - text_xl: { 313 313 - fontSize: tokens.fontSize.xl, 314 314 - letterSpacing: tokens.TRACKING, 315 315 - }, 316 316 - text_2xl: { 317 317 - fontSize: tokens.fontSize._2xl, 318 318 - letterSpacing: tokens.TRACKING, 319 319 - }, 320 320 - text_3xl: { 321 321 - fontSize: tokens.fontSize._3xl, 322 322 - letterSpacing: tokens.TRACKING, 323 323 - }, 324 324 - text_4xl: { 325 325 - fontSize: tokens.fontSize._4xl, 326 326 - letterSpacing: tokens.TRACKING, 327 327 - }, 328 328 - text_5xl: { 329 329 - fontSize: tokens.fontSize._5xl, 330 330 - letterSpacing: tokens.TRACKING, 331 331 - }, 332 332 - leading_tight: { 333 333 - lineHeight: 1.15, 334 334 - }, 335 335 - leading_snug: { 336 336 - lineHeight: 1.3, 337 337 - }, 338 338 - leading_normal: { 339 339 - lineHeight: 1.5, 340 340 - }, 341 341 - tracking_normal: { 342 342 - letterSpacing: tokens.TRACKING, 343 343 - }, 344 344 - font_normal: { 345 345 - fontWeight: tokens.fontWeight.normal, 346 346 - }, 347 347 - font_medium: { 348 348 - fontWeight: tokens.fontWeight.medium, 349 349 - }, 350 350 - font_bold: { 351 351 - fontWeight: tokens.fontWeight.bold, 352 352 - }, 353 353 - font_heavy: { 354 354 - fontWeight: tokens.fontWeight.heavy, 355 355 - }, 356 356 - italic: { 357 357 - fontStyle: 'italic', 358 358 - }, 359 359 - 360 360 - /* 361 361 - * Border 362 362 - */ 363 363 - border_0: { 364 364 - borderWidth: 0, 365 365 - }, 366 366 - border_t_0: { 367 367 - borderTopWidth: 0, 368 368 - }, 369 369 - border_b_0: { 370 370 - borderBottomWidth: 0, 371 371 - }, 372 372 - border_l_0: { 373 373 - borderLeftWidth: 0, 374 374 - }, 375 375 - border_r_0: { 376 376 - borderRightWidth: 0, 377 377 - }, 378 378 - border_x_0: { 379 379 - borderLeftWidth: 0, 380 380 - borderRightWidth: 0, 381 381 - }, 382 382 - border_y_0: { 383 383 - borderTopWidth: 0, 384 384 - borderBottomWidth: 0, 385 385 - }, 386 386 - border: { 387 387 - borderWidth: StyleSheet.hairlineWidth, 388 388 - }, 389 389 - border_t: { 390 390 - borderTopWidth: StyleSheet.hairlineWidth, 391 391 - }, 392 392 - border_b: { 393 393 - borderBottomWidth: StyleSheet.hairlineWidth, 394 394 - }, 395 395 - border_l: { 396 396 - borderLeftWidth: StyleSheet.hairlineWidth, 397 397 - }, 398 398 - border_r: { 399 399 - borderRightWidth: StyleSheet.hairlineWidth, 400 400 - }, 401 401 - border_x: { 402 402 - borderLeftWidth: StyleSheet.hairlineWidth, 403 403 - borderRightWidth: StyleSheet.hairlineWidth, 404 404 - }, 405 405 - border_y: { 406 406 - borderTopWidth: StyleSheet.hairlineWidth, 407 407 - borderBottomWidth: StyleSheet.hairlineWidth, 408 408 - }, 409 409 - border_transparent: { 410 410 - borderColor: 'transparent', 411 411 - }, 412 412 - curve_circular: ios({ 413 413 - borderCurve: 'circular', 414 414 - }), 415 415 - curve_continuous: ios({ 416 416 - borderCurve: 'continuous', 417 417 - }), 418 418 - 419 419 - /* 420 420 - * Shadow 421 421 - */ 422 422 - shadow_sm: { 423 423 - shadowRadius: 8, 424 424 - shadowOpacity: 0.1, 425 425 - elevation: 8, 426 426 - }, 427 427 - shadow_md: { 428 428 - shadowRadius: 16, 429 429 - shadowOpacity: 0.1, 430 430 - elevation: 16, 431 431 - }, 432 432 - shadow_lg: { 433 433 - shadowRadius: 32, 434 434 - shadowOpacity: 0.1, 435 435 - elevation: 24, 436 436 - }, 437 437 - 438 438 - /* 439 439 - * Padding 440 440 - */ 441 441 - p_0: { 442 442 - padding: 0, 443 443 - }, 444 444 - p_2xs: { 445 445 - padding: tokens.space._2xs, 446 446 - }, 447 447 - p_xs: { 448 448 - padding: tokens.space.xs, 449 449 - }, 450 450 - p_sm: { 451 451 - padding: tokens.space.sm, 452 452 - }, 453 453 - p_md: { 454 454 - padding: tokens.space.md, 455 455 - }, 456 456 - p_lg: { 457 457 - padding: tokens.space.lg, 458 458 - }, 459 459 - p_xl: { 460 460 - padding: tokens.space.xl, 461 461 - }, 462 462 - p_2xl: { 463 463 - padding: tokens.space._2xl, 464 464 - }, 465 465 - p_3xl: { 466 466 - padding: tokens.space._3xl, 467 467 - }, 468 468 - p_4xl: { 469 469 - padding: tokens.space._4xl, 470 470 - }, 471 471 - p_5xl: { 472 472 - padding: tokens.space._5xl, 473 473 - }, 474 474 - px_0: { 475 475 - paddingLeft: 0, 476 476 - paddingRight: 0, 477 477 - }, 478 478 - px_2xs: { 479 479 - paddingLeft: tokens.space._2xs, 480 480 - paddingRight: tokens.space._2xs, 481 481 - }, 482 482 - px_xs: { 483 483 - paddingLeft: tokens.space.xs, 484 484 - paddingRight: tokens.space.xs, 485 485 - }, 486 486 - px_sm: { 487 487 - paddingLeft: tokens.space.sm, 488 488 - paddingRight: tokens.space.sm, 489 489 - }, 490 490 - px_md: { 491 491 - paddingLeft: tokens.space.md, 492 492 - paddingRight: tokens.space.md, 493 493 - }, 494 494 - px_lg: { 495 495 - paddingLeft: tokens.space.lg, 496 496 - paddingRight: tokens.space.lg, 497 497 - }, 498 498 - px_xl: { 499 499 - paddingLeft: tokens.space.xl, 500 500 - paddingRight: tokens.space.xl, 501 501 - }, 502 502 - px_2xl: { 503 503 - paddingLeft: tokens.space._2xl, 504 504 - paddingRight: tokens.space._2xl, 505 505 - }, 506 506 - px_3xl: { 507 507 - paddingLeft: tokens.space._3xl, 508 508 - paddingRight: tokens.space._3xl, 509 509 - }, 510 510 - px_4xl: { 511 511 - paddingLeft: tokens.space._4xl, 512 512 - paddingRight: tokens.space._4xl, 513 513 - }, 514 514 - px_5xl: { 515 515 - paddingLeft: tokens.space._5xl, 516 516 - paddingRight: tokens.space._5xl, 517 517 - }, 518 518 - py_0: { 519 519 - paddingTop: 0, 520 520 - paddingBottom: 0, 521 521 - }, 522 522 - py_2xs: { 523 523 - paddingTop: tokens.space._2xs, 524 524 - paddingBottom: tokens.space._2xs, 525 525 - }, 526 526 - py_xs: { 527 527 - paddingTop: tokens.space.xs, 528 528 - paddingBottom: tokens.space.xs, 529 529 - }, 530 530 - py_sm: { 531 531 - paddingTop: tokens.space.sm, 532 532 - paddingBottom: tokens.space.sm, 533 533 - }, 534 534 - py_md: { 535 535 - paddingTop: tokens.space.md, 536 536 - paddingBottom: tokens.space.md, 537 537 - }, 538 538 - py_lg: { 539 539 - paddingTop: tokens.space.lg, 540 540 - paddingBottom: tokens.space.lg, 541 541 - }, 542 542 - py_xl: { 543 543 - paddingTop: tokens.space.xl, 544 544 - paddingBottom: tokens.space.xl, 545 545 - }, 546 546 - py_2xl: { 547 547 - paddingTop: tokens.space._2xl, 548 548 - paddingBottom: tokens.space._2xl, 549 549 - }, 550 550 - py_3xl: { 551 551 - paddingTop: tokens.space._3xl, 552 552 - paddingBottom: tokens.space._3xl, 553 553 - }, 554 554 - py_4xl: { 555 555 - paddingTop: tokens.space._4xl, 556 556 - paddingBottom: tokens.space._4xl, 557 557 - }, 558 558 - py_5xl: { 559 559 - paddingTop: tokens.space._5xl, 560 560 - paddingBottom: tokens.space._5xl, 561 561 - }, 562 562 - pt_0: { 563 563 - paddingTop: 0, 564 564 - }, 565 565 - pt_2xs: { 566 566 - paddingTop: tokens.space._2xs, 567 567 - }, 568 568 - pt_xs: { 569 569 - paddingTop: tokens.space.xs, 570 570 - }, 571 571 - pt_sm: { 572 572 - paddingTop: tokens.space.sm, 573 573 - }, 574 574 - pt_md: { 575 575 - paddingTop: tokens.space.md, 576 576 - }, 577 577 - pt_lg: { 578 578 - paddingTop: tokens.space.lg, 579 579 - }, 580 580 - pt_xl: { 581 581 - paddingTop: tokens.space.xl, 582 582 - }, 583 583 - pt_2xl: { 584 584 - paddingTop: tokens.space._2xl, 585 585 - }, 586 586 - pt_3xl: { 587 587 - paddingTop: tokens.space._3xl, 588 588 - }, 589 589 - pt_4xl: { 590 590 - paddingTop: tokens.space._4xl, 591 591 - }, 592 592 - pt_5xl: { 593 593 - paddingTop: tokens.space._5xl, 594 594 - }, 595 595 - pb_0: { 596 596 - paddingBottom: 0, 597 597 - }, 598 598 - pb_2xs: { 599 599 - paddingBottom: tokens.space._2xs, 600 600 - }, 601 601 - pb_xs: { 602 602 - paddingBottom: tokens.space.xs, 603 603 - }, 604 604 - pb_sm: { 605 605 - paddingBottom: tokens.space.sm, 606 606 - }, 607 607 - pb_md: { 608 608 - paddingBottom: tokens.space.md, 609 609 - }, 610 610 - pb_lg: { 611 611 - paddingBottom: tokens.space.lg, 612 612 - }, 613 613 - pb_xl: { 614 614 - paddingBottom: tokens.space.xl, 615 615 - }, 616 616 - pb_2xl: { 617 617 - paddingBottom: tokens.space._2xl, 618 618 - }, 619 619 - pb_3xl: { 620 620 - paddingBottom: tokens.space._3xl, 621 621 - }, 622 622 - pb_4xl: { 623 623 - paddingBottom: tokens.space._4xl, 624 624 - }, 625 625 - pb_5xl: { 626 626 - paddingBottom: tokens.space._5xl, 627 627 - }, 628 628 - pl_0: { 629 629 - paddingLeft: 0, 630 630 - }, 631 631 - pl_2xs: { 632 632 - paddingLeft: tokens.space._2xs, 633 633 - }, 634 634 - pl_xs: { 635 635 - paddingLeft: tokens.space.xs, 636 636 - }, 637 637 - pl_sm: { 638 638 - paddingLeft: tokens.space.sm, 639 639 - }, 640 640 - pl_md: { 641 641 - paddingLeft: tokens.space.md, 642 642 - }, 643 643 - pl_lg: { 644 644 - paddingLeft: tokens.space.lg, 645 645 - }, 646 646 - pl_xl: { 647 647 - paddingLeft: tokens.space.xl, 648 648 - }, 649 649 - pl_2xl: { 650 650 - paddingLeft: tokens.space._2xl, 651 651 - }, 652 652 - pl_3xl: { 653 653 - paddingLeft: tokens.space._3xl, 654 654 - }, 655 655 - pl_4xl: { 656 656 - paddingLeft: tokens.space._4xl, 657 657 - }, 658 658 - pl_5xl: { 659 659 - paddingLeft: tokens.space._5xl, 660 660 - }, 661 661 - pr_0: { 662 662 - paddingRight: 0, 663 663 - }, 664 664 - pr_2xs: { 665 665 - paddingRight: tokens.space._2xs, 666 666 - }, 667 667 - pr_xs: { 668 668 - paddingRight: tokens.space.xs, 669 669 - }, 670 670 - pr_sm: { 671 671 - paddingRight: tokens.space.sm, 672 672 - }, 673 673 - pr_md: { 674 674 - paddingRight: tokens.space.md, 675 675 - }, 676 676 - pr_lg: { 677 677 - paddingRight: tokens.space.lg, 678 678 - }, 679 679 - pr_xl: { 680 680 - paddingRight: tokens.space.xl, 681 681 - }, 682 682 - pr_2xl: { 683 683 - paddingRight: tokens.space._2xl, 684 684 - }, 685 685 - pr_3xl: { 686 686 - paddingRight: tokens.space._3xl, 687 687 - }, 688 688 - pr_4xl: { 689 689 - paddingRight: tokens.space._4xl, 690 690 - }, 691 691 - pr_5xl: { 692 692 - paddingRight: tokens.space._5xl, 693 693 - }, 694 694 - 695 695 - /* 696 696 - * Margin 697 697 - */ 698 698 - m_0: { 699 699 - margin: 0, 700 700 - }, 701 701 - m_2xs: { 702 702 - margin: tokens.space._2xs, 703 703 - }, 704 704 - m_xs: { 705 705 - margin: tokens.space.xs, 706 706 - }, 707 707 - m_sm: { 708 708 - margin: tokens.space.sm, 709 709 - }, 710 710 - m_md: { 711 711 - margin: tokens.space.md, 712 712 - }, 713 713 - m_lg: { 714 714 - margin: tokens.space.lg, 715 715 - }, 716 716 - m_xl: { 717 717 - margin: tokens.space.xl, 718 718 - }, 719 719 - m_2xl: { 720 720 - margin: tokens.space._2xl, 721 721 - }, 722 722 - m_3xl: { 723 723 - margin: tokens.space._3xl, 724 724 - }, 725 725 - m_4xl: { 726 726 - margin: tokens.space._4xl, 727 727 - }, 728 728 - m_5xl: { 729 729 - margin: tokens.space._5xl, 730 730 - }, 731 731 - m_auto: { 732 732 - margin: 'auto', 733 733 - }, 734 734 - mx_0: { 735 735 - marginLeft: 0, 736 736 - marginRight: 0, 737 737 - }, 738 738 - mx_2xs: { 739 739 - marginLeft: tokens.space._2xs, 740 740 - marginRight: tokens.space._2xs, 741 741 - }, 742 742 - mx_xs: { 743 743 - marginLeft: tokens.space.xs, 744 744 - marginRight: tokens.space.xs, 745 745 - }, 746 746 - mx_sm: { 747 747 - marginLeft: tokens.space.sm, 748 748 - marginRight: tokens.space.sm, 749 749 - }, 750 750 - mx_md: { 751 751 - marginLeft: tokens.space.md, 752 752 - marginRight: tokens.space.md, 753 753 - }, 754 754 - mx_lg: { 755 755 - marginLeft: tokens.space.lg, 756 756 - marginRight: tokens.space.lg, 757 757 - }, 758 758 - mx_xl: { 759 759 - marginLeft: tokens.space.xl, 760 760 - marginRight: tokens.space.xl, 761 761 - }, 762 762 - mx_2xl: { 763 763 - marginLeft: tokens.space._2xl, 764 764 - marginRight: tokens.space._2xl, 765 765 - }, 766 766 - mx_3xl: { 767 767 - marginLeft: tokens.space._3xl, 768 768 - marginRight: tokens.space._3xl, 769 769 - }, 770 770 - mx_4xl: { 771 771 - marginLeft: tokens.space._4xl, 772 772 - marginRight: tokens.space._4xl, 773 773 - }, 774 774 - mx_5xl: { 775 775 - marginLeft: tokens.space._5xl, 776 776 - marginRight: tokens.space._5xl, 777 777 - }, 778 778 - mx_auto: { 779 779 - marginLeft: 'auto', 780 780 - marginRight: 'auto', 781 781 - }, 782 782 - my_0: { 783 783 - marginTop: 0, 784 784 - marginBottom: 0, 785 785 - }, 786 786 - my_2xs: { 787 787 - marginTop: tokens.space._2xs, 788 788 - marginBottom: tokens.space._2xs, 789 789 - }, 790 790 - my_xs: { 791 791 - marginTop: tokens.space.xs, 792 792 - marginBottom: tokens.space.xs, 793 793 - }, 794 794 - my_sm: { 795 795 - marginTop: tokens.space.sm, 796 796 - marginBottom: tokens.space.sm, 797 797 - }, 798 798 - my_md: { 799 799 - marginTop: tokens.space.md, 800 800 - marginBottom: tokens.space.md, 801 801 - }, 802 802 - my_lg: { 803 803 - marginTop: tokens.space.lg, 804 804 - marginBottom: tokens.space.lg, 805 805 - }, 806 806 - my_xl: { 807 807 - marginTop: tokens.space.xl, 808 808 - marginBottom: tokens.space.xl, 809 809 - }, 810 810 - my_2xl: { 811 811 - marginTop: tokens.space._2xl, 812 812 - marginBottom: tokens.space._2xl, 813 813 - }, 814 814 - my_3xl: { 815 815 - marginTop: tokens.space._3xl, 816 816 - marginBottom: tokens.space._3xl, 817 817 - }, 818 818 - my_4xl: { 819 819 - marginTop: tokens.space._4xl, 820 820 - marginBottom: tokens.space._4xl, 821 821 - }, 822 822 - my_5xl: { 823 823 - marginTop: tokens.space._5xl, 824 824 - marginBottom: tokens.space._5xl, 825 825 - }, 826 826 - my_auto: { 827 827 - marginTop: 'auto', 828 828 - marginBottom: 'auto', 829 829 - }, 830 830 - mt_0: { 831 831 - marginTop: 0, 832 832 - }, 833 833 - mt_2xs: { 834 834 - marginTop: tokens.space._2xs, 835 835 - }, 836 836 - mt_xs: { 837 837 - marginTop: tokens.space.xs, 838 838 - }, 839 839 - mt_sm: { 840 840 - marginTop: tokens.space.sm, 841 841 - }, 842 842 - mt_md: { 843 843 - marginTop: tokens.space.md, 844 844 - }, 845 845 - mt_lg: { 846 846 - marginTop: tokens.space.lg, 847 847 - }, 848 848 - mt_xl: { 849 849 - marginTop: tokens.space.xl, 850 850 - }, 851 851 - mt_2xl: { 852 852 - marginTop: tokens.space._2xl, 853 853 - }, 854 854 - mt_3xl: { 855 855 - marginTop: tokens.space._3xl, 856 856 - }, 857 857 - mt_4xl: { 858 858 - marginTop: tokens.space._4xl, 859 859 - }, 860 860 - mt_5xl: { 861 861 - marginTop: tokens.space._5xl, 862 862 - }, 863 863 - mt_auto: { 864 864 - marginTop: 'auto', 865 865 - }, 866 866 - mb_0: { 867 867 - marginBottom: 0, 868 868 - }, 869 869 - mb_2xs: { 870 870 - marginBottom: tokens.space._2xs, 871 871 - }, 872 872 - mb_xs: { 873 873 - marginBottom: tokens.space.xs, 874 874 - }, 875 875 - mb_sm: { 876 876 - marginBottom: tokens.space.sm, 877 877 - }, 878 878 - mb_md: { 879 879 - marginBottom: tokens.space.md, 880 880 - }, 881 881 - mb_lg: { 882 882 - marginBottom: tokens.space.lg, 883 883 - }, 884 884 - mb_xl: { 885 885 - marginBottom: tokens.space.xl, 886 886 - }, 887 887 - mb_2xl: { 888 888 - marginBottom: tokens.space._2xl, 889 889 - }, 890 890 - mb_3xl: { 891 891 - marginBottom: tokens.space._3xl, 892 892 - }, 893 893 - mb_4xl: { 894 894 - marginBottom: tokens.space._4xl, 895 895 - }, 896 896 - mb_5xl: { 897 897 - marginBottom: tokens.space._5xl, 898 898 - }, 899 899 - mb_auto: { 900 900 - marginBottom: 'auto', 901 901 - }, 902 902 - ml_0: { 903 903 - marginLeft: 0, 904 904 - }, 905 905 - ml_2xs: { 906 906 - marginLeft: tokens.space._2xs, 907 907 - }, 908 908 - ml_xs: { 909 909 - marginLeft: tokens.space.xs, 910 910 - }, 911 911 - ml_sm: { 912 912 - marginLeft: tokens.space.sm, 913 913 - }, 914 914 - ml_md: { 915 915 - marginLeft: tokens.space.md, 916 916 - }, 917 917 - ml_lg: { 918 918 - marginLeft: tokens.space.lg, 919 919 - }, 920 920 - ml_xl: { 921 921 - marginLeft: tokens.space.xl, 922 922 - }, 923 923 - ml_2xl: { 924 924 - marginLeft: tokens.space._2xl, 925 925 - }, 926 926 - ml_3xl: { 927 927 - marginLeft: tokens.space._3xl, 928 928 - }, 929 929 - ml_4xl: { 930 930 - marginLeft: tokens.space._4xl, 931 931 - }, 932 932 - ml_5xl: { 933 933 - marginLeft: tokens.space._5xl, 934 934 - }, 935 935 - ml_auto: { 936 936 - marginLeft: 'auto', 937 937 - }, 938 938 - mr_0: { 939 939 - marginRight: 0, 940 940 - }, 941 941 - mr_2xs: { 942 942 - marginRight: tokens.space._2xs, 943 943 - }, 944 944 - mr_xs: { 945 945 - marginRight: tokens.space.xs, 946 946 - }, 947 947 - mr_sm: { 948 948 - marginRight: tokens.space.sm, 949 949 - }, 950 950 - mr_md: { 951 951 - marginRight: tokens.space.md, 952 952 - }, 953 953 - mr_lg: { 954 954 - marginRight: tokens.space.lg, 955 955 - }, 956 956 - mr_xl: { 957 957 - marginRight: tokens.space.xl, 958 958 - }, 959 959 - mr_2xl: { 960 960 - marginRight: tokens.space._2xl, 961 961 - }, 962 962 - mr_3xl: { 963 963 - marginRight: tokens.space._3xl, 964 964 - }, 965 965 - mr_4xl: { 966 966 - marginRight: tokens.space._4xl, 967 967 - }, 968 968 - mr_5xl: { 969 969 - marginRight: tokens.space._5xl, 970 970 - }, 971 971 - mr_auto: { 972 972 - marginRight: 'auto', 973 973 - }, 974 974 - 975 975 - /* 976 976 - * Pointer events & user select 977 977 - */ 978 978 - pointer_events_none: { 979 979 - pointerEvents: 'none', 980 980 - }, 981 981 - pointer_events_auto: { 982 982 - pointerEvents: 'auto', 983 983 - }, 984 984 - user_select_none: { 985 985 - userSelect: 'none', 986 986 - }, 987 987 - user_select_text: { 988 988 - userSelect: 'text', 989 989 - }, 990 990 - user_select_all: { 991 991 - userSelect: 'all', 992 992 - }, 993 993 - outline_inset_1: { 994 994 - outlineOffset: -1, 995 995 - }, 996 996 - 997 997 - /* 998 998 - * Text decoration 999 999 - */ 1000 1000 - underline: { 1001 1001 - textDecorationLine: 'underline', 1002 1002 - }, 1003 1003 - strike_through: { 1004 1004 - textDecorationLine: 'line-through', 1005 1005 - }, 1006 1006 - 1007 1007 - /* 1008 1008 - * Display 1009 1009 - */ 1010 1010 - hidden: { 1011 1011 - display: 'none', 1012 1012 - }, 1013 1013 - inline: web({ 1014 1014 - display: 'inline', 1015 1015 - }), 1016 1016 - block: web({ 1017 1017 - display: 'block', 1018 1018 - }), 1019 1019 - contents: web({ 1020 1020 - display: 'contents', 1021 1021 - }), 1022 1022 - 1023 1023 - /* 1024 35 * Transition 1025 36 */ 1026 37 transition_none: web({ ··· 1099 110 transform: [], 1100 111 }, 1101 112 }) as {transform: Exclude<ViewStyle['transform'], string | undefined>}, 1102 1102 - 1103 1103 - pointer: web({ 1104 1104 - cursor: 'pointer', 1105 1105 - }), 1106 113 } as const

+5 -5

src/alf/fonts.ts

··· 7 7 8 8 const factor = 0.0625 // 1 - (15/16) 9 9 const fontScaleMultipliers: Record<Device['fontScale'], number> = { 10 10 - '-2': 1 - factor * 3, 11 11 - '-1': 1 - factor * 2, 12 12 - '0': 1 - factor * 1, // default 13 13 - '1': 1, 14 14 - '2': 1 + factor * 1, 10 10 + '-2': 1 - factor * 1, // unused 11 11 + '-1': 1 - factor * 1, 12 12 + '0': 1, // default 13 13 + '1': 1 + factor * 1, 14 14 + '2': 1 + factor * 1, // unused 15 15 } 16 16 17 17 export function computeFontScaleMultiplier(scale: Device['fontScale']) {

+13 -30

src/alf/index.tsx

··· 1 1 import React from 'react' 2 2 + import {type Theme, type ThemeName} from '@bsky.app/alf' 2 3 3 4 import { 4 5 computeFontScaleMultiplier, ··· 7 8 setFontFamily as persistFontFamily, 8 9 setFontScale as persistFontScale, 9 10 } from '#/alf/fonts' 10 10 - import {createThemes, defaultTheme} from '#/alf/themes' 11 11 - import {type Theme, type ThemeName} from '#/alf/types' 12 12 - import {BLUE_HUE, GREEN_HUE, RED_HUE} from '#/alf/util/colorGeneration' 11 11 + import {themes} from '#/alf/themes' 13 12 import {type Device} from '#/storage' 14 13 14 14 + export {type TextStyleProp, type Theme, type ViewStyleProp} from '@bsky.app/alf' 15 15 export {atoms} from '#/alf/atoms' 16 16 export * from '#/alf/breakpoints' 17 17 export * from '#/alf/fonts' 18 18 export * as tokens from '#/alf/tokens' 19 19 - export * from '#/alf/types' 20 19 export * from '#/alf/util/flatten' 21 20 export * from '#/alf/util/platform' 22 21 export * from '#/alf/util/themeSelector' ··· 25 24 export type Alf = { 26 25 themeName: ThemeName 27 26 theme: Theme 28 28 - themes: ReturnType<typeof createThemes> 27 27 + themes: typeof themes 29 28 fonts: { 30 29 scale: Exclude<Device['fontScale'], undefined> 31 30 scaleMultiplier: number ··· 44 43 */ 45 44 export const Context = React.createContext<Alf>({ 46 45 themeName: 'light', 47 47 - theme: defaultTheme, 48 48 - themes: createThemes({ 49 49 - hues: { 50 50 - primary: BLUE_HUE, 51 51 - negative: RED_HUE, 52 52 - positive: GREEN_HUE, 53 53 - }, 54 54 - }), 46 46 + theme: themes.light, 47 47 + themes, 55 48 fonts: { 56 49 scale: getFontScale(), 57 50 scaleMultiplier: computeFontScaleMultiplier(getFontScale()), ··· 76 69 const setFontScaleAndPersist = React.useCallback< 77 70 Alf['fonts']['setFontScale'] 78 71 >( 79 79 - fontScale => { 80 80 - setFontScale(fontScale) 81 81 - persistFontScale(fontScale) 82 82 - setFontScaleMultiplier(computeFontScaleMultiplier(fontScale)) 72 72 + fs => { 73 73 + setFontScale(fs) 74 74 + persistFontScale(fs) 75 75 + setFontScaleMultiplier(computeFontScaleMultiplier(fs)) 83 76 }, 84 77 [setFontScale], 85 78 ) ··· 89 82 const setFontFamilyAndPersist = React.useCallback< 90 83 Alf['fonts']['setFontFamily'] 91 84 >( 92 92 - fontFamily => { 93 93 - setFontFamily(fontFamily) 94 94 - persistFontFamily(fontFamily) 85 85 + ff => { 86 86 + setFontFamily(ff) 87 87 + persistFontFamily(ff) 95 88 }, 96 89 [setFontFamily], 97 90 ) 98 98 - const themes = React.useMemo(() => { 99 99 - return createThemes({ 100 100 - hues: { 101 101 - primary: BLUE_HUE, 102 102 - negative: RED_HUE, 103 103 - positive: GREEN_HUE, 104 104 - }, 105 105 - }) 106 106 - }, []) 107 91 108 92 const value = React.useMemo<Alf>( 109 93 () => ({ ··· 121 105 }), 122 106 [ 123 107 themeName, 124 124 - themes, 125 108 fontScale, 126 109 setFontScaleAndPersist, 127 110 fontFamily,

+22 -563

src/alf/themes.ts

··· 1 1 - import {atoms} from '#/alf/atoms' 2 2 - import {type Palette, type Theme} from '#/alf/types' 3 1 import { 4 4 - BLUE_HUE, 5 5 - defaultScale, 6 6 - dimScale, 7 7 - GREEN_HUE, 8 8 - RED_HUE, 9 9 - } from '#/alf/util/colorGeneration' 2 2 + createThemes, 3 3 + DEFAULT_PALETTE, 4 4 + DEFAULT_SUBDUED_PALETTE, 5 5 + } from '@bsky.app/alf' 10 6 11 11 - const themes = createThemes({ 12 12 - hues: { 13 13 - primary: BLUE_HUE, 14 14 - negative: RED_HUE, 15 15 - positive: GREEN_HUE, 16 16 - }, 7 7 + const DEFAULT_THEMES = createThemes({ 8 8 + defaultPalette: DEFAULT_PALETTE, 9 9 + subduedPalette: DEFAULT_SUBDUED_PALETTE, 17 10 }) 18 11 12 12 + export const themes = { 13 13 + lightPalette: DEFAULT_THEMES.light.palette, 14 14 + darkPalette: DEFAULT_THEMES.dark.palette, 15 15 + dimPalette: DEFAULT_THEMES.dim.palette, 16 16 + light: DEFAULT_THEMES.light, 17 17 + dark: DEFAULT_THEMES.dark, 18 18 + dim: DEFAULT_THEMES.dim, 19 19 + } 20 20 + 19 21 /** 20 22 * @deprecated use ALF and access palette from `useTheme()` 21 23 */ 22 22 - export const lightPalette = themes.lightPalette 24 24 + export const lightPalette = DEFAULT_THEMES.light.palette 23 25 /** 24 26 * @deprecated use ALF and access palette from `useTheme()` 25 27 */ 26 26 - export const darkPalette = themes.darkPalette 28 28 + export const darkPalette = DEFAULT_THEMES.dark.palette 27 29 /** 28 30 * @deprecated use ALF and access palette from `useTheme()` 29 31 */ 30 30 - export const dimPalette = themes.dimPalette 32 32 + export const dimPalette = DEFAULT_THEMES.dim.palette 31 33 /** 32 34 * @deprecated use ALF and access theme from `useTheme()` 33 35 */ 34 34 - export const light = themes.light 36 36 + export const light = DEFAULT_THEMES.light 35 37 /** 36 38 * @deprecated use ALF and access theme from `useTheme()` 37 39 */ 38 38 - export const dark = themes.dark 40 40 + export const dark = DEFAULT_THEMES.dark 39 41 /** 40 42 * @deprecated use ALF and access theme from `useTheme()` 41 43 */ 42 42 - export const dim = themes.dim 43 43 - 44 44 - export const defaultTheme = themes.light 45 45 - 46 46 - export function createThemes({ 47 47 - hues, 48 48 - }: { 49 49 - hues: { 50 50 - primary: number 51 51 - negative: number 52 52 - positive: number 53 53 - } 54 54 - }): { 55 55 - lightPalette: Palette 56 56 - darkPalette: Palette 57 57 - dimPalette: Palette 58 58 - light: Theme 59 59 - dark: Theme 60 60 - dim: Theme 61 61 - } { 62 62 - const color = { 63 63 - like: '#ec4899', 64 64 - trueBlack: '#000000', 65 65 - 66 66 - gray_0: `hsl(${hues.primary}, 20%, ${defaultScale[14]}%)`, 67 67 - gray_25: `hsl(${hues.primary}, 20%, ${defaultScale[13]}%)`, 68 68 - gray_50: `hsl(${hues.primary}, 20%, ${defaultScale[12]}%)`, 69 69 - gray_100: `hsl(${hues.primary}, 20%, ${defaultScale[11]}%)`, 70 70 - gray_200: `hsl(${hues.primary}, 20%, ${defaultScale[10]}%)`, 71 71 - gray_300: `hsl(${hues.primary}, 20%, ${defaultScale[9]}%)`, 72 72 - gray_400: `hsl(${hues.primary}, 20%, ${defaultScale[8]}%)`, 73 73 - gray_500: `hsl(${hues.primary}, 20%, ${defaultScale[7]}%)`, 74 74 - gray_600: `hsl(${hues.primary}, 24%, ${defaultScale[6]}%)`, 75 75 - gray_700: `hsl(${hues.primary}, 24%, ${defaultScale[5]}%)`, 76 76 - gray_800: `hsl(${hues.primary}, 28%, ${defaultScale[4]}%)`, 77 77 - gray_900: `hsl(${hues.primary}, 28%, ${defaultScale[3]}%)`, 78 78 - gray_950: `hsl(${hues.primary}, 28%, ${defaultScale[2]}%)`, 79 79 - gray_975: `hsl(${hues.primary}, 28%, ${defaultScale[1]}%)`, 80 80 - gray_1000: `hsl(${hues.primary}, 28%, ${defaultScale[0]}%)`, 81 81 - 82 82 - primary_25: `hsl(${hues.primary}, 99%, 97%)`, 83 83 - primary_50: `hsl(${hues.primary}, 99%, 95%)`, 84 84 - primary_100: `hsl(${hues.primary}, 99%, 90%)`, 85 85 - primary_200: `hsl(${hues.primary}, 99%, 80%)`, 86 86 - primary_300: `hsl(${hues.primary}, 99%, 70%)`, 87 87 - primary_400: `hsl(${hues.primary}, 99%, 60%)`, 88 88 - primary_500: `hsl(${hues.primary}, 99%, 53%)`, 89 89 - primary_600: `hsl(${hues.primary}, 99%, 42%)`, 90 90 - primary_700: `hsl(${hues.primary}, 99%, 34%)`, 91 91 - primary_800: `hsl(${hues.primary}, 99%, 26%)`, 92 92 - primary_900: `hsl(${hues.primary}, 99%, 18%)`, 93 93 - primary_950: `hsl(${hues.primary}, 99%, 10%)`, 94 94 - primary_975: `hsl(${hues.primary}, 99%, 7%)`, 95 95 - 96 96 - green_25: `hsl(${hues.positive}, 82%, 97%)`, 97 97 - green_50: `hsl(${hues.positive}, 82%, 95%)`, 98 98 - green_100: `hsl(${hues.positive}, 82%, 90%)`, 99 99 - green_200: `hsl(${hues.positive}, 82%, 80%)`, 100 100 - green_300: `hsl(${hues.positive}, 82%, 70%)`, 101 101 - green_400: `hsl(${hues.positive}, 82%, 60%)`, 102 102 - green_500: `hsl(${hues.positive}, 82%, 50%)`, 103 103 - green_600: `hsl(${hues.positive}, 82%, 42%)`, 104 104 - green_700: `hsl(${hues.positive}, 82%, 34%)`, 105 105 - green_800: `hsl(${hues.positive}, 82%, 26%)`, 106 106 - green_900: `hsl(${hues.positive}, 82%, 18%)`, 107 107 - green_950: `hsl(${hues.positive}, 82%, 10%)`, 108 108 - green_975: `hsl(${hues.positive}, 82%, 7%)`, 109 109 - 110 110 - red_25: `hsl(${hues.negative}, 91%, 97%)`, 111 111 - red_50: `hsl(${hues.negative}, 91%, 95%)`, 112 112 - red_100: `hsl(${hues.negative}, 91%, 90%)`, 113 113 - red_200: `hsl(${hues.negative}, 91%, 80%)`, 114 114 - red_300: `hsl(${hues.negative}, 91%, 70%)`, 115 115 - red_400: `hsl(${hues.negative}, 91%, 60%)`, 116 116 - red_500: `hsl(${hues.negative}, 91%, 50%)`, 117 117 - red_600: `hsl(${hues.negative}, 91%, 42%)`, 118 118 - red_700: `hsl(${hues.negative}, 91%, 34%)`, 119 119 - red_800: `hsl(${hues.negative}, 91%, 26%)`, 120 120 - red_900: `hsl(${hues.negative}, 91%, 18%)`, 121 121 - red_950: `hsl(${hues.negative}, 91%, 10%)`, 122 122 - red_975: `hsl(${hues.negative}, 91%, 7%)`, 123 123 - } as const 124 124 - 125 125 - const lightPalette = { 126 126 - white: color.gray_0, 127 127 - black: color.gray_1000, 128 128 - like: color.like, 129 129 - 130 130 - contrast_25: color.gray_25, 131 131 - contrast_50: color.gray_50, 132 132 - contrast_100: color.gray_100, 133 133 - contrast_200: color.gray_200, 134 134 - contrast_300: color.gray_300, 135 135 - contrast_400: color.gray_400, 136 136 - contrast_500: color.gray_500, 137 137 - contrast_600: color.gray_600, 138 138 - contrast_700: color.gray_700, 139 139 - contrast_800: color.gray_800, 140 140 - contrast_900: color.gray_900, 141 141 - contrast_950: color.gray_950, 142 142 - contrast_975: color.gray_975, 143 143 - 144 144 - primary_25: color.primary_25, 145 145 - primary_50: color.primary_50, 146 146 - primary_100: color.primary_100, 147 147 - primary_200: color.primary_200, 148 148 - primary_300: color.primary_300, 149 149 - primary_400: color.primary_400, 150 150 - primary_500: color.primary_500, 151 151 - primary_600: color.primary_600, 152 152 - primary_700: color.primary_700, 153 153 - primary_800: color.primary_800, 154 154 - primary_900: color.primary_900, 155 155 - primary_950: color.primary_950, 156 156 - primary_975: color.primary_975, 157 157 - 158 158 - positive_25: color.green_25, 159 159 - positive_50: color.green_50, 160 160 - positive_100: color.green_100, 161 161 - positive_200: color.green_200, 162 162 - positive_300: color.green_300, 163 163 - positive_400: color.green_400, 164 164 - positive_500: color.green_500, 165 165 - positive_600: color.green_600, 166 166 - positive_700: color.green_700, 167 167 - positive_800: color.green_800, 168 168 - positive_900: color.green_900, 169 169 - positive_950: color.green_950, 170 170 - positive_975: color.green_975, 171 171 - 172 172 - negative_25: color.red_25, 173 173 - negative_50: color.red_50, 174 174 - negative_100: color.red_100, 175 175 - negative_200: color.red_200, 176 176 - negative_300: color.red_300, 177 177 - negative_400: color.red_400, 178 178 - negative_500: color.red_500, 179 179 - negative_600: color.red_600, 180 180 - negative_700: color.red_700, 181 181 - negative_800: color.red_800, 182 182 - negative_900: color.red_900, 183 183 - negative_950: color.red_950, 184 184 - negative_975: color.red_975, 185 185 - } as const 186 186 - 187 187 - const darkPalette: Palette = { 188 188 - white: color.gray_25, 189 189 - black: color.trueBlack, 190 190 - like: color.like, 191 191 - 192 192 - contrast_25: color.gray_975, 193 193 - contrast_50: color.gray_950, 194 194 - contrast_100: color.gray_900, 195 195 - contrast_200: color.gray_800, 196 196 - contrast_300: color.gray_700, 197 197 - contrast_400: color.gray_600, 198 198 - contrast_500: color.gray_500, 199 199 - contrast_600: color.gray_400, 200 200 - contrast_700: color.gray_300, 201 201 - contrast_800: color.gray_200, 202 202 - contrast_900: color.gray_100, 203 203 - contrast_950: color.gray_50, 204 204 - contrast_975: color.gray_25, 205 205 - 206 206 - primary_25: color.primary_975, 207 207 - primary_50: color.primary_950, 208 208 - primary_100: color.primary_900, 209 209 - primary_200: color.primary_800, 210 210 - primary_300: color.primary_700, 211 211 - primary_400: color.primary_600, 212 212 - primary_500: color.primary_500, 213 213 - primary_600: color.primary_400, 214 214 - primary_700: color.primary_300, 215 215 - primary_800: color.primary_200, 216 216 - primary_900: color.primary_100, 217 217 - primary_950: color.primary_50, 218 218 - primary_975: color.primary_25, 219 219 - 220 220 - positive_25: color.green_975, 221 221 - positive_50: color.green_950, 222 222 - positive_100: color.green_900, 223 223 - positive_200: color.green_800, 224 224 - positive_300: color.green_700, 225 225 - positive_400: color.green_600, 226 226 - positive_500: color.green_500, 227 227 - positive_600: color.green_400, 228 228 - positive_700: color.green_300, 229 229 - positive_800: color.green_200, 230 230 - positive_900: color.green_100, 231 231 - positive_950: color.green_50, 232 232 - positive_975: color.green_25, 233 233 - 234 234 - negative_25: color.red_975, 235 235 - negative_50: color.red_950, 236 236 - negative_100: color.red_900, 237 237 - negative_200: color.red_800, 238 238 - negative_300: color.red_700, 239 239 - negative_400: color.red_600, 240 240 - negative_500: color.red_500, 241 241 - negative_600: color.red_400, 242 242 - negative_700: color.red_300, 243 243 - negative_800: color.red_200, 244 244 - negative_900: color.red_100, 245 245 - negative_950: color.red_50, 246 246 - negative_975: color.red_25, 247 247 - } as const 248 248 - 249 249 - const dimPalette: Palette = { 250 250 - ...darkPalette, 251 251 - black: `hsl(${hues.primary}, 28%, ${dimScale[0]}%)`, 252 252 - like: color.like, 253 253 - 254 254 - contrast_25: `hsl(${hues.primary}, 28%, ${dimScale[1]}%)`, 255 255 - contrast_50: `hsl(${hues.primary}, 28%, ${dimScale[2]}%)`, 256 256 - contrast_100: `hsl(${hues.primary}, 28%, ${dimScale[3]}%)`, 257 257 - contrast_200: `hsl(${hues.primary}, 28%, ${dimScale[4]}%)`, 258 258 - contrast_300: `hsl(${hues.primary}, 24%, ${dimScale[5]}%)`, 259 259 - contrast_400: `hsl(${hues.primary}, 24%, ${dimScale[6]}%)`, 260 260 - contrast_500: `hsl(${hues.primary}, 20%, ${dimScale[7]}%)`, 261 261 - contrast_600: `hsl(${hues.primary}, 20%, ${dimScale[8]}%)`, 262 262 - contrast_700: `hsl(${hues.primary}, 20%, ${dimScale[9]}%)`, 263 263 - contrast_800: `hsl(${hues.primary}, 20%, ${dimScale[10]}%)`, 264 264 - contrast_900: `hsl(${hues.primary}, 20%, ${dimScale[11]}%)`, 265 265 - contrast_950: `hsl(${hues.primary}, 20%, ${dimScale[12]}%)`, 266 266 - contrast_975: `hsl(${hues.primary}, 20%, ${dimScale[13]}%)`, 267 267 - 268 268 - primary_25: `hsl(${hues.primary}, 50%, ${dimScale[1]}%)`, 269 269 - primary_50: `hsl(${hues.primary}, 60%, ${dimScale[2]}%)`, 270 270 - primary_100: `hsl(${hues.primary}, 70%, ${dimScale[3]}%)`, 271 271 - primary_200: `hsl(${hues.primary}, 82%, ${dimScale[4]}%)`, 272 272 - primary_300: `hsl(${hues.primary}, 90%, ${dimScale[5]}%)`, 273 273 - primary_400: `hsl(${hues.primary}, 95%, ${dimScale[6]}%)`, 274 274 - primary_500: `hsl(${hues.primary}, 99%, ${dimScale[7]}%)`, 275 275 - primary_600: `hsl(${hues.primary}, 99%, ${dimScale[8]}%)`, 276 276 - primary_700: `hsl(${hues.primary}, 99%, ${dimScale[9]}%)`, 277 277 - primary_800: `hsl(${hues.primary}, 99%, ${dimScale[10]}%)`, 278 278 - primary_900: `hsl(${hues.primary}, 99%, ${dimScale[11]}%)`, 279 279 - primary_950: `hsl(${hues.primary}, 99%, ${dimScale[12]}%)`, 280 280 - primary_975: `hsl(${hues.primary}, 99%, ${dimScale[13]}%)`, 281 281 - 282 282 - positive_25: `hsl(${hues.positive}, 50%, ${dimScale[1]}%)`, 283 283 - positive_50: `hsl(${hues.positive}, 60%, ${dimScale[2]}%)`, 284 284 - positive_100: `hsl(${hues.positive}, 70%, ${dimScale[3]}%)`, 285 285 - positive_200: `hsl(${hues.positive}, 82%, ${dimScale[4]}%)`, 286 286 - positive_300: `hsl(${hues.positive}, 82%, ${dimScale[5]}%)`, 287 287 - positive_400: `hsl(${hues.positive}, 82%, ${dimScale[6]}%)`, 288 288 - positive_500: `hsl(${hues.positive}, 82%, ${dimScale[7]}%)`, 289 289 - positive_600: `hsl(${hues.positive}, 82%, ${dimScale[8]}%)`, 290 290 - positive_700: `hsl(${hues.positive}, 82%, ${dimScale[9]}%)`, 291 291 - positive_800: `hsl(${hues.positive}, 82%, ${dimScale[10]}%)`, 292 292 - positive_900: `hsl(${hues.positive}, 82%, ${dimScale[11]}%)`, 293 293 - positive_950: `hsl(${hues.positive}, 82%, ${dimScale[12]}%)`, 294 294 - positive_975: `hsl(${hues.positive}, 82%, ${dimScale[13]}%)`, 295 295 - 296 296 - negative_25: `hsl(${hues.negative}, 70%, ${dimScale[1]}%)`, 297 297 - negative_50: `hsl(${hues.negative}, 80%, ${dimScale[2]}%)`, 298 298 - negative_100: `hsl(${hues.negative}, 84%, ${dimScale[3]}%)`, 299 299 - negative_200: `hsl(${hues.negative}, 88%, ${dimScale[4]}%)`, 300 300 - negative_300: `hsl(${hues.negative}, 91%, ${dimScale[5]}%)`, 301 301 - negative_400: `hsl(${hues.negative}, 91%, ${dimScale[6]}%)`, 302 302 - negative_500: `hsl(${hues.negative}, 91%, ${dimScale[7]}%)`, 303 303 - negative_600: `hsl(${hues.negative}, 91%, ${dimScale[8]}%)`, 304 304 - negative_700: `hsl(${hues.negative}, 91%, ${dimScale[9]}%)`, 305 305 - negative_800: `hsl(${hues.negative}, 91%, ${dimScale[10]}%)`, 306 306 - negative_900: `hsl(${hues.negative}, 91%, ${dimScale[11]}%)`, 307 307 - negative_950: `hsl(${hues.negative}, 91%, ${dimScale[12]}%)`, 308 308 - negative_975: `hsl(${hues.negative}, 91%, ${dimScale[13]}%)`, 309 309 - } as const 310 310 - 311 311 - const light: Theme = { 312 312 - scheme: 'light', 313 313 - name: 'light', 314 314 - palette: lightPalette, 315 315 - atoms: { 316 316 - text: { 317 317 - color: lightPalette.black, 318 318 - }, 319 319 - text_contrast_low: { 320 320 - color: lightPalette.contrast_400, 321 321 - }, 322 322 - text_contrast_medium: { 323 323 - color: lightPalette.contrast_700, 324 324 - }, 325 325 - text_contrast_high: { 326 326 - color: lightPalette.contrast_900, 327 327 - }, 328 328 - text_inverted: { 329 329 - color: lightPalette.white, 330 330 - }, 331 331 - bg: { 332 332 - backgroundColor: lightPalette.white, 333 333 - }, 334 334 - bg_contrast_25: { 335 335 - backgroundColor: lightPalette.contrast_25, 336 336 - }, 337 337 - bg_contrast_50: { 338 338 - backgroundColor: lightPalette.contrast_50, 339 339 - }, 340 340 - bg_contrast_100: { 341 341 - backgroundColor: lightPalette.contrast_100, 342 342 - }, 343 343 - bg_contrast_200: { 344 344 - backgroundColor: lightPalette.contrast_200, 345 345 - }, 346 346 - bg_contrast_300: { 347 347 - backgroundColor: lightPalette.contrast_300, 348 348 - }, 349 349 - bg_contrast_400: { 350 350 - backgroundColor: lightPalette.contrast_400, 351 351 - }, 352 352 - bg_contrast_500: { 353 353 - backgroundColor: lightPalette.contrast_500, 354 354 - }, 355 355 - bg_contrast_600: { 356 356 - backgroundColor: lightPalette.contrast_600, 357 357 - }, 358 358 - bg_contrast_700: { 359 359 - backgroundColor: lightPalette.contrast_700, 360 360 - }, 361 361 - bg_contrast_800: { 362 362 - backgroundColor: lightPalette.contrast_800, 363 363 - }, 364 364 - bg_contrast_900: { 365 365 - backgroundColor: lightPalette.contrast_900, 366 366 - }, 367 367 - bg_contrast_950: { 368 368 - backgroundColor: lightPalette.contrast_950, 369 369 - }, 370 370 - bg_contrast_975: { 371 371 - backgroundColor: lightPalette.contrast_975, 372 372 - }, 373 373 - border_contrast_low: { 374 374 - borderColor: lightPalette.contrast_100, 375 375 - }, 376 376 - border_contrast_medium: { 377 377 - borderColor: lightPalette.contrast_200, 378 378 - }, 379 379 - border_contrast_high: { 380 380 - borderColor: lightPalette.contrast_300, 381 381 - }, 382 382 - shadow_sm: { 383 383 - ...atoms.shadow_sm, 384 384 - shadowColor: lightPalette.black, 385 385 - }, 386 386 - shadow_md: { 387 387 - ...atoms.shadow_md, 388 388 - shadowColor: lightPalette.black, 389 389 - }, 390 390 - shadow_lg: { 391 391 - ...atoms.shadow_lg, 392 392 - shadowColor: lightPalette.black, 393 393 - }, 394 394 - }, 395 395 - } 396 396 - 397 397 - const dark: Theme = { 398 398 - scheme: 'dark', 399 399 - name: 'dark', 400 400 - palette: darkPalette, 401 401 - atoms: { 402 402 - text: { 403 403 - color: darkPalette.white, 404 404 - }, 405 405 - text_contrast_low: { 406 406 - color: darkPalette.contrast_400, 407 407 - }, 408 408 - text_contrast_medium: { 409 409 - color: darkPalette.contrast_600, 410 410 - }, 411 411 - text_contrast_high: { 412 412 - color: darkPalette.contrast_900, 413 413 - }, 414 414 - text_inverted: { 415 415 - color: darkPalette.black, 416 416 - }, 417 417 - bg: { 418 418 - backgroundColor: darkPalette.black, 419 419 - }, 420 420 - bg_contrast_25: { 421 421 - backgroundColor: darkPalette.contrast_25, 422 422 - }, 423 423 - bg_contrast_50: { 424 424 - backgroundColor: darkPalette.contrast_50, 425 425 - }, 426 426 - bg_contrast_100: { 427 427 - backgroundColor: darkPalette.contrast_100, 428 428 - }, 429 429 - bg_contrast_200: { 430 430 - backgroundColor: darkPalette.contrast_200, 431 431 - }, 432 432 - bg_contrast_300: { 433 433 - backgroundColor: darkPalette.contrast_300, 434 434 - }, 435 435 - bg_contrast_400: { 436 436 - backgroundColor: darkPalette.contrast_400, 437 437 - }, 438 438 - bg_contrast_500: { 439 439 - backgroundColor: darkPalette.contrast_500, 440 440 - }, 441 441 - bg_contrast_600: { 442 442 - backgroundColor: darkPalette.contrast_600, 443 443 - }, 444 444 - bg_contrast_700: { 445 445 - backgroundColor: darkPalette.contrast_700, 446 446 - }, 447 447 - bg_contrast_800: { 448 448 - backgroundColor: darkPalette.contrast_800, 449 449 - }, 450 450 - bg_contrast_900: { 451 451 - backgroundColor: darkPalette.contrast_900, 452 452 - }, 453 453 - bg_contrast_950: { 454 454 - backgroundColor: darkPalette.contrast_950, 455 455 - }, 456 456 - bg_contrast_975: { 457 457 - backgroundColor: darkPalette.contrast_975, 458 458 - }, 459 459 - border_contrast_low: { 460 460 - borderColor: darkPalette.contrast_100, 461 461 - }, 462 462 - border_contrast_medium: { 463 463 - borderColor: darkPalette.contrast_200, 464 464 - }, 465 465 - border_contrast_high: { 466 466 - borderColor: darkPalette.contrast_300, 467 467 - }, 468 468 - shadow_sm: { 469 469 - ...atoms.shadow_sm, 470 470 - shadowOpacity: 0.7, 471 471 - shadowColor: color.trueBlack, 472 472 - }, 473 473 - shadow_md: { 474 474 - ...atoms.shadow_md, 475 475 - shadowOpacity: 0.7, 476 476 - shadowColor: color.trueBlack, 477 477 - }, 478 478 - shadow_lg: { 479 479 - ...atoms.shadow_lg, 480 480 - shadowOpacity: 0.7, 481 481 - shadowColor: color.trueBlack, 482 482 - }, 483 483 - }, 484 484 - } 485 485 - 486 486 - const dim: Theme = { 487 487 - ...dark, 488 488 - scheme: 'dark', 489 489 - name: 'dim', 490 490 - palette: dimPalette, 491 491 - atoms: { 492 492 - ...dark.atoms, 493 493 - text: { 494 494 - color: dimPalette.white, 495 495 - }, 496 496 - text_contrast_low: { 497 497 - color: dimPalette.contrast_400, 498 498 - }, 499 499 - text_contrast_medium: { 500 500 - color: dimPalette.contrast_600, 501 501 - }, 502 502 - text_contrast_high: { 503 503 - color: dimPalette.contrast_900, 504 504 - }, 505 505 - text_inverted: { 506 506 - color: dimPalette.black, 507 507 - }, 508 508 - bg: { 509 509 - backgroundColor: dimPalette.black, 510 510 - }, 511 511 - bg_contrast_25: { 512 512 - backgroundColor: dimPalette.contrast_25, 513 513 - }, 514 514 - bg_contrast_50: { 515 515 - backgroundColor: dimPalette.contrast_50, 516 516 - }, 517 517 - bg_contrast_100: { 518 518 - backgroundColor: dimPalette.contrast_100, 519 519 - }, 520 520 - bg_contrast_200: { 521 521 - backgroundColor: dimPalette.contrast_200, 522 522 - }, 523 523 - bg_contrast_300: { 524 524 - backgroundColor: dimPalette.contrast_300, 525 525 - }, 526 526 - bg_contrast_400: { 527 527 - backgroundColor: dimPalette.contrast_400, 528 528 - }, 529 529 - bg_contrast_500: { 530 530 - backgroundColor: dimPalette.contrast_500, 531 531 - }, 532 532 - bg_contrast_600: { 533 533 - backgroundColor: dimPalette.contrast_600, 534 534 - }, 535 535 - bg_contrast_700: { 536 536 - backgroundColor: dimPalette.contrast_700, 537 537 - }, 538 538 - bg_contrast_800: { 539 539 - backgroundColor: dimPalette.contrast_800, 540 540 - }, 541 541 - bg_contrast_900: { 542 542 - backgroundColor: dimPalette.contrast_900, 543 543 - }, 544 544 - bg_contrast_950: { 545 545 - backgroundColor: dimPalette.contrast_950, 546 546 - }, 547 547 - bg_contrast_975: { 548 548 - backgroundColor: dimPalette.contrast_975, 549 549 - }, 550 550 - border_contrast_low: { 551 551 - borderColor: dimPalette.contrast_100, 552 552 - }, 553 553 - border_contrast_medium: { 554 554 - borderColor: dimPalette.contrast_200, 555 555 - }, 556 556 - border_contrast_high: { 557 557 - borderColor: dimPalette.contrast_300, 558 558 - }, 559 559 - shadow_sm: { 560 560 - ...atoms.shadow_sm, 561 561 - shadowOpacity: 0.7, 562 562 - shadowColor: `hsl(${hues.primary}, 28%, 6%)`, 563 563 - }, 564 564 - shadow_md: { 565 565 - ...atoms.shadow_md, 566 566 - shadowOpacity: 0.7, 567 567 - shadowColor: `hsl(${hues.primary}, 28%, 6%)`, 568 568 - }, 569 569 - shadow_lg: { 570 570 - ...atoms.shadow_lg, 571 571 - shadowOpacity: 0.7, 572 572 - shadowColor: `hsl(${hues.primary}, 28%, 6%)`, 573 573 - }, 574 574 - }, 575 575 - } 576 576 - 577 577 - return { 578 578 - lightPalette, 579 579 - darkPalette, 580 580 - dimPalette, 581 581 - light, 582 582 - dark, 583 583 - dim, 584 584 - } 585 585 - } 44 44 + export const dim = DEFAULT_THEMES.dim

+4 -55

src/alf/tokens.ts

··· 1 1 - import {isAndroid} from '#/platform/detection' 1 1 + import {tokens} from '@bsky.app/alf' 2 2 3 3 - export const TRACKING = isAndroid ? 0.1 : 0 3 3 + export * from '@bsky.app/alf/dist/tokens' 4 4 5 5 export const color = { 6 6 - temp_purple: 'rgb(105 0 255)', 7 7 - temp_purple_dark: 'rgb(83 0 202)', 8 8 - } as const 9 9 - 10 10 - export const space = { 11 11 - _2xs: 2, 12 12 - xs: 4, 13 13 - sm: 8, 14 14 - md: 12, 15 15 - lg: 16, 16 16 - xl: 20, 17 17 - _2xl: 24, 18 18 - _3xl: 28, 19 19 - _4xl: 32, 20 20 - _5xl: 40, 21 21 - } as const 22 22 - 23 23 - export const fontSize = { 24 24 - _2xs: 10, 25 25 - xs: 12, 26 26 - sm: 14, 27 27 - md: 16, 28 28 - lg: 18, 29 29 - xl: 20, 30 30 - _2xl: 22, 31 31 - _3xl: 26, 32 32 - _4xl: 32, 33 33 - _5xl: 40, 34 34 - } as const 35 35 - 36 36 - export const lineHeight = { 37 37 - none: 1, 38 38 - normal: 1.5, 39 39 - relaxed: 1.625, 40 40 - } as const 41 41 - 42 42 - export const borderRadius = { 43 43 - _2xs: 2, 44 44 - xs: 4, 45 45 - sm: 8, 46 46 - md: 12, 47 47 - lg: 16, 48 48 - full: 999, 49 49 - } as const 50 50 - 51 51 - /** 52 52 - * These correspond to Inter font files we actually load. 53 53 - */ 54 54 - export const fontWeight = { 55 55 - normal: '400', 56 56 - medium: '500', 57 57 - bold: '600', 58 58 - heavy: '800', 6 6 + temp_purple: tokens.labelerColor.purple, 7 7 + temp_purple_dark: tokens.labelerColor.purple_dark, 59 8 } as const 60 9 61 10 export const gradients = {

-164

src/alf/types.ts

··· 1 1 - import {type StyleProp, type TextStyle, type ViewStyle} from 'react-native' 2 2 - 3 3 - export type TextStyleProp = { 4 4 - style?: StyleProp<TextStyle> 5 5 - } 6 6 - 7 7 - export type ViewStyleProp = { 8 8 - style?: StyleProp<ViewStyle> 9 9 - } 10 10 - 11 11 - export type ThemeName = 'light' | 'dim' | 'dark' 12 12 - export type Palette = { 13 13 - white: string 14 14 - black: string 15 15 - like: string 16 16 - 17 17 - contrast_25: string 18 18 - contrast_50: string 19 19 - contrast_100: string 20 20 - contrast_200: string 21 21 - contrast_300: string 22 22 - contrast_400: string 23 23 - contrast_500: string 24 24 - contrast_600: string 25 25 - contrast_700: string 26 26 - contrast_800: string 27 27 - contrast_900: string 28 28 - contrast_950: string 29 29 - contrast_975: string 30 30 - 31 31 - primary_25: string 32 32 - primary_50: string 33 33 - primary_100: string 34 34 - primary_200: string 35 35 - primary_300: string 36 36 - primary_400: string 37 37 - primary_500: string 38 38 - primary_600: string 39 39 - primary_700: string 40 40 - primary_800: string 41 41 - primary_900: string 42 42 - primary_950: string 43 43 - primary_975: string 44 44 - 45 45 - positive_25: string 46 46 - positive_50: string 47 47 - positive_100: string 48 48 - positive_200: string 49 49 - positive_300: string 50 50 - positive_400: string 51 51 - positive_500: string 52 52 - positive_600: string 53 53 - positive_700: string 54 54 - positive_800: string 55 55 - positive_900: string 56 56 - positive_950: string 57 57 - positive_975: string 58 58 - 59 59 - negative_25: string 60 60 - negative_50: string 61 61 - negative_100: string 62 62 - negative_200: string 63 63 - negative_300: string 64 64 - negative_400: string 65 65 - negative_500: string 66 66 - negative_600: string 67 67 - negative_700: string 68 68 - negative_800: string 69 69 - negative_900: string 70 70 - negative_950: string 71 71 - negative_975: string 72 72 - } 73 73 - export type ThemedAtoms = { 74 74 - text: { 75 75 - color: string 76 76 - } 77 77 - text_contrast_low: { 78 78 - color: string 79 79 - } 80 80 - text_contrast_medium: { 81 81 - color: string 82 82 - } 83 83 - text_contrast_high: { 84 84 - color: string 85 85 - } 86 86 - text_inverted: { 87 87 - color: string 88 88 - } 89 89 - bg: { 90 90 - backgroundColor: string 91 91 - } 92 92 - bg_contrast_25: { 93 93 - backgroundColor: string 94 94 - } 95 95 - bg_contrast_50: { 96 96 - backgroundColor: string 97 97 - } 98 98 - bg_contrast_100: { 99 99 - backgroundColor: string 100 100 - } 101 101 - bg_contrast_200: { 102 102 - backgroundColor: string 103 103 - } 104 104 - bg_contrast_300: { 105 105 - backgroundColor: string 106 106 - } 107 107 - bg_contrast_400: { 108 108 - backgroundColor: string 109 109 - } 110 110 - bg_contrast_500: { 111 111 - backgroundColor: string 112 112 - } 113 113 - bg_contrast_600: { 114 114 - backgroundColor: string 115 115 - } 116 116 - bg_contrast_700: { 117 117 - backgroundColor: string 118 118 - } 119 119 - bg_contrast_800: { 120 120 - backgroundColor: string 121 121 - } 122 122 - bg_contrast_900: { 123 123 - backgroundColor: string 124 124 - } 125 125 - bg_contrast_950: { 126 126 - backgroundColor: string 127 127 - } 128 128 - bg_contrast_975: { 129 129 - backgroundColor: string 130 130 - } 131 131 - border_contrast_low: { 132 132 - borderColor: string 133 133 - } 134 134 - border_contrast_medium: { 135 135 - borderColor: string 136 136 - } 137 137 - border_contrast_high: { 138 138 - borderColor: string 139 139 - } 140 140 - shadow_sm: { 141 141 - shadowRadius: number 142 142 - shadowOpacity: number 143 143 - elevation: number 144 144 - shadowColor: string 145 145 - } 146 146 - shadow_md: { 147 147 - shadowRadius: number 148 148 - shadowOpacity: number 149 149 - elevation: number 150 150 - shadowColor: string 151 151 - } 152 152 - shadow_lg: { 153 153 - shadowRadius: number 154 154 - shadowOpacity: number 155 155 - elevation: number 156 156 - shadowColor: string 157 157 - } 158 158 - } 159 159 - export type Theme = { 160 160 - scheme: 'light' | 'dark' // for library support 161 161 - name: ThemeName 162 162 - palette: Palette 163 163 - atoms: ThemedAtoms 164 164 - }

-15

src/alf/typography.tsx

··· 9 9 import {type Alf, applyFonts, atoms, flatten} from '#/alf' 10 10 11 11 /** 12 12 - * Util to calculate lineHeight from a text size atom and a leading atom 13 13 - * 14 14 - * Example: 15 15 - * `leading(atoms.text_md, atoms.leading_normal)` // => 24 16 16 - */ 17 17 - export function leading< 18 18 - Size extends {fontSize?: number}, 19 19 - Leading extends {lineHeight?: number}, 20 20 - >(textSize: Size, leading: Leading) { 21 21 - const size = textSize?.fontSize || atoms.text_md.fontSize 22 22 - const lineHeight = leading?.lineHeight || atoms.leading_normal.lineHeight 23 23 - return Math.round(size * lineHeight) 24 24 - } 25 25 - 26 26 - /** 27 12 * Ensures that `lineHeight` defaults to a relative value of `1`, or applies 28 13 * other relative leading atoms. 29 14 *

-8

src/alf/util/__tests__/colors.test.ts

··· 1 1 import {jest} from '@jest/globals' 2 2 3 3 - import {logger} from '#/logger' 4 3 import {transparentifyColor} from '../colorGeneration' 5 5 - 6 6 - jest.mock('#/logger', () => ({ 7 7 - logger: {warn: jest.fn()}, 8 8 - })) 9 4 10 5 describe('transparentifyColor', () => { 11 6 beforeEach(() => { ··· 41 36 const unsupported = 'blue' 42 37 const result = transparentifyColor(unsupported, 0.5) 43 38 expect(result).toBe(unsupported) 44 44 - expect(logger.warn).toHaveBeenCalledWith( 45 45 - `Could not make '${unsupported}' transparent`, 46 46 - ) 47 39 }) 48 40 })

+3 -44

src/alf/util/colorGeneration.ts

··· 1 1 - import {logger} from '#/logger' 1 1 + import {utils} from '@bsky.app/alf' 2 2 3 3 export const BLUE_HUE = 211 4 4 - export const RED_HUE = 346 5 5 - export const GREEN_HUE = 152 6 4 7 5 /** 8 8 - * Smooth progression of lightness "stops" for generating HSL colors. 6 6 + * @deprecated use `utils.alpha` from `@bsky.app/alf` instead 9 7 */ 10 10 - export const COLOR_STOPS = [ 11 11 - 0, 0.05, 0.1, 0.15, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.85, 0.9, 0.95, 1, 12 12 - ] 13 13 - 14 14 - export function generateScale(start: number, end: number) { 15 15 - const range = end - start 16 16 - return COLOR_STOPS.map(stop => { 17 17 - return start + range * stop 18 18 - }) 19 19 - } 20 20 - 21 21 - export const defaultScale = generateScale(6, 100) 22 22 - // dim shifted 6% lighter 23 23 - export const dimScale = generateScale(12, 100) 24 24 - 25 25 - export function transparentifyColor(color: string, alpha: number) { 26 26 - if (color.startsWith('hsl(')) { 27 27 - return 'hsla(' + color.slice('hsl('.length, -1) + `, ${alpha})` 28 28 - } else if (color.startsWith('rgb(')) { 29 29 - return 'rgba(' + color.slice('rgb('.length, -1) + `, ${alpha})` 30 30 - } else if (color.startsWith('#')) { 31 31 - if (color.length === 7) { 32 32 - const alphaHex = Math.round(alpha * 255).toString(16) 33 33 - // Per MDN: If there is only one number, it is duplicated: e means ee 34 34 - // https://developer.mozilla.org/en-US/docs/Web/CSS/hex-color 35 35 - return color.slice(0, 7) + alphaHex.padStart(2, alphaHex) 36 36 - } else if (color.length === 4) { 37 37 - // convert to 6-digit hex before adding alpha 38 38 - const [r, g, b] = color.slice(1).split('') 39 39 - const alphaHex = Math.round(alpha * 255).toString(16) 40 40 - return `#${r.repeat(2)}${g.repeat(2)}${b.repeat(2)}${alphaHex.padStart( 41 41 - 2, 42 42 - alphaHex, 43 43 - )}` 44 44 - } 45 45 - } else { 46 46 - logger.warn(`Could not make '${color}' transparent`) 47 47 - } 48 48 - return color 49 49 - } 8 8 + export const transparentifyColor = utils.alpha

+1 -62

src/alf/util/platform.ts

··· 1 1 - import {Platform} from 'react-native' 2 2 - 3 3 - import {isAndroid, isIOS, isNative, isWeb} from '#/platform/detection' 4 4 - 5 5 - /** 6 6 - * Identity function on web. Returns nothing on other platforms. 7 7 - * 8 8 - * Note: Platform splitting does not tree-shake away the other platforms, 9 9 - * so don't do stuff like e.g. rely on platform-specific imports. Use 10 10 - * platform-split files instead. 11 11 - */ 12 12 - export function web(value: any) { 13 13 - if (isWeb) { 14 14 - return value 15 15 - } 16 16 - } 17 17 - 18 18 - /** 19 19 - * Identity function on iOS. Returns nothing on other platforms. 20 20 - * 21 21 - * Note: Platform splitting does not tree-shake away the other platforms, 22 22 - * so don't do stuff like e.g. rely on platform-specific imports. Use 23 23 - * platform-split files instead. 24 24 - */ 25 25 - export function ios(value: any) { 26 26 - if (isIOS) { 27 27 - return value 28 28 - } 29 29 - } 30 30 - 31 31 - /** 32 32 - * Identity function on Android. Returns nothing on other platforms.. 33 33 - * 34 34 - * Note: Platform splitting does not tree-shake away the other platforms, 35 35 - * so don't do stuff like e.g. rely on platform-specific imports. Use 36 36 - * platform-split files instead. 37 37 - */ 38 38 - export function android(value: any) { 39 39 - if (isAndroid) { 40 40 - return value 41 41 - } 42 42 - } 43 43 - 44 44 - /** 45 45 - * Identity function on iOS and Android. Returns nothing on web. 46 46 - * 47 47 - * Note: Platform splitting does not tree-shake away the other platforms, 48 48 - * so don't do stuff like e.g. rely on platform-specific imports. Use 49 49 - * platform-split files instead. 50 50 - */ 51 51 - export function native(value: any) { 52 52 - if (isNative) { 53 53 - return value 54 54 - } 55 55 - } 56 56 - 57 57 - /** 58 58 - * Note: Platform splitting does not tree-shake away the other platforms, 59 59 - * so don't do stuff like e.g. rely on platform-specific imports. Use 60 60 - * platform-split files instead. 61 61 - */ 62 62 - export const platform = Platform.select 1 1 + export {android, ios, native, platform, web} from '@bsky.app/alf'

+1 -1

src/alf/util/systemUI.ts

··· 1 1 import * as SystemUI from 'expo-system-ui' 2 2 + import {type Theme} from '@bsky.app/alf' 2 3 3 4 import {isAndroid} from '#/platform/detection' 4 4 - import {type Theme} from '../types' 5 5 6 6 export function setSystemUITheme(themeType: 'theme' | 'lightbox', t: Theme) { 7 7 if (isAndroid) {

+2 -13

src/alf/util/themeSelector.ts

··· 1 1 - import {type ThemeName} from '#/alf/types' 1 1 + import {utils} from '@bsky.app/alf' 2 2 3 3 - export function select<T>(name: ThemeName, options: Record<ThemeName, T>) { 4 4 - switch (name) { 5 5 - case 'light': 6 6 - return options.light 7 7 - case 'dark': 8 8 - return options.dark || options.dim 9 9 - case 'dim': 10 10 - return options.dim || options.dark 11 11 - default: 12 12 - throw new Error(`select(theme, options) received unknown theme ${name}`) 13 13 - } 14 14 - } 3 3 + export const select = utils.select

+1 -1

src/alf/util/useColorModeTheme.ts

··· 1 1 import React from 'react' 2 2 import {type ColorSchemeName, useColorScheme} from 'react-native' 3 3 + import {type ThemeName} from '@bsky.app/alf' 3 4 4 5 import {isWeb} from '#/platform/detection' 5 6 import {useThemePrefs} from '#/state/shell' 6 7 import {dark, dim, light} from '#/alf/themes' 7 7 - import {type ThemeName} from '#/alf/types' 8 8 9 9 export function useColorModeTheme(): ThemeName { 10 10 const theme = useThemeName()

+2 -2

src/components/AccountList.tsx

··· 77 77 ]}> 78 78 <Text 79 79 style={[ 80 80 - a.font_bold, 80 80 + a.font_semi_bold, 81 81 a.flex_1, 82 82 a.flex_row, 83 83 a.py_sm, ··· 151 151 <View style={[a.flex_row, a.align_center, a.gap_xs]}> 152 152 <Text 153 153 emoji 154 154 - style={[a.font_bold, a.leading_tight]} 154 154 + style={[a.font_semi_bold, a.leading_tight]} 155 155 numberOfLines={1}> 156 156 {sanitizeDisplayName( 157 157 profile?.displayName || profile?.handle || account.handle,

+2 -3

src/components/BlockedGeoOverlay.tsx

··· 96 96 <Mark fill={t.palette.primary_600} width={14} /> 97 97 <Text 98 98 style={[ 99 99 - a.font_bold, 99 99 + a.font_semi_bold, 100 100 { 101 101 color: t.palette.primary_600, 102 102 }, ··· 121 121 </View> 122 122 123 123 <View style={[a.mt_xl, a.align_start]}> 124 124 - <Text 125 125 - style={[a.text_lg, a.font_heavy, a.leading_snug, a.pb_xs]}> 124 124 + <Text style={[a.text_lg, a.font_bold, a.leading_snug, a.pb_xs]}> 126 125 <Trans>Not in Mississippi?</Trans> 127 126 </Text> 128 127 <Text

+5 -13

src/components/Button.tsx

··· 240 240 } 241 241 } else if (color === 'secondary') { 242 242 if (!disabled) { 243 243 - baseStyles.push(t.atoms.bg_contrast_25) 243 243 + baseStyles.push(t.atoms.bg_contrast_50) 244 244 hoverStyles.push(t.atoms.bg_contrast_100) 245 245 } else { 246 246 baseStyles.push(t.atoms.bg_contrast_50) ··· 289 289 }) 290 290 } else { 291 291 baseStyles.push({ 292 292 - backgroundColor: select(t.name, { 293 293 - light: t.palette.primary_25, 294 294 - dim: t.palette.primary_50, 295 295 - dark: t.palette.primary_50, 296 296 - }), 292 292 + backgroundColor: t.palette.primary_50, 297 293 }) 298 294 } 299 295 } else if (color === 'negative_subtle') { ··· 314 310 }) 315 311 } else { 316 312 baseStyles.push({ 317 317 - backgroundColor: select(t.name, { 318 318 - light: t.palette.negative_25, 319 319 - dim: t.palette.negative_50, 320 320 - dark: t.palette.negative_50, 321 321 - }), 313 313 + backgroundColor: t.palette.negative_50, 322 314 }) 323 315 } 324 316 } ··· 372 364 if (!disabled) { 373 365 baseStyles.push(t.atoms.bg) 374 366 hoverStyles.push({ 375 375 - backgroundColor: t.palette.contrast_25, 367 367 + backgroundColor: t.palette.contrast_50, 376 368 }) 377 369 } 378 370 } ··· 396 388 if (!disabled) { 397 389 baseStyles.push(t.atoms.bg) 398 390 hoverStyles.push({ 399 399 - backgroundColor: t.palette.contrast_25, 391 391 + backgroundColor: t.palette.contrast_50, 400 392 }) 401 393 } 402 394 }

+6 -2

src/components/ContextMenu/index.tsx

··· 796 796 style={[ 797 797 a.flex_1, 798 798 a.text_md, 799 799 - a.font_bold, 799 799 + a.font_semi_bold, 800 800 t.atoms.text_contrast_high, 801 801 {paddingTop: 3}, 802 802 style, ··· 855 855 const t = useTheme() 856 856 return ( 857 857 <Text 858 858 - style={[a.font_bold, t.atoms.text_contrast_medium, {marginBottom: -8}]}> 858 858 + style={[ 859 859 + a.font_semi_bold, 860 860 + t.atoms.text_contrast_medium, 861 861 + {marginBottom: -8}, 862 862 + ]}> 859 863 {children} 860 864 </Text> 861 865 )

+1 -1

src/components/Dialog/shared.tsx

··· 62 62 style?: StyleProp<TextStyle> 63 63 }) { 64 64 return ( 65 65 - <Text style={[a.text_lg, a.text_center, a.font_heavy, style]}> 65 65 + <Text style={[a.text_lg, a.text_center, a.font_bold, style]}> 66 66 {children} 67 67 </Text> 68 68 )

+1 -1

src/components/Error.tsx

··· 40 40 ]} 41 41 sideBorders={sideBorders}> 42 42 <View style={[a.w_full, a.align_center, a.gap_lg]}> 43 43 - <Text style={[a.font_bold, a.text_3xl]}>{title}</Text> 43 43 + <Text style={[a.font_semi_bold, a.text_3xl]}>{title}</Text> 44 44 <Text 45 45 style={[ 46 46 a.text_md,

+2 -2

src/components/FeedCard.tsx

··· 128 128 <View style={[a.flex_1]}> 129 129 <Text 130 130 emoji 131 131 - style={[a.text_md, a.font_bold, a.leading_snug]} 131 131 + style={[a.text_md, a.font_semi_bold, a.leading_snug]} 132 132 numberOfLines={1}> 133 133 {title} 134 134 </Text> ··· 214 214 export function Likes({count}: {count: number}) { 215 215 const t = useTheme() 216 216 return ( 217 217 - <Text style={[a.text_sm, t.atoms.text_contrast_medium, a.font_bold]}> 217 217 + <Text style={[a.text_sm, t.atoms.text_contrast_medium, a.font_semi_bold]}> 218 218 <Trans> 219 219 Liked by <Plural value={count || 0} one="# user" other="# users" /> 220 220 </Trans>

+2 -2

src/components/FeedInterstitials.tsx

··· 380 380 a.justify_between, 381 381 ]} 382 382 pointerEvents={isIOS ? 'auto' : 'box-none'}> 383 383 - <Text style={[a.text_sm, a.font_bold, t.atoms.text]}> 383 383 + <Text style={[a.text_sm, a.font_semi_bold, t.atoms.text]}> 384 384 {isFeedContext ? ( 385 385 <Trans>Suggested for you</Trans> 386 386 ) : ( ··· 516 516 style={[ 517 517 a.flex_1, 518 518 a.text_lg, 519 519 - a.font_bold, 519 519 + a.font_semi_bold, 520 520 t.atoms.text_contrast_medium, 521 521 ]}> 522 522 <Trans>Some other feeds you might like</Trans>

+1 -1

src/components/LabelingServiceCard/index.tsx

··· 45 45 46 46 export function Title({value}: {value: string}) { 47 47 return ( 48 48 - <Text emoji style={[a.text_md, a.font_bold, a.leading_tight]}> 48 48 + <Text emoji style={[a.text_md, a.font_semi_bold, a.leading_tight]}> 49 49 {value} 50 50 </Text> 51 51 )

+1 -1

src/components/Layout/Header/index.tsx

··· 181 181 <Text 182 182 style={[ 183 183 a.text_lg, 184 184 - a.font_heavy, 184 184 + a.font_bold, 185 185 a.leading_tight, 186 186 isIOS && align === 'platform' && a.text_center, 187 187 gtMobile && a.text_xl,

+2 -2

src/components/ListCard.tsx

··· 127 127 allowOverride={creator && currentAccount?.did === creator.did}> 128 128 <Hider.Mask> 129 129 <Text 130 130 - style={[a.text_md, a.font_bold, a.leading_snug, a.italic]} 130 130 + style={[a.text_md, a.font_semi_bold, a.leading_snug, a.italic]} 131 131 numberOfLines={1}> 132 132 <Trans>Hidden list</Trans> 133 133 </Text> ··· 135 135 <Hider.Content> 136 136 <Text 137 137 emoji 138 138 - style={[a.text_md, a.font_bold, a.leading_snug]} 138 138 + style={[a.text_md, a.font_semi_bold, a.leading_snug]} 139 139 numberOfLines={1}> 140 140 {title} 141 141 </Text>

+1 -1

src/components/LoggedOutCTA.tsx

··· 50 50 <View style={[a.flex_row, a.align_center, a.flex_1, a.pr_md]}> 51 51 <Logo width={30} style={[a.mr_md]} /> 52 52 <View style={[a.flex_1]}> 53 53 - <Text style={[a.text_lg, a.font_bold, a.leading_snug]}> 53 53 + <Text style={[a.text_lg, a.font_semi_bold, a.leading_snug]}> 54 54 <Trans>Join Bluesky</Trans> 55 55 </Text> 56 56 <Text

+2 -2

src/components/Menu/index.tsx

··· 191 191 style={[ 192 192 a.flex_1, 193 193 a.text_md, 194 194 - a.font_bold, 194 194 + a.font_semi_bold, 195 195 t.atoms.text_contrast_high, 196 196 {paddingTop: 3}, 197 197 style, ··· 293 293 return ( 294 294 <Text 295 295 style={[ 296 296 - a.font_bold, 296 296 + a.font_semi_bold, 297 297 t.atoms.text_contrast_medium, 298 298 {marginBottom: -8}, 299 299 style,

+2 -2

src/components/Menu/index.web.tsx

··· 292 292 <Text 293 293 style={[ 294 294 a.flex_1, 295 295 - a.font_bold, 295 295 + a.font_semi_bold, 296 296 t.atoms.text_contrast_high, 297 297 style, 298 298 disabled && t.atoms.text_contrast_low, ··· 372 372 return ( 373 373 <Text 374 374 style={[ 375 375 - a.font_bold, 375 375 + a.font_semi_bold, 376 376 a.p_sm, 377 377 t.atoms.text_contrast_low, 378 378 a.leading_snug,

+1 -1

src/components/NewskieDialog.tsx

··· 135 135 style={[a.absolute, a.inset_0]} 136 136 /> 137 137 </View> 138 138 - <Text style={[a.font_bold, a.text_xl]}> 138 138 + <Text style={[a.font_semi_bold, a.text_xl]}> 139 139 {isMe ? <Trans>Welcome, friend!</Trans> : <Trans>Say hello!</Trans>} 140 140 </Text> 141 141 </View>

+1 -1

src/components/Pills.tsx

··· 133 133 emoji 134 134 style={[ 135 135 text, 136 136 - a.font_bold, 136 136 + a.font_semi_bold, 137 137 a.leading_tight, 138 138 t.atoms.text_contrast_medium, 139 139 {paddingRight: 3},

+1 -1

src/components/PolicyUpdateOverlay/Badge.tsx

··· 25 25 <Logo fill={t.palette.primary_600} width={14} /> 26 26 <Text 27 27 style={[ 28 28 - a.font_bold, 28 28 + a.font_semi_bold, 29 29 { 30 30 color: t.palette.primary_600, 31 31 },

+2 -2

src/components/PolicyUpdateOverlay/updates/202508/index.tsx

··· 69 69 70 70 {screenReaderEnabled ? ( 71 71 <View style={[a.gap_sm]}> 72 72 - <Text emoji style={[a.text_2xl, a.font_bold, a.leading_snug]}> 72 72 + <Text emoji style={[a.text_2xl, a.font_semi_bold, a.leading_snug]}> 73 73 <Trans>Hey there 👋</Trans> 74 74 </Text> 75 75 <Text style={[a.leading_snug, a.text_md]}> ··· 115 115 </View> 116 116 ) : ( 117 117 <View style={[a.gap_sm]}> 118 118 - <Text emoji style={[a.text_2xl, a.font_bold, a.leading_snug]}> 118 118 + <Text emoji style={[a.text_2xl, a.font_semi_bold, a.leading_snug]}> 119 119 <Trans>Hey there 👋</Trans> 120 120 </Text> 121 121 <Text style={[a.leading_snug, a.text_md]}>

+1 -1

src/components/Post/Embed/ExternalEmbed/index.tsx

··· 126 126 <Text 127 127 emoji 128 128 numberOfLines={3} 129 129 - style={[a.text_md, a.font_bold, a.leading_snug]}> 129 129 + style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 130 130 {link.title || link.uri} 131 131 </Text> 132 132 )}

+1 -1

src/components/Post/Embed/VideoEmbed/VideoEmbedInner/TimeIndicator.tsx

··· 54 54 <Text 55 55 style={[ 56 56 {color: t.palette.white, fontSize: 12, fontVariant: ['tabular-nums']}, 57 57 - a.font_bold, 57 57 + a.font_semi_bold, 58 58 {lineHeight: 1.25}, 59 59 ]}> 60 60 {`${minutes}:${seconds}`}

+6 -1

src/components/PostControls/PostControlButton.tsx

··· 128 128 129 129 return ( 130 130 <Text 131 131 - style={[color, big ? a.text_md : a.text_sm, active && a.font_bold, style]} 131 131 + style={[ 132 132 + color, 133 133 + big ? a.text_md : a.text_sm, 134 134 + active && a.font_semi_bold, 135 135 + style, 136 136 + ]} 132 137 {...props} 133 138 /> 134 139 )

+2 -2

src/components/PostControls/RepostButton.tsx

··· 157 157 variant="ghost" 158 158 color="primary"> 159 159 <Repost size="lg" fill={t.palette.primary_500} /> 160 160 - <Text style={[a.font_bold, a.text_xl]}> 160 160 + <Text style={[a.font_semi_bold, a.text_xl]}> 161 161 {isReposted ? ( 162 162 <Trans>Remove repost</Trans> 163 163 ) : ( ··· 188 188 /> 189 189 <Text 190 190 style={[ 191 191 - a.font_bold, 191 191 + a.font_semi_bold, 192 192 a.text_xl, 193 193 embeddingDisabled && t.atoms.text_contrast_low, 194 194 ]}>

+1 -1

src/components/PostControls/ShareMenu/RecentChats.tsx

··· 203 203 a.text_sm, 204 204 t.atoms.text_contrast_high, 205 205 a.text_center, 206 206 - a.font_bold, 206 206 + a.font_semi_bold, 207 207 ]}> 208 208 <Trans>Start a conversation, and it will appear here.</Trans> 209 209 </Text>

+2 -2

src/components/ProfileCard.tsx

··· 233 233 <Text 234 234 emoji 235 235 style={[ 236 236 - a.font_bold, 236 236 + a.font_semi_bold, 237 237 a.leading_tight, 238 238 a.flex_shrink_0, 239 239 {maxWidth: '70%'}, ··· 287 287 emoji 288 288 style={[ 289 289 a.text_md, 290 290 - a.font_bold, 290 290 + a.font_semi_bold, 291 291 a.leading_snug, 292 292 a.self_start, 293 293 a.flex_shrink,

+3 -3

src/components/ProfileHoverCard/index.web.tsx

··· 515 515 <View style={[a.flex_row, a.align_center, a.pt_md, a.pb_xs]}> 516 516 <Text 517 517 numberOfLines={1} 518 518 - style={[a.text_lg, a.font_bold, a.self_start]}> 518 518 + style={[a.text_lg, a.font_semi_bold, a.self_start]}> 519 519 {sanitizeDisplayName( 520 520 profile.displayName || sanitizeHandle(profile.handle), 521 521 moderation.ui('displayName'), ··· 562 562 label={`${followers} ${pluralizedFollowers}`} 563 563 style={[t.atoms.text]} 564 564 onPress={hide}> 565 565 - <Text style={[a.text_md, a.font_bold]}>{followers} </Text> 565 565 + <Text style={[a.text_md, a.font_semi_bold]}>{followers} </Text> 566 566 <Text style={[t.atoms.text_contrast_medium]}> 567 567 {pluralizedFollowers} 568 568 </Text> ··· 572 572 label={_(msg`${following} following`)} 573 573 style={[t.atoms.text]} 574 574 onPress={hide}> 575 575 - <Text style={[a.text_md, a.font_bold]}>{following} </Text> 575 575 + <Text style={[a.text_md, a.font_semi_bold]}>{following} </Text> 576 576 <Text style={[t.atoms.text_contrast_medium]}> 577 577 {pluralizedFollowings} 578 578 </Text>

+1 -1

src/components/ProgressGuide/FollowDialog.tsx

··· 360 360 style={[ 361 361 a.z_10, 362 362 a.text_lg, 363 363 - a.font_heavy, 363 363 + a.font_bold, 364 364 a.leading_tight, 365 365 t.atoms.text_contrast_high, 366 366 ]}>

+1 -1

src/components/ProgressGuide/List.tsx

··· 28 28 <Text 29 29 style={[ 30 30 t.atoms.text_contrast_medium, 31 31 - a.font_bold, 31 31 + a.font_semi_bold, 32 32 a.text_sm, 33 33 {textTransform: 'uppercase'}, 34 34 ]}>

+1 -1

src/components/ProgressGuide/Task.tsx

··· 39 39 <Text 40 40 style={[ 41 41 a.text_sm, 42 42 - a.font_bold, 42 42 + a.font_semi_bold, 43 43 a.leading_tight, 44 44 tabularNumsTitle && {fontVariant: ['tabular-nums']}, 45 45 ]}>

+1 -1

src/components/ProgressGuide/Toast.tsx

··· 160 160 ref={animatedCheckRef} 161 161 /> 162 162 <View> 163 163 - <Text style={[a.text_md, a.font_bold]}>{title}</Text> 163 163 + <Text style={[a.text_md, a.font_semi_bold]}>{title}</Text> 164 164 {subtitle && ( 165 165 <Text style={[a.text_sm, t.atoms.text_contrast_medium]}> 166 166 {subtitle}

+1 -1

src/components/Prompt.tsx

··· 77 77 style={[ 78 78 a.flex_1, 79 79 a.text_2xl, 80 80 - a.font_bold, 80 80 + a.font_semi_bold, 81 81 a.pb_sm, 82 82 a.leading_snug, 83 83 style,

+3 -2

src/components/ReportDialog/SelectLabelerView.tsx

··· 24 24 return ( 25 25 <View style={[a.gap_lg]}> 26 26 <View style={[a.justify_center, gtMobile ? a.gap_sm : a.gap_xs]}> 27 27 - <Text style={[a.text_2xl, a.font_bold]}> 27 27 + <Text style={[a.text_2xl, a.font_semi_bold]}> 28 28 <Trans>Select moderator</Trans> 29 29 </Text> 30 30 <Text style={[a.text_md, t.atoms.text_contrast_medium]}> ··· 75 75 handle: labeler.creator.handle, 76 76 })} 77 77 /> 78 78 - <Text style={[t.atoms.text_contrast_medium, a.text_sm, a.font_bold]}> 78 78 + <Text 79 79 + style={[t.atoms.text_contrast_medium, a.text_sm, a.font_semi_bold]}> 79 80 @{labeler.creator.handle} 80 81 </Text> 81 82 </LabelingServiceCard.Content>

+3 -2

src/components/ReportDialog/SelectReportOptionView.tsx

··· 85 85 ) : null} 86 86 87 87 <View style={[a.justify_center, gtMobile ? a.gap_sm : a.gap_xs]}> 88 88 - <Text style={[a.text_2xl, a.font_bold]}>{i18n.title}</Text> 88 88 + <Text style={[a.text_2xl, a.font_semi_bold]}>{i18n.title}</Text> 89 89 <Text style={[a.text_md, t.atoms.text_contrast_medium]}> 90 90 {i18n.description} 91 91 </Text> ··· 173 173 interacted && t.atoms.bg_contrast_50, 174 174 ]}> 175 175 <View style={[a.flex_1, a.gap_xs]}> 176 176 - <Text style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}> 176 176 + <Text 177 177 + style={[a.text_md, a.font_semi_bold, t.atoms.text_contrast_medium]}> 177 178 {title} 178 179 </Text> 179 180 <Text style={[a.leading_tight, {maxWidth: 400}]}>{description}</Text>

+1 -1

src/components/ReportDialog/SubmitView.tsx

··· 125 125 t.atoms.border_contrast_low, 126 126 ]}> 127 127 <View style={[a.flex_1, a.gap_xs]}> 128 128 - <Text style={[a.text_md, a.font_bold]}> 128 128 + <Text style={[a.text_md, a.font_semi_bold]}> 129 129 {selectedReportOption.title} 130 130 </Text> 131 131 <Text style={[a.leading_tight, {maxWidth: 400}]}>

+7 -1

src/components/SearchError.tsx

··· 34 34 {maxWidth: gtMobile ? 394 : 294}, 35 35 gtMobile ? a.gap_md : a.gap_sm, 36 36 ]}> 37 37 - <Text style={[a.font_bold, a.text_lg, a.text_center, a.leading_snug]}> 37 37 + <Text 38 38 + style={[ 39 39 + a.font_semi_bold, 40 40 + a.text_lg, 41 41 + a.text_center, 42 42 + a.leading_snug, 43 43 + ]}> 38 44 {title} 39 45 </Text> 40 46 {children}

+1 -1

src/components/Select/index.tsx

··· 280 280 // eslint-disable-next-line bsky-internal/avoid-unwrapped-text 281 281 return ( 282 282 <View style={[a.flex_1, a.py_md, a.border_b, t.atoms.border_contrast_low]}> 283 283 - <Text style={[a.text_md, selected && a.font_bold]}>{children}</Text> 283 283 + <Text style={[a.text_md, selected && a.font_semi_bold]}>{children}</Text> 284 284 </View> 285 285 ) 286 286 }

+1 -1

src/components/Select/index.web.tsx

··· 259 259 a.text_sm, 260 260 {outline: 0}, 261 261 (hovered || focused) && {backgroundColor: t.palette.primary_50}, 262 262 - selected && [a.font_bold], 262 262 + selected && [a.font_semi_bold], 263 263 a.transition_color, 264 264 style, 265 265 ])}>

+1 -1

src/components/StarterPack/ProfileStarterPacks.tsx

··· 255 255 {marginTop: a.border.borderWidth}, 256 256 ]}> 257 257 <View style={[a.gap_xs]}> 258 258 - <Text style={[a.font_bold, a.text_lg, {color: 'white'}]}> 258 258 + <Text style={[a.font_semi_bold, a.text_lg, {color: 'white'}]}> 259 259 <Trans>You haven't created a starter pack yet!</Trans> 260 260 </Text> 261 261 <Text style={[a.text_md, {color: 'white'}]}>

+8 -3

src/components/StarterPack/QrCode.tsx

··· 54 54 ]}> 55 55 <View style={[a.gap_sm]}> 56 56 <Text 57 57 - style={[a.font_bold, a.text_3xl, a.text_center, {color: 'white'}]}> 57 57 + style={[ 58 58 + a.font_semi_bold, 59 59 + a.text_3xl, 60 60 + a.text_center, 61 61 + {color: 'white'}, 62 62 + ]}> 58 63 {record.name} 59 64 </Text> 60 65 </View> 61 66 <View style={[a.gap_xl, a.align_center]}> 62 67 <Text 63 68 style={[ 64 64 - a.font_bold, 69 69 + a.font_semi_bold, 65 70 a.text_center, 66 71 {color: 'white', fontSize: 18}, 67 72 ]}> ··· 76 81 a.flex, 77 82 a.flex_row, 78 83 a.align_center, 79 79 - a.font_bold, 84 84 + a.font_semi_bold, 80 85 {color: 'white', fontSize: 18, gap: 6}, 81 86 ]}> 82 87 <Trans>

+1 -1

src/components/StarterPack/ShareDialog.tsx

··· 77 77 ) : ( 78 78 <View style={[!gtMobile && a.gap_lg]}> 79 79 <View style={[a.gap_sm, gtMobile && a.pb_lg]}> 80 80 - <Text style={[a.font_bold, a.text_2xl]}> 80 80 + <Text style={[a.font_semi_bold, a.text_2xl]}> 81 81 <Trans>Invite people to this starter pack!</Trans> 82 82 </Text> 83 83 <Text style={[a.text_md, t.atoms.text_contrast_medium]}>

+2 -2

src/components/StarterPack/StarterPackCard.tsx

··· 77 77 <View style={[a.flex_1]}> 78 78 <Text 79 79 emoji 80 80 - style={[a.text_md, a.font_bold, a.leading_snug]} 80 80 + style={[a.text_md, a.font_semi_bold, a.leading_snug]} 81 81 numberOfLines={2}> 82 82 {record.name} 83 83 </Text> ··· 97 97 </Text> 98 98 ) : null} 99 99 {!!joinedAllTimeCount && joinedAllTimeCount >= 50 && ( 100 100 - <Text style={[a.font_bold, t.atoms.text_contrast_medium]}> 100 100 + <Text style={[a.font_semi_bold, t.atoms.text_contrast_medium]}> 101 101 <Trans comment="Number of users (always at least 50) who have joined Bluesky using a specific starter pack"> 102 102 <Plural value={joinedAllTimeCount} other="# users have" /> joined! 103 103 </Trans>

+1 -1

src/components/StarterPack/Wizard/WizardEditListDialog.tsx

··· 105 105 : [a.pb_sm, a.align_end], 106 106 ]}> 107 107 <View style={{width: 60}} /> 108 108 - <Text style={[a.font_bold, a.text_xl]}> 108 108 + <Text style={[a.font_semi_bold, a.text_xl]}> 109 109 {state.currentStep === 'Profiles' ? ( 110 110 <Trans>Edit People</Trans> 111 111 ) : (

+1 -1

src/components/StarterPack/Wizard/WizardListCard.tsx

··· 83 83 emoji 84 84 style={[ 85 85 a.flex_1, 86 86 - a.font_bold, 86 86 + a.font_semi_bold, 87 87 a.text_md, 88 88 a.leading_tight, 89 89 a.self_start,

+1 -1

src/components/SubtleWebHover.web.tsx

··· 11 11 if (isTouchDevice) { 12 12 return null 13 13 } 14 14 - let opacity: number 14 14 + let opacity = 0.5 15 15 switch (t.name) { 16 16 case 'dark': 17 17 opacity = 0.4

+1 -1

src/components/TrendingTopics.tsx

··· 90 90 91 91 <Text 92 92 style={[ 93 93 - a.font_bold, 93 93 + a.font_semi_bold, 94 94 a.leading_tight, 95 95 isSmall ? [a.text_sm] : [a.text_md, {paddingBottom: 1}], 96 96 ]}

+9 -3

src/components/VideoPostCard.tsx

··· 227 227 {likeCount > 0 && ( 228 228 <View style={[a.flex_row, a.align_center, a.gap_xs]}> 229 229 <Heart size="sm" fill="white" /> 230 230 - <Text style={[a.text_sm, a.font_bold, {color: 'white'}]}> 230 230 + <Text 231 231 + style={[a.text_sm, a.font_semi_bold, {color: 'white'}]}> 231 232 {formatCount(i18n, likeCount)} 232 233 </Text> 233 234 </View> ··· 235 236 {repostCount > 0 && ( 236 237 <View style={[a.flex_row, a.align_center, a.gap_xs]}> 237 238 <Repost size="sm" fill="white" /> 238 238 - <Text style={[a.text_sm, a.font_bold, {color: 'white'}]}> 239 239 + <Text 240 240 + style={[a.text_sm, a.font_semi_bold, {color: 'white'}]}> 239 241 {formatCount(i18n, repostCount)} 240 242 </Text> 241 243 </View> ··· 520 522 <View style={[a.flex_row, a.align_center, a.gap_xs]}> 521 523 <Heart size="sm" fill="white" /> 522 524 <Text 523 523 - style={[a.text_sm, a.font_bold, {color: 'white'}]}> 525 525 + style={[ 526 526 + a.text_sm, 527 527 + a.font_semi_bold, 528 528 + {color: 'white'}, 529 529 + ]}> 524 530 {formatCount(i18n, likeCount)} 525 531 </Text> 526 532 </View>

+2 -2

src/components/WelcomeModal.tsx

··· 108 108 <Text 109 109 style={[ 110 110 a.text_2xl, 111 111 - a.font_bold, 111 111 + a.font_semi_bold, 112 112 a.user_select_none, 113 113 {color: '#354358', letterSpacing: -0.5}, 114 114 ]}> ··· 127 127 <Text 128 128 style={[ 129 129 gtMobile ? a.text_4xl : a.text_3xl, 130 130 - a.font_bold, 130 130 + a.font_semi_bold, 131 131 a.text_center, 132 132 {color: '#354358'}, 133 133 web({

+1 -1

src/components/WhoCanReply.tsx

··· 188 188 label={_(msg`Dialog: adjust who can interact with this post`)} 189 189 style={web({maxWidth: 400})}> 190 190 <View style={[a.gap_sm]}> 191 191 - <Text style={[a.font_bold, a.text_xl, a.pb_sm]}> 191 191 + <Text style={[a.font_semi_bold, a.text_xl, a.pb_sm]}> 192 192 <Trans>Who can interact with this post?</Trans> 193 193 </Text> 194 194 <Rules

+1 -1

src/components/activity-notifications/SubscribeProfileDialog.tsx

··· 219 219 label={_(msg`Get notified of new posts from ${name}`)}> 220 220 <View style={[a.gap_lg]}> 221 221 <View style={[a.gap_xs]}> 222 222 - <Text style={[a.font_heavy, a.text_2xl]}> 222 222 + <Text style={[a.font_bold, a.text_2xl]}> 223 223 <Trans>Keep me posted</Trans> 224 224 </Text> 225 225 <Text style={[t.atoms.text_contrast_medium, a.text_md]}>

+2 -2

src/components/ageAssurance/AgeAssuranceAdmonition.tsx

··· 82 82 </View> 83 83 <View style={[a.flex_1, a.gap_xs, a.pr_4xl]}> 84 84 <Text style={[a.text_sm, a.leading_snug]}>{children}</Text> 85 85 - <Text style={[a.text_sm, a.leading_snug, a.font_bold]}> 85 85 + <Text style={[a.text_sm, a.leading_snug, a.font_semi_bold]}> 86 86 <Trans> 87 87 Learn more in your{' '} 88 88 <InlineLinkText 89 89 label={_(msg`Go to account settings`)} 90 90 to={'/settings/account'} 91 91 - style={[a.text_sm, a.leading_snug, a.font_bold]} 91 91 + style={[a.text_sm, a.leading_snug, a.font_semi_bold]} 92 92 onPress={() => { 93 93 logger.metric('ageAssurance:navigateToSettings', {}) 94 94 }}>

+1 -1

src/components/ageAssurance/AgeAssuranceAppealDialog.tsx

··· 89 89 <AgeAssuranceBadge /> 90 90 </View> 91 91 92 92 - <Text style={[a.text_2xl, a.font_heavy, a.pt_md, a.leading_tight]}> 92 92 + <Text style={[a.text_2xl, a.font_bold, a.pt_md, a.leading_tight]}> 93 93 <Trans>Contact us</Trans> 94 94 </Text> 95 95

+1 -1

src/components/ageAssurance/AgeAssuranceBadge.tsx

··· 29 29 <Shield size="sm" /> 30 30 <Text 31 31 style={[ 32 32 - a.font_bold, 32 32 + a.font_semi_bold, 33 33 a.leading_snug, 34 34 { 35 35 color: select(t.name, {

+1 -1

src/components/ageAssurance/AgeAssuranceInitDialog.tsx

··· 178 178 <View style={[a.align_start]}> 179 179 <AgeAssuranceBadge /> 180 180 181 181 - <Text style={[a.text_xl, a.font_heavy, a.pt_xl, a.pb_md]}> 181 181 + <Text style={[a.text_xl, a.font_bold, a.pt_xl, a.pb_md]}> 182 182 {success ? <Trans>Success!</Trans> : <Trans>Verify your age</Trans>} 183 183 </Text> 184 184

+2 -2

src/components/ageAssurance/AgeAssuranceRedirectDialog.tsx

··· 160 160 a.pb_md, 161 161 ]}> 162 162 <SuccessIcon size="sm" fill={t.palette.positive_600} /> 163 163 - <Text style={[a.text_xl, a.font_heavy]}> 163 163 + <Text style={[a.text_xl, a.font_bold]}> 164 164 <Trans>Success</Trans> 165 165 </Text> 166 166 </View> ··· 209 209 ]}> 210 210 {error && <ErrorIcon size="md" fill={t.palette.negative_500} />} 211 211 212 212 - <Text style={[a.text_xl, a.font_heavy]}> 212 212 + <Text style={[a.text_xl, a.font_bold]}> 213 213 {error ? <Trans>Connection issue</Trans> : <Trans>Verifying</Trans>} 214 214 </Text> 215 215

+1 -1

src/components/ageAssurance/AgeRestrictedScreen.tsx

··· 62 62 </View> 63 63 64 64 <View style={[a.gap_sm, a.pb_lg]}> 65 65 - <Text style={[a.text_xl, a.leading_snug, a.font_heavy]}> 65 65 + <Text style={[a.text_xl, a.leading_snug, a.font_bold]}> 66 66 <Trans> 67 67 You must complete age assurance in order to access this screen. 68 68 </Trans>

+1 -1

src/components/dialogs/BirthDateSettings.tsx

··· 38 38 label={_(msg`My Birthday`)} 39 39 style={web({maxWidth: 400})}> 40 40 <View style={[a.gap_sm]}> 41 41 - <Text style={[a.text_xl, a.font_bold]}> 41 41 + <Text style={[a.text_xl, a.font_semi_bold]}> 42 42 <Trans>My Birthday</Trans> 43 43 </Text> 44 44 <Text style={[a.leading_snug, t.atoms.text_contrast_medium]}>

+1 -1

src/components/dialogs/DeviceLocationRequestDialog.tsx

··· 108 108 109 109 return ( 110 110 <View style={[a.gap_md]}> 111 111 - <Text style={[a.text_xl, a.font_heavy]}> 111 111 + <Text style={[a.text_xl, a.font_bold]}> 112 112 <Trans>Confirm your location</Trans> 113 113 </Text> 114 114 <View style={[a.gap_sm, a.pb_xs]}>

+3 -3

src/components/dialogs/EmailDialog/screens/Manage2FA/Disable.tsx

··· 153 153 154 154 return ( 155 155 <View style={[a.gap_sm]}> 156 156 - <Text style={[a.text_xl, a.font_heavy, a.leading_snug]}> 156 156 + <Text style={[a.text_xl, a.font_bold, a.leading_snug]}> 157 157 <Trans>Disable email 2FA</Trans> 158 158 </Text> 159 159 ··· 163 163 style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}> 164 164 <Trans> 165 165 To disable your email 2FA method, please verify your access to{' '} 166 166 - <Span style={[a.font_bold]}>{currentAccount?.email}</Span> 166 166 + <Span style={[a.font_semi_bold]}>{currentAccount?.email}</Span> 167 167 </Trans> 168 168 </Text> 169 169 ··· 214 214 style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}> 215 215 <Trans> 216 216 To disable your email 2FA method, please verify your access to{' '} 217 217 - <Span style={[a.font_bold]}>{currentAccount?.email}</Span> 217 217 + <Span style={[a.font_semi_bold]}>{currentAccount?.email}</Span> 218 218 </Trans> 219 219 </Text> 220 220

+1 -1

src/components/dialogs/EmailDialog/screens/Manage2FA/Enable.tsx

··· 88 88 return ( 89 89 <View style={[a.gap_lg]}> 90 90 <View style={[a.gap_sm]}> 91 91 - <Text style={[a.text_xl, a.font_heavy, a.leading_snug]}> 91 91 + <Text style={[a.text_xl, a.font_bold, a.leading_snug]}> 92 92 <Trans>Enable email 2FA</Trans> 93 93 </Text> 94 94

+3 -3

src/components/dialogs/EmailDialog/screens/Update.tsx

··· 199 199 200 200 return ( 201 201 <View style={[a.gap_lg]}> 202 202 - <Text style={[a.text_xl, a.font_heavy]}> 202 202 + <Text style={[a.text_xl, a.font_bold]}> 203 203 <Trans>Update your email</Trans> 204 204 </Text> 205 205 ··· 239 239 <> 240 240 <Divider /> 241 241 <View> 242 242 - <Text style={[a.text_md, a.pb_sm, a.font_bold]}> 242 242 + <Text style={[a.text_md, a.pb_sm, a.font_semi_bold]}> 243 243 <Trans>Security step required</Trans> 244 244 </Text> 245 245 <Text ··· 282 282 <View style={[a.gap_sm]}> 283 283 <View style={[a.flex_row, a.gap_sm, a.align_center]}> 284 284 <Check fill={t.palette.positive_600} size="xs" /> 285 285 - <Text style={[a.text_md, a.font_heavy]}> 285 285 + <Text style={[a.text_md, a.font_bold]}> 286 286 <Trans>Success!</Trans> 287 287 </Text> 288 288 </View>

+1 -1

src/components/dialogs/EmailDialog/screens/VerificationReminder.tsx

··· 58 58 <View style={[a.mb_xs, {height: 150 - dialogPadding}]} /> 59 59 60 60 <View style={[a.gap_sm]}> 61 61 - <Text style={[a.text_xl, a.font_heavy]}> 61 61 + <Text style={[a.text_xl, a.font_bold]}> 62 62 <Trans>Please verify your email</Trans> 63 63 </Text> 64 64 <Text style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}>

+5 -5

src/components/dialogs/EmailDialog/screens/Verify.tsx

··· 174 174 return ( 175 175 <View style={[a.gap_lg]}> 176 176 <View style={[a.gap_sm]}> 177 177 - <Text style={[a.text_xl, a.font_heavy]}> 177 177 + <Text style={[a.text_xl, a.font_bold]}> 178 178 <Span style={{top: 1}}> 179 179 <Check size="sm" fill={t.palette.positive_600} /> 180 180 </Span> ··· 197 197 return ( 198 198 <View style={[a.gap_lg]}> 199 199 <View style={[a.gap_sm]}> 200 200 - <Text style={[a.text_xl, a.font_heavy]}> 200 200 + <Text style={[a.text_xl, a.font_bold]}> 201 201 {state.step === 'email' ? ( 202 202 state.mutationStatus === 'success' ? ( 203 203 <> ··· 239 239 state.mutationStatus === 'success' ? ( 240 240 <Trans> 241 241 We sent an email to{' '} 242 242 - <Span style={[a.font_bold, t.atoms.text]}> 242 242 + <Span style={[a.font_semi_bold, t.atoms.text]}> 243 243 {currentAccount!.email} 244 244 </Span>{' '} 245 245 containing a link. Please click on it to complete the email ··· 248 248 ) : ( 249 249 <Trans> 250 250 We'll send an email to{' '} 251 251 - <Span style={[a.font_bold, t.atoms.text]}> 251 251 + <Span style={[a.font_semi_bold, t.atoms.text]}> 252 252 {currentAccount!.email} 253 253 </Span>{' '} 254 254 containing a link. Please click on it to complete the email ··· 258 258 ) : ( 259 259 <Trans> 260 260 Please enter the code we sent to{' '} 261 261 - <Span style={[a.font_bold, t.atoms.text]}> 261 261 + <Span style={[a.font_semi_bold, t.atoms.text]}> 262 262 {currentAccount!.email} 263 263 </Span>{' '} 264 264 below.

+2 -2

src/components/dialogs/Embed.tsx

··· 104 104 <Dialog.Inner label={_(msg`Embed post`)} style={[{maxWidth: 500}]}> 105 105 <View style={[a.gap_lg]}> 106 106 <View style={[a.gap_sm]}> 107 107 - <Text style={[a.text_2xl, a.font_heavy]}> 107 107 + <Text style={[a.text_2xl, a.font_bold]}> 108 108 <Trans>Embed post</Trans> 109 109 </Text> 110 110 <Text ··· 147 147 148 148 {showCustomisation && ( 149 149 <View style={[a.gap_sm, a.p_md]}> 150 150 - <Text style={[t.atoms.text_contrast_medium, a.font_bold]}> 150 150 + <Text style={[t.atoms.text_contrast_medium, a.font_semi_bold]}> 151 151 <Trans>Color theme</Trans> 152 152 </Text> 153 153 <ToggleButton.Group

+1 -1

src/components/dialogs/EmbedConsent.tsx

··· 54 54 label={_(msg`External Media`)} 55 55 style={[gtMobile ? {width: 'auto', maxWidth: 400} : a.w_full]}> 56 56 <View style={a.gap_sm}> 57 57 - <Text style={[a.text_2xl, a.font_bold]}> 57 57 + <Text style={[a.text_2xl, a.font_semi_bold]}> 58 58 <Trans>External Media</Trans> 59 59 </Text> 60 60

+1 -1

src/components/dialogs/InAppBrowserConsent.tsx

··· 62 62 <Dialog.ScrollableInner label={_(msg`How should we open this link?`)}> 63 63 <View style={[a.gap_2xl]}> 64 64 <View style={[a.gap_sm]}> 65 65 - <Text style={[a.font_heavy, a.text_2xl]}> 65 65 + <Text style={[a.font_bold, a.text_2xl]}> 66 66 <Trans>How should we open this link?</Trans> 67 67 </Text> 68 68 <Text style={[t.atoms.text_contrast_high, a.leading_snug, a.text_md]}>

+3 -2

src/components/dialogs/LinkWarning.tsx

··· 68 68 }> 69 69 <View style={[a.gap_2xl]}> 70 70 <View style={[a.gap_sm]}> 71 71 - <Text style={[a.font_heavy, a.text_2xl]}> 71 71 + <Text style={[a.font_bold, a.text_2xl]}> 72 72 {potentiallyMisleading ? ( 73 73 <Trans>Potentially misleading link</Trans> 74 74 ) : ( ··· 151 151 ]}> 152 152 <Text style={[a.text_md, a.leading_snug, t.atoms.text_contrast_medium]}> 153 153 {scheme} 154 154 - <Text style={[a.text_md, a.leading_snug, t.atoms.text, a.font_bold]}> 154 154 + <Text 155 155 + style={[a.text_md, a.leading_snug, t.atoms.text, a.font_semi_bold]}> 155 156 {hostname} 156 157 </Text> 157 158 {rest}

+15 -8

src/components/dialogs/MutedWords.tsx

··· 108 108 <Dialog.ScrollableInner label={_(msg`Manage your muted words and tags`)}> 109 109 <View> 110 110 <Text 111 111 - style={[a.text_md, a.font_bold, a.pb_sm, t.atoms.text_contrast_high]}> 111 111 + style={[ 112 112 + a.text_md, 113 113 + a.font_semi_bold, 114 114 + a.pb_sm, 115 115 + t.atoms.text_contrast_high, 116 116 + ]}> 112 117 <Trans>Add muted words and tags</Trans> 113 118 </Text> 114 119 <Text style={[a.pb_lg, a.leading_snug, t.atoms.text_contrast_medium]}> ··· 147 152 style={[ 148 153 a.pb_xs, 149 154 a.text_sm, 150 150 - a.font_bold, 155 155 + a.font_semi_bold, 151 156 t.atoms.text_contrast_medium, 152 157 ]}> 153 158 <Trans>Duration:</Trans> ··· 247 252 style={[ 248 253 a.pb_xs, 249 254 a.text_sm, 250 250 - a.font_bold, 255 255 + a.font_semi_bold, 251 256 t.atoms.text_contrast_medium, 252 257 ]}> 253 258 <Trans>Mute in:</Trans> ··· 293 298 style={[ 294 299 a.pb_xs, 295 300 a.text_sm, 296 296 - a.font_bold, 301 301 + a.font_semi_bold, 297 302 t.atoms.text_contrast_medium, 298 303 ]}> 299 304 <Trans>Options:</Trans> ··· 362 367 <Text 363 368 style={[ 364 369 a.text_md, 365 365 - a.font_bold, 370 370 + a.font_semi_bold, 366 371 a.pb_md, 367 372 t.atoms.text_contrast_high, 368 373 ]}> ··· 455 460 style={[ 456 461 a.flex_1, 457 462 a.leading_snug, 458 458 - a.font_bold, 463 463 + a.font_semi_bold, 459 464 web({ 460 465 overflowWrap: 'break-word', 461 466 wordBreak: 'break-word', ··· 466 471 {word.value}{' '} 467 472 <Text style={[a.font_normal, t.atoms.text_contrast_medium]}> 468 473 in{' '} 469 469 - <Text style={[a.font_bold, t.atoms.text_contrast_medium]}> 474 474 + <Text 475 475 + style={[a.font_semi_bold, t.atoms.text_contrast_medium]}> 470 476 text & tags 471 477 </Text> 472 478 </Text> ··· 476 482 {word.value}{' '} 477 483 <Text style={[a.font_normal, t.atoms.text_contrast_medium]}> 478 484 in{' '} 479 479 - <Text style={[a.font_bold, t.atoms.text_contrast_medium]}> 485 485 + <Text 486 486 + style={[a.font_semi_bold, t.atoms.text_contrast_medium]}> 480 487 tags 481 488 </Text> 482 489 </Text>

+7 -5

src/components/dialogs/PostInteractionSettingsDialog.tsx

··· 84 84 ]}> 85 85 <Trans> 86 86 You can set default interaction settings in{' '} 87 87 - <Text style={[a.font_bold, t.atoms.text_contrast_medium]}> 87 87 + <Text style={[a.font_semi_bold, t.atoms.text_contrast_medium]}> 88 88 Settings &rarr; Moderation &rarr; Interaction settings 89 89 </Text> 90 90 . ··· 100 100 export function Header() { 101 101 return ( 102 102 <View style={[a.gap_md, a.pb_sm]}> 103 103 - <Text style={[a.text_2xl, a.font_bold]}> 103 103 + <Text style={[a.text_2xl, a.font_semi_bold]}> 104 104 <Trans>Post interaction settings</Trans> 105 105 </Text> 106 106 <Text style={[a.text_md, a.pb_xs]}> ··· 329 329 <View style={[a.flex_1, a.gap_md]}> 330 330 <View style={[a.gap_lg]}> 331 331 <View style={[a.gap_sm]}> 332 332 - <Text style={[a.font_bold, a.text_lg]}> 332 332 + <Text style={[a.font_semi_bold, a.text_lg]}> 333 333 <Trans>Quote settings</Trans> 334 334 </Text> 335 335 ··· 385 385 opacity: replySettingsDisabled ? 0.3 : 1, 386 386 }, 387 387 ]}> 388 388 - <Text style={[a.font_bold, a.text_lg]}> 388 388 + <Text style={[a.font_semi_bold, a.text_lg]}> 389 389 <Trans>Reply settings</Trans> 390 390 </Text> 391 391 ··· 535 535 }, 536 536 style, 537 537 ]}> 538 538 - <Text style={[a.text_sm, isSelected && a.font_bold]}>{label}</Text> 538 538 + <Text style={[a.text_sm, isSelected && a.font_semi_bold]}> 539 539 + {label} 540 540 + </Text> 539 541 {isSelected ? ( 540 542 <Check size="sm" fill={t.palette.primary_500} /> 541 543 ) : (

+1 -1

src/components/dialogs/SearchablePeopleList.tsx

··· 284 284 style={[ 285 285 a.z_10, 286 286 a.text_lg, 287 287 - a.font_heavy, 287 287 + a.font_bold, 288 288 a.leading_tight, 289 289 t.atoms.text_contrast_high, 290 290 ]}>

+3 -3

src/components/dialogs/StarterPackDialog.tsx

··· 172 172 isWeb ? a.mb_2xl : a.my_lg, 173 173 a.align_center, 174 174 ]}> 175 175 - <Text style={[a.text_lg, a.font_bold]}> 175 175 + <Text style={[a.text_lg, a.font_semi_bold]}> 176 176 <Trans>Add to starter packs</Trans> 177 177 </Text> 178 178 <Button ··· 189 189 <> 190 190 <View 191 191 style={[a.flex_row, a.justify_between, a.align_center, a.py_md]}> 192 192 - <Text style={[a.text_md, a.font_bold]}> 192 192 + <Text style={[a.text_md, a.font_semi_bold]}> 193 193 <Trans>New starter pack</Trans> 194 194 </Text> 195 195 <Button ··· 331 331 return ( 332 332 <View style={[a.flex_row, a.justify_between, a.align_center, a.py_md]}> 333 333 <View> 334 334 - <Text emoji style={[a.text_md, a.font_bold]} numberOfLines={1}> 334 334 + <Text emoji style={[a.text_md, a.font_semi_bold]} numberOfLines={1}> 335 335 {record.name} 336 336 </Text> 337 337

+1 -1

src/components/dialogs/SwitchAccount.tsx

··· 45 45 <Dialog.Handle /> 46 46 <Dialog.ScrollableInner label={_(msg`Switch Account`)}> 47 47 <View style={[a.gap_lg]}> 48 48 - <Text style={[a.text_2xl, a.font_bold]}> 48 48 + <Text style={[a.text_2xl, a.font_semi_bold]}> 49 49 <Trans>Switch Account</Trans> 50 50 </Text> 51 51

+2 -2

src/components/dialogs/nuxs/ActivitySubscriptions.tsx

··· 66 66 <SparkleIcon fill={t.palette.primary_800} size="sm" /> 67 67 <Text 68 68 style={[ 69 69 - a.font_bold, 69 69 + a.font_semi_bold, 70 70 { 71 71 color: t.palette.primary_800, 72 72 }, ··· 127 127 style={[ 128 128 a.text_3xl, 129 129 a.leading_tight, 130 130 - a.font_heavy, 130 130 + a.font_bold, 131 131 a.text_center, 132 132 { 133 133 fontSize: isWeb ? 28 : 32,

+2 -2

src/components/dialogs/nuxs/BookmarksAnnouncement.tsx

··· 65 65 <SparkleIcon fill={t.palette.primary_800} size="sm" /> 66 66 <Text 67 67 style={[ 68 68 - a.font_bold, 68 68 + a.font_semi_bold, 69 69 { 70 70 color: t.palette.primary_800, 71 71 }, ··· 133 133 style={[ 134 134 a.text_3xl, 135 135 a.leading_tight, 136 136 - a.font_heavy, 136 136 + a.font_bold, 137 137 a.text_center, 138 138 { 139 139 fontSize: isWeb ? 28 : 32,

+4 -4

src/components/dialogs/nuxs/InitialVerificationAnnouncement.tsx

··· 55 55 <SparkleIcon fill={t.palette.primary_700} size="sm" /> 56 56 <Text 57 57 style={[ 58 58 - a.font_bold, 58 58 + a.font_semi_bold, 59 59 { 60 60 color: t.palette.primary_700, 61 61 }, ··· 87 87 </View> 88 88 89 89 <View style={[a.gap_xs]}> 90 90 - <Text style={[a.text_2xl, a.font_bold, a.leading_snug]}> 90 90 + <Text style={[a.text_2xl, a.font_semi_bold, a.leading_snug]}> 91 91 <Trans>A new form of verification</Trans> 92 92 </Text> 93 93 <Text style={[a.leading_snug, a.text_md]}> ··· 123 123 <View style={[a.gap_sm]}> 124 124 <View style={[a.flex_row, a.align_center, a.gap_xs]}> 125 125 <VerifierCheck width={14} /> 126 126 - <Text style={[a.text_lg, a.font_bold, a.leading_snug]}> 126 126 + <Text style={[a.text_lg, a.font_semi_bold, a.leading_snug]}> 127 127 <Trans>Who can verify?</Trans> 128 128 </Text> 129 129 </View> ··· 138 138 <Trans> 139 139 Trust emerges from relationships, communities, and shared 140 140 context, so we’re also enabling{' '} 141 141 - <Span style={[a.font_bold]}>trusted verifiers</Span>: 141 141 + <Span style={[a.font_semi_bold]}>trusted verifiers</Span>: 142 142 organizations that can directly issue verification. 143 143 </Trans> 144 144 </Text>

+3 -1

src/components/dms/ChatEmptyPill.tsx

··· 89 89 onPress={onPress} 90 90 onPressIn={onPressIn} 91 91 onPressOut={onPressOut}> 92 92 - <Text style={[a.font_bold, a.pointer_events_none]} selectable={false}> 92 92 + <Text 93 93 + style={[a.font_semi_bold, a.pointer_events_none]} 94 94 + selectable={false}> 93 95 {prompts[promptIndex]} 94 96 </Text> 95 97 </AnimatedPressable>

+2 -1

src/components/dms/DateDivider.tsx

··· 67 67 a.px_md, 68 68 ]}> 69 69 <Trans> 70 70 - <Text style={[a.text_xs, t.atoms.text_contrast_medium, a.font_bold]}> 70 70 + <Text 71 71 + style={[a.text_xs, t.atoms.text_contrast_medium, a.font_semi_bold]}> 71 72 {date} 72 73 </Text>{' '} 73 74 at {time}

+1 -1

src/components/dms/EmojiPopup.android.tsx

··· 51 51 a.border_b, 52 52 t.atoms.border_contrast_low, 53 53 ]}> 54 54 - <Text style={[a.font_bold, a.text_md]}> 54 54 + <Text style={[a.font_semi_bold, a.text_md]}> 55 55 <Trans>Add Reaction</Trans> 56 56 </Text> 57 57 <Button

+1 -1

src/components/dms/MessagesListBlockedFooter.tsx

··· 61 61 return ( 62 62 <View style={[hasMessages && a.pt_md, a.pb_xl, a.gap_lg]}> 63 63 <Divider /> 64 64 - <Text style={[a.text_md, a.font_bold, a.text_center]}> 64 64 + <Text style={[a.text_md, a.font_semi_bold, a.text_center]}> 65 65 {isBlocking ? ( 66 66 <Trans>You have blocked this user</Trans> 67 67 ) : (

+1 -1

src/components/dms/MessagesListHeader.tsx

··· 154 154 emoji 155 155 style={[ 156 156 a.text_md, 157 157 - a.font_bold, 157 157 + a.font_semi_bold, 158 158 a.self_start, 159 159 web(a.leading_normal), 160 160 ]}

+1 -1

src/components/dms/NewMessagesPill.tsx

··· 88 88 onPress={onPress} 89 89 onPressIn={onPressIn} 90 90 onPressOut={onPressOut}> 91 91 - <Text style={[a.font_bold]}> 91 91 + <Text style={[a.font_semi_bold]}> 92 92 <Trans>New messages</Trans> 93 93 </Text> 94 94 </AnimatedPressable>

+5 -4

src/components/dms/ReportDialog.tsx

··· 200 200 </Button> 201 201 202 202 <View style={[a.justify_center, gtMobile ? a.gap_sm : a.gap_xs]}> 203 203 - <Text style={[a.text_2xl, a.font_bold]}>{copy.title}</Text> 203 203 + <Text style={[a.text_2xl, a.font_semi_bold]}>{copy.title}</Text> 204 204 <Text style={[a.text_md, t.atoms.text_contrast_medium]}> 205 205 <Trans> 206 206 Your report will be sent to the Bluesky Moderation Service ··· 213 213 )} 214 214 215 215 <Text style={[a.text_md, t.atoms.text_contrast_medium]}> 216 216 - <Text style={[a.font_bold, a.text_md, t.atoms.text_contrast_medium]}> 216 216 + <Text 217 217 + style={[a.font_semi_bold, a.text_md, t.atoms.text_contrast_medium]}> 217 218 <Trans>Reason:</Trans> 218 219 </Text>{' '} 219 219 - <Text style={[a.font_bold, a.text_md]}>{reportOption.title}</Text> 220 220 + <Text style={[a.font_semi_bold, a.text_md]}>{reportOption.title}</Text> 220 221 </Text> 221 222 222 223 <Divider /> ··· 346 347 return ( 347 348 <View style={a.gap_2xl}> 348 349 <View style={[a.justify_center, gtMobile ? a.gap_sm : a.gap_xs]}> 349 349 - <Text style={[a.text_2xl, a.font_bold]}> 350 350 + <Text style={[a.text_2xl, a.font_semi_bold]}> 350 351 <Trans>Report submitted</Trans> 351 352 </Text> 352 353 <Text style={[a.text_md, t.atoms.text_contrast_medium]}>

+2 -1

src/components/forms/FormError.tsx

··· 20 20 ]}> 21 21 <Warning fill={t.palette.white} size="md" /> 22 22 <View style={[a.flex_1]}> 23 23 - <Text style={[{color: t.palette.white}, a.font_bold, a.leading_snug]}> 23 23 + <Text 24 24 + style={[{color: t.palette.white}, a.font_semi_bold, a.leading_snug]}> 24 25 {error} 25 26 </Text> 26 27 </View>

+19 -9

src/components/forms/TextField.tsx

··· 15 15 android, 16 16 applyFonts, 17 17 atoms as a, 18 18 - ios, 19 18 platform, 20 19 type TextStyleProp, 21 20 tokens, ··· 202 201 a.px_xs, 203 202 { 204 203 // paddingVertical doesn't work w/multiline - esb 205 205 - lineHeight: a.text_md.fontSize * 1.1875, 204 204 + lineHeight: a.text_md.fontSize * 1.2, 206 205 textAlignVertical: rest.multiline ? 'top' : undefined, 207 206 minHeight: rest.multiline ? 80 : undefined, 208 207 minWidth: 0, 208 208 + paddingTop: 13, 209 209 + paddingBottom: 13, 209 210 }, 210 210 - ios({paddingTop: 12, paddingBottom: 13}), 211 211 - // Needs to be sm on Paper, md on Fabric for some godforsaken reason -sfn 212 212 - android(a.py_sm), 213 213 - // fix for autofill styles covering border 211 211 + android({ 212 212 + paddingTop: 8, 213 213 + paddingBottom: 9, 214 214 + }), 215 215 + /* 216 216 + * Margins are needed here to avoid autofill background overlapping the 217 217 + * top and bottom borders - esb 218 218 + */ 214 219 web({ 215 215 - paddingTop: 10, 220 220 + paddingTop: 11, 216 221 paddingBottom: 11, 217 222 marginTop: 2, 218 223 marginBottom: 2, ··· 262 267 a.absolute, 263 268 a.inset_0, 264 269 a.rounded_sm, 265 265 - t.atoms.bg_contrast_25, 270 270 + t.atoms.bg_contrast_50, 266 271 {borderColor: 'transparent', borderWidth: 2}, 267 272 ctx.hovered ? chromeHover : {}, 268 273 ctx.focused ? chromeFocus : {}, ··· 287 292 return ( 288 293 <Text 289 294 nativeID={nativeID} 290 290 - style={[a.text_sm, a.font_bold, t.atoms.text_contrast_medium, a.mb_sm]}> 295 295 + style={[ 296 296 + a.text_sm, 297 297 + a.font_semi_bold, 298 298 + t.atoms.text_contrast_medium, 299 299 + a.mb_sm, 300 300 + ]}> 291 301 {children} 292 302 </Text> 293 303 )

+1 -1

src/components/forms/Toggle.tsx

··· 249 249 return ( 250 250 <Text 251 251 style={[ 252 252 - a.font_bold, 252 252 + a.font_semi_bold, 253 253 a.leading_tight, 254 254 { 255 255 userSelect: 'none',

+1 -1

src/components/forms/ToggleButton.tsx

··· 133 133 <Text 134 134 style={[ 135 135 a.text_center, 136 136 - a.font_bold, 136 136 + a.font_semi_bold, 137 137 t.atoms.text_contrast_medium, 138 138 textStyles, 139 139 ]}>

+4 -4

src/components/intents/VerifyEmailIntentDialog.tsx

··· 75 75 </View> 76 76 ) : status === 'success' ? ( 77 77 <View style={[a.gap_sm, isNative && a.pb_xl]}> 78 78 - <Text style={[a.font_heavy, a.text_2xl]}> 78 78 + <Text style={[a.font_bold, a.text_2xl]}> 79 79 <Trans>Email Verified</Trans> 80 80 </Text> 81 81 <Text style={[a.text_md, a.leading_snug]}> ··· 87 87 </View> 88 88 ) : status === 'failure' ? ( 89 89 <View style={[a.gap_sm]}> 90 90 - <Text style={[a.font_heavy, a.text_2xl]}> 90 90 + <Text style={[a.font_bold, a.text_2xl]}> 91 91 <Trans>Invalid Verification Code</Trans> 92 92 </Text> 93 93 <Text style={[a.text_md, a.leading_snug]}> ··· 100 100 </View> 101 101 ) : ( 102 102 <View style={[a.gap_sm, isNative && a.pb_xl]}> 103 103 - <Text style={[a.font_heavy, a.text_2xl]}> 103 103 + <Text style={[a.font_bold, a.text_2xl]}> 104 104 <Trans>Email Resent</Trans> 105 105 </Text> 106 106 <Text style={[a.text_md, a.leading_snug]}> 107 107 <Trans> 108 108 We have sent another verification email to{' '} 109 109 - <Text style={[a.text_md, a.font_bold]}> 109 109 + <Text style={[a.text_md, a.font_semi_bold]}> 110 110 {currentAccount?.email} 111 111 </Text> 112 112 .

+2 -2

src/components/interstitials/Trending.tsx

··· 82 82 style={[ 83 83 t.atoms.text_contrast_medium, 84 84 a.text_sm, 85 85 - a.font_bold, 85 85 + a.font_semi_bold, 86 86 ]}> 87 87 {' '} 88 88 </Text> ··· 101 101 style={[ 102 102 t.atoms.text, 103 103 a.text_sm, 104 104 - a.font_bold, 104 104 + a.font_semi_bold, 105 105 {opacity: 0.7}, // NOTE: we use opacity 0.7 instead of a color to match the color of the home pager tab bar 106 106 ]}> 107 107 {topic.topic}

+1 -1

src/components/interstitials/TrendingVideos.tsx

··· 82 82 a.align_center, 83 83 a.justify_between, 84 84 ]}> 85 85 - <Text style={[a.text_sm, a.font_bold, a.leading_snug]}> 85 85 + <Text style={[a.text_sm, a.font_semi_bold, a.leading_snug]}> 86 86 <Trans>Trending Videos</Trans> 87 87 </Text> 88 88 <Button

+2 -2

src/components/live/EditLiveDialog.tsx

··· 120 120 style={web({maxWidth: 420})}> 121 121 <View style={[a.gap_lg]}> 122 122 <View style={[a.gap_sm]}> 123 123 - <Text style={[a.font_bold, a.text_2xl]}> 123 123 + <Text style={[a.font_semi_bold, a.text_2xl]}> 124 124 <Trans>You are Live</Trans> 125 125 </Text> 126 126 <View style={[a.flex_row, a.align_center, a.gap_xs]}> ··· 182 182 a.text_sm, 183 183 a.leading_snug, 184 184 a.flex_1, 185 185 - a.font_bold, 185 185 + a.font_semi_bold, 186 186 {color: t.palette.negative_500}, 187 187 ]}> 188 188 {liveLinkError ? (

+2 -2

src/components/live/GoLiveDialog.tsx

··· 94 94 style={web({maxWidth: 420})}> 95 95 <View style={[a.gap_xl]}> 96 96 <View style={[a.gap_sm]}> 97 97 - <Text style={[a.font_bold, a.text_2xl]}> 97 97 + <Text style={[a.font_semi_bold, a.text_2xl]}> 98 98 <Trans>Go Live</Trans> 99 99 </Text> 100 100 <Text style={[a.text_md, a.leading_snug, t.atoms.text_contrast_high]}> ··· 153 153 a.text_sm, 154 154 a.leading_snug, 155 155 a.flex_1, 156 156 - a.font_bold, 156 156 + a.font_semi_bold, 157 157 {color: t.palette.negative_500}, 158 158 ]}> 159 159 {liveLinkError ? (

+1 -1

src/components/live/LinkPreview.tsx

··· 70 70 <> 71 71 <Text 72 72 numberOfLines={2} 73 73 - style={[a.leading_snug, a.font_bold, a.text_md]}> 73 73 + style={[a.leading_snug, a.font_semi_bold, a.text_md]}> 74 74 {linkMeta.title || linkMeta.url} 75 75 </Text> 76 76 <View style={[a.flex_row, a.align_center, a.gap_2xs]}>

+1 -1

src/components/live/LiveIndicator.tsx

··· 39 39 <Text 40 40 style={[ 41 41 a.text_center, 42 42 - a.font_bold, 42 42 + a.font_semi_bold, 43 43 fontSize, 44 44 {color: t.palette.white}, 45 45 ]}>

+1 -1

src/components/live/LiveStatusDialog.tsx

··· 137 137 <View style={[a.w_full, a.justify_center, a.gap_2xs]}> 138 138 <Text 139 139 numberOfLines={3} 140 140 - style={[a.leading_snug, a.font_bold, a.text_xl]}> 140 140 + style={[a.leading_snug, a.font_semi_bold, a.text_xl]}> 141 141 {embed.external.title || embed.external.uri} 142 142 </Text> 143 143 <View style={[a.flex_row, a.align_center, a.gap_2xs]}>

+4 -4

src/components/moderation/ContentHider.tsx

··· 178 178 style={[ 179 179 a.flex_1, 180 180 a.text_left, 181 181 - a.font_bold, 181 181 + a.font_semi_bold, 182 182 a.leading_snug, 183 183 - gtMobile && [a.font_bold], 183 183 + gtMobile && [a.font_semi_bold], 184 184 t.atoms.text_contrast_medium, 185 185 web({ 186 186 marginBottom: 1, ··· 192 192 {!modui.noOverride && ( 193 193 <Text 194 194 style={[ 195 195 - a.font_bold, 195 195 + a.font_semi_bold, 196 196 a.leading_snug, 197 197 - gtMobile && [a.font_bold], 197 197 + gtMobile && [a.font_semi_bold], 198 198 t.atoms.text_contrast_high, 199 199 web({ 200 200 marginBottom: 1,

+8 -3

src/components/moderation/LabelPreference.tsx

··· 48 48 49 49 return ( 50 50 <View style={[a.gap_xs, a.flex_1]}> 51 51 - <Text emoji style={[a.font_bold, gtPhone ? a.text_sm : a.text_md]}> 51 51 + <Text emoji style={[a.font_semi_bold, gtPhone ? a.text_sm : a.text_md]}> 52 52 {name} 53 53 </Text> 54 54 <Text emoji style={[t.atoms.text_contrast_medium, a.leading_snug]}> ··· 241 241 <View style={[a.flex_row, a.gap_xs, a.align_center, a.mt_xs]}> 242 242 <CircleInfo size="sm" fill={t.atoms.text_contrast_high.color} /> 243 243 244 244 - <Text style={[t.atoms.text_contrast_medium, a.font_bold, a.italic]}> 244 244 + <Text 245 245 + style={[ 246 246 + t.atoms.text_contrast_medium, 247 247 + a.font_semi_bold, 248 248 + a.italic, 249 249 + ]}> 245 250 {adultDisabled ? ( 246 251 <Trans>Adult content is disabled.</Trans> 247 252 ) : isGlobalLabel ? ( ··· 274 279 t.atoms.border_contrast_low, 275 280 a.self_start, 276 281 ]}> 277 277 - <Text emoji style={[a.font_bold, t.atoms.text_contrast_low]}> 282 282 + <Text emoji style={[a.font_semi_bold, t.atoms.text_contrast_low]}> 278 283 {currentPrefLabel} 279 284 </Text> 280 285 </View>

+3 -3

src/components/moderation/LabelsOnMeDialog.tsx

··· 67 67 /> 68 68 ) : ( 69 69 <> 70 70 - <Text style={[a.text_2xl, a.font_heavy, a.pb_xs, a.leading_tight]}> 70 70 + <Text style={[a.text_2xl, a.font_bold, a.pb_xs, a.leading_tight]}> 71 71 {isAccount ? ( 72 72 <Trans>Labels on your account</Trans> 73 73 ) : ( ··· 134 134 ]}> 135 135 <View style={[a.p_md, a.gap_sm, a.flex_row]}> 136 136 <View style={[a.flex_1, a.gap_xs]}> 137 137 - <Text emoji style={[a.font_bold, a.text_md]}> 137 137 + <Text emoji style={[a.font_semi_bold, a.text_md]}> 138 138 {strings.name} 139 139 </Text> 140 140 <Text emoji style={[t.atoms.text_contrast_medium, a.leading_snug]}> ··· 264 264 return ( 265 265 <> 266 266 <View> 267 267 - <Text style={[a.text_2xl, a.font_bold, a.pb_xs, a.leading_tight]}> 267 267 + <Text style={[a.text_2xl, a.font_semi_bold, a.pb_xs, a.leading_tight]}> 268 268 <Trans>Appeal "{strings.name}" label</Trans> 269 269 </Text> 270 270 <Text style={[a.text_md, a.leading_snug]}>

+1 -1

src/components/moderation/ModerationDetailsDialog.tsx

··· 142 142 paddingBottom: 0, 143 143 }}> 144 144 <View style={[xGutters, a.pb_lg]}> 145 145 - <Text emoji style={[t.atoms.text, a.text_2xl, a.font_heavy, a.mb_sm]}> 145 145 + <Text emoji style={[t.atoms.text, a.text_2xl, a.font_bold, a.mb_sm]}> 146 146 {name} 147 147 </Text> 148 148 <Text style={[t.atoms.text, a.text_sm, a.leading_snug]}>

+6 -6

src/components/moderation/ReportDialog/index.tsx

··· 69 69 const {_} = useLingui() 70 70 return ( 71 71 <Dialog.ScrollableInner label={_(msg`Report dialog`)}> 72 72 - <Text style={[a.font_heavy, a.text_xl, a.leading_snug, a.pb_xs]}> 72 72 + <Text style={[a.font_bold, a.text_xl, a.leading_snug, a.pb_xs]}> 73 73 <Trans>Invalid report subject</Trans> 74 74 </Text> 75 75 <Text style={[a.text_md, a.leading_snug]}> ··· 393 393 <Text style={[a.leading_snug, a.pb_xs]}> 394 394 <Trans> 395 395 Your report will be sent to{' '} 396 396 - <Text style={[a.font_bold, a.leading_snug]}> 396 396 + <Text style={[a.font_semi_bold, a.leading_snug]}> 397 397 {state.selectedLabeler?.creator.displayName} 398 398 </Text> 399 399 . ··· 529 529 ) : ( 530 530 <Text 531 531 style={[ 532 532 - a.font_heavy, 532 532 + a.font_bold, 533 533 a.text_center, 534 534 t.atoms.text, 535 535 { ··· 552 552 <Text 553 553 style={[ 554 554 a.flex_1, 555 555 - a.font_heavy, 555 555 + a.font_bold, 556 556 a.text_lg, 557 557 a.leading_snug, 558 558 active ? t.atoms.text : t.atoms.text_contrast_medium, ··· 598 598 ? [t.atoms.border_contrast_high] 599 599 : [t.atoms.border_contrast_low], 600 600 ]}> 601 601 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 601 601 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 602 602 {option.title} 603 603 </Text> 604 604 <Text ··· 670 670 avatar={labeler.creator.avatar} 671 671 /> 672 672 <View style={[a.flex_1]}> 673 673 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 673 673 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 674 674 {title} 675 675 </Text> 676 676 <Text

+8 -2

src/components/moderation/ScreenHider.tsx

··· 86 86 </View> 87 87 </View> 88 88 <Text 89 89 - style={[a.text_4xl, a.font_bold, a.text_center, a.mb_md, t.atoms.text]}> 89 89 + style={[ 90 90 + a.text_4xl, 91 91 + a.font_semi_bold, 92 92 + a.text_center, 93 93 + a.mb_md, 94 94 + t.atoms.text, 95 95 + ]}> 90 96 {isNoPwi ? ( 91 97 <Trans>Sign-in Required</Trans> 92 98 ) : ( ··· 112 118 <Text 113 119 style={[ 114 120 a.text_lg, 115 115 - a.font_bold, 121 121 + a.font_semi_bold, 116 122 a.leading_snug, 117 123 t.atoms.text, 118 124 a.ml_xs,

+2 -2

src/components/verification/VerificationsDialog.tsx

··· 79 79 gtMobile ? {width: 'auto', maxWidth: 400, minWidth: 200} : a.w_full, 80 80 ]}> 81 81 <View style={[a.gap_sm, a.pb_lg]}> 82 82 - <Text style={[a.text_2xl, a.font_bold, a.pr_4xl, a.leading_tight]}> 82 82 + <Text style={[a.text_2xl, a.font_semi_bold, a.pr_4xl, a.leading_tight]}> 83 83 {label} 84 84 </Text> 85 85 <Text style={[a.text_md, a.leading_snug]}> ··· 206 206 <ProfileCard.AvatarPlaceholder /> 207 207 <View style={[a.flex_1]}> 208 208 <Text 209 209 - style={[a.text_md, a.font_bold, a.leading_snug]} 209 209 + style={[a.text_md, a.font_semi_bold, a.leading_snug]} 210 210 numberOfLines={1}> 211 211 <Trans>Unknown verifier</Trans> 212 212 </Text>

+2 -1

src/components/verification/VerifierDialog.tsx

··· 89 89 </View> 90 90 91 91 <View style={[a.gap_sm]}> 92 92 - <Text style={[a.text_2xl, a.font_bold, a.pr_4xl, a.leading_tight]}> 92 92 + <Text 93 93 + style={[a.text_2xl, a.font_semi_bold, a.pr_4xl, a.leading_tight]}> 93 94 {label} 94 95 </Text> 95 96 <Text style={[a.text_md, a.leading_snug]}>

+1 -1

src/lib/ThemeContext.tsx

··· 1 1 import {type ReactNode} from 'react' 2 2 import {createContext, useContext} from 'react' 3 3 import {type TextStyle, type ViewStyle} from 'react-native' 4 4 + import {type ThemeName} from '@bsky.app/alf' 4 5 5 5 - import {type ThemeName} from '#/alf/types' 6 6 import {darkTheme, defaultTheme, dimTheme} from './themes' 7 7 8 8 export type ColorScheme = 'light' | 'dark'

+2 -2

src/lib/custom-animations/CountWheel.tsx

··· 147 147 big ? a.text_md : a.text_sm, 148 148 a.user_select_none, 149 149 isLiked 150 150 - ? [a.font_bold, s.likeColor] 150 150 + ? [a.font_semi_bold, s.likeColor] 151 151 : {color: t.palette.contrast_500}, 152 152 ]}> 153 153 {formattedCount} ··· 165 165 big ? a.text_md : a.text_sm, 166 166 a.user_select_none, 167 167 isLiked 168 168 - ? [a.font_bold, s.likeColor] 168 168 + ? [a.font_semi_bold, s.likeColor] 169 169 : {color: t.palette.contrast_500}, 170 170 ]}> 171 171 {formattedPrevCount}

+2 -2

src/lib/custom-animations/CountWheel.web.tsx

··· 93 93 big ? a.text_md : a.text_sm, 94 94 a.user_select_none, 95 95 isLiked 96 96 - ? [a.font_bold, s.likeColor] 96 96 + ? [a.font_semi_bold, s.likeColor] 97 97 : {color: t.palette.contrast_500}, 98 98 ]}> 99 99 {formattedCount} ··· 110 110 big ? a.text_md : a.text_sm, 111 111 a.user_select_none, 112 112 isLiked 113 113 - ? [a.font_bold, s.likeColor] 113 113 + ? [a.font_semi_bold, s.likeColor] 114 114 : {color: t.palette.contrast_500}, 115 115 ]}> 116 116 {formattedPrevCount}

+27 -27

src/lib/themes.ts

··· 101 101 '2xl-medium': { 102 102 fontSize: 18, 103 103 letterSpacing: tokens.TRACKING, 104 104 - fontWeight: fontWeight.bold, 104 104 + fontWeight: fontWeight.semiBold, 105 105 }, 106 106 '2xl-bold': { 107 107 fontSize: 18, 108 108 letterSpacing: tokens.TRACKING, 109 109 - fontWeight: fontWeight.bold, 109 109 + fontWeight: fontWeight.semiBold, 110 110 }, 111 111 '2xl-heavy': { 112 112 fontSize: 18, 113 113 letterSpacing: tokens.TRACKING, 114 114 - fontWeight: fontWeight.heavy, 114 114 + fontWeight: fontWeight.bold, 115 115 }, 116 116 'xl-thin': { 117 117 fontSize: 17, ··· 126 126 'xl-medium': { 127 127 fontSize: 17, 128 128 letterSpacing: tokens.TRACKING, 129 129 - fontWeight: fontWeight.bold, 129 129 + fontWeight: fontWeight.semiBold, 130 130 }, 131 131 'xl-bold': { 132 132 fontSize: 17, 133 133 letterSpacing: tokens.TRACKING, 134 134 - fontWeight: fontWeight.bold, 134 134 + fontWeight: fontWeight.semiBold, 135 135 }, 136 136 'xl-heavy': { 137 137 fontSize: 17, 138 138 letterSpacing: tokens.TRACKING, 139 139 - fontWeight: fontWeight.heavy, 139 139 + fontWeight: fontWeight.bold, 140 140 }, 141 141 'lg-thin': { 142 142 fontSize: 16, ··· 151 151 'lg-medium': { 152 152 fontSize: 16, 153 153 letterSpacing: tokens.TRACKING, 154 154 - fontWeight: fontWeight.bold, 154 154 + fontWeight: fontWeight.semiBold, 155 155 }, 156 156 'lg-bold': { 157 157 fontSize: 16, 158 158 letterSpacing: tokens.TRACKING, 159 159 - fontWeight: fontWeight.bold, 159 159 + fontWeight: fontWeight.semiBold, 160 160 }, 161 161 'lg-heavy': { 162 162 fontSize: 16, 163 163 letterSpacing: tokens.TRACKING, 164 164 - fontWeight: fontWeight.heavy, 164 164 + fontWeight: fontWeight.bold, 165 165 }, 166 166 'md-thin': { 167 167 fontSize: 15, ··· 176 176 'md-medium': { 177 177 fontSize: 15, 178 178 letterSpacing: tokens.TRACKING, 179 179 - fontWeight: fontWeight.bold, 179 179 + fontWeight: fontWeight.semiBold, 180 180 }, 181 181 'md-bold': { 182 182 fontSize: 15, 183 183 letterSpacing: tokens.TRACKING, 184 184 - fontWeight: fontWeight.bold, 184 184 + fontWeight: fontWeight.semiBold, 185 185 }, 186 186 'md-heavy': { 187 187 fontSize: 15, 188 188 letterSpacing: tokens.TRACKING, 189 189 - fontWeight: fontWeight.heavy, 189 189 + fontWeight: fontWeight.bold, 190 190 }, 191 191 'sm-thin': { 192 192 fontSize: 14, ··· 201 201 'sm-medium': { 202 202 fontSize: 14, 203 203 letterSpacing: tokens.TRACKING, 204 204 - fontWeight: fontWeight.bold, 204 204 + fontWeight: fontWeight.semiBold, 205 205 }, 206 206 'sm-bold': { 207 207 fontSize: 14, 208 208 letterSpacing: tokens.TRACKING, 209 209 - fontWeight: fontWeight.bold, 209 209 + fontWeight: fontWeight.semiBold, 210 210 }, 211 211 'sm-heavy': { 212 212 fontSize: 14, 213 213 letterSpacing: tokens.TRACKING, 214 214 - fontWeight: fontWeight.heavy, 214 214 + fontWeight: fontWeight.bold, 215 215 }, 216 216 'xs-thin': { 217 217 fontSize: 13, ··· 226 226 'xs-medium': { 227 227 fontSize: 13, 228 228 letterSpacing: tokens.TRACKING, 229 229 - fontWeight: fontWeight.bold, 229 229 + fontWeight: fontWeight.semiBold, 230 230 }, 231 231 'xs-bold': { 232 232 fontSize: 13, 233 233 letterSpacing: tokens.TRACKING, 234 234 - fontWeight: fontWeight.bold, 234 234 + fontWeight: fontWeight.semiBold, 235 235 }, 236 236 'xs-heavy': { 237 237 fontSize: 13, 238 238 letterSpacing: tokens.TRACKING, 239 239 - fontWeight: fontWeight.heavy, 239 239 + fontWeight: fontWeight.bold, 240 240 }, 241 241 242 242 'title-2xl': { 243 243 fontSize: 34, 244 244 letterSpacing: tokens.TRACKING, 245 245 - fontWeight: fontWeight.bold, 245 245 + fontWeight: fontWeight.semiBold, 246 246 }, 247 247 'title-xl': { 248 248 fontSize: 28, 249 249 letterSpacing: tokens.TRACKING, 250 250 - fontWeight: fontWeight.bold, 250 250 + fontWeight: fontWeight.semiBold, 251 251 }, 252 252 'title-lg': { 253 253 fontSize: 22, 254 254 - fontWeight: fontWeight.bold, 254 254 + fontWeight: fontWeight.semiBold, 255 255 }, 256 256 title: { 257 257 - fontWeight: fontWeight.bold, 257 257 + fontWeight: fontWeight.semiBold, 258 258 fontSize: 20, 259 259 letterSpacing: tokens.TRACKING, 260 260 }, 261 261 'title-sm': { 262 262 - fontWeight: fontWeight.bold, 262 262 + fontWeight: fontWeight.semiBold, 263 263 fontSize: 17, 264 264 letterSpacing: tokens.TRACKING, 265 265 }, ··· 274 274 fontWeight: fontWeight.normal, 275 275 }, 276 276 'button-lg': { 277 277 - fontWeight: fontWeight.bold, 277 277 + fontWeight: fontWeight.semiBold, 278 278 fontSize: 18, 279 279 letterSpacing: tokens.TRACKING, 280 280 }, 281 281 button: { 282 282 - fontWeight: fontWeight.bold, 282 282 + fontWeight: fontWeight.semiBold, 283 283 fontSize: 14, 284 284 letterSpacing: tokens.TRACKING, 285 285 }, ··· 296 296 palette: { 297 297 ...defaultTheme.palette, 298 298 default: { 299 299 - background: darkPalette.black, 299 299 + background: darkPalette.contrast_0, 300 300 backgroundLight: darkPalette.contrast_25, 301 301 text: darkPalette.white, 302 302 textLight: darkPalette.contrast_600, ··· 345 345 ...darkTheme.palette, 346 346 default: { 347 347 ...darkTheme.palette.default, 348 348 - background: dimPalette.black, 348 348 + background: dimPalette.contrast_0, 349 349 backgroundLight: dimPalette.contrast_25, 350 350 text: dimPalette.white, 351 351 textLight: dimPalette.contrast_700,

+1 -1

src/screens/Deactivated.tsx

··· 121 121 </View> 122 122 123 123 <View style={[a.gap_xs, a.pb_3xl]}> 124 124 - <Text style={[a.text_xl, a.font_bold, a.leading_snug]}> 124 124 + <Text style={[a.text_xl, a.font_semi_bold, a.leading_snug]}> 125 125 <Trans>Welcome back!</Trans> 126 126 </Text> 127 127 <Text style={[a.text_sm, a.leading_snug]}>

+1 -1

src/screens/Home/NoFeedsPinned.tsx

··· 75 75 }, 76 76 ]}> 77 77 <View style={[a.align_center, a.gap_sm, a.pb_xl]}> 78 78 - <Text style={[a.text_xl, a.font_bold]}> 78 78 + <Text style={[a.text_xl, a.font_semi_bold]}> 79 79 <Trans>Whoops!</Trans> 80 80 </Text> 81 81 <Text

+2 -2

src/screens/List/ListHiddenScreen.tsx

··· 122 122 width={42} 123 123 /> 124 124 <View style={[a.gap_sm, a.align_center]}> 125 125 - <Text style={[a.font_bold, a.text_3xl]}> 125 125 + <Text style={[a.font_semi_bold, a.text_3xl]}> 126 126 {list.creator.viewer?.blocking || list.creator.viewer?.blockedBy ? ( 127 127 <Trans>Creator has been blocked</Trans> 128 128 ) : ( ··· 150 150 ) : ( 151 151 <Trans> 152 152 This list – created by{' '} 153 153 - <Text style={[a.font_bold]}> 153 153 + <Text style={[a.font_semi_bold]}> 154 154 {sanitizeHandle(list.creator.handle, '@')} 155 155 </Text>{' '} 156 156 – contains possible violations of Bluesky's community guidelines

+1 -1

src/screens/Login/FormContainer.tsx

··· 22 22 testID={testID} 23 23 style={[a.gap_md, a.flex_1, !gtMobile && [a.px_lg, a.py_md], style]}> 24 24 {titleText && !gtMobile && ( 25 25 - <Text style={[a.text_xl, a.font_bold, t.atoms.text_contrast_high]}> 25 25 + <Text style={[a.text_xl, a.font_semi_bold, t.atoms.text_contrast_high]}> 26 26 {titleText} 27 27 </Text> 28 28 )}

+1 -1

src/screens/Login/PasswordUpdatedForm.tsx

··· 19 19 <FormContainer 20 20 testID="passwordUpdatedForm" 21 21 style={[a.gap_2xl, !gtMobile && a.mt_5xl]}> 22 22 - <Text style={[a.text_3xl, a.font_bold, a.text_center]}> 22 22 + <Text style={[a.text_3xl, a.font_semi_bold, a.text_center]}> 23 23 <Trans>Password updated!</Trans> 24 24 </Text> 25 25 <Text style={[a.text_center, a.mx_auto, {maxWidth: '80%'}]}>

+4 -2

src/screens/Messages/ChatList.tsx

··· 265 265 width={48} 266 266 fill={t.atoms.text_contrast_low.color} 267 267 /> 268 268 - <Text style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_bold]}> 268 268 + <Text 269 269 + style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}> 269 270 <Trans>Whoops!</Trans> 270 271 </Text> 271 272 <Text ··· 298 299 <> 299 300 <View style={[a.pt_3xl, a.align_center]}> 300 301 <MessageIcon width={48} fill={t.palette.primary_500} /> 301 301 - <Text style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_bold]}> 302 302 + <Text 303 303 + style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}> 302 304 <Trans>Nothing here</Trans> 303 305 </Text> 304 306 <Text

+4 -2

src/screens/Messages/Inbox.tsx

··· 193 193 width={48} 194 194 fill={t.atoms.text_contrast_low.color} 195 195 /> 196 196 - <Text style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_bold]}> 196 196 + <Text 197 197 + style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}> 197 198 <Trans>Whoops!</Trans> 198 199 </Text> 199 200 <Text ··· 225 226 <> 226 227 <View style={[a.pt_3xl, a.align_center]}> 227 228 <MessageIcon width={48} fill={t.palette.primary_500} /> 228 228 - <Text style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_bold]}> 229 229 + <Text 230 230 + style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}> 229 231 <Trans comment="Title message shown in chat requests inbox when it's empty"> 230 232 Inbox zero! 231 233 </Trans>

+2 -2

src/screens/Messages/Settings.tsx

··· 71 71 </Layout.Header.Outer> 72 72 <Layout.Content> 73 73 <View style={[a.p_lg, a.gap_md]}> 74 74 - <Text style={[a.text_lg, a.font_bold]}> 74 74 + <Text style={[a.text_lg, a.font_semi_bold]}> 75 75 <Trans>Allow new messages from</Trans> 76 76 </Text> 77 77 <Toggle.Group ··· 121 121 {isNative && ( 122 122 <> 123 123 <Divider style={a.my_md} /> 124 124 - <Text style={[a.text_lg, a.font_bold]}> 124 124 + <Text style={[a.text_lg, a.font_semi_bold]}> 125 125 <Trans>Notification Sounds</Trans> 126 126 </Text> 127 127 <Toggle.Group

+7 -2

src/screens/Messages/components/ChatDisabled.tsx

··· 22 22 <View 23 23 style={[a.align_start, a.p_xl, a.rounded_md, t.atoms.bg_contrast_25]}> 24 24 <Text 25 25 - style={[a.text_md, a.font_bold, a.pb_sm, t.atoms.text_contrast_high]}> 25 25 + style={[ 26 26 + a.text_md, 27 27 + a.font_semi_bold, 28 28 + a.pb_sm, 29 29 + t.atoms.text_contrast_high, 30 30 + ]}> 26 31 <Trans>Your chats have been disabled</Trans> 27 32 </Text> 28 33 <Text style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}> ··· 104 109 105 110 return ( 106 111 <Dialog.ScrollableInner label={_(msg`Appeal this decision`)}> 107 107 - <Text style={[a.text_2xl, a.font_bold, a.pb_xs, a.leading_tight]}> 112 112 + <Text style={[a.text_2xl, a.font_semi_bold, a.pb_xs, a.leading_tight]}> 108 113 <Trans>Appeal this decision</Trans> 109 114 </Text> 110 115 <Text style={[a.text_md, a.leading_snug]}>

+2 -2

src/screens/Messages/components/ChatListItem.tsx

··· 397 397 style={[ 398 398 a.text_md, 399 399 t.atoms.text, 400 400 - a.font_bold, 400 400 + a.font_semi_bold, 401 401 {lineHeight: 21}, 402 402 isDimStyle && t.atoms.text_contrast_medium, 403 403 ]}> ··· 461 461 style={[ 462 462 a.text_sm, 463 463 a.leading_snug, 464 464 - hasUnread ? a.font_bold : t.atoms.text_contrast_high, 464 464 + hasUnread ? a.font_semi_bold : t.atoms.text_contrast_high, 465 465 isDimStyle && t.atoms.text_contrast_medium, 466 466 ]}> 467 467 {lastMessage}

+1 -1

src/screens/Messages/components/InboxPreview.tsx

··· 57 57 )} 58 58 </View> 59 59 <ButtonText 60 60 - style={[a.flex_1, a.font_bold, a.text_left]} 60 60 + style={[a.flex_1, a.font_semi_bold, a.text_left]} 61 61 numberOfLines={1}> 62 62 <Trans>Chat requests</Trans> 63 63 </ButtonText>

+1 -1

src/screens/Messages/components/RequestListItem.tsx

··· 38 38 {/* spacer, since you can't nest pressables */} 39 39 <View style={[a.pt_md, a.pb_xs, a.w_full, {opacity: 0}]} aria-hidden> 40 40 {/* Placeholder text so that it responds to the font height */} 41 41 - <Text style={[a.text_xs, a.leading_tight, a.font_bold]}> 41 41 + <Text style={[a.text_xs, a.leading_tight, a.font_semi_bold]}> 42 42 <Trans comment="Accept a chat request">Accept Request</Trans> 43 43 </Text> 44 44 </View>

+12 -6

src/screens/Moderation/index.tsx

··· 142 142 ]}> 143 143 <View style={[a.flex_row, a.align_center, a.gap_md]}> 144 144 <Icon size="md" style={[t.atoms.text_contrast_medium]} /> 145 145 - <Text style={[a.text_sm, a.font_bold]}>{title}</Text> 145 145 + <Text style={[a.text_sm, a.font_semi_bold]}>{title}</Text> 146 146 </View> 147 147 <ChevronRight 148 148 size="sm" ··· 221 221 )} 222 222 223 223 <Text 224 224 - style={[a.text_md, a.font_bold, a.pb_md, t.atoms.text_contrast_high]}> 224 224 + style={[ 225 225 + a.text_md, 226 226 + a.font_semi_bold, 227 227 + a.pb_md, 228 228 + t.atoms.text_contrast_high, 229 229 + ]}> 225 230 <Trans>Moderation tools</Trans> 226 231 </Text> 227 232 ··· 330 335 a.pt_2xl, 331 336 a.pb_md, 332 337 a.text_md, 333 333 - a.font_bold, 338 338 + a.font_semi_bold, 334 339 t.atoms.text_contrast_high, 335 340 ]}> 336 341 <Trans>Content filters</Trans> ··· 364 369 a.pt_2xl, 365 370 a.pb_md, 366 371 a.text_md, 367 367 - a.font_bold, 372 372 + a.font_semi_bold, 368 373 t.atoms.text_contrast_high, 369 374 ]}> 370 375 <Trans>Content filters</Trans> ··· 396 401 a.justify_between, 397 402 disabledOnIOS && {opacity: 0.5}, 398 403 ]}> 399 399 - <Text style={[a.font_bold, t.atoms.text_contrast_high]}> 404 404 + <Text 405 405 + style={[a.font_semi_bold, t.atoms.text_contrast_high]}> 400 406 <Trans>Enable adult content</Trans> 401 407 </Text> 402 408 <Toggle.Item ··· 465 471 <Text 466 472 style={[ 467 473 a.text_md, 468 468 - a.font_bold, 474 474 + a.font_semi_bold, 469 475 a.pt_2xl, 470 476 a.pb_md, 471 477 t.atoms.text_contrast_high,

+2 -5

src/screens/Onboarding/Layout.tsx

··· 17 17 useTheme, 18 18 web, 19 19 } from '#/alf' 20 20 - import {leading} from '#/alf/typography' 21 20 import {Button, ButtonIcon, ButtonText} from '#/components/Button' 22 21 import {ArrowLeft_Stroke2_Corner0_Rounded as ArrowLeft} from '#/components/icons/Arrow' 23 22 import {HEADER_SLOT_SIZE} from '#/components/Layout' ··· 234 233 style={[ 235 234 a.pb_sm, 236 235 a.text_4xl, 237 237 - a.font_bold, 238 238 - { 239 239 - lineHeight: leading(a.text_4xl, a.leading_tight), 240 240 - }, 236 236 + a.font_semi_bold, 237 237 + a.leading_tight, 241 238 flatten(style), 242 239 ]}> 243 240 {children}

+4 -4

src/screens/Onboarding/StepFinished.tsx

··· 432 432 </View> 433 433 434 434 <View style={[a.gap_sm]}> 435 435 - <Text style={[a.font_heavy, a.text_3xl, a.text_center]}> 435 435 + <Text style={[a.font_bold, a.text_3xl, a.text_center]}> 436 436 {title} 437 437 </Text> 438 438 <Text ··· 537 537 <View style={[a.flex_row, a.align_center, a.w_full, a.gap_lg]}> 538 538 <IconCircle icon={Growth} size="lg" style={{width: 48, height: 48}} /> 539 539 <View style={[a.flex_1, a.gap_xs]}> 540 540 - <Text style={[a.font_bold, a.text_lg]}> 540 540 + <Text style={[a.font_semi_bold, a.text_lg]}> 541 541 <Trans>Public</Trans> 542 542 </Text> 543 543 <Text ··· 551 551 <View style={[a.flex_row, a.align_center, a.w_full, a.gap_lg]}> 552 552 <IconCircle icon={News} size="lg" style={{width: 48, height: 48}} /> 553 553 <View style={[a.flex_1, a.gap_xs]}> 554 554 - <Text style={[a.font_bold, a.text_lg]}> 554 554 + <Text style={[a.font_semi_bold, a.text_lg]}> 555 555 <Trans>Open</Trans> 556 556 </Text> 557 557 <Text ··· 567 567 style={{width: 48, height: 48}} 568 568 /> 569 569 <View style={[a.flex_1, a.gap_xs]}> 570 570 - <Text style={[a.font_bold, a.text_lg]}> 570 570 + <Text style={[a.font_semi_bold, a.text_lg]}> 571 571 <Trans>Flexible</Trans> 572 572 </Text> 573 573 <Text

+1 -1

src/screens/Onboarding/StepInterests/InterestButton.tsx

··· 69 69 { 70 70 color: t.palette.contrast_900, 71 71 }, 72 72 - a.font_bold, 72 72 + a.font_semi_bold, 73 73 native({paddingTop: 2}), 74 74 ctx.selected ? styles.textSelected : {}, 75 75 ]}>

+1 -1

src/screens/Onboarding/StepInterests/index.tsx

··· 184 184 <Text 185 185 style={[ 186 186 a.text_md, 187 187 - a.font_bold, 187 187 + a.font_semi_bold, 188 188 { 189 189 color: t.palette.negative_900, 190 190 },

+1 -1

src/screens/Onboarding/StepSuggestedAccounts/index.tsx

··· 133 133 134 134 return ( 135 135 <View style={[a.align_start]} testID="onboardingInterests"> 136 136 - <Text style={[a.font_heavy, a.text_3xl]}> 136 136 + <Text style={[a.font_bold, a.text_3xl]}> 137 137 <Trans comment="Accounts suggested to the user for them to follow"> 138 138 Suggested for you 139 139 </Trans>

+6 -1

src/screens/PostThread/components/ThreadError.tsx

··· 58 58 ]}> 59 59 <View style={[a.gap_xs]}> 60 60 <Text 61 61 - style={[a.text_center, a.text_lg, a.font_bold, a.leading_snug]}> 61 61 + style={[ 62 62 + a.text_center, 63 63 + a.text_lg, 64 64 + a.font_semi_bold, 65 65 + a.leading_snug, 66 66 + ]}> 62 67 {title} 63 68 </Text> 64 69 <Text

+16 -10

src/screens/PostThread/components/ThreadItemAnchor.tsx

··· 129 129 ]}> 130 130 <TrashIcon style={[t.atoms.text_contrast_medium]} /> 131 131 </View> 132 132 - <Text style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}> 132 132 + <Text 133 133 + style={[a.text_md, a.font_semi_bold, t.atoms.text_contrast_medium]}> 133 134 <Trans>Post has been deleted</Trans> 134 135 </Text> 135 136 </View> ··· 343 344 style={[ 344 345 a.flex_shrink, 345 346 a.text_lg, 346 346 - a.font_bold, 347 347 + a.font_semi_bold, 347 348 a.leading_snug, 348 349 ]} 349 350 numberOfLines={1}> ··· 439 440 <Text 440 441 testID="repostCount-expanded" 441 442 style={[a.text_md, t.atoms.text_contrast_medium]}> 442 442 - <Text style={[a.text_md, a.font_bold, t.atoms.text]}> 443 443 + <Text style={[a.text_md, a.font_semi_bold, t.atoms.text]}> 443 444 {formatPostStatCount(post.repostCount)} 444 445 </Text>{' '} 445 446 <Plural ··· 457 458 <Text 458 459 testID="quoteCount-expanded" 459 460 style={[a.text_md, t.atoms.text_contrast_medium]}> 460 460 - <Text style={[a.text_md, a.font_bold, t.atoms.text]}> 461 461 + <Text style={[a.text_md, a.font_semi_bold, t.atoms.text]}> 461 462 {formatPostStatCount(post.quoteCount)} 462 463 </Text>{' '} 463 464 <Plural ··· 473 474 <Text 474 475 testID="likeCount-expanded" 475 476 style={[a.text_md, t.atoms.text_contrast_medium]}> 476 476 - <Text style={[a.text_md, a.font_bold, t.atoms.text]}> 477 477 + <Text style={[a.text_md, a.font_semi_bold, t.atoms.text]}> 477 478 {formatPostStatCount(post.likeCount)} 478 479 </Text>{' '} 479 480 <Plural value={post.likeCount} one="like" other="likes" /> ··· 484 485 <Text 485 486 testID="bookmarkCount-expanded" 486 487 style={[a.text_md, t.atoms.text_contrast_medium]}> 487 487 - <Text style={[a.text_md, a.font_bold, t.atoms.text]}> 488 488 + <Text style={[a.text_md, a.font_semi_bold, t.atoms.text]}> 488 489 {formatPostStatCount(post.bookmarkCount)} 489 490 </Text>{' '} 490 491 <Plural value={post.bookmarkCount} one="save" other="saves" /> ··· 652 653 <Text 653 654 style={[ 654 655 a.text_xs, 655 655 - a.font_bold, 656 656 + a.font_semi_bold, 656 657 a.leading_tight, 657 658 t.atoms.text_contrast_medium, 658 659 ]}> ··· 669 670 <Prompt.DescriptionText> 670 671 <Trans> 671 672 This post claims to have been created on{' '} 672 672 - <RNText style={[a.font_bold]}>{niceDate(i18n, createdAt)}</RNText>, 673 673 - but was first seen by Bluesky on{' '} 674 674 - <RNText style={[a.font_bold]}>{niceDate(i18n, indexedAt)}</RNText>. 673 673 + <RNText style={[a.font_semi_bold]}> 674 674 + {niceDate(i18n, createdAt)} 675 675 + </RNText> 676 676 + , but was first seen by Bluesky on{' '} 677 677 + <RNText style={[a.font_semi_bold]}> 678 678 + {niceDate(i18n, indexedAt)} 679 679 + </RNText> 680 680 + . 675 681 </Trans> 676 682 </Prompt.DescriptionText> 677 683 <Text

+2 -1

src/screens/PostThread/components/ThreadItemPost.tsx

··· 106 106 ]}> 107 107 <TrashIcon style={[t.atoms.text_contrast_medium]} /> 108 108 </View> 109 109 - <Text style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}> 109 109 + <Text 110 110 + style={[a.text_md, a.font_semi_bold, t.atoms.text_contrast_medium]}> 110 111 <Trans>Post has been deleted</Trans> 111 112 </Text> 112 113 </View>

+2 -1

src/screens/PostThread/components/ThreadItemPostTombstone.tsx

··· 46 46 <View style={[a.flex_row, a.justify_center, {width: LINEAR_AVI_WIDTH}]}> 47 47 <Icon style={[t.atoms.text_contrast_medium]} /> 48 48 </View> 49 49 - <Text style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}> 49 49 + <Text 50 50 + style={[a.text_md, a.font_semi_bold, t.atoms.text_contrast_medium]}> 50 51 {copy} 51 52 </Text> 52 53 </View>

+1 -1

src/screens/Profile/ErrorState.tsx

··· 27 27 <View style={[a.px_xl]}> 28 28 <CircleInfo width={48} style={[t.atoms.text_contrast_low]} /> 29 29 30 30 - <Text style={[a.text_xl, a.font_bold, a.pb_md, a.pt_xl]}> 30 30 + <Text style={[a.text_xl, a.font_semi_bold, a.pb_md, a.pt_xl]}> 31 31 <Trans>Hmmmm, we couldn't load that moderation service.</Trans> 32 32 </Text> 33 33 <Text

+1 -1

src/screens/Profile/Header/DisplayName.tsx

··· 26 26 t.atoms.text, 27 27 gtMobile ? a.text_4xl : a.text_3xl, 28 28 a.self_start, 29 29 - a.font_heavy, 29 29 + a.font_bold, 30 30 ]}> 31 31 {sanitizeDisplayName( 32 32 profile.displayName || sanitizeHandle(profile.handle),

+2 -2

src/screens/Profile/Header/EditProfileDialog.tsx

··· 326 326 style={[ 327 327 a.text_sm, 328 328 a.mt_xs, 329 329 - a.font_bold, 329 329 + a.font_semi_bold, 330 330 {color: t.palette.negative_400}, 331 331 ]}> 332 332 <Plural ··· 377 377 style={[ 378 378 a.text_sm, 379 379 a.mt_xs, 380 380 - a.font_bold, 380 380 + a.font_semi_bold, 381 381 {color: t.palette.negative_400}, 382 382 ]}> 383 383 <Plural

+3 -3

src/screens/Profile/Header/Metrics.tsx

··· 37 37 style={[a.flex_row, t.atoms.text]} 38 38 to={makeProfileLink(profile, 'followers')} 39 39 label={`${profile.followersCount || 0} ${pluralizedFollowers}`}> 40 40 - <Text style={[a.font_bold, a.text_md]}>{followers} </Text> 40 40 + <Text style={[a.font_semi_bold, a.text_md]}>{followers} </Text> 41 41 <Text style={[t.atoms.text_contrast_medium, a.text_md]}> 42 42 {pluralizedFollowers} 43 43 </Text> ··· 47 47 style={[a.flex_row, t.atoms.text]} 48 48 to={makeProfileLink(profile, 'follows')} 49 49 label={_(msg`${profile.followsCount || 0} following`)}> 50 50 - <Text style={[a.font_bold, a.text_md]}>{following} </Text> 50 50 + <Text style={[a.font_semi_bold, a.text_md]}>{following} </Text> 51 51 <Text style={[t.atoms.text_contrast_medium, a.text_md]}> 52 52 {pluralizedFollowings} 53 53 </Text> 54 54 </InlineLinkText> 55 55 - <Text style={[a.font_bold, t.atoms.text, a.text_md]}> 55 55 + <Text style={[a.font_semi_bold, t.atoms.text, a.text_md]}> 56 56 {formatCount(i18n, profile.postsCount || 0)}{' '} 57 57 <Text style={[t.atoms.text_contrast_medium, a.font_normal, a.text_md]}> 58 58 {plural(profile.postsCount || 0, {one: 'post', other: 'posts'})}

+2 -2

src/screens/Profile/Header/ProfileHeaderLabeler.tsx

··· 225 225 ? t.palette.contrast_700 226 226 : t.palette.white, 227 227 }, 228 228 - a.font_bold, 228 228 + a.font_semi_bold, 229 229 a.text_center, 230 230 a.leading_tight, 231 231 ]}> ··· 297 297 {({hovered, focused, pressed}) => ( 298 298 <Text 299 299 style={[ 300 300 - a.font_bold, 300 300 + a.font_semi_bold, 301 301 a.text_sm, 302 302 t.atoms.text_contrast_medium, 303 303 (hovered || focused || pressed) &&

+1 -1

src/screens/Profile/Header/ProfileHeaderStandard.tsx

··· 267 267 t.atoms.text, 268 268 gtMobile ? a.text_4xl : a.text_3xl, 269 269 a.self_start, 270 270 - a.font_heavy, 270 270 + a.font_bold, 271 271 a.leading_tight, 272 272 ]}> 273 273 {sanitizeDisplayName(

+2 -2

src/screens/Profile/components/ProfileFeedHeader.tsx

··· 234 234 <Text 235 235 style={[ 236 236 a.text_md, 237 237 - a.font_heavy, 237 237 + a.font_bold, 238 238 a.leading_tight, 239 239 gtMobile && a.text_lg, 240 240 ]} ··· 441 441 442 442 <View style={[a.flex_1, a.gap_2xs]}> 443 443 <Text 444 444 - style={[a.text_2xl, a.font_heavy, a.leading_tight]} 444 444 + style={[a.text_2xl, a.font_bold, a.leading_tight]} 445 445 numberOfLines={2}> 446 446 {info.displayName} 447 447 </Text>

+1 -1

src/screens/ProfileList/components/ErrorScreen.tsx

··· 22 22 23 23 return ( 24 24 <View style={[a.px_xl, a.py_md, a.gap_md]}> 25 25 - <Text style={[a.text_4xl, a.font_heavy]}> 25 25 + <Text style={[a.text_4xl, a.font_bold]}> 26 26 <Trans>Could not load list</Trans> 27 27 </Text> 28 28 <Text style={[a.text_md, t.atoms.text_contrast_high, a.leading_snug]}>

+2 -2

src/screens/SavedFeeds.tsx

··· 374 374 a.border_b, 375 375 t.atoms.border_contrast_low, 376 376 ]}> 377 377 - <Text style={[a.text_xl, a.font_heavy, a.leading_snug]}>{children}</Text> 377 377 + <Text style={[a.text_xl, a.font_bold, a.leading_snug]}>{children}</Text> 378 378 </View> 379 379 ) 380 380 } ··· 406 406 /> 407 407 </View> 408 408 <View style={[a.flex_1, a.flex_row, a.gap_sm, a.align_center]}> 409 409 - <Text style={[a.text_sm, a.font_bold, a.leading_snug]}> 409 409 + <Text style={[a.text_sm, a.font_semi_bold, a.leading_snug]}> 410 410 <Trans context="feed-name">Following</Trans> 411 411 </Text> 412 412 </View>

+1 -1

src/screens/Search/Explore.tsx

··· 885 885 ]}> 886 886 <CircleInfo size="md" fill={t.palette.negative_400} /> 887 887 <View style={[a.flex_1, a.gap_sm]}> 888 888 - <Text style={[a.font_bold, a.leading_snug]}> 888 888 + <Text style={[a.font_semi_bold, a.leading_snug]}> 889 889 {item.message} 890 890 </Text> 891 891 <Text

+1 -1

src/screens/Search/Shell.tsx

··· 460 460 a.pt_sm, 461 461 a.pb_lg, 462 462 ]}> 463 463 - <Text style={[a.text_2xl, a.font_heavy]}> 463 463 + <Text style={[a.text_2xl, a.font_bold]}> 464 464 <Trans>Search</Trans> 465 465 </Text> 466 466 </View>

+5 -1

src/screens/Search/components/ModuleHeader.tsx

··· 93 93 94 94 export function TitleText({style, ...props}: TextProps) { 95 95 return ( 96 96 - <Text style={[a.font_bold, a.flex_1, a.text_xl, style]} emoji {...props} /> 96 96 + <Text 97 97 + style={[a.font_semi_bold, a.flex_1, a.text_xl, style]} 98 98 + emoji 99 99 + {...props} 100 100 + /> 97 101 ) 98 102 } 99 103

+1 -1

src/screens/Search/components/SearchHistory.tsx

··· 45 45 <View style={[a.w_full, a.gap_md]}> 46 46 {(searchHistory.length > 0 || selectedProfiles.length > 0) && ( 47 47 <View style={[a.px_lg, a.pt_sm]}> 48 48 - <Text style={[a.text_md, a.font_bold]}> 48 48 + <Text style={[a.text_md, a.font_semi_bold]}> 49 49 <Trans>Recent Searches</Trans> 50 50 </Text> 51 51 </View>

+2 -2

src/screens/Search/components/StarterPackCard.tsx

··· 89 89 <View style={[a.flex_1]}> 90 90 <Text 91 91 emoji 92 92 - style={[a.text_md, a.font_bold, a.leading_snug]} 92 92 + style={[a.text_md, a.font_semi_bold, a.leading_snug]} 93 93 numberOfLines={1}> 94 94 {record.name} 95 95 </Text> ··· 242 242 <Text 243 243 style={[ 244 244 gtPhone ? a.text_md : a.text_xs, 245 245 - a.font_bold, 245 245 + a.font_semi_bold, 246 246 a.leading_snug, 247 247 {color: 'white'}, 248 248 ]}>

+1 -1

src/screens/Search/modules/ExploreInterestsCard.tsx

··· 63 63 ]}> 64 64 <View style={[a.flex_row, a.gap_sm, a.align_center]}> 65 65 <Shapes /> 66 66 - <Text style={[a.text_xl, a.font_bold, a.leading_tight]}> 66 66 + <Text style={[a.text_xl, a.font_semi_bold, a.leading_tight]}> 67 67 <Trans>Your interests</Trans> 68 68 </Text> 69 69 </View>

+1 -1

src/screens/Search/modules/ExploreRecommendations.tsx

··· 50 50 fill={t.palette.primary_500} 51 51 style={{marginLeft: -2}} 52 52 /> 53 53 - <Text style={[a.text_2xl, a.font_heavy, t.atoms.text]}> 53 53 + <Text style={[a.text_2xl, a.font_bold, t.atoms.text]}> 54 54 <Trans>Recommended</Trans> 55 55 </Text> 56 56 </View>

+2 -2

src/screens/Search/modules/ExploreTrendingTopics.tsx

··· 104 104 <Text 105 105 style={[ 106 106 a.text_md, 107 107 - a.font_bold, 107 107 + a.font_semi_bold, 108 108 a.leading_tight, 109 109 {width: 20}, 110 110 ]}> ··· 113 113 </Trans> 114 114 </Text> 115 115 <Text 116 116 - style={[a.text_md, a.font_bold, a.leading_tight]} 116 116 + style={[a.text_md, a.font_semi_bold, a.leading_tight]} 117 117 numberOfLines={1}> 118 118 {trend.displayName} 119 119 </Text>

+1 -1

src/screens/Settings/AccountSettings.tsx

··· 97 97 color={t.palette.primary_500} 98 98 /> 99 99 <SettingsList.ItemText 100 100 - style={[{color: t.palette.primary_500}, a.font_bold]}> 100 100 + style={[{color: t.palette.primary_500}, a.font_semi_bold]}> 101 101 <Trans>Verify your email</Trans> 102 102 </SettingsList.ItemText> 103 103 <SettingsList.Chevron color={t.palette.primary_500} />

+7 -2

src/screens/Settings/AppIconSettings/index.tsx

··· 93 93 a.text_md, 94 94 a.mt_xl, 95 95 a.mb_sm, 96 96 - a.font_bold, 96 96 + a.font_semi_bold, 97 97 t.atoms.text_contrast_medium, 98 98 ]}> 99 99 <Trans>Bluesky+</Trans> ··· 201 201 const t = useTheme() 202 202 return ( 203 203 <Text 204 204 - style={[a.text_md, a.font_bold, a.flex_1, t.atoms.text_contrast_medium]} 204 204 + style={[ 205 205 + a.text_md, 206 206 + a.font_semi_bold, 207 207 + a.flex_1, 208 208 + t.atoms.text_contrast_medium, 209 209 + ]} 205 210 emoji> 206 211 {children} 207 212 </Text>

+1 -1

src/screens/Settings/AppPasswords.tsx

··· 167 167 a.gap_sm, 168 168 ]}> 169 169 <View style={[a.gap_xs]}> 170 170 - <Text style={[t.atoms.text, a.text_md, a.font_bold]}> 170 170 + <Text style={[t.atoms.text, a.text_md, a.font_semi_bold]}> 171 171 {appPassword.name} 172 172 </Text> 173 173 <Text style={[t.atoms.text_contrast_medium]}>

+1 -1

src/screens/Settings/InterestsSettings.tsx

··· 222 222 { 223 223 color: t.palette.contrast_900, 224 224 }, 225 225 - a.font_bold, 225 225 + a.font_semi_bold, 226 226 ctx.selected ? styles.textSelected : {}, 227 227 ]}> 228 228 {interestsDisplayNames[interest]}

+5 -2

src/screens/Settings/NotificationSettings/ActivityNotificationSettings.tsx

··· 140 140 Enable notifications for an account by visiting their 141 141 profile and pressing the{' '} 142 142 <RNText 143 143 - style={[a.font_bold, t.atoms.text_contrast_high]}> 143 143 + style={[ 144 144 + a.font_semi_bold, 145 145 + t.atoms.text_contrast_high, 146 146 + ]}> 144 147 bell icon 145 148 </RNText>{' '} 146 149 <BellRingingFilledIcon ··· 157 160 <InlineLinkText 158 161 label={_(msg`Privacy and Security settings`)} 159 162 to={{screen: 'ActivityPrivacySettings'}} 160 160 - style={[a.font_bold]}> 163 163 + style={[a.font_semi_bold]}> 161 164 Settings &rarr; Privacy and Security 162 165 </InlineLinkText> 163 166 .

+1 -1

src/screens/Settings/NotificationSettings/components/ItemTextWithSubtitle.tsx

··· 19 19 const t = useTheme() 20 20 return ( 21 21 <View style={[a.flex_1, bold ? a.gap_xs : a.gap_2xs]}> 22 22 - <SettingsList.ItemText style={bold && [a.font_bold, a.text_lg]}> 22 22 + <SettingsList.ItemText style={bold && [a.font_semi_bold, a.text_lg]}> 23 23 {titleText} 24 24 </SettingsList.ItemText> 25 25 {showSkeleton ? (

+1 -1

src/screens/Settings/NotificationSettings/components/PreferenceControls.tsx

··· 150 150 {'include' in preference && ( 151 151 <> 152 152 <Divider /> 153 153 - <Text style={[a.font_bold, a.text_md]}> 153 153 + <Text style={[a.font_semi_bold, a.text_md]}> 154 154 <Trans>From</Trans> 155 155 </Text> 156 156 <Toggle.Group

+4 -2

src/screens/Settings/Settings.tsx

··· 343 343 a.pt_sm, 344 344 t.atoms.text, 345 345 gtMobile ? a.text_4xl : a.text_3xl, 346 346 - a.font_heavy, 346 346 + a.font_bold, 347 347 ]}> 348 348 {displayName} 349 349 </Text> ··· 513 513 514 514 <SettingsList.Divider /> 515 515 <View style={[a.p_xl, a.gap_md]}> 516 516 - <Text style={[a.text_lg, a.font_bold]}>PolicyUpdate202508 Debug</Text> 516 516 + <Text style={[a.text_lg, a.font_semi_bold]}> 517 517 + PolicyUpdate202508 Debug 518 518 + </Text> 517 519 518 520 <View style={[a.flex_row, a.align_center, a.justify_between, a.gap_md]}> 519 521 <Button

+2 -2

src/screens/Settings/components/AddAppPasswordDialog.tsx

··· 107 107 style={[a.gap_lg]} 108 108 exiting={native(SlideOutLeft)} 109 109 key={0}> 110 110 - <Text style={[a.text_2xl, a.font_bold]}> 110 110 + <Text style={[a.text_2xl, a.font_semi_bold]}> 111 111 <Trans>Add App Password</Trans> 112 112 </Text> 113 113 <Text style={[a.text_md, a.leading_snug]}> ··· 183 183 style={[a.gap_lg]} 184 184 entering={isWeb ? FadeIn.delay(200) : SlideInRight} 185 185 key={1}> 186 186 - <Text style={[a.text_2xl, a.font_bold]}> 186 186 + <Text style={[a.text_2xl, a.font_semi_bold]}> 187 187 <Trans>Here is your app password!</Trans> 188 188 </Text> 189 189 <Text style={[a.text_md, a.leading_snug]}>

+3 -3

src/screens/Settings/components/ChangeHandleDialog.tsx

··· 244 244 <Text> 245 245 <Trans> 246 246 Your full handle will be{' '} 247 247 - <Text style={[a.font_bold]}> 247 247 + <Text style={[a.font_semi_bold]}> 248 248 @{createFullHandle(subdomain, host)} 249 249 </Text> 250 250 </Trans> ··· 280 280 }), 281 281 )} 282 282 to="https://bsky.social/about/blog/4-28-2023-domain-handle-tutorial" 283 283 - style={[a.font_bold]} 283 283 + style={[a.font_semi_bold]} 284 284 disableMismatchWarning> 285 285 Learn more here. 286 286 </InlineLinkText> ··· 522 522 <Admonition type="info" style={[a.mb_md]}> 523 523 <Trans> 524 524 Your current handle{' '} 525 525 - <Text style={[a.font_bold]}> 525 525 + <Text style={[a.font_semi_bold]}> 526 526 {sanitizeHandle(currentAccount?.handle || '', '@')} 527 527 </Text>{' '} 528 528 will automatically remain reserved for you. You can switch back to

+1 -1

src/screens/Settings/components/ChangePasswordDialog.tsx

··· 165 165 style={web({maxWidth: 400})}> 166 166 <View style={[a.gap_xl]}> 167 167 <View style={[a.gap_sm]}> 168 168 - <Text style={[a.font_heavy, a.text_2xl]}> 168 168 + <Text style={[a.font_bold, a.text_2xl]}> 169 169 {uiStrings[stage].title} 170 170 </Text> 171 171 {error ? (

+1 -1

src/screens/Settings/components/CopyButton.tsx

··· 58 58 pointerEvents="none"> 59 59 <Text 60 60 style={[ 61 61 - a.font_bold, 61 61 + a.font_semi_bold, 62 62 a.text_right, 63 63 a.text_md, 64 64 t.atoms.text_contrast_high,

+1 -1

src/screens/Settings/components/DisableEmail2FADialog.tsx

··· 85 85 <View style={[a.relative, a.gap_md, a.w_full]}> 86 86 <Text 87 87 nativeID="dialog-title" 88 88 - style={[a.text_2xl, a.font_bold, t.atoms.text]}> 88 88 + style={[a.text_2xl, a.font_semi_bold, t.atoms.text]}> 89 89 <Trans>Disable Email 2FA</Trans> 90 90 </Text> 91 91 <P nativeID="dialog-description">

+1 -1

src/screens/Settings/components/ExportCarDialog.tsx

··· 58 58 accessibilityDescribedBy="dialog-description" 59 59 accessibilityLabelledBy="dialog-title"> 60 60 <View style={[a.relative, a.gap_lg, a.w_full]}> 61 61 - <Text nativeID="dialog-title" style={[a.text_2xl, a.font_heavy]}> 61 61 + <Text nativeID="dialog-title" style={[a.text_2xl, a.font_bold]}> 62 62 <Trans>Export My Data</Trans> 63 63 </Text> 64 64 <Text

+4 -3

src/screens/Signup/index.tsx

··· 133 133 <Animated.View entering={!isFetchedAtMount ? FadeIn : undefined}> 134 134 <LinearGradientBackground 135 135 style={[a.mx_lg, a.p_lg, a.gap_sm, a.rounded_sm]}> 136 136 - <Text style={[a.font_bold, a.text_xl, {color: 'white'}]}> 136 136 + <Text style={[a.font_semi_bold, a.text_xl, {color: 'white'}]}> 137 137 {starterPack.record.name} 138 138 </Text> 139 139 <Text style={[{color: 'white'}]}> ··· 164 164 !gtMobile && {paddingBottom: 100}, 165 165 ]}> 166 166 <View style={[a.gap_sm, a.pb_3xl]}> 167 167 - <Text style={[a.font_bold, t.atoms.text_contrast_medium]}> 167 167 + <Text 168 168 + style={[a.font_semi_bold, t.atoms.text_contrast_medium]}> 168 169 <Trans> 169 170 Step {state.activeStep + 1} of{' '} 170 171 {state.serviceDescription && ··· 173 174 : '3'} 174 175 </Trans> 175 176 </Text> 176 176 - <Text style={[a.text_3xl, a.font_bold]}> 177 177 + <Text style={[a.text_3xl, a.font_semi_bold]}> 177 178 {state.activeStep === SignupStep.INFO ? ( 178 179 <Trans>Your account</Trans> 179 180 ) : state.activeStep === SignupStep.HANDLE ? (

+2 -2

src/screens/SignupQueued.tsx

··· 123 123 <Logo width={120} /> 124 124 </View> 125 125 126 126 - <Text style={[a.text_4xl, a.font_heavy, a.pb_sm]}> 126 126 + <Text style={[a.text_4xl, a.font_bold, a.pb_sm]}> 127 127 <Trans>You're in line</Trans> 128 128 </Text> 129 129 <P style={[t.atoms.text_contrast_medium]}> ··· 146 146 ]}> 147 147 {typeof placeInQueue === 'number' && ( 148 148 <Text 149 149 - style={[a.text_5xl, a.text_center, a.font_heavy, a.mb_2xl]}> 149 149 + style={[a.text_5xl, a.text_center, a.font_bold, a.mb_2xl]}> 150 150 {placeInQueue} 151 151 </Text> 152 152 )}

+19 -6

src/screens/StarterPack/StarterPackLandingScreen.tsx

··· 183 183 </View> 184 184 <Text 185 185 style={[ 186 186 - a.font_bold, 186 186 + a.font_semi_bold, 187 187 a.text_4xl, 188 188 a.text_center, 189 189 a.leading_tight, ··· 192 192 {record.name} 193 193 </Text> 194 194 <Text 195 195 - style={[a.text_center, a.font_bold, a.text_md, {color: 'white'}]}> 195 195 + style={[ 196 196 + a.text_center, 197 197 + a.font_semi_bold, 198 198 + a.text_md, 199 199 + {color: 'white'}, 200 200 + ]}> 196 201 Starter pack by {`@${creator.handle}`} 197 202 </Text> 198 203 </LinearGradientBackground> ··· 218 223 color={t.atoms.text_contrast_medium.color} 219 224 /> 220 225 <Text 221 221 - style={[a.font_bold, a.text_sm, t.atoms.text_contrast_medium]} 226 226 + style={[ 227 227 + a.font_semi_bold, 228 228 + a.text_sm, 229 229 + t.atoms.text_contrast_medium, 230 230 + ]} 222 231 numberOfLines={1}> 223 232 <Trans> 224 233 {formatCount(i18n, JOINED_THIS_WEEK)} joined this week ··· 229 238 <View style={[a.gap_3xl]}> 230 239 {Boolean(listItemsSample?.length) && ( 231 240 <View style={[a.gap_md]}> 232 232 - <Text style={[a.font_heavy, a.text_lg]}> 241 241 + <Text style={[a.font_bold, a.text_lg]}> 233 242 {listItemsCount <= 8 ? ( 234 243 <Trans>You'll follow these people right away</Trans> 235 244 ) : ( ··· 270 279 )} 271 280 {feeds?.length ? ( 272 281 <View style={[a.gap_md]}> 273 273 - <Text style={[a.font_heavy, a.text_lg]}> 282 282 + <Text style={[a.font_bold, a.text_lg]}> 274 283 <Trans>You'll stay updated with these feeds</Trans> 275 284 </Text> 276 285 ··· 387 396 {/* Webkit needs this to have a zindex of 2? */} 388 397 <View style={[a.gap_md, {zIndex: 2}]}> 389 398 <Text 390 390 - style={[a.font_bold, a.text_4xl, {lineHeight: 40, color: 'white'}]}> 399 399 + style={[ 400 400 + a.font_semi_bold, 401 401 + a.text_4xl, 402 402 + {lineHeight: 40, color: 'white'}, 403 403 + ]}> 391 404 Download Bluesky to get started! 392 405 </Text> 393 406 <Text style={[a.text_lg, {color: 'white'}]}>

+7 -3

src/screens/StarterPack/StarterPackScreen.tsx

··· 486 486 color={t.atoms.text_contrast_medium.color} 487 487 /> 488 488 <Text 489 489 - style={[a.font_bold, a.text_sm, t.atoms.text_contrast_medium]}> 489 489 + style={[ 490 490 + a.font_semi_bold, 491 491 + a.text_sm, 492 492 + t.atoms.text_contrast_medium, 493 493 + ]}> 490 494 <Trans comment="Number of users (always at least 25) who have joined Bluesky using a specific starter pack"> 491 495 <Plural 492 496 value={starterPack.joinedAllTimeCount || 0} ··· 669 673 t.atoms.bg_contrast_25, 670 674 ]}> 671 675 <View style={[a.flex_1, a.gap_2xs]}> 672 672 - <Text style={[a.font_bold]}> 676 676 + <Text style={[a.font_semi_bold]}> 673 677 <Trans>Unable to delete</Trans> 674 678 </Text> 675 679 <Text style={[a.leading_snug]}>{cleanError(deleteError)}</Text> ··· 727 731 <Layout.Content centerContent> 728 732 <View style={[a.py_4xl, a.px_xl, a.align_center, a.gap_5xl]}> 729 733 <View style={[a.w_full, a.align_center, a.gap_lg]}> 730 730 - <Text style={[a.font_bold, a.text_3xl]}> 734 734 + <Text style={[a.font_semi_bold, a.text_3xl]}> 731 735 <Trans>Starter pack is invalid</Trans> 732 736 </Text> 733 737 <Text

+1 -1

src/screens/StarterPack/Wizard/StepDetails.tsx

··· 27 27 <View style={[a.px_xl, a.gap_xl, a.mt_4xl]}> 28 28 <View style={[a.gap_md, a.align_center, a.px_md, a.mb_md]}> 29 29 <StarterPack width={90} gradient="sky" /> 30 30 - <Text style={[a.font_bold, a.text_3xl]}> 30 30 + <Text style={[a.font_semi_bold, a.text_3xl]}> 31 31 <Trans>Invites, but personal</Trans> 32 32 </Text> 33 33 <Text style={[a.text_center, a.text_md, a.px_md]}>

+1 -1

src/screens/StarterPack/Wizard/StepFeeds.tsx

··· 113 113 ) : ( 114 114 <Text 115 115 style={[ 116 116 - a.font_bold, 116 116 + a.font_semi_bold, 117 117 a.text_lg, 118 118 a.text_center, 119 119 a.mt_lg,

+1 -1

src/screens/StarterPack/Wizard/StepProfiles.tsx

··· 98 98 ) : ( 99 99 <Text 100 100 style={[ 101 101 - a.font_bold, 101 101 + a.font_semi_bold, 102 102 a.text_lg, 103 103 a.text_center, 104 104 a.mt_lg,

+20 -15

src/screens/StarterPack/Wizard/index.tsx

··· 447 447 ]}> 448 448 {items.length > minimumItems && ( 449 449 <View style={[a.absolute, {right: 14, top: 31}]}> 450 450 - <Text style={[a.font_bold]}> 450 450 + <Text style={[a.font_semi_bold]}> 451 451 {items.length}/ 452 452 {state.currentStep === 'Profiles' ? STARTER_PACK_MAX_SIZE : 3} 453 453 </Text> ··· 490 490 ) : ( 491 491 <Trans> 492 492 It's just{' '} 493 493 - <Text style={[a.font_bold, textStyles]} emoji> 493 493 + <Text style={[a.font_semi_bold, textStyles]} emoji> 494 494 {getName(items[0])}{' '} 495 495 </Text> 496 496 right now! Add more people to your starter pack by searching ··· 500 500 ) : items.length === 2 ? ( 501 501 currentAccount?.did === items[0].did ? ( 502 502 <Trans> 503 503 - <Text style={[a.font_bold, textStyles]}>You</Text> and 503 503 + <Text style={[a.font_semi_bold, textStyles]}>You</Text> and 504 504 <Text> </Text> 505 505 - <Text style={[a.font_bold, textStyles]} emoji> 505 505 + <Text style={[a.font_semi_bold, textStyles]} emoji> 506 506 {getName(items[1] /* [0] is self, skip it */)}{' '} 507 507 </Text> 508 508 are included in your starter pack 509 509 </Trans> 510 510 ) : ( 511 511 <Trans> 512 512 - <Text style={[a.font_bold, textStyles]}> 512 512 + <Text style={[a.font_semi_bold, textStyles]}> 513 513 {getName(items[0])} 514 514 </Text>{' '} 515 515 and 516 516 <Text> </Text> 517 517 - <Text style={[a.font_bold, textStyles]} emoji> 517 517 + <Text style={[a.font_semi_bold, textStyles]} emoji> 518 518 {getName(items[1] /* [0] is self, skip it */)}{' '} 519 519 </Text> 520 520 are included in your starter pack ··· 522 522 ) 523 523 ) : items.length > 2 ? ( 524 524 <Trans context="profiles"> 525 525 - <Text style={[a.font_bold, textStyles]} emoji> 525 525 + <Text style={[a.font_semi_bold, textStyles]} emoji> 526 526 {getName(items[1] /* [0] is self, skip it */)},{' '} 527 527 </Text> 528 528 - <Text style={[a.font_bold, textStyles]} emoji> 528 528 + <Text style={[a.font_semi_bold, textStyles]} emoji> 529 529 {getName(items[2])},{' '} 530 530 </Text> 531 531 and{' '} ··· 542 542 ) : state.currentStep === 'Feeds' ? ( 543 543 items.length === 0 ? ( 544 544 <View style={[a.gap_sm]}> 545 545 - <Text style={[a.font_bold, a.text_center, textStyles]}> 545 545 + <Text style={[a.font_semi_bold, a.text_center, textStyles]}> 546 546 <Trans>Add some feeds to your starter pack!</Trans> 547 547 </Text> 548 548 <Text style={[a.text_center, textStyles]}> ··· 556 556 { 557 557 items.length === 1 ? ( 558 558 <Trans> 559 559 - <Text style={[a.font_bold, textStyles]} emoji> 559 559 + <Text style={[a.font_semi_bold, textStyles]} emoji> 560 560 {getName(items[0])} 561 561 </Text>{' '} 562 562 is included in your starter pack 563 563 </Trans> 564 564 ) : items.length === 2 ? ( 565 565 <Trans> 566 566 - <Text style={[a.font_bold, textStyles]} emoji> 566 566 + <Text style={[a.font_semi_bold, textStyles]} emoji> 567 567 {getName(items[0])} 568 568 </Text>{' '} 569 569 and 570 570 <Text> </Text> 571 571 - <Text style={[a.font_bold, textStyles]} emoji> 571 571 + <Text style={[a.font_semi_bold, textStyles]} emoji> 572 572 {getName(items[1])}{' '} 573 573 </Text> 574 574 are included in your starter pack 575 575 </Trans> 576 576 ) : items.length > 2 ? ( 577 577 <Trans context="feeds"> 578 578 - <Text style={[a.font_bold, textStyles]} emoji> 578 578 + <Text style={[a.font_semi_bold, textStyles]} emoji> 579 579 {getName(items[0])},{' '} 580 580 </Text> 581 581 - <Text style={[a.font_bold, textStyles]} emoji> 581 581 + <Text style={[a.font_semi_bold, textStyles]} emoji> 582 582 {getName(items[1])},{' '} 583 583 </Text> 584 584 and{' '} ··· 604 604 isNative ? a.mt_sm : a.mt_md, 605 605 ]}> 606 606 {state.currentStep === 'Profiles' && items.length < 8 && ( 607 607 - <Text style={[a.font_bold, textStyles, t.atoms.text_contrast_medium]}> 607 607 + <Text 608 608 + style={[ 609 609 + a.font_semi_bold, 610 610 + textStyles, 611 611 + t.atoms.text_contrast_medium, 612 612 + ]}> 608 613 <Trans>Add {8 - items.length} more to continue</Trans> 609 614 </Text> 610 615 )}

+1 -1

src/screens/Takendown.tsx

··· 148 148 <Logo width={64} /> 149 149 </View> 150 150 151 151 - <Text style={[a.text_4xl, a.font_heavy, a.pb_md]}> 151 151 + <Text style={[a.text_4xl, a.font_bold, a.pb_md]}> 152 152 {isAppealling ? ( 153 153 <Trans>Appeal suspension</Trans> 154 154 ) : (

+1 -1

src/screens/VideoFeed/components/Header.tsx

··· 120 120 <Text 121 121 style={[ 122 122 a.text_md, 123 123 - a.font_heavy, 123 123 + a.font_bold, 124 124 a.leading_tight, 125 125 gtMobile && a.text_lg, 126 126 ]}

+1 -1

src/screens/VideoFeed/components/Scrubber.tsx

··· 179 179 timeStyle, 180 180 ]} 181 181 pointerEvents="none"> 182 182 - <Text style={[a.text_center, a.font_bold]}> 182 182 + <Text style={[a.text_center, a.font_semi_bold]}> 183 183 <Text style={[a.text_5xl, {fontVariant: ['tabular-nums']}]}> 184 184 {formatTime(currentSeekTime)} 185 185 </Text>

+4 -4

src/screens/VideoFeed/index.tsx

··· 524 524 <Text 525 525 style={[ 526 526 a.text_2xl, 527 527 - a.font_heavy, 527 527 + a.font_bold, 528 528 a.text_center, 529 529 a.leading_tight, 530 530 a.mx_xl, ··· 670 670 <Text 671 671 style={[ 672 672 a.text_sm, 673 673 - a.font_bold, 673 673 + a.font_semi_bold, 674 674 a.text_center, 675 675 {opacity: pressed ? 0.5 : 1}, 676 676 ]}> ··· 807 807 /> 808 808 <View style={[a.flex_1]}> 809 809 <Text 810 810 - style={[a.text_md, a.font_heavy]} 810 810 + style={[a.text_md, a.font_bold]} 811 811 emoji 812 812 numberOfLines={1}> 813 813 {sanitizeDisplayName( ··· 1115 1115 <LeafIcon width={64} fill="black" /> 1116 1116 </View> 1117 1117 <View style={[a.w_full, a.gap_md]}> 1118 1118 - <Text style={[a.text_3xl, a.text_center, a.font_heavy]}> 1118 1118 + <Text style={[a.text_3xl, a.text_center, a.font_bold]}> 1119 1119 <Trans>That's everything!</Trans> 1120 1120 </Text> 1121 1121 <Text

+1 -1

src/view/com/auth/SplashScreen.tsx

··· 44 44 <Text 45 45 style={[ 46 46 a.text_md, 47 47 - a.font_bold, 47 47 + a.font_semi_bold, 48 48 t.atoms.text_contrast_medium, 49 49 a.text_center, 50 50 ]}>

+5 -1

src/view/com/auth/SplashScreen.web.tsx

··· 95 95 )} 96 96 97 97 <Text 98 98 - style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}> 98 98 + style={[ 99 99 + a.text_md, 100 100 + a.font_semi_bold, 101 101 + t.atoms.text_contrast_medium, 102 102 + ]}> 99 103 <Trans>What's up?</Trans> 100 104 </Text> 101 105 </View>

+1 -1

src/view/com/auth/server-input/index.tsx

··· 126 126 accessibilityDescribedBy="dialog-description" 127 127 accessibilityLabelledBy="dialog-title"> 128 128 <View style={[a.relative, a.gap_md, a.w_full]}> 129 129 - <Text nativeID="dialog-title" style={[a.text_2xl, a.font_bold]}> 129 129 + <Text nativeID="dialog-title" style={[a.text_2xl, a.font_semi_bold]}> 130 130 <Trans>Choose your account provider</Trans> 131 131 </Text> 132 132 <ToggleButton.Group

+2 -2

src/view/com/composer/Composer.tsx

··· 1770 1770 style={[ 1771 1771 {paddingLeft: 28}, 1772 1772 a.text_xs, 1773 1773 - a.font_bold, 1773 1773 + a.font_semi_bold, 1774 1774 a.leading_snug, 1775 1775 t.atoms.text_contrast_low, 1776 1776 ]}> ··· 1863 1863 progress={wheelProgress} 1864 1864 /> 1865 1865 </Animated.View> 1866 1866 - <NewText style={[a.font_bold, a.ml_sm]}>{text}</NewText> 1866 1866 + <NewText style={[a.font_semi_bold, a.ml_sm]}>{text}</NewText> 1867 1867 </ToolbarWrapper> 1868 1868 ) 1869 1869 }

+1 -1

src/view/com/composer/ComposerReplyTo.tsx

··· 101 101 <View style={[a.flex_1, a.pl_md, a.pr_sm, a.gap_2xs]}> 102 102 <View style={[a.flex_row, a.align_center, a.pr_xs]}> 103 103 <Text 104 104 - style={[a.font_bold, a.text_md, a.leading_snug, a.flex_shrink]} 104 104 + style={[a.font_semi_bold, a.text_md, a.leading_snug, a.flex_shrink]} 105 105 numberOfLines={1} 106 106 emoji> 107 107 {sanitizeDisplayName(

+3 -2

src/view/com/composer/GifAltText.tsx

··· 95 95 <Plus size="sm" fill={t.palette.white} /> 96 96 )} 97 97 <Text 98 98 - style={[a.font_bold, {color: t.palette.white}]} 98 98 + style={[a.font_semi_bold, {color: t.palette.white}]} 99 99 accessible={false}> 100 100 <Trans>ALT</Trans> 101 101 </Text> ··· 206 206 </View> 207 207 {/* below the text input to force tab order */} 208 208 <View> 209 209 - <Text style={[a.text_2xl, a.font_bold, a.leading_tight, a.pb_sm]}> 209 209 + <Text 210 210 + style={[a.text_2xl, a.font_semi_bold, a.leading_tight, a.pb_sm]}> 210 211 <Trans>Add alt text</Trans> 211 212 </Text> 212 213 <View style={[a.align_center]}>

+3 -3

src/view/com/composer/labels/LabelsBtn.tsx

··· 108 108 style={[{maxWidth: 500}, a.w_full]}> 109 109 <View style={[a.flex_1]}> 110 110 <View style={[a.gap_sm]}> 111 111 - <Text style={[a.text_2xl, a.font_bold]}> 111 111 + <Text style={[a.text_2xl, a.font_semi_bold]}> 112 112 <Trans>Add a content warning</Trans> 113 113 </Text> 114 114 <Text style={[t.atoms.text_contrast_medium, a.leading_snug]}> ··· 123 123 <View> 124 124 <View 125 125 style={[a.flex_row, a.align_center, a.justify_between, a.pb_sm]}> 126 126 - <Text style={[a.font_bold, a.text_lg]}> 126 126 + <Text style={[a.font_semi_bold, a.text_lg]}> 127 127 <Trans>Adult Content</Trans> 128 128 </Text> 129 129 </View> ··· 181 181 <View> 182 182 <View 183 183 style={[a.flex_row, a.align_center, a.justify_between, a.pb_sm]}> 184 184 - <Text style={[a.font_bold, a.text_lg]}> 184 184 + <Text style={[a.font_semi_bold, a.text_lg]}> 185 185 <Trans>Other</Trans> 186 186 </Text> 187 187 </View>

+1 -1

src/view/com/composer/photos/ImageAltTextDialog.tsx

··· 89 89 <Dialog.Close /> 90 90 91 91 <View> 92 92 - <Text style={[a.text_2xl, a.font_bold, a.leading_tight, a.pb_sm]}> 92 92 + <Text style={[a.text_2xl, a.font_semi_bold, a.leading_tight, a.pb_sm]}> 93 93 <Trans>Add alt text</Trans> 94 94 </Text> 95 95

+1 -1

src/view/com/composer/select-language/PostLanguageSelect.tsx

··· 111 111 <Text 112 112 style={[ 113 113 {color}, 114 114 - a.font_bold, 114 114 + a.font_semi_bold, 115 115 a.text_sm, 116 116 a.leading_snug, 117 117 {maxWidth: 100},

+2 -2

src/view/com/composer/select-language/PostLanguageSelectDialog.tsx

··· 155 155 style={[ 156 156 t.atoms.text, 157 157 a.text_left, 158 158 - a.font_bold, 158 158 + a.font_semi_bold, 159 159 a.text_xl, 160 160 a.mb_sm, 161 161 ]}> ··· 240 240 style={[ 241 241 a.px_0, 242 242 a.py_md, 243 243 - a.font_bold, 243 243 + a.font_semi_bold, 244 244 a.text_xs, 245 245 t.atoms.text_contrast_low, 246 246 a.pt_3xl,

+1 -1

src/view/com/composer/select-language/SuggestedLanguage.tsx

··· 88 88 <Text style={[a.flex_1]}> 89 89 <Trans> 90 90 Are you writing in{' '} 91 91 - <Text style={[a.font_bold]}>{suggestedLanguageName}</Text>? 91 91 + <Text style={[a.font_semi_bold]}>{suggestedLanguageName}</Text>? 92 92 </Trans> 93 93 </Text> 94 94

+1 -1

src/view/com/composer/text-input/TextInput.web.tsx

··· 353 353 <Text 354 354 style={[ 355 355 a.text_lg, 356 356 - a.font_bold, 356 356 + a.font_semi_bold, 357 357 t.atoms.text_contrast_medium, 358 358 t.atoms.border_contrast_high, 359 359 styles.dropText,

+1 -1

src/view/com/composer/text-input/mobile/Autocomplete.tsx

··· 110 110 platform({ios: a.flex_1}), 111 111 ]}> 112 112 <Text 113 113 - style={[a.text_md, a.font_bold, a.leading_snug]} 113 113 + style={[a.text_md, a.font_semi_bold, a.leading_snug]} 114 114 emoji 115 115 numberOfLines={1}> 116 116 {displayName}

+3 -3

src/view/com/composer/videos/SubtitleDialog.tsx

··· 97 97 return ( 98 98 <Dialog.ScrollableInner label={_(msg`Video settings`)}> 99 99 <View style={a.gap_md}> 100 100 - <Text style={[a.text_xl, a.font_bold, a.leading_tight]}> 100 100 + <Text style={[a.text_xl, a.font_semi_bold, a.leading_tight]}> 101 101 <Trans>Alt text</Trans> 102 102 </Text> 103 103 <TextField.Root> ··· 128 128 a.my_md, 129 129 ]} 130 130 /> 131 131 - <Text style={[a.text_xl, a.font_bold, a.leading_tight]}> 131 131 + <Text style={[a.text_xl, a.font_semi_bold, a.leading_tight]}> 132 132 <Trans>Captions (.vtt)</Trans> 133 133 </Text> 134 134 <SubtitleFilePicker ··· 235 235 <PageTextIcon style={[t.atoms.text, a.flex_shrink_0]} size="sm" /> 236 236 )} 237 237 <Text 238 238 - style={[a.flex_1, a.leading_snug, a.font_bold, a.mb_2xs]} 238 238 + style={[a.flex_1, a.leading_snug, a.font_semi_bold, a.mb_2xs]} 239 239 numberOfLines={1}> 240 240 {file.name} 241 241 </Text>

+2 -2

src/view/com/feeds/FeedSourceCard.tsx

··· 139 139 <View style={[a.flex_1]}> 140 140 <Text 141 141 emoji 142 142 - style={[a.text_sm, a.font_bold, a.leading_snug]} 142 142 + style={[a.text_sm, a.font_semi_bold, a.leading_snug]} 143 143 numberOfLines={1}> 144 144 {feed.displayName} 145 145 </Text> ··· 165 165 <Text 166 166 style={[ 167 167 a.text_sm, 168 168 - a.font_bold, 168 168 + a.font_semi_bold, 169 169 t.atoms.text_contrast_medium, 170 170 a.leading_snug, 171 171 ]}>

+7 -5

src/view/com/feeds/MissingFeed.tsx

··· 67 67 <View style={[a.flex_1]}> 68 68 <Text 69 69 emoji 70 70 - style={[a.text_sm, a.font_bold, a.leading_snug, a.italic]} 70 70 + style={[a.text_sm, a.font_semi_bold, a.leading_snug, a.italic]} 71 71 numberOfLines={1}> 72 72 {type === 'feed' ? ( 73 73 <Trans>Feed unavailable</Trans> ··· 128 128 } 129 129 style={web({maxWidth: 500})}> 130 130 <View style={[a.gap_sm]}> 131 131 - <Text style={[a.font_heavy, a.text_2xl]}> 131 131 + <Text style={[a.font_bold, a.text_2xl]}> 132 132 {type === 'feed' ? ( 133 133 <Trans>Could not connect to feed service</Trans> 134 134 ) : ( ··· 147 147 )} 148 148 </Text> 149 149 <Divider style={[a.my_md]} /> 150 150 - <Text style={[a.font_bold, t.atoms.text_contrast_high]}> 150 150 + <Text style={[a.font_semi_bold, t.atoms.text_contrast_high]}> 151 151 {type === 'feed' ? ( 152 152 <Trans>Feed creator</Trans> 153 153 ) : ( ··· 184 184 )} 185 185 {type === 'feed' && ( 186 186 <> 187 187 - <Text style={[a.font_bold, t.atoms.text_contrast_high, a.mt_md]}> 187 187 + <Text 188 188 + style={[a.font_semi_bold, t.atoms.text_contrast_high, a.mt_md]}> 188 189 <Trans>Feed identifier</Trans> 189 190 </Text> 190 191 <Text style={[a.text_md, t.atoms.text_contrast_high, a.italic]}> ··· 194 195 )} 195 196 {error instanceof Error && ( 196 197 <> 197 197 - <Text style={[a.font_bold, t.atoms.text_contrast_high, a.mt_md]}> 198 198 + <Text 199 199 + style={[a.font_semi_bold, t.atoms.text_contrast_high, a.mt_md]}> 198 200 <Trans>Error message</Trans> 199 201 </Text> 200 202 <Text style={[a.text_md, t.atoms.text_contrast_high, a.italic]}>

+11 -11

src/view/com/notifications/NotificationFeedItem.tsx

··· 214 214 <ProfileHoverCard did={firstAuthor.profile.did} inline> 215 215 <InlineLinkText 216 216 key={firstAuthor.href} 217 217 - style={[t.atoms.text, a.font_bold, a.text_md, a.leading_tight]} 217 217 + style={[t.atoms.text, a.font_semi_bold, a.text_md, a.leading_tight]} 218 218 to={firstAuthor.href} 219 219 disableMismatchWarning 220 220 emoji ··· 271 271 notificationContent = hasMultipleAuthors ? ( 272 272 <Trans> 273 273 {firstAuthorLink} and{' '} 274 274 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 274 274 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 275 275 <Plural 276 276 value={additionalAuthorsCount} 277 277 one={`${formattedAuthorsCount} other`} ··· 295 295 notificationContent = hasMultipleAuthors ? ( 296 296 <Trans> 297 297 {firstAuthorLink} and{' '} 298 298 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 298 298 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 299 299 <Plural 300 300 value={additionalAuthorsCount} 301 301 one={`${formattedAuthorsCount} other`} ··· 352 352 notificationContent = hasMultipleAuthors ? ( 353 353 <Trans> 354 354 {firstAuthorLink} and{' '} 355 355 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 355 355 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 356 356 <Plural 357 357 value={additionalAuthorsCount} 358 358 one={`${formattedAuthorsCount} other`} ··· 378 378 notificationContent = hasMultipleAuthors ? ( 379 379 <Trans> 380 380 {firstAuthorLink} and{' '} 381 381 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 381 381 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 382 382 <Plural 383 383 value={additionalAuthorsCount} 384 384 one={`${formattedAuthorsCount} other`} ··· 402 402 notificationContent = hasMultipleAuthors ? ( 403 403 <Trans> 404 404 {firstAuthorLink} and{' '} 405 405 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 405 405 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 406 406 <Plural 407 407 value={additionalAuthorsCount} 408 408 one={`${formattedAuthorsCount} other`} ··· 483 483 notificationContent = hasMultipleAuthors ? ( 484 484 <Trans> 485 485 {firstAuthorLink} and{' '} 486 486 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 486 486 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 487 487 <Plural 488 488 value={additionalAuthorsCount} 489 489 one={`${formattedAuthorsCount} other`} ··· 507 507 notificationContent = hasMultipleAuthors ? ( 508 508 <Trans> 509 509 {firstAuthorLink} and{' '} 510 510 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 510 510 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 511 511 <Plural 512 512 value={additionalAuthorsCount} 513 513 one={`${formattedAuthorsCount} other`} ··· 541 541 notificationContent = hasMultipleAuthors ? ( 542 542 <Trans> 543 543 New posts from {firstAuthorLink} and{' '} 544 544 - <Text style={[a.text_md, a.font_bold, a.leading_snug]}> 544 544 + <Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}> 545 545 <Plural 546 546 value={additionalAuthorsCount} 547 547 one={`${formattedAuthorsCount} other`} ··· 846 846 {authors.length > MAX_AUTHORS ? ( 847 847 <Text 848 848 style={[ 849 849 - a.font_bold, 849 849 + a.font_semi_bold, 850 850 {paddingLeft: 6}, 851 851 t.atoms.text_contrast_medium, 852 852 ]}> ··· 926 926 emoji 927 927 style={[ 928 928 a.text_md, 929 929 - a.font_bold, 929 929 + a.font_semi_bold, 930 930 a.leading_tight, 931 931 {maxWidth: '70%'}, 932 932 ]}>

+1 -1

src/view/com/pager/TabBar.tsx

··· 431 431 <Text 432 432 emoji 433 433 testID={testID ? `${testID}-${item}` : undefined} 434 434 - style={[styles.itemText, t.atoms.text, a.text_md, a.font_bold]} 434 434 + style={[styles.itemText, t.atoms.text, a.text_md, a.font_semi_bold]} 435 435 onLayout={handleTextLayout}> 436 436 {item} 437 437 </Text>

+1 -1

src/view/com/pager/TabBar.web.tsx

··· 121 121 styles.itemText, 122 122 selected ? t.atoms.text : t.atoms.text_contrast_medium, 123 123 a.text_md, 124 124 - a.font_bold, 124 124 + a.font_semi_bold, 125 125 {lineHeight: 20}, 126 126 ]}> 127 127 {item}

+1 -1

src/view/com/posts/FeedShutdownMsg.tsx

··· 92 92 t.atoms.border_contrast_low, 93 93 a.border_t, 94 94 ]}> 95 95 - <Text style={[a.text_5xl, a.font_bold, t.atoms.text, a.text_center]}> 95 95 + <Text style={[a.text_5xl, a.font_semi_bold, t.atoms.text, a.text_center]}> 96 96 :( 97 97 </Text> 98 98 <Text style={[a.text_md, a.leading_snug, t.atoms.text, a.text_center]}>

+1 -1

src/view/com/util/PostMeta.tsx

··· 92 92 onPress={onBeforePressAuthor} 93 93 style={[ 94 94 a.text_md, 95 95 - a.font_bold, 95 95 + a.font_semi_bold, 96 96 t.atoms.text, 97 97 a.leading_tight, 98 98 a.flex_shrink_0,

+1 -1

src/view/com/util/error/ErrorScreen.tsx

··· 62 62 /> 63 63 </View> 64 64 </View> 65 65 - <Text style={[a.text_center, a.font_heavy, a.text_2xl, a.mb_md]}> 65 65 + <Text style={[a.text_center, a.font_bold, a.text_2xl, a.mb_md]}> 66 66 {title} 67 67 </Text> 68 68 <Text style={[a.text_center, a.text_md, a.mb_xl]}>{message}</Text>

+1 -2

src/view/com/util/images/AutoSizedImage.tsx

··· 185 185 }, 186 186 ], 187 187 ]}> 188 188 - <Text 189 189 - style={[a.font_heavy, largeAlt ? a.text_xs : {fontSize: 8}]}> 188 188 + <Text style={[a.font_bold, largeAlt ? a.text_xs : {fontSize: 8}]}> 190 189 ALT 191 190 </Text> 192 191 </View>

+1 -1

src/view/com/util/images/Gallery.tsx

··· 109 109 ], 110 110 ]}> 111 111 <Text 112 112 - style={[a.font_heavy, largeAltBadge ? a.text_xs : {fontSize: 8}]}> 112 112 + style={[a.font_bold, largeAltBadge ? a.text_xs : {fontSize: 8}]}> 113 113 ALT 114 114 </Text> 115 115 </View>

+9 -7

src/view/screens/DebugMod.tsx

··· 275 275 <moderationOptsOverrideContext.Provider value={modOpts}> 276 276 <ScrollView> 277 277 <CenteredView style={[t.atoms.bg, a.px_lg, a.py_lg]}> 278 278 - <H1 style={[a.text_5xl, a.font_bold, a.pb_lg]}> 278 278 + <H1 style={[a.text_5xl, a.font_semi_bold, a.pb_lg]}> 279 279 Moderation states 280 280 </H1> 281 281 ··· 396 396 <View style={[a.mt_md]}> 397 397 <Text 398 398 style={[ 399 399 - a.font_bold, 399 399 + a.font_semi_bold, 400 400 a.text_xs, 401 401 t.atoms.text, 402 402 a.pb_sm, ··· 438 438 <View> 439 439 <Text 440 440 style={[ 441 441 - a.font_bold, 441 441 + a.font_semi_bold, 442 442 a.text_xs, 443 443 t.atoms.text, 444 444 a.pl_md, ··· 596 596 function Heading({title, subtitle}: {title: string; subtitle?: string}) { 597 597 const t = useTheme() 598 598 return ( 599 599 - <H3 style={[a.text_3xl, a.font_bold, a.pb_md]}> 599 599 + <H3 style={[a.text_3xl, a.font_semi_bold, a.pb_md]}> 600 600 {title}{' '} 601 601 {!!subtitle && ( 602 602 <H3 style={[t.atoms.text_contrast_medium, a.text_lg]}>{subtitle}</H3> ··· 627 627 a.mt_md, 628 628 ]}> 629 629 <View> 630 630 - <Text style={[a.font_bold, a.text_xs, t.atoms.text, a.pl_md, a.pb_xs]}> 630 630 + <Text 631 631 + style={[a.font_semi_bold, a.text_xs, t.atoms.text, a.pl_md, a.pb_xs]}> 631 632 Blurs 632 633 </Text> 633 634 <View ··· 662 663 </View> 663 664 </View> 664 665 <View> 665 665 - <Text style={[a.font_bold, a.text_xs, t.atoms.text, a.pl_md, a.pb_xs]}> 666 666 + <Text 667 667 + style={[a.font_semi_bold, a.text_xs, t.atoms.text, a.pl_md, a.pb_xs]}> 666 668 Severity 667 669 </Text> 668 670 <View ··· 789 791 const ui = mod.ui(key as keyof ModerationBehavior) 790 792 return ( 791 793 <View key={key} style={[a.flex_row, a.gap_md]}> 792 792 - <Text style={[a.font_bold, {width: 100}]}>{key}</Text> 794 794 + <Text style={[a.font_semi_bold, {width: 100}]}>{key}</Text> 793 795 <Flag v={ui.filter} label="Filter" /> 794 796 <Flag v={ui.blur} label="Blur" /> 795 797 <Flag v={ui.alert} label="Alert" />

+2 -2

src/view/screens/Feeds.tsx

··· 700 700 }> 701 701 <IconCircle icon={ListSparkle_Stroke2_Corner0_Rounded} size="lg" /> 702 702 <View style={[a.flex_1, a.gap_xs]}> 703 703 - <Text style={[a.flex_1, a.text_2xl, a.font_heavy, t.atoms.text]}> 703 703 + <Text style={[a.flex_1, a.text_2xl, a.font_bold, t.atoms.text]}> 704 704 <Trans>My Feeds</Trans> 705 705 </Text> 706 706 <Text style={[t.atoms.text_contrast_high]}> ··· 726 726 size="lg" 727 727 /> 728 728 <View style={[a.flex_1, a.gap_sm]}> 729 729 - <Text style={[a.flex_1, a.text_2xl, a.font_heavy, t.atoms.text]}> 729 729 + <Text style={[a.flex_1, a.text_2xl, a.font_bold, t.atoms.text]}> 730 730 <Trans>Discover New Feeds</Trans> 731 731 </Text> 732 732 <Text style={[t.atoms.text_contrast_high]}>

+2 -2

src/view/screens/Storybook/Buttons.tsx

··· 16 16 export function Buttons() { 17 17 return ( 18 18 <View style={[a.gap_md]}> 19 19 - <Text style={[a.font_heavy, a.text_5xl]}>Buttons</Text> 19 19 + <Text style={[a.font_bold, a.text_5xl]}>Buttons</Text> 20 20 21 21 {[ 22 22 'primary', ··· 29 29 <Fragment key={color}> 30 30 {['tiny', 'small', 'large'].map(size => ( 31 31 <Fragment key={size}> 32 32 - <Text style={[a.font_heavy, a.text_2xl]}> 32 32 + <Text style={[a.font_bold, a.text_2xl]}> 33 33 color={color} size={size} 34 34 </Text> 35 35 <View style={[a.flex_row, a.align_start, a.gap_md]}>

+1 -1

src/view/screens/Storybook/Settings.tsx

··· 106 106 color={t.palette.primary_500} 107 107 /> 108 108 <SettingsList.ItemText 109 109 - style={[{color: t.palette.primary_500}, a.font_bold]}> 109 109 + style={[{color: t.palette.primary_500}, a.font_semi_bold]}> 110 110 Protect your account 111 111 </SettingsList.ItemText> 112 112 <SettingsList.Chevron color={t.palette.primary_500} />

+4 -4

src/view/screens/Storybook/Theming.tsx

··· 11 11 <View style={[t.atoms.bg, a.gap_lg, a.p_xl]}> 12 12 <Palette /> 13 13 14 14 - <Text style={[a.font_bold, a.pt_xl, a.px_md]}>theme.atoms.text</Text> 14 14 + <Text style={[a.font_semi_bold, a.pt_xl, a.px_md]}>theme.atoms.text</Text> 15 15 16 16 <View style={[a.flex_1, t.atoms.border_contrast_high, a.border_t]} /> 17 17 - <Text style={[a.font_bold, t.atoms.text_contrast_high, a.px_md]}> 17 17 + <Text style={[a.font_semi_bold, t.atoms.text_contrast_high, a.px_md]}> 18 18 theme.atoms.text_contrast_high 19 19 </Text> 20 20 21 21 <View style={[a.flex_1, t.atoms.border_contrast_medium, a.border_t]} /> 22 22 - <Text style={[a.font_bold, t.atoms.text_contrast_medium, a.px_md]}> 22 22 + <Text style={[a.font_semi_bold, t.atoms.text_contrast_medium, a.px_md]}> 23 23 theme.atoms.text_contrast_medium 24 24 </Text> 25 25 26 26 <View style={[a.flex_1, t.atoms.border_contrast_low, a.border_t]} /> 27 27 - <Text style={[a.font_bold, t.atoms.text_contrast_low, a.px_md]}> 27 27 + <Text style={[a.font_semi_bold, t.atoms.text_contrast_low, a.px_md]}> 28 28 theme.atoms.text_contrast_low 29 29 </Text> 30 30

+4 -4

src/view/screens/Storybook/Typography.tsx

··· 26 26 <Text style={[a.text_xl, a.font_medium, a.italic]}> 27 27 This is medium italic text 28 28 </Text> 29 29 - <Text style={[a.text_xl, a.font_bold]}>This is bold text</Text> 30 30 - <Text style={[a.text_xl, a.font_bold, a.italic]}> 29 29 + <Text style={[a.text_xl, a.font_semi_bold]}>This is bold text</Text> 30 30 + <Text style={[a.text_xl, a.font_semi_bold, a.italic]}> 31 31 This is bold italic text 32 32 </Text> 33 33 - <Text style={[a.text_xl, a.font_heavy]}>This is heavy text</Text> 34 34 - <Text style={[a.text_xl, a.font_heavy, a.italic]}> 33 33 + <Text style={[a.text_xl, a.font_bold]}>This is heavy text</Text> 34 34 + <Text style={[a.text_xl, a.font_bold, a.italic]}> 35 35 This is heavy italic text 36 36 </Text> 37 37

+5 -5

src/view/shell/Drawer.tsx

··· 90 90 <View style={[a.flex_row, a.align_center, a.gap_xs, a.flex_1]}> 91 91 <Text 92 92 emoji 93 93 - style={[a.font_heavy, a.text_xl, a.mt_2xs, a.leading_tight]} 93 93 + style={[a.font_bold, a.text_xl, a.mt_2xs, a.leading_tight]} 94 94 numberOfLines={1}> 95 95 {profile?.displayName || account.handle} 96 96 </Text> ··· 115 115 </View> 116 116 <Text style={[a.text_md, t.atoms.text_contrast_medium]}> 117 117 <Trans> 118 118 - <Text style={[a.text_md, a.font_bold]}> 118 118 + <Text style={[a.text_md, a.font_semi_bold]}> 119 119 {formatCount(i18n, profile?.followersCount ?? 0)} 120 120 </Text>{' '} 121 121 <Plural ··· 126 126 </Trans>{' '} 127 127 &middot;{' '} 128 128 <Trans> 129 129 - <Text style={[a.text_md, a.font_bold]}> 129 129 + <Text style={[a.text_md, a.font_semi_bold]}> 130 130 {formatCount(i18n, profile?.followsCount ?? 0)} 131 131 </Text>{' '} 132 132 <Plural ··· 656 656 style={[ 657 657 a.text_xs, 658 658 a.leading_tight, 659 659 - a.font_bold, 659 659 + a.font_semi_bold, 660 660 { 661 661 fontVariant: ['tabular-nums'], 662 662 color: colors.white, ··· 673 673 style={[ 674 674 a.flex_1, 675 675 a.text_2xl, 676 676 - bold && a.font_heavy, 676 676 + bold && a.font_bold, 677 677 web(a.leading_snug), 678 678 ]} 679 679 numberOfLines={1}>

+1 -1

src/view/shell/NavSignupCard.tsx

··· 36 36 37 37 <View style={[a.pt_lg]}> 38 38 <Text 39 39 - style={[a.text_3xl, a.font_heavy, {lineHeight: a.text_3xl.fontSize}]}> 39 39 + style={[a.text_3xl, a.font_bold, {lineHeight: a.text_3xl.fontSize}]}> 40 40 <Trans>Join the conversation</Trans> 41 41 </Text> 42 42 </View>

+1 -1

src/view/shell/desktop/Feeds.tsx

··· 90 90 a.text_md, 91 91 a.leading_snug, 92 92 current 93 93 - ? [a.font_bold, t.atoms.text] 93 93 + ? [a.font_semi_bold, t.atoms.text] 94 94 : [t.atoms.text_contrast_medium], 95 95 web({ 96 96 marginHorizontal: 2,

+3 -3

src/view/shell/desktop/LeftNav.tsx

··· 161 161 }, 162 162 ]}> 163 163 <Text 164 164 - style={[a.font_heavy, a.text_sm, a.leading_snug]} 164 164 + style={[a.font_bold, a.text_sm, a.leading_snug]} 165 165 numberOfLines={1}> 166 166 {sanitizeDisplayName( 167 167 profile.displayName || profile.handle, ··· 462 462 style={[ 463 463 a.absolute, 464 464 a.text_xs, 465 465 - a.font_bold, 465 465 + a.font_semi_bold, 466 466 a.rounded_full, 467 467 a.text_center, 468 468 a.leading_tight, ··· 509 509 ) : null} 510 510 </View> 511 511 {!leftNavMinimal && ( 512 512 - <Text style={[a.text_xl, isCurrent ? a.font_heavy : a.font_normal]}> 512 512 + <Text style={[a.text_xl, isCurrent ? a.font_bold : a.font_normal]}> 513 513 {label} 514 514 </Text> 515 515 )}

+1 -1

src/view/shell/desktop/SidebarTrendingTopics.tsx

··· 53 53 style={[ 54 54 a.flex_1, 55 55 a.text_sm, 56 56 - a.font_bold, 56 56 + a.font_semi_bold, 57 57 t.atoms.text_contrast_medium, 58 58 ]}> 59 59 <Trans>Trending</Trans>

+7

yarn.lock

··· 3635 3635 resolved "https://registry.yarnpkg.com/@braintree/sanitize-url/-/sanitize-url-6.0.4.tgz#923ca57e173c6b232bbbb07347b1be982f03e783" 3636 3636 integrity sha512-s3jaWicZd0pkP0jf5ysyHUI/RE7MHos6qlToFcGWXVp+ykHOy77OUMrfbgJ9it2C5bow7OIQwYYaHjk9XlBQ2A== 3637 3637 3638 3638 + "@bsky.app/alf@^0.1.2": 3639 3639 + version "0.1.2" 3640 3640 + resolved "https://registry.yarnpkg.com/@bsky.app/alf/-/alf-0.1.2.tgz#8e3b3cd0b27f1dfe359d99edd2afd7d123b7ab69" 3641 3641 + integrity sha512-lIidmkoHsqXwj07BY4fYIu/JyWGXRAGLfh65qhGzWpXLTK1DGyoQUjz5CwsqTDSQWpCfBC7eEaOtYjjv9cAjSQ== 3642 3642 + dependencies: 3643 3643 + react-responsive "^10.0.1" 3644 3644 + 3638 3645 "@bufbuild/protobuf@^1.5.0": 3639 3646 version "1.7.0" 3640 3647 resolved "https://registry.yarnpkg.com/@bufbuild/protobuf/-/protobuf-1.7.0.tgz#cecddc8162a231642b410bc7b99309cd5969733c"