anatolykopyl/vue-three-d-mockup
1
0
Fork 0
mirror of https://github.com/anatolykopyl/vue-three-d-mockup.git synced 2026-03-26 12:55:08 +00:00
Code Issues Projects Releases Wiki Activity

deploy: 9eb59e2796

Browse Source
This commit is contained in:
anatolykopyl
2022-07-24 15:38:24 +00:00
parent 631c658874
commit 68e3e1608a
28 changed files with 74 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
guide/index.html
View File

@@ -5,11 +5,11 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Introduction | Vue 3D Mockup</title>
<meta name="description" content="📱 A 3D phone mockup component to showcase your apps">
<link rel="stylesheet" href="/vue-three-d-mockup/assets/style.94aee370.css">
<link rel="stylesheet" href="/vue-three-d-mockup/assets/style.4245d65e.css">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/chunks/Mockup.ce849057.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/chunks/screen.fc899083.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/app.06d4fed4.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/guide_index.md.ed4c9fae.lean.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/guide_index.md.fec8e219.lean.js">
<script>(()=>{const e=localStorage.getItem("vitepress-theme-appearance"),a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@@ -22,8 +22,8 @@
<span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">script</span><span style="color:#A6ACCD;"> </span><span style="color:#C792EA;">setup</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> Mockup </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-three-d-mockup</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">&lt;/</span><span style="color:#F07178;">script</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-79ca2460 data-v-04568844><div class="edit-info" data-v-04568844><!----><div class="last-updated" data-v-04568844><p class="VPLastUpdated" data-v-04568844 data-v-0ce8c960>Last updated: <time datatime="2022-07-24T15:28:09.000Z" data-v-0ce8c960></time></p></div></div><div class="prev-next" data-v-04568844><div class="pager" data-v-04568844><!----></div><div class="pager" data-v-04568844><a class="pager-link next" href="/vue-three-d-mockup/guide/screen-from-assets.html" data-v-04568844><span class="desc" data-v-04568844>Next page</span><span class="title" data-v-04568844>Screen from assets</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-6b5fd0a9 data-v-5b331722><div class="container" data-v-5b331722><p class="message" data-v-5b331722>Released under the GPL-3.0 license.</p><p class="copyright" data-v-5b331722></p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_index.md\":\"ed4c9fae\",\"guide_multiple-mockups.md\":\"92412f25\",\"guide_props.md\":\"4662ed06\",\"guide_screen-from-assets.md\":\"132f12ad\",\"guide_theming.md\":\"063681cb\",\"guide_video-as-screen.md\":\"26864a15\",\"index.md\":\"731a7e0e\"}")</script>
<span class="line"></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-79ca2460 data-v-04568844><div class="edit-info" data-v-04568844><!----><div class="last-updated" data-v-04568844><p class="VPLastUpdated" data-v-04568844 data-v-0ce8c960>Last updated: <time datatime="2022-07-24T15:37:46.000Z" data-v-0ce8c960></time></p></div></div><div class="prev-next" data-v-04568844><div class="pager" data-v-04568844><!----></div><div class="pager" data-v-04568844><a class="pager-link next" href="/vue-three-d-mockup/guide/screen-from-assets.html" data-v-04568844><span class="desc" data-v-04568844>Next page</span><span class="title" data-v-04568844>Screen from assets</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-6b5fd0a9 data-v-5b331722><div class="container" data-v-5b331722><p class="message" data-v-5b331722>Released under the GPL-3.0 license.</p><p class="copyright" data-v-5b331722></p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_index.md\":\"fec8e219\",\"guide_multiple-mockups.md\":\"bbf319eb\",\"guide_props.md\":\"3d12cef2\",\"guide_screen-from-assets.md\":\"d8d2acd1\",\"guide_theming.md\":\"139da6a3\",\"guide_video-as-screen.md\":\"a1b1b910\",\"index.md\":\"aa2f0de7\"}")</script>
<script type="module" async src="/vue-three-d-mockup/assets/app.06d4fed4.js"></script>
</body>

8
guide/multiple-mockups.html
View File

@@ -5,11 +5,11 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Multiple mockups | Vue 3D Mockup</title>
<meta name="description" content="📱 A 3D phone mockup component to showcase your apps">
<link rel="stylesheet" href="/vue-three-d-mockup/assets/style.94aee370.css">
<link rel="stylesheet" href="/vue-three-d-mockup/assets/style.4245d65e.css">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/chunks/Mockup.ce849057.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/chunks/screen.fc899083.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/app.06d4fed4.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/guide_multiple-mockups.md.92412f25.lean.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/guide_multiple-mockups.md.bbf319eb.lean.js">
<script>(()=>{const e=localStorage.getItem("vitepress-theme-appearance"),a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@@ -36,8 +36,8 @@
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> Mockup </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-three-d-mockup</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> screenImage </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./assets/screen.png</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">&lt;/</span><span style="color:#F07178;">script</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-79ca2460 data-v-04568844><div class="edit-info" data-v-04568844><!----><div class="last-updated" data-v-04568844><p class="VPLastUpdated" data-v-04568844 data-v-0ce8c960>Last updated: <time datatime="2022-07-24T15:28:09.000Z" data-v-0ce8c960></time></p></div></div><div class="prev-next" data-v-04568844><div class="pager" data-v-04568844><a class="pager-link prev" href="/vue-three-d-mockup/guide/video-as-screen.html" data-v-04568844><span class="desc" data-v-04568844>Previous page</span><span class="title" data-v-04568844>Video as screen</span></a></div><div class="has-prev pager" data-v-04568844><a class="pager-link next" href="/vue-three-d-mockup/guide/theming.html" data-v-04568844><span class="desc" data-v-04568844>Next page</span><span class="title" data-v-04568844>Theming</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-6b5fd0a9 data-v-5b331722><div class="container" data-v-5b331722><p class="message" data-v-5b331722>Released under the GPL-3.0 license.</p><p class="copyright" data-v-5b331722></p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_index.md\":\"ed4c9fae\",\"guide_multiple-mockups.md\":\"92412f25\",\"guide_props.md\":\"4662ed06\",\"guide_screen-from-assets.md\":\"132f12ad\",\"guide_theming.md\":\"063681cb\",\"guide_video-as-screen.md\":\"26864a15\",\"index.md\":\"731a7e0e\"}")</script>
<span class="line"></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-79ca2460 data-v-04568844><div class="edit-info" data-v-04568844><!----><div class="last-updated" data-v-04568844><p class="VPLastUpdated" data-v-04568844 data-v-0ce8c960>Last updated: <time datatime="2022-07-24T15:37:46.000Z" data-v-0ce8c960></time></p></div></div><div class="prev-next" data-v-04568844><div class="pager" data-v-04568844><a class="pager-link prev" href="/vue-three-d-mockup/guide/video-as-screen.html" data-v-04568844><span class="desc" data-v-04568844>Previous page</span><span class="title" data-v-04568844>Video as screen</span></a></div><div class="has-prev pager" data-v-04568844><a class="pager-link next" href="/vue-three-d-mockup/guide/theming.html" data-v-04568844><span class="desc" data-v-04568844>Next page</span><span class="title" data-v-04568844>Theming</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-6b5fd0a9 data-v-5b331722><div class="container" data-v-5b331722><p class="message" data-v-5b331722>Released under the GPL-3.0 license.</p><p class="copyright" data-v-5b331722></p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_index.md\":\"fec8e219\",\"guide_multiple-mockups.md\":\"bbf319eb\",\"guide_props.md\":\"3d12cef2\",\"guide_screen-from-assets.md\":\"d8d2acd1\",\"guide_theming.md\":\"139da6a3\",\"guide_video-as-screen.md\":\"a1b1b910\",\"index.md\":\"aa2f0de7\"}")</script>
<script type="module" async src="/vue-three-d-mockup/assets/app.06d4fed4.js"></script>
</body>

8
guide/props.html
View File

File diff suppressed because one or more lines are too long

8
guide/screen-from-assets.html
View File

@@ -5,9 +5,9 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Screen image from assets folder | Vue 3D Mockup</title>
<meta name="description" content="📱 A 3D phone mockup component to showcase your apps">
<link rel="stylesheet" href="/vue-three-d-mockup/assets/style.94aee370.css">
<link rel="stylesheet" href="/vue-three-d-mockup/assets/style.4245d65e.css">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/app.06d4fed4.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/guide_screen-from-assets.md.132f12ad.lean.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/guide_screen-from-assets.md.d8d2acd1.lean.js">
<script>(()=>{const e=localStorage.getItem("vitepress-theme-appearance"),a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@@ -27,8 +27,8 @@
<span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">script</span><span style="color:#A6ACCD;"> </span><span style="color:#C792EA;">setup</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#A6ACCD;"> Mockup </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-three-d-mockup</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">&lt;/</span><span style="color:#F07178;">script</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-79ca2460 data-v-04568844><div class="edit-info" data-v-04568844><!----><div class="last-updated" data-v-04568844><p class="VPLastUpdated" data-v-04568844 data-v-0ce8c960>Last updated: <time datatime="2022-07-24T15:28:09.000Z" data-v-0ce8c960></time></p></div></div><div class="prev-next" data-v-04568844><div class="pager" data-v-04568844><a class="pager-link prev" href="/vue-three-d-mockup/guide/" data-v-04568844><span class="desc" data-v-04568844>Previous page</span><span class="title" data-v-04568844>Introduction</span></a></div><div class="has-prev pager" data-v-04568844><a class="pager-link next" href="/vue-three-d-mockup/guide/video-as-screen.html" data-v-04568844><span class="desc" data-v-04568844>Next page</span><span class="title" data-v-04568844>Video as screen</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-6b5fd0a9 data-v-5b331722><div class="container" data-v-5b331722><p class="message" data-v-5b331722>Released under the GPL-3.0 license.</p><p class="copyright" data-v-5b331722></p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_index.md\":\"ed4c9fae\",\"guide_multiple-mockups.md\":\"92412f25\",\"guide_props.md\":\"4662ed06\",\"guide_screen-from-assets.md\":\"132f12ad\",\"guide_theming.md\":\"063681cb\",\"guide_video-as-screen.md\":\"26864a15\",\"index.md\":\"731a7e0e\"}")</script>
<span class="line"></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-79ca2460 data-v-04568844><div class="edit-info" data-v-04568844><!----><div class="last-updated" data-v-04568844><p class="VPLastUpdated" data-v-04568844 data-v-0ce8c960>Last updated: <time datatime="2022-07-24T15:37:46.000Z" data-v-0ce8c960></time></p></div></div><div class="prev-next" data-v-04568844><div class="pager" data-v-04568844><a class="pager-link prev" href="/vue-three-d-mockup/guide/" data-v-04568844><span class="desc" data-v-04568844>Previous page</span><span class="title" data-v-04568844>Introduction</span></a></div><div class="has-prev pager" data-v-04568844><a class="pager-link next" href="/vue-three-d-mockup/guide/video-as-screen.html" data-v-04568844><span class="desc" data-v-04568844>Next page</span><span class="title" data-v-04568844>Video as screen</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-6b5fd0a9 data-v-5b331722><div class="container" data-v-5b331722><p class="message" data-v-5b331722>Released under the GPL-3.0 license.</p><p class="copyright" data-v-5b331722></p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_index.md\":\"fec8e219\",\"guide_multiple-mockups.md\":\"bbf319eb\",\"guide_props.md\":\"3d12cef2\",\"guide_screen-from-assets.md\":\"d8d2acd1\",\"guide_theming.md\":\"139da6a3\",\"guide_video-as-screen.md\":\"a1b1b910\",\"index.md\":\"aa2f0de7\"}")</script>
<script type="module" async src="/vue-three-d-mockup/assets/app.06d4fed4.js"></script>
</body>

36
guide/theming.html
View File

File diff suppressed because one or more lines are too long

8
guide/video-as-screen.html
View File

@@ -5,10 +5,10 @@
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Video as screen | Vue 3D Mockup</title>
<meta name="description" content="📱 A 3D phone mockup component to showcase your apps">
<link rel="stylesheet" href="/vue-three-d-mockup/assets/style.94aee370.css">
<link rel="stylesheet" href="/vue-three-d-mockup/assets/style.4245d65e.css">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/chunks/Mockup.ce849057.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/app.06d4fed4.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/guide_video-as-screen.md.26864a15.lean.js">
<link rel="modulepreload" href="/vue-three-d-mockup/assets/guide_video-as-screen.md.a1b1b910.lean.js">
<script>(()=>{const e=localStorage.getItem("vitepress-theme-appearance"),a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
@@ -44,8 +44,8 @@
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> videoElement </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">ref</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">null</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> vidReady </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">ref</span><span style="color:#A6ACCD;">(</span><span style="color:#FF9CAC;">false</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">&lt;/</span><span style="color:#F07178;">script</span><span style="color:#89DDFF;">&gt;</span></span>
<span class="line"></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-79ca2460 data-v-04568844><div class="edit-info" data-v-04568844><!----><div class="last-updated" data-v-04568844><p class="VPLastUpdated" data-v-04568844 data-v-0ce8c960>Last updated: <time datatime="2022-07-24T15:28:09.000Z" data-v-0ce8c960></time></p></div></div><div class="prev-next" data-v-04568844><div class="pager" data-v-04568844><a class="pager-link prev" href="/vue-three-d-mockup/guide/screen-from-assets.html" data-v-04568844><span class="desc" data-v-04568844>Previous page</span><span class="title" data-v-04568844>Screen from assets</span></a></div><div class="has-prev pager" data-v-04568844><a class="pager-link next" href="/vue-three-d-mockup/guide/multiple-mockups.html" data-v-04568844><span class="desc" data-v-04568844>Next page</span><span class="title" data-v-04568844>Multiple mockups</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-6b5fd0a9 data-v-5b331722><div class="container" data-v-5b331722><p class="message" data-v-5b331722>Released under the GPL-3.0 license.</p><p class="copyright" data-v-5b331722></p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_index.md\":\"ed4c9fae\",\"guide_multiple-mockups.md\":\"92412f25\",\"guide_props.md\":\"4662ed06\",\"guide_screen-from-assets.md\":\"132f12ad\",\"guide_theming.md\":\"063681cb\",\"guide_video-as-screen.md\":\"26864a15\",\"index.md\":\"731a7e0e\"}")</script>
<span class="line"></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-79ca2460 data-v-04568844><div class="edit-info" data-v-04568844><!----><div class="last-updated" data-v-04568844><p class="VPLastUpdated" data-v-04568844 data-v-0ce8c960>Last updated: <time datatime="2022-07-24T15:37:46.000Z" data-v-0ce8c960></time></p></div></div><div class="prev-next" data-v-04568844><div class="pager" data-v-04568844><a class="pager-link prev" href="/vue-three-d-mockup/guide/screen-from-assets.html" data-v-04568844><span class="desc" data-v-04568844>Previous page</span><span class="title" data-v-04568844>Screen from assets</span></a></div><div class="has-prev pager" data-v-04568844><a class="pager-link next" href="/vue-three-d-mockup/guide/multiple-mockups.html" data-v-04568844><span class="desc" data-v-04568844>Next page</span><span class="title" data-v-04568844>Multiple mockups</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-6b5fd0a9 data-v-5b331722><div class="container" data-v-5b331722><p class="message" data-v-5b331722>Released under the GPL-3.0 license.</p><p class="copyright" data-v-5b331722></p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_index.md\":\"fec8e219\",\"guide_multiple-mockups.md\":\"bbf319eb\",\"guide_props.md\":\"3d12cef2\",\"guide_screen-from-assets.md\":\"d8d2acd1\",\"guide_theming.md\":\"139da6a3\",\"guide_video-as-screen.md\":\"a1b1b910\",\"index.md\":\"aa2f0de7\"}")</script>
<script type="module" async src="/vue-three-d-mockup/assets/app.06d4fed4.js"></script>
</body>