frontend client for gemstone. decentralised workplace app
2
fork

Configure Feed

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

refactor: hover state

serenity a968db6c a6447abe

+61 -45
+30 -22
src/components/Settings/RegisterLatticeModalContent.tsx
··· 1 1 import { Loading } from "@/components/primitives/Loading"; 2 2 import { Text } from "@/components/primitives/Text"; 3 3 import { useFacet } from "@/lib/facet"; 4 + import { lighten } from "@/lib/facet/src/lib/colors"; 4 5 import { registerNewLattice } from "@/lib/utils/gmstn"; 5 6 import { 6 7 useOAuthAgentGuaranteed, ··· 97 98 /> 98 99 </View> 99 100 <Pressable 100 - style={{ 101 - backgroundColor: inputText.trim() 102 - ? semantic.primary 103 - : registerError 104 - ? semantic.error 105 - : semantic.border, 106 - borderRadius: atoms.radii.lg, 107 - alignItems: "center", 108 - paddingVertical: 10, 109 - }} 110 101 onPress={() => { 111 102 newLatticeMutation(); 112 103 }} 113 104 > 114 - {mutationPending ? ( 115 - <Loading size="small" /> 116 - ) : ( 117 - <Text 118 - style={[ 119 - typography.weights.byName.normal, 120 - { color: semantic.textInverse }, 121 - ]} 122 - > 123 - Register 124 - </Text> 125 - )} 105 + {({ hovered }) => 106 + mutationPending ? ( 107 + <Loading size="small" /> 108 + ) : ( 109 + <View 110 + style={{ 111 + backgroundColor: inputText.trim() 112 + ? hovered 113 + ? lighten(semantic.primary, 7) 114 + : semantic.primary 115 + : registerError 116 + ? semantic.error 117 + : semantic.border, 118 + borderRadius: atoms.radii.lg, 119 + alignItems: "center", 120 + paddingVertical: 10, 121 + }} 122 + > 123 + <Text 124 + style={[ 125 + typography.weights.byName.normal, 126 + { color: semantic.textInverse }, 127 + ]} 128 + > 129 + Add 130 + </Text> 131 + </View> 132 + ) 133 + } 126 134 </Pressable> 127 135 </View> 128 136 );
+31 -23
src/components/Settings/RegisterShardModalContent.tsx
··· 1 1 import { Loading } from "@/components/primitives/Loading"; 2 2 import { Text } from "@/components/primitives/Text"; 3 3 import { useFacet } from "@/lib/facet"; 4 + import { lighten } from "@/lib/facet/src/lib/colors"; 4 5 import { registerNewShard } from "@/lib/utils/gmstn"; 5 6 import { 6 7 useOAuthAgentGuaranteed, ··· 27 28 const agent = useOAuthAgentGuaranteed(); 28 29 const session = useOAuthSessionGuaranteed(); 29 30 const queryClient = useQueryClient(); 30 - const { queryKey: shardsQueryKey } = useShardsQuery(session) 31 + const { queryKey: shardsQueryKey } = useShardsQuery(session); 31 32 const { mutate: newShardMutation, isPending: mutationPending } = 32 33 useMutation({ 33 34 mutationFn: async () => { ··· 97 98 /> 98 99 </View> 99 100 <Pressable 100 - style={{ 101 - backgroundColor: inputText.trim() 102 - ? semantic.primary 103 - : registerError 104 - ? semantic.error 105 - : semantic.border, 106 - borderRadius: atoms.radii.lg, 107 - alignItems: "center", 108 - paddingVertical: 10, 109 - }} 110 101 onPress={() => { 111 102 newShardMutation(); 112 103 }} 113 104 > 114 - {mutationPending ? ( 115 - <Loading size="small" /> 116 - ) : ( 117 - <Text 118 - style={[ 119 - typography.weights.byName.normal, 120 - { color: semantic.textInverse }, 121 - ]} 122 - > 123 - Register 124 - </Text> 125 - )} 105 + {({ hovered }) => 106 + mutationPending ? ( 107 + <Loading size="small" /> 108 + ) : ( 109 + <View 110 + style={{ 111 + backgroundColor: inputText.trim() 112 + ? hovered 113 + ? lighten(semantic.primary, 7) 114 + : semantic.primary 115 + : registerError 116 + ? semantic.error 117 + : semantic.border, 118 + borderRadius: atoms.radii.lg, 119 + alignItems: "center", 120 + paddingVertical: 10, 121 + }} 122 + > 123 + <Text 124 + style={[ 125 + typography.weights.byName.normal, 126 + { color: semantic.textInverse }, 127 + ]} 128 + > 129 + Add 130 + </Text> 131 + </View> 132 + ) 133 + } 126 134 </Pressable> 127 135 </View> 128 136 );