datastake-daf 0.6.97 → 0.6.98

package/src/@daf/core/components/Footer/style.js

@@ -0,0 +1,176 @@
+import styled from "styled-components";
+
+export const FooterContainer = styled.div`
+	.daf-footer {
+		background: #ffffff;
+		border-top: 1px solid #e8e8e8;
+		border-left: none;
+		border-right: none;
+		border-bottom: none;
+		border-radius: 0;
+		padding: 24px;
+		margin: 0;
+		box-shadow: none;
+		z-index: 100;
+		position: relative;
+		min-height: 80px;
+
+		&.daf-footer-fixed {
+			position: fixed;
+			bottom: 0;
+			left: 0;
+			right: 0;
+			z-index: 1000;
+		}
+
+		.daf-footer-content {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			width: 100%;
+			min-height: 32px;
+
+			.daf-footer-left {
+				flex: 1;
+				display: flex;
+				align-items: center;
+				justify-content: flex-start;
+			}
+
+			.daf-footer-center {
+				flex: 1;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+			}
+
+			.daf-footer-right {
+				flex: 1;
+				display: flex;
+				align-items: center;
+				justify-content: flex-end;
+				gap: 12px;
+
+				.daf-footer-actions {
+					.ant-btn {
+						height: 40px;
+						padding: 0 24px;
+						border-radius: 6px;
+						font-weight: 500;
+						font-size: 14px;
+						transition: all 0.3s ease;
+						border: 1px solid transparent;
+
+						&.ant-btn-primary {
+							background-color: var(--color-primary-70);
+							color: #ffffff;
+							border-color: var(--color-primary-70);
+
+							&:hover {
+								background-color: var(--color-primary-60);
+								border-color: var(--color-primary-60);
+							}
+
+							&:active {
+								background-color: var(--color-primary-80);
+								border-color: var(--color-primary-80);
+							}
+
+							&:disabled {
+								background-color: #f5f5f5;
+								color: #bfbfbf;
+								border-color: #d9d9d9;
+							}
+						}
+
+						&.ant-btn-default {
+							background: #ffffff;
+							color: #666666;
+							border-color: #d9d9d9;
+
+							&:hover {
+								border-color: var(--color-primary-70);
+								color: var(--color-primary-70);
+							}
+
+							&:active {
+								border-color: var(--color-primary-80);
+								color: var(--color-primary-80);
+							}
+
+							&:disabled {
+								background-color: #f5f5f5;
+								color: #bfbfbf;
+								border-color: #d9d9d9;
+							}
+						}
+
+						&.ant-btn-ghost {
+							background: transparent;
+							color: #666666;
+							border-color: #d9d9d9;
+
+							&:hover {
+								border-color: var(--color-primary-70);
+								color: var(--color-primary-70);
+								background: rgba(0, 0, 0, 0.02);
+							}
+
+							&:active {
+								border-color: var(--color-primary-80);
+								color: var(--color-primary-80);
+							}
+
+							&:disabled {
+								color: #bfbfbf;
+								border-color: #d9d9d9;
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+
+	/* Responsive design */
+	@media (max-width: 768px) {
+		.daf-footer {
+			margin: 0;
+			padding: 16px;
+
+			.daf-footer-content {
+				flex-direction: column;
+				gap: 16px;
+				align-items: stretch;
+
+				.daf-footer-left,
+				.daf-footer-center,
+				.daf-footer-right {
+					flex: none;
+					justify-content: center;
+				}
+
+				.daf-footer-right {
+					.daf-footer-actions {
+						justify-content: center;
+					}
+				}
+			}
+		}
+	}
+
+	/* App-specific styling */
+	&.sbg-app {
+		.daf-footer {
+			background: #f8f9fa;
+			border-color: #e9ecef;
+		}
+	}
+
+	&.nashiriki-app {
+		.daf-footer {
+			background: #fff;
+			border-color: #d9d9d9;
+		}
+	}
+`;

package/src/index.js

@@ -47,6 +47,9 @@ export { default as TabsHeader } from "./@daf/core/components/Header/TabsHeader/
 export { default as ModalHeader } from "./@daf/core/components/Header/ModalHeader/index.jsx";
 export { default as DrawerHeader } from "./@daf/core/components/Header/DrawerHeader/index.jsx";
 
+// Footer
+export { default as Footer } from "./@daf/core/components/Footer/index.jsx";
+
 //* ------------------------------ Dashboard ------------------------------
 export { default as PdfView } from "./@daf/core/components/Dashboard/PdfView/index.jsx";
 export { default as PdfForm } from "./@daf/core/components/PdfForm/index.js";

package/src/styles/_index.scss

@@ -6,7 +6,7 @@
 @import "./layout/index";
 @import "./pages/index";
 @import "./xyflow.scss";
-/* @import "./datastake.scss"; */
+@import "./datastake.scss";
 // form classes
 
 .max-char-cont {