+ {loading && (
+
+ );
+};
+
+export default Button;
\ No newline at end of file
diff --git a/apps/doc/src/components/DashboardTitle/index.tsx b/apps/doc/src/components/DashboardTitle/index.tsx
new file mode 100644
index 0000000..a96c675
--- /dev/null
+++ b/apps/doc/src/components/DashboardTitle/index.tsx
@@ -0,0 +1,21 @@
+import React from 'react';
+import clsx from "clsx";
+
+import styles from './styles.module.css';
+
+export default function DashboardTitle() {
+ return (
+ <>
+
+ Welcome to the
+
+
STARK Way of Building
+ + ++ Starknet uses the Cairo programming language both for its infrastructure and for writing Starknet + contracts. L2 <--> L1 messaging infrastructure is available and contracts are fully composable. +
+ + ) +} diff --git a/apps/doc/src/components/DashboardTitle/styles.module.css b/apps/doc/src/components/DashboardTitle/styles.module.css new file mode 100644 index 0000000..b7faba7 --- /dev/null +++ b/apps/doc/src/components/DashboardTitle/styles.module.css @@ -0,0 +1,10 @@ +.title { + font-weight: 700; + font-size: 48px; + line-height: 130%; + margin-top: 10px !important; +} + +.orangeTitle { + color: #EF740E; +} diff --git a/apps/doc/src/components/HomepageFeatures/index.tsx b/apps/doc/src/components/HomepageFeatures/index.tsx new file mode 100644 index 0000000..fac298d --- /dev/null +++ b/apps/doc/src/components/HomepageFeatures/index.tsx @@ -0,0 +1,118 @@ +import React from 'react'; +import Link from '@docusaurus/Link'; +import clsx from 'clsx'; +import styles from './styles.module.css'; + +type FeatureItem = { + title: string; + imgUrl: string; + description: JSX.Element; +}; + +const FeatureList: FeatureItem[] = [ + { + title: 'Account Abstraction', + imgUrl: require('@site/static/img/home_feature_item1.png').default, + description: ( + <> + Introduce you to account abstraction on Starknet. + + ), + }, + { + title: 'Cairo Lang', + imgUrl: require('@site/static/img/home_feature_item2.png').default, + description: ( + <> + Teach you to write a NFT contract in cairo. + + ), + }, + { + title: 'Starknet Dapp', + imgUrl: require('@site/static/img/home_feature_item3.png').default, + description: ( + <> + Build a simple NFT minting Dapp on Starknet. + + ), + }, +]; + + +function Feature({title, imgUrl, description}: FeatureItem) { + return ( +
+ 
+
+ );
+}
+
+export default function HomepageFeatures(): JSX.Element {
+ return (
+
+ {title}
+{description}
+
+
+
+
+
+
+ Say hi to Starknet 🤟
+Starknet is a permissionless decentralized Validity-Rollup (often referred to as ZK-Rollup). It operates as an L2 network over Ethereum, enabling any dApp to achieve unlimited scale for its computation – without compromising Ethereum's composability and security.
+ + https://starknet.io +What will you learn from this tutorial
+
+ {FeatureList.map((props, idx) => (
+
+
+ Go to tutorial
+
+
+
+
+
+ {done ? (
+ 
+ ) : (
+
+ );
+};
+
+export default LazyloadImage;
diff --git a/apps/doc/src/components/Modal/index.module.css b/apps/doc/src/components/Modal/index.module.css
new file mode 100644
index 0000000..9d708a5
--- /dev/null
+++ b/apps/doc/src/components/Modal/index.module.css
@@ -0,0 +1,60 @@
+/**
+ * CSS files with the .module.css suffix will be treated as CSS modules
+ * and scoped locally.
+ */
+
+.modal {
+ pointer-events: none;
+ visibility: hidden;
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ opacity: 0;
+ z-index: 999;
+ background: rgba(0, 0, 0, 0.5);
+ transition-duration: .2s;
+ transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+ transition-property: transform, opacity, visibility;
+ overflow-y: hidden;
+ overscroll-behavior: contain;
+}
+
+.modal_box {
+ box-sizing: border-box;
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ overflow: hidden;
+ padding: 48px 20px;
+ gap: 40px;
+ isolation: isolate;
+ max-height: calc(100vh - 5em);
+ max-width: 32rem;
+ background: #FFFFFF;
+ border: 0.5px solid #CECECE;
+ box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.2);
+ border-radius: 6px;
+}
+
+.modal_show {
+ pointer-events: auto;
+ visibility: visible;
+ opacity: 1;
+}
+
+.modal_close_btn {
+ position: absolute;
+ padding: 10px;
+ right: 10px;
+ top: 10px;
+ outline: none;
+ border: none;
+ cursor: pointer;
+ background: none;
+}
\ No newline at end of file
diff --git a/apps/doc/src/components/Modal/index.tsx b/apps/doc/src/components/Modal/index.tsx
new file mode 100644
index 0000000..5fddd73
--- /dev/null
+++ b/apps/doc/src/components/Modal/index.tsx
@@ -0,0 +1,43 @@
+import clsx from "clsx";
+import React, { ReactNode } from "react";
+import styles from "./index.module.css";
+
+type ModalProps = {
+ open?: boolean;
+ onClose?: () => void;
+ children?: ReactNode;
+};
+
+export default function Modal(props: ModalProps): JSX.Element {
+ const { children, open = false, onClose } = props;
+ return (
+
+
+ )}
+
+
+ );
+}
+
+function CloseSvg() {
+ return (
+
+ );
+}
diff --git a/apps/doc/src/constants/base.ts b/apps/doc/src/constants/base.ts
new file mode 100644
index 0000000..e69de29
diff --git a/apps/doc/src/contexts/GlobalContext.ts b/apps/doc/src/contexts/GlobalContext.ts
new file mode 100644
index 0000000..d5f8f84
--- /dev/null
+++ b/apps/doc/src/contexts/GlobalContext.ts
@@ -0,0 +1,8 @@
+import React from "react";
+
+interface State {
+ uid?: string;
+ setUid?: (uid: string) => void;
+}
+
+export default React.createContext
+
+ {children}
+
+
+
+
+
+
+
+ {siteConfig.title}
+{siteConfig.tagline}
+
+
+ Starknet Tutorials
+
+
+