Commit latest presentation

This commit is contained in:
Xevion
2022-04-06 01:44:28 -05:00
parent 7434ea9934
commit 6a1943c372
18 changed files with 416 additions and 69 deletions

17
dist/404.html vendored
View File

@@ -1,17 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="https://cdn.jsdelivr.net/gh/slidevjs/slidev/assets/favicon.png">
<script type="module" crossorigin src="/assets/index.4aca3c25.js"></script>
<link rel="stylesheet" href="/assets/index.57362d64.css">
</head>
<body>
<div id="app"></div>
</body>
</html>

1
dist/_redirects vendored
View File

@@ -1 +0,0 @@
/* /index.html 200

View File

File diff suppressed because one or more lines are too long

View File

@@ -1 +0,0 @@
import{d as t,C as s,D as l,r as c,E as r,A as n,G as u,H as i,I as m,o as p,c as f}from"./index.4aca3c25.js";const g=t({setup(d){const o=s(l),e=c();return r(()=>{n.mount(e.value,e.value.parentElement),u(o,a=>n.options.coordinateScale=1/a,{immediate:!0}),i()}),m(()=>{n.unmount()}),(a,v)=>(p(),f("svg",{ref_key:"svg",ref:e,class:"w-full h-full absolute top-0 pointer-events-none"},null,512))}});export{g as default};

View File

@@ -1 +0,0 @@
function g(s,y){return y.forEach(function(c){c&&typeof c!="string"&&!Array.isArray(c)&&Object.keys(c).forEach(function(r){if(r!=="default"&&!(r in s)){var l=Object.getOwnPropertyDescriptor(c,r);Object.defineProperty(s,r,l.get?l:{enumerable:!0,get:function(){return c[r]}})}})}),Object.freeze(Object.defineProperty(s,Symbol.toStringTag,{value:"Module"}))}var f=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},m={exports:{}};(function(s,y){(function(c,r){r()})(f,function(){function c(e,t){return typeof t=="undefined"?t={autoBom:!1}:typeof t!="object"&&(console.warn("Deprecated: Expected third argument to be a object"),t={autoBom:!t}),t.autoBom&&/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(e.type)?new Blob(["\uFEFF",e],{type:e.type}):e}function r(e,t,i){var n=new XMLHttpRequest;n.open("GET",e),n.responseType="blob",n.onload=function(){p(n.response,t,i)},n.onerror=function(){console.error("could not download file")},n.send()}function l(e){var t=new XMLHttpRequest;t.open("HEAD",e,!1);try{t.send()}catch{}return 200<=t.status&&299>=t.status}function d(e){try{e.dispatchEvent(new MouseEvent("click"))}catch{var t=document.createEvent("MouseEvents");t.initMouseEvent("click",!0,!0,window,0,0,0,80,20,!1,!1,!1,!1,0,null),e.dispatchEvent(t)}}var a=typeof window=="object"&&window.window===window?window:typeof self=="object"&&self.self===self?self:typeof f=="object"&&f.global===f?f:void 0,b=a.navigator&&/Macintosh/.test(navigator.userAgent)&&/AppleWebKit/.test(navigator.userAgent)&&!/Safari/.test(navigator.userAgent),p=a.saveAs||(typeof window!="object"||window!==a?function(){}:"download"in HTMLAnchorElement.prototype&&!b?function(e,t,i){var n=a.URL||a.webkitURL,o=document.createElement("a");t=t||e.name||"download",o.download=t,o.rel="noopener",typeof e=="string"?(o.href=e,o.origin===location.origin?d(o):l(o.href)?r(e,t,i):d(o,o.target="_blank")):(o.href=n.createObjectURL(e),setTimeout(function(){n.revokeObjectURL(o.href)},4e4),setTimeout(function(){d(o)},0))}:"msSaveOrOpenBlob"in navigator?function(e,t,i){if(t=t||e.name||"download",typeof e!="string")navigator.msSaveOrOpenBlob(c(e,i),t);else if(l(e))r(e,t,i);else{var n=document.createElement("a");n.href=e,n.target="_blank",setTimeout(function(){d(n)})}}:function(e,t,i,n){if(n=n||open("","_blank"),n&&(n.document.title=n.document.body.innerText="downloading..."),typeof e=="string")return r(e,t,i);var o=e.type==="application/octet-stream",E=/constructor/i.test(a.HTMLElement)||a.safari,h=/CriOS\/[\d]+/.test(navigator.userAgent);if((h||o&&E||b)&&typeof FileReader!="undefined"){var v=new FileReader;v.onloadend=function(){var u=v.result;u=h?u:u.replace(/^data:[^;]*;/,"data:attachment/file;"),n?n.location.href=u:location=u,n=null},v.readAsDataURL(e)}else{var j=a.URL||a.webkitURL,w=j.createObjectURL(e);n?n.location=w:location.href=w,n=null,setTimeout(function(){j.revokeObjectURL(w)},4e4)}});a.saveAs=p.saveAs=p,s.exports=p})})(m);var O=m.exports,A=g({__proto__:null,default:O},[m.exports]);export{A as F};

View File

File diff suppressed because one or more lines are too long

View File

Binary file not shown.

Before

Width:  |  Height:  |  Size: 120 KiB

View File

Binary file not shown.

Before

Width:  |  Height:  |  Size: 92 KiB

View File

@@ -5,8 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="https://cdn.jsdelivr.net/gh/slidevjs/slidev/assets/favicon.png">
<script type="module" crossorigin src="/assets/index.4aca3c25.js"></script>
<link rel="stylesheet" href="/assets/index.57362d64.css">
<script type="module" crossorigin src="/assets/index.b5f88166.js"></script>
<link rel="stylesheet" href="/assets/index.c08c73ae.css">
</head>
<body>
<div id="app"></div>

View File

@@ -1 +0,0 @@
elect.xevion.dev

View File

File diff suppressed because one or more lines are too long

View File

@@ -1 +1 @@
import{d as t,C as s,D as l,r as c,E as r,A as n,G as u,H as i,I as m,o as p,c as f}from"./index.4aca3c25.js";const g=t({setup(d){const o=s(l),e=c();return r(()=>{n.mount(e.value,e.value.parentElement),u(o,a=>n.options.coordinateScale=1/a,{immediate:!0}),i()}),m(()=>{n.unmount()}),(a,v)=>(p(),f("svg",{ref_key:"svg",ref:e,class:"w-full h-full absolute top-0 pointer-events-none"},null,512))}});export{g as default};
import{d as t,C as s,D as l,r as c,E as r,A as n,G as u,H as i,I as m,o as p,c as f}from"./index.b5f88166.js";const g=t({setup(d){const o=s(l),e=c();return r(()=>{n.mount(e.value,e.value.parentElement),u(o,a=>n.options.coordinateScale=1/a,{immediate:!0}),i()}),m(()=>{n.unmount()}),(a,v)=>(p(),f("svg",{ref_key:"svg",ref:e,class:"w-full h-full absolute top-0 pointer-events-none"},null,512))}});export{g as default};

View File

File diff suppressed because one or more lines are too long

View File

File diff suppressed because one or more lines are too long

View File

File diff suppressed because one or more lines are too long

View File

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,376 @@
---
# try also 'default' to start simple
theme: unicorn
# random image from a curated Unsplash collection by Anthony
# like them? see https://unsplash.com/collections/94734566/slidev
background: https://source.unsplash.com/collection/94734566/1920x1080
# apply any windi css classes to the current slide
class: 'text-center'
# https://sli.dev/custom/highlighters.html
highlighter: shiki
# show line numbers in code blocks
lineNumbers: false
# some information about the slides, markdown enabled
persist: false
---
# Welcome to Slidev
Presentation slides for developers
<div class="pt-12">
<span @click="$slidev.nav.next" class="px-2 py-1 rounded cursor-pointer" hover="bg-white bg-opacity-10">
Press Space for next page <carbon:arrow-right class="inline"/>
</span>
</div>
<div class="abs-br m-6 flex gap-2">
<button @click="$slidev.nav.openInEditor()" title="Open in Editor" class="text-xl icon-btn opacity-50 !border-none !hover:text-white">
<carbon:edit />
</button>
<a href="https://github.com/slidevjs/slidev" target="_blank" alt="GitHub"
class="text-xl icon-btn opacity-50 !border-none !hover:text-white">
<carbon-logo-github />
</a>
</div>
<!--
The last comment block of each slide will be treated as slide notes. It will be visible and editable in Presenter Mode along with the slide. [Read more in the docs](https://sli.dev/guide/syntax.html#notes)
-->
---
# What is Slidev?
Slidev is a slides maker and presenter designed for developers, consist of the following features
- 📝 **Text-based** - focus on the content with Markdown, and then style them later
- 🎨 **Themable** - theme can be shared and used with npm packages
- 🧑‍💻 **Developer Friendly** - code highlighting, live coding with autocompletion
- 🤹 **Interactive** - embedding Vue components to enhance your expressions
- 🎥 **Recording** - built-in recording and camera view
- 📤 **Portable** - export into PDF, PNGs, or even a hostable SPA
- 🛠 **Hackable** - anything possible on a webpage
<br>
<br>
Read more about [Why Slidev?](https://sli.dev/guide/why)
<!--
You can have `style` tag in markdown to override the style for the current page.
Learn more: https://sli.dev/guide/syntax#embedded-styles
-->
<style>
h1 {
background-color: #2B90B6;
background-image: linear-gradient(45deg, #4EC5D4 10%, #146b8c 20%);
background-size: 100%;
-webkit-background-clip: text;
-moz-background-clip: text;
-webkit-text-fill-color: transparent;
-moz-text-fill-color: transparent;
}
</style>
---
# Navigation
Hover on the bottom-left corner to see the navigation's controls panel, [learn more](https://sli.dev/guide/navigation.html)
### Keyboard Shortcuts
| | |
| --- | --- |
| <kbd>right</kbd> / <kbd>space</kbd>| next animation or slide |
| <kbd>left</kbd> / <kbd>shift</kbd><kbd>space</kbd> | previous animation or slide |
| <kbd>up</kbd> | previous slide |
| <kbd>down</kbd> | next slide |
<!-- https://sli.dev/guide/animations.html#click-animations -->
<img
v-click
class="absolute -bottom-9 -left-7 w-80 opacity-50"
src="https://sli.dev/assets/arrow-bottom-left.svg"
/>
<p v-after class="absolute bottom-23 left-45 opacity-30 transform -rotate-10">Here!</p>
---
layout: image-right
image: https://source.unsplash.com/collection/94734566/1920x1080
---
# Code
Use code snippets and get the highlighting directly![^1]
```ts {all|2|1-6|9|all}
interface User {
id: number
firstName: string
lastName: string
role: string
}
function updateUser(id: number, update: User) {
const user = getUser(id)
const newUser = { ...user, ...update }
saveUser(id, newUser)
}
```
<arrow v-click="3" x1="400" y1="420" x2="230" y2="330" color="#564" width="3" arrowSize="1" />
[^1]: [Learn More](https://sli.dev/guide/syntax.html#line-highlighting)
<style>
.footnotes-sep {
@apply mt-20 opacity-10;
}
.footnotes {
@apply text-sm opacity-75;
}
.footnote-backref {
display: none;
}
</style>
---
# Components
<div grid="~ cols-2 gap-4">
<div>
You can use Vue components directly inside your slides.
We have provided a few built-in components like `<Tweet/>` and `<Youtube/>` that you can use directly. And adding your custom components is also super easy.
```html
<Counter :count="10" />
```
<!-- ./components/Counter.vue -->
<Counter :count="10" m="t-4" />
Check out [the guides](https://sli.dev/builtin/components.html) for more.
</div>
<div>
```html
<Tweet id="1390115482657726468" />
```
<Tweet id="1390115482657726468" scale="0.65" />
</div>
</div>
---
class: px-20
---
# Themes
Slidev comes with powerful theming support. Themes can provide styles, layouts, components, or even configurations for tools. Switching between themes by just **one edit** in your frontmatter:
<div grid="~ cols-2 gap-2" m="-t-2">
```yaml
---
theme: default
---
```
```yaml
---
theme: seriph
---
```
<img border="rounded" src="https://github.com/slidevjs/themes/blob/main/screenshots/theme-default/01.png?raw=true">
<img border="rounded" src="https://github.com/slidevjs/themes/blob/main/screenshots/theme-seriph/01.png?raw=true">
</div>
Read more about [How to use a theme](https://sli.dev/themes/use.html) and
check out the [Awesome Themes Gallery](https://sli.dev/themes/gallery.html).
---
preload: false
---
# Animations
Animations are powered by [@vueuse/motion](https://motion.vueuse.org/).
```html
<div
v-motion
:initial="{ x: -80 }"
:enter="{ x: 0 }">
Slidev
</div>
```
<div class="w-60 relative mt-6">
<div class="relative w-40 h-40">
<img
v-motion
:initial="{ x: 800, y: -100, scale: 1.5, rotate: -50 }"
:enter="final"
class="absolute top-0 left-0 right-0 bottom-0"
src="https://sli.dev/logo-square.png"
/>
<img
v-motion
:initial="{ y: 500, x: -100, scale: 2 }"
:enter="final"
class="absolute top-0 left-0 right-0 bottom-0"
src="https://sli.dev/logo-circle.png"
/>
<img
v-motion
:initial="{ x: 600, y: 400, scale: 2, rotate: 100 }"
:enter="final"
class="absolute top-0 left-0 right-0 bottom-0"
src="https://sli.dev/logo-triangle.png"
/>
</div>
<div
class="text-5xl absolute top-14 left-40 text-[#2B90B6] -z-1"
v-motion
:initial="{ x: -80, opacity: 0}"
:enter="{ x: 0, opacity: 1, transition: { delay: 2000, duration: 1000 } }">
Slidev
</div>
</div>
<!-- vue script setup scripts can be directly used in markdown, and will only affects current page -->
<script setup lang="ts">
const final = {
x: 0,
y: 0,
rotate: 0,
scale: 1,
transition: {
type: 'spring',
damping: 10,
stiffness: 20,
mass: 2
}
}
</script>
<div
v-motion
:initial="{ x:35, y: 40, opacity: 0}"
:enter="{ y: 0, opacity: 1, transition: { delay: 3500 } }">
[Learn More](https://sli.dev/guide/animations.html#motion)
</div>
---
# LaTeX
LaTeX is supported out-of-box powered by [KaTeX](https://katex.org/).
<br>
Inline $\sqrt{3x-1}+(1+x)^2$
Block
$$
\begin{array}{c}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &
= \frac{4\pi}{c}\vec{\mathbf{j}} \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} & = 0
\end{array}
$$
<br>
[Learn more](https://sli.dev/guide/syntax#latex)
---
# Diagrams
You can create diagrams / graphs from textual descriptions, directly in your Markdown.
<div class="grid grid-cols-3 gap-10 pt-4 -mb-6">
```mermaid {scale: 0.5}
sequenceDiagram
Alice->John: Hello John, how are you?
Note over Alice,John: A typical interaction
```
```mermaid {theme: 'neutral', scale: 0.8}
graph TD
B[Text] --> C{Decision}
C -->|One| D[Result 1]
C -->|Two| E[Result 2]
```
```plantuml {scale: 0.7}
@startuml
package "Some Group" {
HTTP - [First Component]
[Another Component]
}
node "Other Groups" {
FTP - [Second Component]
[First Component] --> FTP
}
cloud {
[Example 1]
}
database "MySql" {
folder "This is my folder" {
[Folder 3]
}
frame "Foo" {
[Frame 4]
}
}
[Another Component] --> [Example 1]
[Example 1] --> [Folder 3]
[Folder 3] --> [Frame 4]
@enduml
```
</div>
[Learn More](https://sli.dev/guide/syntax.html#diagrams)
---
layout: center
class: text-center
---
# Learn More
[Documentations](https://sli.dev) · [GitHub](https://github.com/slidevjs/slidev) · [Showcases](https://sli.dev/showcases.html)

View File

@@ -101,16 +101,30 @@ Wouldn't you like to show off what you've worked on? Let's make it a new standar
## Collaboration
ACM is missing a platform for collaborating on projects together - one is sorely needed to connect those with an idea
to those with the skills.
to those with the skills. From small projects to grandiose far off ideas, everything is on the table.
---
## Assistance
With my experience and skillset, I believe I can help the members of ACM out with their projects from start to finish.
- **Ideas**: I'm full of ideas when it comes to projects; I can help you expand on your project or provide a viewpoint you hadn't thought of yet!
- **Issues**: With my experience, I've fallen into so many traps, flaws and issues with projects that I guarantee you I can help speculate what problems you'll encounter in development.
- **Tech Stack**: I'm knowledgeable on tech stacks, frameworks and technologies, but even if I don't know what you need yet, I can find out. Let me help you figure out what you need!
---
class:
---
# Contact & Platforms
- 💯 **Website** - [xevion.dev](https://xevion.dev)
- 🔧 **GitHub** - Xevion or [github.com/Xevion](https://github.com/Xevion)
- 🚀 **Discord** - `Xevion#8506`, or `Ctrl+K` then type `Xevion`
- 🛰️ **LinkedIn** - Ryan Walters at **[linkedin.com/in/ryancwalters/](https://www.linkedin.com/in/ryancwalters/)**
- **Website** - [xevion.dev](https://xevion.dev)
- 🚀 **Discord** - `Xevion#8506`, or `Ctrl+K` then type `Xevion`
- 📨 **Email** - `ryanchwalters@gmail.com` or `xevioni@yandex.com`
- **Photography Website** - [www.rcw.photos](https://www.rcw.photos/)
---