michalvankodev/michalvankodev-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Get rid of less

Browse Source
This commit is contained in:
Michal Vanko 2021-12-15 16:04:50 +01:00
parent d14d190bc2
commit b04399b463
10 changed files with 96 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
package-lock.json generated
View File

@ -33,7 +33,6 @@
"eslint": "^8.4.1",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-svelte3": "^3.2.1",
"less": "^3.11.3",
"prettier": "~2.5.1",
"prettier-plugin-svelte": "^2.5.1",
"svelte": "^3.44.2",
@ -1277,7 +1276,8 @@
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-2.0.3.tgz",
"integrity": "sha512-GK6QUtisv4fNS+XcI7shX0Gx9ORg7QqIznyfho79JTnX1XhLiyZHfftvGiziqzRiEi/Bjhgpi+D2o7HxJFPnDQ==",
"devOptional": true,
"optional": true,
"peer": true,
"dependencies": {
"is-what": "^3.12.0"
}
@ -1495,6 +1495,7 @@
"resolved": "https://registry.npmjs.org/errno/-/errno-0.1.8.tgz",
"integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==",
"optional": true,
"peer": true,
"dependencies": {
"prr": "~1.0.1"
},
@ -2492,6 +2493,7 @@
"resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz",
"integrity": "sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=",
"optional": true,
"peer": true,
"bin": {
"image-size": "bin/image-size.js"
},
@ -2615,7 +2617,8 @@
"version": "3.14.1",
"resolved": "https://registry.npmjs.org/is-what/-/is-what-3.14.1.tgz",
"integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==",
"devOptional": true
"optional": true,
"peer": true
},
"node_modules/isexe": {
"version": "2.0.0",
@ -2704,7 +2707,8 @@
"version": "3.13.1",
"resolved": "https://registry.npmjs.org/less/-/less-3.13.1.tgz",
"integrity": "sha512-SwA1aQXGUvp+P5XdZslUOhhLnClSLIjWvJhmd+Vgib5BFIr9lMNlQwmwUNOjXThF/A0x+MCYYPeWEfeWiLRnTw==",
"devOptional": true,
"optional": true,
"peer": true,
"dependencies": {
"copy-anything": "^2.0.1",
"tslib": "^1.10.0"
@ -2730,6 +2734,7 @@
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"optional": true,
"peer": true,
"engines": {
"node": ">=0.10.0"
}
@ -2738,7 +2743,8 @@
"version": "1.14.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
"devOptional": true
"optional": true,
"peer": true
},
"node_modules/levn": {
"version": "0.4.1",
@ -2812,6 +2818,7 @@
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
"integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==",
"optional": true,
"peer": true,
"dependencies": {
"pify": "^4.0.1",
"semver": "^5.6.0"
@ -2858,6 +2865,7 @@
"resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
"integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
"optional": true,
"peer": true,
"bin": {
"mime": "cli.js"
},
@ -2945,7 +2953,8 @@
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/native-request/-/native-request-1.1.0.tgz",
"integrity": "sha512-uZ5rQaeRn15XmpgE0xoPL8YWqcX90VtCFglYwAgkvKM5e8fog+vePLAhHxuuv/gRkrQxIeh5U3q9sMNUrENqWw==",
"optional": true
"optional": true,
"peer": true
},
"node_modules/natural-compare": {
"version": "1.4.0",
@ -3112,6 +3121,7 @@
"resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
"integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
"optional": true,
"peer": true,
"engines": {
"node": ">=6"
}
@ -3218,7 +3228,8 @@
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
"integrity": "sha1-0/wRS6BplaRexok/SEzrHXj19HY=",
"optional": true
"optional": true,
"peer": true
},
"node_modules/punycode": {
"version": "2.1.1",
@ -3422,6 +3433,7 @@
"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
"integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
"optional": true,
"peer": true,
"bin": {
"semver": "bin/semver"
}
@ -4855,7 +4867,8 @@
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-2.0.3.tgz",
"integrity": "sha512-GK6QUtisv4fNS+XcI7shX0Gx9ORg7QqIznyfho79JTnX1XhLiyZHfftvGiziqzRiEi/Bjhgpi+D2o7HxJFPnDQ==",
"devOptional": true,
"optional": true,
"peer": true,
"requires": {
"is-what": "^3.12.0"
}
@ -5007,6 +5020,7 @@
"resolved": "https://registry.npmjs.org/errno/-/errno-0.1.8.tgz",
"integrity": "sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==",
"optional": true,
"peer": true,
"requires": {
"prr": "~1.0.1"
}
@ -5692,7 +5706,8 @@
"version": "0.5.5",
"resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz",
"integrity": "sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=",
"optional": true
"optional": true,
"peer": true
},
"import-cwd": {
"version": "3.0.0",
@ -5782,7 +5797,8 @@
"version": "3.14.1",
"resolved": "https://registry.npmjs.org/is-what/-/is-what-3.14.1.tgz",
"integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==",
"devOptional": true
"optional": true,
"peer": true
},
"isexe": {
"version": "2.0.0",
@ -5853,7 +5869,8 @@
"version": "3.13.1",
"resolved": "https://registry.npmjs.org/less/-/less-3.13.1.tgz",
"integrity": "sha512-SwA1aQXGUvp+P5XdZslUOhhLnClSLIjWvJhmd+Vgib5BFIr9lMNlQwmwUNOjXThF/A0x+MCYYPeWEfeWiLRnTw==",
"devOptional": true,
"optional": true,
"peer": true,
"requires": {
"copy-anything": "^2.0.1",
"errno": "^0.1.1",
@ -5870,13 +5887,15 @@
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"optional": true
"optional": true,
"peer": true
},
"tslib": {
"version": "1.14.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
"devOptional": true
"optional": true,
"peer": true
}
}
},
@ -5937,6 +5956,7 @@
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
"integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==",
"optional": true,
"peer": true,
"requires": {
"pify": "^4.0.1",
"semver": "^5.6.0"
@ -5967,7 +5987,8 @@
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
"integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
"optional": true
"optional": true,
"peer": true
},
"min-indent": {
"version": "1.0.1",
@ -6025,7 +6046,8 @@
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/native-request/-/native-request-1.1.0.tgz",
"integrity": "sha512-uZ5rQaeRn15XmpgE0xoPL8YWqcX90VtCFglYwAgkvKM5e8fog+vePLAhHxuuv/gRkrQxIeh5U3q9sMNUrENqWw==",
"optional": true
"optional": true,
"peer": true
},
"natural-compare": {
"version": "1.4.0",
@ -6155,7 +6177,8 @@
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
"integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
"optional": true
"optional": true,
"peer": true
},
"polished": {
"version": "4.1.3",
@ -6219,7 +6242,8 @@
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
"integrity": "sha1-0/wRS6BplaRexok/SEzrHXj19HY=",
"optional": true
"optional": true,
"peer": true
},
"punycode": {
"version": "2.1.1",
@ -6356,7 +6380,8 @@
"version": "5.7.1",
"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
"integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
"optional": true
"optional": true,
"peer": true
},
"slash": {
"version": "3.0.0",

1
package.json
View File

@ -40,7 +40,6 @@
"eslint": "^8.4.1",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-svelte3": "^3.2.1",
"less": "^3.11.3",
"prettier": "~2.5.1",
"prettier-plugin-svelte": "^2.5.1",
"svelte": "^3.44.2",

4
src/components/Nav.css.ts
View File

@ -78,3 +78,7 @@ export const portfolioPageNavigationLinksClass = sprinkles({
marginX: 'auto',
marginY: 'none',
})
export const portfolioPageNavigationLinkClass = sprinkles({
padding: '1x',
})

22
src/components/Nav.svelte
View File

@ -8,6 +8,7 @@
navigationContentClass,
navigationLinksClass,
portfolioPageNavigation,
portfolioPageNavigationLinkClass,
portfolioPageNavigationLinksClass,
selectedClass,
} from './Nav.css'
@ -63,11 +64,22 @@
{#if segment === '/portfolio'}
<section class="page-navigation {portfolioPageNavigation}">
<div class={portfolioPageNavigationLinksClass}>
<a href="/portfolio#personal-information">About</a>
<a href="/portfolio#skills">Skills</a>
<a href="/portfolio#work-history">Work History</a>
<a href="/portfolio#projects">Projects</a>
<a href="/portfolio#education">Education</a>
<a
class={portfolioPageNavigationLinkClass}
href="/portfolio#personal-information">About</a
>
<a class={portfolioPageNavigationLinkClass} href="/portfolio#skills"
>Skills</a
>
<a class={portfolioPageNavigationLinkClass} href="/portfolio#work-history"
>Work History</a
>
<a class={portfolioPageNavigationLinkClass} href="/portfolio#projects"
>Projects</a
>
<a class={portfolioPageNavigationLinkClass} href="/portfolio#education"
>Education</a
>
</div>
</section>
{/if}

2
src/components/SvgIcon.svelte
View File

@ -1,5 +1,5 @@
<script lang="ts">
import svgSprite from '/build/icons-sprite.svg'
import svgSprite from '/static/build/icons-sprite.svg'
export let className: string
export let name: string
</script>

10
src/components/portfolio/project.css.ts Normal file
View File

@ -0,0 +1,10 @@
import { globalStyle, style } from '@vanilla-extract/css'
export const projectScopeClass = style({})
globalStyle(`${projectScopeClass} img`, {
float: 'right',
width: '25%',
})
// We need to get rid off the global selectors LOL

10
src/components/portfolio/project.svelte
View File

@ -1,10 +1,11 @@
<script lang="ts">
import type { ProjectAttributes } from '../../routes/portfolio/index.json'
import { projectScopeClass } from './project.css'
export let project: ProjectAttributes
</script>
<article class="project">
<article class="project {projectScopeClass}">
<h3>{project.name}</h3>
<section class="description">
{#if project.image}
@ -18,10 +19,3 @@
</section>
<aside />
</article>
<style>
.project-image {
float: right;
width: 25%;
}
</style>

2
src/markdown/renderer-extension.ts
View File

@ -1,5 +1,5 @@
import Prism from 'prismjs'
import loadLanguages from 'prismjs/components/index'
import loadLanguages from 'prismjs/components/index.js'
loadLanguages(['bash', 'markdown', 'json', 'yaml', 'typescript'])

21
src/routes/blog/index.svelte
View File

@ -2,12 +2,11 @@
/**
* @type {import('@sveltejs/kit').Load}
*/
export function load({ fetch, page: { params, query } }) {
const blogQuery = query ? '?' + query.toString() : ''
return fetch(`blog.json${blogQuery}`)
export function load({ fetch }) {
return fetch(`blog.json`)
.then((r) => r.json())
.then((posts) => {
return { props: { posts, query } }
return { props: { posts } }
})
}
</script>
@ -18,10 +17,18 @@
import type { PostContent } from './_content'
export let posts: PostContent[]
export let query
export let tagQuery
export let displayedPosts: PostContent[]
export let tagQuery: string
$: tagQuery = query.get('tag')
$: {
if (typeof window !== 'undefined') {
let params = new URLSearchParams(window.location.search)
tagQuery = params.get('tag')
displayedPosts = posts.filter((post) => post.tags.includes(tagQuery))
} else {
displayedPosts = posts
}
}
</script>
<svelte:head>

4
src/routes/layout.css.ts
View File

@ -18,6 +18,10 @@ export const mainContentClass = sprinkles({
})
// Layout global styles
// atomic design needs to get rid off these global selectors LOL
// There should be written markdown renderer for each type of output
// where every component gets the layout atomic class
// TODO Create atomic classes for maxWidhts and use them everywhere in the content
globalStyle(
`${mainContentClass} h1, ${mainContentClass} h2, ${mainContentClass} h3, ${mainContentClass} h4, ${mainContentClass} h5, ${mainContentClass} h6, ${mainContentClass} p, ${mainContentClass} ul, ${mainContentClass} ol, ${mainContentClass} figure, ${mainContentClass} img, ${mainContentClass} blockquote, ${mainContentClass} iframe, ${mainContentClass} footer`,