FilesExpand file tree

main

/

nav.py

Copy path

Blame

More file actions

Blame

More file actions

Latest commit

 

History

History

History

117 lines (111 loc) · 4.1 KB

main

/

nav.py

Copy path

Top

File metadata and controls

• Code
• Blame

117 lines (111 loc) · 4.1 KB

Raw

Copy raw file

Download raw file

Open symbols panel

Edit and raw actions

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

import reflex as rx

import reflex_local_auth

from .. import navigation

def navbar_link(text: str, url: str) -> rx.Component:

return rx.link(

rx.text(text, size="4", weight="medium"), href=url

)

def navbar() -> rx.Component:

return rx.box(

rx.desktop_only(

rx.hstack(

rx.hstack(

rx.link(

rx.image(

src="/logo.jpg",

width="2.25em",

height="auto",

border_radius="25%",

),

href=navigation.routes.HOME_ROUTE

),

rx.link(

rx.heading(

"Reflex", size="7", weight="bold"

),

href=navigation.routes.HOME_ROUTE

),

align_items="center",

),

rx.hstack(

navbar_link("Home", navigation.routes.HOME_ROUTE),

navbar_link("About", navigation.routes.ABOUT_US_ROUTE),

navbar_link("Articles", navigation.routes.ARTICLE_LIST_ROUTE),

navbar_link("Pricing", navigation.routes.PRICING_ROUTE),

navbar_link("Contact", navigation.routes.CONTACT_US_ROUTE),

spacing="5",

),

rx.hstack(

rx.link(

rx.button(

"Register",

size="3",

variant="outline",

),

href=reflex_local_auth.routes.REGISTER_ROUTE

),

rx.link(

rx.button(

"Login",

size="3",

variant="outline",

),

href=reflex_local_auth.routes.LOGIN_ROUTE

),

spacing="4",

justify="end",

),

justify="between",

align_items="center",

id='my-navbar-hstack-desktop',

),

),

rx.mobile_and_tablet(

rx.hstack(

rx.hstack(

rx.image(

src="/logo.jpg",

width="2em",

height="auto",

border_radius="25%",

),

rx.heading(

"Reflex", size="6", weight="bold"

),

align_items="center",

),

rx.menu.root(

rx.menu.trigger(

rx.icon("menu", size=30)

),

rx.menu.content(

rx.menu.item("Home",

on_click=navigation.NavState.to_home),

rx.menu.item("About",

on_click=navigation.NavState.to_about_us),

rx.menu.item("Articles",

on_click=navigation.NavState.to_articles),

rx.menu.item("Pricing",

on_click=navigation.NavState.to_pricing),

rx.menu.item("Contact",

on_click=navigation.NavState.to_contact),

rx.menu.separator(),

rx.menu.item("Log in",

on_click=navigation.NavState.to_login),

rx.menu.item("Register",

on_click=navigation.NavState.to_register),

),

justify="end",

),

justify="between",

align_items="center",

),

),

bg=rx.color("accent", 3),

padding="1em",

# position="fixed",

# top="0px",

# z_index="5",

width="100%",

id='my-main-nav',

)