-
+ {/* */}
+
+ );
+}
+
+
+export function OpenAISVG(){
+ return
+}
+
+export function OpenAIBadge(){
+ return
In Partnership With
+}
+
+function PriceBadge({isPro}){
+ const color = isPro ? '#4527fd' : '#00ffbf'
+ return
+ {isPro ? 'Paid' : 'Free'} Course
+
+}
+
+
+function Lessons({isPro, percent, count}){
+ const color = '#ffc081'
+ return
+
{isPro ? 'Advanced' : 'Beginner'}
+
+
{count} Lessons
+
+}
diff --git a/src/theme/DocItem/Footer/course.module.css b/src/theme/DocItem/Footer/course.module.css
new file mode 100644
index 00000000000..a6e6fea66e8
--- /dev/null
+++ b/src/theme/DocItem/Footer/course.module.css
@@ -0,0 +1,49 @@
+.card {
+ all: unset;
+ cursor: pointer;
+ border: 1px solid #292b36;
+ border-radius: 10px;
+ flex-direction: column;
+ flex: 1;
+ display: flex;
+ overflow: hidden;
+ transition: .1s;
+}
+
+.img {
+ width: 100%;
+ height: 100%;
+ height: 20rem;
+ object-fit: cover;
+ border-radius: 5px;
+}
+
+.card:hover{
+ text-decoration: none;
+ scale: 1.01;
+}
+
+.card_content {
+ padding: 36px;
+ max-height: 300px;
+}
+
+
+.badge {
+ background: #00ffbf;
+ display: flex;
+ justify-content: flex-start;
+ gap: 8px;
+ align-items: center;
+ text-align: center;
+ padding: 12px 26px;
+ border-radius: 80px;
+ width: fit-content;
+ min-width: 342px;
+}
+
+.openAI {
+ height: 22px;
+ color: black;
+}
+
diff --git a/src/theme/DocItem/Footer/index.js b/src/theme/DocItem/Footer/index.js
index fa35dcd823d..739507a010e 100644
--- a/src/theme/DocItem/Footer/index.js
+++ b/src/theme/DocItem/Footer/index.js
@@ -6,6 +6,33 @@ import LastUpdated from "@theme/LastUpdated";
import EditThisPage from "@theme/EditThisPage";
import TagsListInline from "@theme/TagsListInline";
import styles from "./styles.module.css";
+import Course from './course';
+import SignUp from './signup';
+
+const courses = [{
+ name: 'ChatGPT for Everyone',
+ desc: "Learn about ChatGPT, one of the most advanced AI systems available today, and dive into the world of Generative AI.",
+ special: true,
+ isPro: false,
+ percent: 30,
+ count: 15,
+ url: 'https://learn-prompting.webflow.io/course-chat-gpt-for-everyone',
+ src: "https://assets-global.website-files.com/655b6730173650f3f66a0f98/655b6c0666126b34d261c42f_ChatGPT%20for%20Everyone%20-%20Course%20Page.png",
+ srcset: "",
+},
+{
+ name: 'Intro to Prompt Engineering',
+ desc: 'Learn about the basics of Prompt Engineering, and how to effectively communicate with AI.',
+ isPro: true,
+ percent: 30,
+ count: 12,
+ url: 'https://learn-prompting.webflow.io/courses/intro-to-prompt-engineering',
+ src: "https://assets-global.website-files.com/655b6730173650f3f66a0f98/655e35962450a3b5e5be1276_A%20blue%20and%20pink%20abstract%20background.jpg",
+ srcset: "",
+},
+]
+
+
function TagsRow(props) {
return (
@@ -45,8 +72,12 @@ function EditMetaRow({
);
}
+const securityWords = ['hack', 'security', 'inject', 'safety']
+
export default function DocItemFooter() {
- const { metadata } = useDoc();
+ const { metadata, ...rest } = useDoc();
+ console.log( metadata.description, rest.toc.map(t => t.value))
+ const isSecurity = [...rest.toc.map(t => t?.value || ''), metadata.description].some(t => securityWords.some(w => t.toLowerCase().includes(w)))
const {
editUrl,
lastUpdatedAt,
@@ -64,6 +95,16 @@ export default function DocItemFooter() {
);
-}
\ No newline at end of file
+}
diff --git a/src/theme/DocItem/Footer/signup.js b/src/theme/DocItem/Footer/signup.js
new file mode 100644
index 00000000000..6c9b943729a
--- /dev/null
+++ b/src/theme/DocItem/Footer/signup.js
@@ -0,0 +1,63 @@
+import React from 'react';
+import { FaBusinessTime, FaCertificate, FaList, FaQuestionCircle } from "react-icons/fa";
+import classes from './signup.module.css';
+
+export default function SignUp() {
+ return (
+
+
+
+
+
+
+
+ Don't get left behind on AI
+
+
+ Sign up and get the latest AI news, prompts, and tools.
+
+
+
+ Join 30,000+ readers from companies like OpenAI, Microsoft,
+ Google, Meta and more!
+
+
+
+
+ );
+}
diff --git a/src/theme/DocItem/Footer/signup.module.css b/src/theme/DocItem/Footer/signup.module.css
new file mode 100644
index 00000000000..c7784f71133
--- /dev/null
+++ b/src/theme/DocItem/Footer/signup.module.css
@@ -0,0 +1,35 @@
+.main {
+ margin-bottom: 40px;
+}
+
+.cols {
+ display: flex;
+}
+
+@media screen and (max-width: 1439px) {
+ .cols {
+ flex-direction: column-reverse;
+ gap: 10px;
+ }
+}
+
+
+.links {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+ font-weight: bold;
+ font-size: 15px;
+}
+
+.links > div {
+ display: flex;
+ align-items: center;
+ gap: 6px;
+}
+
+.email {
+ width: 100%;
+}
+
diff --git a/src/theme/DocItem/Footer/styles.module.css b/src/theme/DocItem/Footer/styles.module.css
index 7c1e9644191..10c6c351516 100644
--- a/src/theme/DocItem/Footer/styles.module.css
+++ b/src/theme/DocItem/Footer/styles.module.css
@@ -9,3 +9,17 @@
text-align: right;
}
}
+
+.courses {
+ display: flex;
+ gap: 24px;
+ justify-content: space-between;
+ width: 100%;
+}
+
+
+@media screen and (max-width: 1400px) {
+ .courses {
+ flex-direction: column;
+ }
+}
diff --git a/src/theme/NavbarItem/ComponentTypes.js b/src/theme/NavbarItem/ComponentTypes.js
index a90a69a7b36..497ded26c6d 100644
--- a/src/theme/NavbarItem/ComponentTypes.js
+++ b/src/theme/NavbarItem/ComponentTypes.js
@@ -10,4 +10,5 @@ function MyAwesomeNavbarItemForDocs(props) {
export default {
...ComponentTypes,
'custom-myAwesomeNavbarItem': MyAwesomeNavbarItemForDocs,
-};
\ No newline at end of file
+
+};