Patch 13

lunatic-fox · Apr 25, 2024 · 8100618 · 8100618
1 parent 903e0f6
commit 8100618
Show file tree

Hide file tree

Showing 4 changed files with 56 additions and 11 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -9,6 +9,7 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@devapix/react": "^0.0.3",
     "highlight.js": "^11.9.0",
     "kolorz": "^0.0.1",
     "next": "14.1.0",

diff --git a/src/app/docs/pages/waysofuse/devapixreact/page.tsx b/src/app/docs/pages/waysofuse/devapixreact/page.tsx
@@ -1,8 +1,13 @@
 import Code from '@/app/components/Code'
 import Docs from '@/app/docs/components/Docs'
 import ReqResExample from '@/app/docs/components/ReqResExample'
-import Image from 'next/image'
 import responseStyle from '@/app/docs/components/ReqResExample/index.module.css'
+import {
+  DeviconJavascript,
+  DeviconTypescript,
+  DeviconPython,
+  DeviconVscode
+} from '@devapix/react'
 
 export default function Page() {
   return (
@@ -56,7 +61,17 @@ export default function Page() {
       </p>
       <Code
         h='ts'
-        c={`import { DeviconPhotoshop } from '@devapix/react'`} />
+        c={`
+          import { DeviconPhotoshop } from '@devapix/react'
+
+          export default function Page() {
+            return (
+              <section>
+                <DeviconPhotoshop/>
+              </section>
+            )
+          }
+        `} />
       <p>
         This is equivalent to the latest release of <Code ic='photoshop' /> icon.
       </p>
@@ -68,7 +83,17 @@ export default function Page() {
       </p>
       <Code
         h='ts'
-        c={`import { DeviconPhotoshop } from '@devapix/react/2.15.1'`} />
+        c={`
+          import { DeviconPhotoshop } from '@devapix/react/2.15.1'
+          
+          export default function Page() {
+            return (
+              <section>
+                <DeviconPhotoshop/>
+              </section>
+            )
+          }
+        `} />
       <p>
         Is equivalent to <Code ic='photoshop' /> icon of <Code ic='2.15.1' /> release.
       </p>
@@ -94,7 +119,7 @@ export default function Page() {
           | 'lw' | 'line-wordmark'
         color: string
         theme: 'd' | 'dark' | 'l' | 'light'
-        size: number
+        size: number // default: 128
       `} />
       <p>
         Here we have more examples using the rest of properties.
@@ -123,11 +148,24 @@ export default function Page() {
         }
         `} />
 
-      <section className={responseStyle.reqResImgWrapper} style={{display: 'flex', alignItems: 'center'}}>
-        <Image src='https://devapix.vercel.app/api?js&t=l&s=80' width={80} height={80} alt='i' />
-        <Image src='https://devapix.vercel.app/api?ts&t=d' width={64} height={64} alt='i' />
-        <Image src='https://devapix.vercel.app/api?python&c=008004' width={64} height={64} alt='i' />
-        <Image src='https://devapix.vercel.app/api?vscode&v=ow&c=ff5300&s=80' width={80} height={80} alt='i' />
+      <h5>Requests</h5>
+      <Code c={`
+        https://devapix.vercel.app/api?javascript&t=l&s=80
+        https://devapix.vercel.app/api?typescript&t=d
+        https://devapix.vercel.app/api?python&c=008004
+        https://devapix.vercel.app/api?vscode&v=ow&c=ff5300&s=80
+      `}/>
+
+      <h5>Response</h5>
+      <section className={responseStyle.reqResImgWrapper} style={{
+        display: 'flex',
+        flexWrap: 'wrap',
+        alignItems: 'center'
+      }}>
+        <DeviconJavascript theme='light' size={80}/>
+        <DeviconTypescript theme='dark'/>
+        <DeviconPython color='#008004'/>
+        <DeviconVscode version='ow' color='#ff5300' size={80}/>
       </section>
       <hr />
 

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -51,7 +51,7 @@ export default function Home() {
           </section>
         </Link>
 
-        <Link href='#'>
+        {/* <Link href='#'>
           <section className={styles.card}>
           <section className={styles.underConstruction}>
           <Image
@@ -74,7 +74,7 @@ export default function Home() {
               </p>
             </article>
           </section>
-        </Link>
+        </Link> */}
 
       </section>
     </main>