diff --git a/example/src/pages/FooterWithButton.tsx b/example/src/pages/FooterWithButton.tsx
index 4c500489..0686ee53 100644
--- a/example/src/pages/FooterWithButton.tsx
+++ b/example/src/pages/FooterWithButton.tsx
@@ -21,6 +21,7 @@ export const FooterWithButton = () => (
Footer with button
{
);
return (
-
+
{renderLeftButton()}
{renderMidButton()}
{renderRightButton()}
diff --git a/src/components/layout/FooterWithButtons.tsx b/src/components/layout/FooterWithButtons.tsx
index 4a8eb62e..7c587931 100644
--- a/src/components/layout/FooterWithButtons.tsx
+++ b/src/components/layout/FooterWithButtons.tsx
@@ -4,6 +4,10 @@ import { StyleSheet, View } from "react-native";
import { IOStyles } from "../../core";
import { BlockButtons, BlockButtonsProps } from "./BlockButtons";
+type Props = BlockButtonsProps & {
+ sticky?: boolean;
+};
+
// TODO: Refactor with an unique component like `FooterTopShadow` after bonus vacanze
const styles = StyleSheet.create({
container: {
@@ -11,7 +15,9 @@ const styles = StyleSheet.create({
width: "100%",
// This Magic number is an heritage of the app code-base, this component should be removed in favor of `GradientBottomAction`
marginTop: -50,
- paddingTop: 50,
+ paddingTop: 50
+ },
+ sticky: {
position: "absolute",
bottom: 0
}
@@ -21,15 +27,15 @@ const styles = StyleSheet.create({
* Implements a component that show buttons as sticky footer
* It can include 1, 2 or 3 buttons. If they are 2, they can have the inlineHalf or the inlineOneThird style
*/
-export const FooterWithButtons = (props: BlockButtonsProps) => (
+export const FooterWithButtons = ({ sticky = false, ...rest }: Props) => (
-
+
);