diff --git a/.gitea/workflows/workflow.yaml b/.gitea/workflows/workflow.yaml index d3e8e5c..169695b 100644 --- a/.gitea/workflows/workflow.yaml +++ b/.gitea/workflows/workflow.yaml @@ -4,37 +4,25 @@ run-name: ${{ gitea.actor }} is deploying this page to production. on: push: branches: - - master + - master jobs: - build: + build-and-deploy: runs-on: ubuntu-latest steps: - - name: Repository auschecken - uses: actions/checkout@v3 + - name: Checkout repository + uses: actions/checkout@v4 - - name: Node.js einrichten - uses: actions/setup-node@v3 + - name: Set up Node.js + uses: actions/setup-node@v4 with: - node-version: 18 + node-version: 20 - - name: Clear node_modules and package-lock - run: | - rm -rf node_modules - rm -f package-lock.json + - name: Install dependencies + run: npm install --legacy-peer-deps --force - - name: Install Dependencies - run: | - npm install --legacy-peer-deps --force - npm install -g gatsby-cli - - - name: Clean Gatsby cache - run: | - gatsby clean - - - name: Build Gatsby Site - run: | - gatsby build + - name: Build Gatsby site + run: npx gatsby build env: NODE_ENV: production CI: true @@ -46,22 +34,6 @@ jobs: exit 1 fi - - name: Upload build artifacts - uses: actions/upload-artifact@v3 - with: - name: gatsby-build - path: public/ - - deploy: - needs: build - runs-on: ubuntu-latest - steps: - - name: Download build artifacts - uses: actions/download-artifact@v3 - with: - name: gatsby-build - path: public - - name: Install SSH key uses: shimataro/ssh-key-action@v2 with: diff --git a/.nvmrc b/.nvmrc new file mode 100644 index 0000000..209e3ef --- /dev/null +++ b/.nvmrc @@ -0,0 +1 @@ +20 diff --git a/.nvrmc b/.nvrmc deleted file mode 100644 index 0828ab7..0000000 --- a/.nvrmc +++ /dev/null @@ -1 +0,0 @@ -v18 \ No newline at end of file diff --git a/README.md b/README.md index 1f80e4e..6d70f14 100644 --- a/README.md +++ b/README.md @@ -1,18 +1,27 @@ -# gatsby-starter-strata +# thiessen.io -**This is a starter for Gatsby.js V2.** +Personal site of **Dennis Thiessen** — Staff Data, Analytics & AI Engineer (Bern, Switzerland). -**The older V1 version of this starter can be found on the v1 branch** +Built with [Gatsby](https://www.gatsbyjs.com/) 5 and React 18. Single-page, Swiss-minimal design; styles are plain CSS in `src/assets/style.css` (no preprocessor). -Gatsby starter based on the Strata site template, designed by [HTML5 UP](https://html5up.net/strata). Check out https://codebushi.com/gatsby-starters/ for more Gatsby starters and templates. +## Develop -## Preview +```bash +npm install --legacy-peer-deps +npx gatsby develop # http://localhost:8000 +``` -http://gatsby-strata.surge.sh/ +## Build -## Installation +```bash +npx gatsby build # output in ./public +``` -Install this starter (assuming Gatsby is installed) by running from your CLI: -`gatsby new gatsby-starter-strata https://github.com/ChangoMan/gatsby-starter-strata` +Use Node 20 (see `.nvmrc`). -Run `gatsby develop` in the terminal to start. +## Deploy + +Pushing to `master` triggers the Gitea Actions workflow in +`.gitea/workflows/workflow.yaml`, which builds the site and rsyncs `public/` +to the web server over SSH. It relies on these repository secrets: +`SSH_PRIVATE_KEY`, `SSH_KNOWN_HOSTS`, `DEPLOY_USER`, `DEPLOY_HOST`, `DEPLOY_PATH`. diff --git a/gatsby-config.js b/gatsby-config.js index 1a883e5..19dc3a3 100644 --- a/gatsby-config.js +++ b/gatsby-config.js @@ -1,24 +1,24 @@ module.exports = { siteMetadata: { - title: "Dennis Thiessen - IT Software Engineering", + title: "Dennis Thiessen — Data, Analytics & AI Engineer", author: "Dennis Thiessen", - description: "Portfolio of Dennis Thiessen - IT Software Engineer Freelancer" + description: + "Dennis Thiessen is a Staff Data, Analytics & AI Engineer in Bern, Switzerland, building the data pipelines and ML infrastructure that production systems run on." }, plugins: [ 'gatsby-plugin-react-helmet', { resolve: `gatsby-plugin-manifest`, options: { - name: 'gatsby-starter-default', - short_name: 'Dennis Thiessen', + name: 'Dennis Thiessen', + short_name: 'D. Thiessen', start_url: '/', - background_color: '#663399', - theme_color: '#663399', + background_color: '#f4f5f7', + theme_color: '#15171c', display: 'minimal-ui', icon: 'src/assets/images/website-icon-dt.png', }, }, - 'gatsby-plugin-sass', 'gatsby-plugin-offline' ], } diff --git a/package.json b/package.json index 2329940..dba4755 100644 --- a/package.json +++ b/package.json @@ -1,22 +1,16 @@ { - "name": "gatsby-starter-default", - "description": "Gatsby default starter", + "name": "thiessen-io", + "description": "Personal site of Dennis Thiessen — thiessen.io", "version": "1.0.0", - "author": "Hunter Chang", + "author": "Dennis Thiessen", "dependencies": { "gatsby": "^5.12.12", "gatsby-plugin-manifest": "^5.12.3", "gatsby-plugin-offline": "^6.12.3", "gatsby-plugin-react-helmet": "^6.12.0", - "gatsby-plugin-sass": "^6.12.3", - "sass": "^1.69.5", "react": "^18.2.0", "react-dom": "^18.2.0", "react-helmet": "^6.1.0", - "yet-another-react-lightbox": "^3.15.6", - "@fortawesome/fontawesome-svg-core": "^6.5.1", - "@fortawesome/free-solid-svg-icons": "^6.5.1", - "@fortawesome/react-fontawesome": "^0.2.0", "ajv": "^8.12.0", "ajv-keywords": "^5.1.0", "schema-utils": "^4.2.0" diff --git a/src/assets/css/font-awesome.min.css b/src/assets/css/font-awesome.min.css deleted file mode 100644 index b7610d2..0000000 --- a/src/assets/css/font-awesome.min.css +++ /dev/null @@ -1,4 +0,0 @@ -/*! - * Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome - * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) - */@font-face{font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.eot?v=4.7.0');src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-remove:before,.fa-close:before,.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook-f:before,.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-feed:before,.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-desc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-asc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before,.fa-gratipay:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.fa-space-shuttle:before{content:"\f197"}.fa-slack:before{content:"\f198"}.fa-envelope-square:before{content:"\f199"}.fa-wordpress:before{content:"\f19a"}.fa-openid:before{content:"\f19b"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\f19c"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\f19d"}.fa-yahoo:before{content:"\f19e"}.fa-google:before{content:"\f1a0"}.fa-reddit:before{content:"\f1a1"}.fa-reddit-square:before{content:"\f1a2"}.fa-stumbleupon-circle:before{content:"\f1a3"}.fa-stumbleupon:before{content:"\f1a4"}.fa-delicious:before{content:"\f1a5"}.fa-digg:before{content:"\f1a6"}.fa-pied-piper-pp:before{content:"\f1a7"}.fa-pied-piper-alt:before{content:"\f1a8"}.fa-drupal:before{content:"\f1a9"}.fa-joomla:before{content:"\f1aa"}.fa-language:before{content:"\f1ab"}.fa-fax:before{content:"\f1ac"}.fa-building:before{content:"\f1ad"}.fa-child:before{content:"\f1ae"}.fa-paw:before{content:"\f1b0"}.fa-spoon:before{content:"\f1b1"}.fa-cube:before{content:"\f1b2"}.fa-cubes:before{content:"\f1b3"}.fa-behance:before{content:"\f1b4"}.fa-behance-square:before{content:"\f1b5"}.fa-steam:before{content:"\f1b6"}.fa-steam-square:before{content:"\f1b7"}.fa-recycle:before{content:"\f1b8"}.fa-automobile:before,.fa-car:before{content:"\f1b9"}.fa-cab:before,.fa-taxi:before{content:"\f1ba"}.fa-tree:before{content:"\f1bb"}.fa-spotify:before{content:"\f1bc"}.fa-deviantart:before{content:"\f1bd"}.fa-soundcloud:before{content:"\f1be"}.fa-database:before{content:"\f1c0"}.fa-file-pdf-o:before{content:"\f1c1"}.fa-file-word-o:before{content:"\f1c2"}.fa-file-excel-o:before{content:"\f1c3"}.fa-file-powerpoint-o:before{content:"\f1c4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\f1c5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\f1c6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\f1c7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}.fa-file-code-o:before{content:"\f1c9"}.fa-vine:before{content:"\f1ca"}.fa-codepen:before{content:"\f1cb"}.fa-jsfiddle:before{content:"\f1cc"}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\f1cd"}.fa-circle-o-notch:before{content:"\f1ce"}.fa-ra:before,.fa-resistance:before,.fa-rebel:before{content:"\f1d0"}.fa-ge:before,.fa-empire:before{content:"\f1d1"}.fa-git-square:before{content:"\f1d2"}.fa-git:before{content:"\f1d3"}.fa-y-combinator-square:before,.fa-yc-square:before,.fa-hacker-news:before{content:"\f1d4"}.fa-tencent-weibo:before{content:"\f1d5"}.fa-qq:before{content:"\f1d6"}.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}.fa-send:before,.fa-paper-plane:before{content:"\f1d8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\f1d9"}.fa-history:before{content:"\f1da"}.fa-circle-thin:before{content:"\f1db"}.fa-header:before{content:"\f1dc"}.fa-paragraph:before{content:"\f1dd"}.fa-sliders:before{content:"\f1de"}.fa-share-alt:before{content:"\f1e0"}.fa-share-alt-square:before{content:"\f1e1"}.fa-bomb:before{content:"\f1e2"}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:"\f1e3"}.fa-tty:before{content:"\f1e4"}.fa-binoculars:before{content:"\f1e5"}.fa-plug:before{content:"\f1e6"}.fa-slideshare:before{content:"\f1e7"}.fa-twitch:before{content:"\f1e8"}.fa-yelp:before{content:"\f1e9"}.fa-newspaper-o:before{content:"\f1ea"}.fa-wifi:before{content:"\f1eb"}.fa-calculator:before{content:"\f1ec"}.fa-paypal:before{content:"\f1ed"}.fa-google-wallet:before{content:"\f1ee"}.fa-cc-visa:before{content:"\f1f0"}.fa-cc-mastercard:before{content:"\f1f1"}.fa-cc-discover:before{content:"\f1f2"}.fa-cc-amex:before{content:"\f1f3"}.fa-cc-paypal:before{content:"\f1f4"}.fa-cc-stripe:before{content:"\f1f5"}.fa-bell-slash:before{content:"\f1f6"}.fa-bell-slash-o:before{content:"\f1f7"}.fa-trash:before{content:"\f1f8"}.fa-copyright:before{content:"\f1f9"}.fa-at:before{content:"\f1fa"}.fa-eyedropper:before{content:"\f1fb"}.fa-paint-brush:before{content:"\f1fc"}.fa-birthday-cake:before{content:"\f1fd"}.fa-area-chart:before{content:"\f1fe"}.fa-pie-chart:before{content:"\f200"}.fa-line-chart:before{content:"\f201"}.fa-lastfm:before{content:"\f202"}.fa-lastfm-square:before{content:"\f203"}.fa-toggle-off:before{content:"\f204"}.fa-toggle-on:before{content:"\f205"}.fa-bicycle:before{content:"\f206"}.fa-bus:before{content:"\f207"}.fa-ioxhost:before{content:"\f208"}.fa-angellist:before{content:"\f209"}.fa-cc:before{content:"\f20a"}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:"\f20b"}.fa-meanpath:before{content:"\f20c"}.fa-buysellads:before{content:"\f20d"}.fa-connectdevelop:before{content:"\f20e"}.fa-dashcube:before{content:"\f210"}.fa-forumbee:before{content:"\f211"}.fa-leanpub:before{content:"\f212"}.fa-sellsy:before{content:"\f213"}.fa-shirtsinbulk:before{content:"\f214"}.fa-simplybuilt:before{content:"\f215"}.fa-skyatlas:before{content:"\f216"}.fa-cart-plus:before{content:"\f217"}.fa-cart-arrow-down:before{content:"\f218"}.fa-diamond:before{content:"\f219"}.fa-ship:before{content:"\f21a"}.fa-user-secret:before{content:"\f21b"}.fa-motorcycle:before{content:"\f21c"}.fa-street-view:before{content:"\f21d"}.fa-heartbeat:before{content:"\f21e"}.fa-venus:before{content:"\f221"}.fa-mars:before{content:"\f222"}.fa-mercury:before{content:"\f223"}.fa-intersex:before,.fa-transgender:before{content:"\f224"}.fa-transgender-alt:before{content:"\f225"}.fa-venus-double:before{content:"\f226"}.fa-mars-double:before{content:"\f227"}.fa-venus-mars:before{content:"\f228"}.fa-mars-stroke:before{content:"\f229"}.fa-mars-stroke-v:before{content:"\f22a"}.fa-mars-stroke-h:before{content:"\f22b"}.fa-neuter:before{content:"\f22c"}.fa-genderless:before{content:"\f22d"}.fa-facebook-official:before{content:"\f230"}.fa-pinterest-p:before{content:"\f231"}.fa-whatsapp:before{content:"\f232"}.fa-server:before{content:"\f233"}.fa-user-plus:before{content:"\f234"}.fa-user-times:before{content:"\f235"}.fa-hotel:before,.fa-bed:before{content:"\f236"}.fa-viacoin:before{content:"\f237"}.fa-train:before{content:"\f238"}.fa-subway:before{content:"\f239"}.fa-medium:before{content:"\f23a"}.fa-yc:before,.fa-y-combinator:before{content:"\f23b"}.fa-optin-monster:before{content:"\f23c"}.fa-opencart:before{content:"\f23d"}.fa-expeditedssl:before{content:"\f23e"}.fa-battery-4:before,.fa-battery:before,.fa-battery-full:before{content:"\f240"}.fa-battery-3:before,.fa-battery-three-quarters:before{content:"\f241"}.fa-battery-2:before,.fa-battery-half:before{content:"\f242"}.fa-battery-1:before,.fa-battery-quarter:before{content:"\f243"}.fa-battery-0:before,.fa-battery-empty:before{content:"\f244"}.fa-mouse-pointer:before{content:"\f245"}.fa-i-cursor:before{content:"\f246"}.fa-object-group:before{content:"\f247"}.fa-object-ungroup:before{content:"\f248"}.fa-sticky-note:before{content:"\f249"}.fa-sticky-note-o:before{content:"\f24a"}.fa-cc-jcb:before{content:"\f24b"}.fa-cc-diners-club:before{content:"\f24c"}.fa-clone:before{content:"\f24d"}.fa-balance-scale:before{content:"\f24e"}.fa-hourglass-o:before{content:"\f250"}.fa-hourglass-1:before,.fa-hourglass-start:before{content:"\f251"}.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\f252"}.fa-hourglass-3:before,.fa-hourglass-end:before{content:"\f253"}.fa-hourglass:before{content:"\f254"}.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:"\f255"}.fa-hand-stop-o:before,.fa-hand-paper-o:before{content:"\f256"}.fa-hand-scissors-o:before{content:"\f257"}.fa-hand-lizard-o:before{content:"\f258"}.fa-hand-spock-o:before{content:"\f259"}.fa-hand-pointer-o:before{content:"\f25a"}.fa-hand-peace-o:before{content:"\f25b"}.fa-trademark:before{content:"\f25c"}.fa-registered:before{content:"\f25d"}.fa-creative-commons:before{content:"\f25e"}.fa-gg:before{content:"\f260"}.fa-gg-circle:before{content:"\f261"}.fa-tripadvisor:before{content:"\f262"}.fa-odnoklassniki:before{content:"\f263"}.fa-odnoklassniki-square:before{content:"\f264"}.fa-get-pocket:before{content:"\f265"}.fa-wikipedia-w:before{content:"\f266"}.fa-safari:before{content:"\f267"}.fa-chrome:before{content:"\f268"}.fa-firefox:before{content:"\f269"}.fa-opera:before{content:"\f26a"}.fa-internet-explorer:before{content:"\f26b"}.fa-tv:before,.fa-television:before{content:"\f26c"}.fa-contao:before{content:"\f26d"}.fa-500px:before{content:"\f26e"}.fa-amazon:before{content:"\f270"}.fa-calendar-plus-o:before{content:"\f271"}.fa-calendar-minus-o:before{content:"\f272"}.fa-calendar-times-o:before{content:"\f273"}.fa-calendar-check-o:before{content:"\f274"}.fa-industry:before{content:"\f275"}.fa-map-pin:before{content:"\f276"}.fa-map-signs:before{content:"\f277"}.fa-map-o:before{content:"\f278"}.fa-map:before{content:"\f279"}.fa-commenting:before{content:"\f27a"}.fa-commenting-o:before{content:"\f27b"}.fa-houzz:before{content:"\f27c"}.fa-vimeo:before{content:"\f27d"}.fa-black-tie:before{content:"\f27e"}.fa-fonticons:before{content:"\f280"}.fa-reddit-alien:before{content:"\f281"}.fa-edge:before{content:"\f282"}.fa-credit-card-alt:before{content:"\f283"}.fa-codiepie:before{content:"\f284"}.fa-modx:before{content:"\f285"}.fa-fort-awesome:before{content:"\f286"}.fa-usb:before{content:"\f287"}.fa-product-hunt:before{content:"\f288"}.fa-mixcloud:before{content:"\f289"}.fa-scribd:before{content:"\f28a"}.fa-pause-circle:before{content:"\f28b"}.fa-pause-circle-o:before{content:"\f28c"}.fa-stop-circle:before{content:"\f28d"}.fa-stop-circle-o:before{content:"\f28e"}.fa-shopping-bag:before{content:"\f290"}.fa-shopping-basket:before{content:"\f291"}.fa-hashtag:before{content:"\f292"}.fa-bluetooth:before{content:"\f293"}.fa-bluetooth-b:before{content:"\f294"}.fa-percent:before{content:"\f295"}.fa-gitlab:before{content:"\f296"}.fa-wpbeginner:before{content:"\f297"}.fa-wpforms:before{content:"\f298"}.fa-envira:before{content:"\f299"}.fa-universal-access:before{content:"\f29a"}.fa-wheelchair-alt:before{content:"\f29b"}.fa-question-circle-o:before{content:"\f29c"}.fa-blind:before{content:"\f29d"}.fa-audio-description:before{content:"\f29e"}.fa-volume-control-phone:before{content:"\f2a0"}.fa-braille:before{content:"\f2a1"}.fa-assistive-listening-systems:before{content:"\f2a2"}.fa-asl-interpreting:before,.fa-american-sign-language-interpreting:before{content:"\f2a3"}.fa-deafness:before,.fa-hard-of-hearing:before,.fa-deaf:before{content:"\f2a4"}.fa-glide:before{content:"\f2a5"}.fa-glide-g:before{content:"\f2a6"}.fa-signing:before,.fa-sign-language:before{content:"\f2a7"}.fa-low-vision:before{content:"\f2a8"}.fa-viadeo:before{content:"\f2a9"}.fa-viadeo-square:before{content:"\f2aa"}.fa-snapchat:before{content:"\f2ab"}.fa-snapchat-ghost:before{content:"\f2ac"}.fa-snapchat-square:before{content:"\f2ad"}.fa-pied-piper:before{content:"\f2ae"}.fa-first-order:before{content:"\f2b0"}.fa-yoast:before{content:"\f2b1"}.fa-themeisle:before{content:"\f2b2"}.fa-google-plus-circle:before,.fa-google-plus-official:before{content:"\f2b3"}.fa-fa:before,.fa-font-awesome:before{content:"\f2b4"}.fa-handshake-o:before{content:"\f2b5"}.fa-envelope-open:before{content:"\f2b6"}.fa-envelope-open-o:before{content:"\f2b7"}.fa-linode:before{content:"\f2b8"}.fa-address-book:before{content:"\f2b9"}.fa-address-book-o:before{content:"\f2ba"}.fa-vcard:before,.fa-address-card:before{content:"\f2bb"}.fa-vcard-o:before,.fa-address-card-o:before{content:"\f2bc"}.fa-user-circle:before{content:"\f2bd"}.fa-user-circle-o:before{content:"\f2be"}.fa-user-o:before{content:"\f2c0"}.fa-id-badge:before{content:"\f2c1"}.fa-drivers-license:before,.fa-id-card:before{content:"\f2c2"}.fa-drivers-license-o:before,.fa-id-card-o:before{content:"\f2c3"}.fa-quora:before{content:"\f2c4"}.fa-free-code-camp:before{content:"\f2c5"}.fa-telegram:before{content:"\f2c6"}.fa-thermometer-4:before,.fa-thermometer:before,.fa-thermometer-full:before{content:"\f2c7"}.fa-thermometer-3:before,.fa-thermometer-three-quarters:before{content:"\f2c8"}.fa-thermometer-2:before,.fa-thermometer-half:before{content:"\f2c9"}.fa-thermometer-1:before,.fa-thermometer-quarter:before{content:"\f2ca"}.fa-thermometer-0:before,.fa-thermometer-empty:before{content:"\f2cb"}.fa-shower:before{content:"\f2cc"}.fa-bathtub:before,.fa-s15:before,.fa-bath:before{content:"\f2cd"}.fa-podcast:before{content:"\f2ce"}.fa-window-maximize:before{content:"\f2d0"}.fa-window-minimize:before{content:"\f2d1"}.fa-window-restore:before{content:"\f2d2"}.fa-times-rectangle:before,.fa-window-close:before{content:"\f2d3"}.fa-times-rectangle-o:before,.fa-window-close-o:before{content:"\f2d4"}.fa-bandcamp:before{content:"\f2d5"}.fa-grav:before{content:"\f2d6"}.fa-etsy:before{content:"\f2d7"}.fa-imdb:before{content:"\f2d8"}.fa-ravelry:before{content:"\f2d9"}.fa-eercast:before{content:"\f2da"}.fa-microchip:before{content:"\f2db"}.fa-snowflake-o:before{content:"\f2dc"}.fa-superpowers:before{content:"\f2dd"}.fa-wpexplorer:before{content:"\f2de"}.fa-meetup:before{content:"\f2e0"}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto} \ No newline at end of file diff --git a/src/assets/fonts/FontAwesome.otf b/src/assets/fonts/FontAwesome.otf deleted file mode 100644 index 401ec0f..0000000 Binary files a/src/assets/fonts/FontAwesome.otf and /dev/null differ diff --git a/src/assets/fonts/fontawesome-webfont.eot b/src/assets/fonts/fontawesome-webfont.eot deleted file mode 100644 index e9f60ca..0000000 Binary files a/src/assets/fonts/fontawesome-webfont.eot and /dev/null differ diff --git a/src/assets/fonts/fontawesome-webfont.svg b/src/assets/fonts/fontawesome-webfont.svg deleted file mode 100644 index 855c845..0000000 --- a/src/assets/fonts/fontawesome-webfont.svg +++ /dev/null @@ -1,2671 +0,0 @@ - - - - -Created by FontForge 20120731 at Mon Oct 24 17:37:40 2016 - By ,,, -Copyright Dave Gandy 2016. All rights reserved. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/fonts/fontawesome-webfont.ttf b/src/assets/fonts/fontawesome-webfont.ttf deleted file mode 100644 index 35acda2..0000000 Binary files a/src/assets/fonts/fontawesome-webfont.ttf and /dev/null differ diff --git a/src/assets/fonts/fontawesome-webfont.woff b/src/assets/fonts/fontawesome-webfont.woff deleted file mode 100644 index 400014a..0000000 Binary files a/src/assets/fonts/fontawesome-webfont.woff and /dev/null differ diff --git a/src/assets/fonts/fontawesome-webfont.woff2 b/src/assets/fonts/fontawesome-webfont.woff2 deleted file mode 100644 index 4d13fc6..0000000 Binary files a/src/assets/fonts/fontawesome-webfont.woff2 and /dev/null differ diff --git a/src/assets/images/bg.jpg b/src/assets/images/bg.jpg deleted file mode 100644 index 59d3207..0000000 Binary files a/src/assets/images/bg.jpg and /dev/null differ diff --git a/src/assets/images/fulls/01.jpg b/src/assets/images/fulls/01.jpg deleted file mode 100644 index ef5a0cc..0000000 Binary files a/src/assets/images/fulls/01.jpg and /dev/null differ diff --git a/src/assets/images/fulls/02.jpg b/src/assets/images/fulls/02.jpg deleted file mode 100644 index 0891c23..0000000 Binary files a/src/assets/images/fulls/02.jpg and /dev/null differ diff --git a/src/assets/images/fulls/03.jpg b/src/assets/images/fulls/03.jpg deleted file mode 100644 index ee700ef..0000000 Binary files a/src/assets/images/fulls/03.jpg and /dev/null differ diff --git a/src/assets/images/fulls/04.jpg b/src/assets/images/fulls/04.jpg deleted file mode 100644 index 32f18bc..0000000 Binary files a/src/assets/images/fulls/04.jpg and /dev/null differ diff --git a/src/assets/images/fulls/05.jpg b/src/assets/images/fulls/05.jpg deleted file mode 100644 index 4673b12..0000000 Binary files a/src/assets/images/fulls/05.jpg and /dev/null differ diff --git a/src/assets/images/fulls/06.jpg b/src/assets/images/fulls/06.jpg deleted file mode 100644 index b91cc30..0000000 Binary files a/src/assets/images/fulls/06.jpg and /dev/null differ diff --git a/src/assets/images/fulls/07.jpg b/src/assets/images/fulls/07.jpg deleted file mode 100644 index c1fd98b..0000000 Binary files a/src/assets/images/fulls/07.jpg and /dev/null differ diff --git a/src/assets/images/fulls/08.jpg b/src/assets/images/fulls/08.jpg deleted file mode 100644 index 8111317..0000000 Binary files a/src/assets/images/fulls/08.jpg and /dev/null differ diff --git a/src/assets/images/fulls/09.jpg b/src/assets/images/fulls/09.jpg deleted file mode 100644 index 00e29b9..0000000 Binary files a/src/assets/images/fulls/09.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/01.jpg b/src/assets/images/thumbs/01.jpg deleted file mode 100644 index 58bc210..0000000 Binary files a/src/assets/images/thumbs/01.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/02.jpg b/src/assets/images/thumbs/02.jpg deleted file mode 100644 index 7fe614d..0000000 Binary files a/src/assets/images/thumbs/02.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/03.jpg b/src/assets/images/thumbs/03.jpg deleted file mode 100644 index fcd1532..0000000 Binary files a/src/assets/images/thumbs/03.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/04.jpg b/src/assets/images/thumbs/04.jpg deleted file mode 100644 index 9f8b1fe..0000000 Binary files a/src/assets/images/thumbs/04.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/05.jpg b/src/assets/images/thumbs/05.jpg deleted file mode 100644 index f5b2b6c..0000000 Binary files a/src/assets/images/thumbs/05.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/06.jpg b/src/assets/images/thumbs/06.jpg deleted file mode 100644 index d965424..0000000 Binary files a/src/assets/images/thumbs/06.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/07.jpg b/src/assets/images/thumbs/07.jpg deleted file mode 100644 index 3955db1..0000000 Binary files a/src/assets/images/thumbs/07.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/08.jpg b/src/assets/images/thumbs/08.jpg deleted file mode 100644 index fa205d5..0000000 Binary files a/src/assets/images/thumbs/08.jpg and /dev/null differ diff --git a/src/assets/images/thumbs/09.jpg b/src/assets/images/thumbs/09.jpg deleted file mode 100644 index 51bd0b9..0000000 Binary files a/src/assets/images/thumbs/09.jpg and /dev/null differ diff --git a/src/assets/images/website-icon.png b/src/assets/images/website-icon.png deleted file mode 100644 index 908bc78..0000000 Binary files a/src/assets/images/website-icon.png and /dev/null differ diff --git a/src/assets/scss/ie8.scss b/src/assets/scss/ie8.scss deleted file mode 100644 index 5a3822c..0000000 --- a/src/assets/scss/ie8.scss +++ /dev/null @@ -1,87 +0,0 @@ -@import 'libs/vars'; -@import 'libs/functions'; -@import 'libs/mixins'; -@import 'libs/skel'; - -/* - Strata by HTML5 UP - html5up.net | @ajlkn - Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) -*/ - -/* Button */ - - input[type="submit"], - input[type="reset"], - input[type="button"], - .button { - position: relative; - -ms-behavior: url('assets/js/ie/PIE.htc'); - } - -/* Form */ - - input[type="text"], - input[type="password"], - input[type="email"], - select, - textarea { - position: relative; - -ms-behavior: url('assets/js/ie/PIE.htc'); - } - - input[type="text"], - input[type="password"], - input[type="email"], - select { - height: _size(element-height); - line-height: _size(element-height); - } - - input[type="checkbox"], - input[type="radio"] { - & + label { - &:before { - display: none; - } - } - } - -/* Image */ - - .image { - position: relative; - -ms-behavior: url('assets/js/ie/PIE.htc'); - - &:before, &:after { - display: none !important; - } - - img { - position: relative; - -ms-behavior: url('assets/js/ie/PIE.htc'); - } - } - -/* Header */ - - #header { - background-image: url('../../images/bg.jpg'); - background-repeat: no-repeat; - background-size: cover; - -ms-behavior: url('assets/js/ie/backgroundsize.min.htc'); - - h1 { - color: _palette(accent2, fg-bold); - } - } - -/* Footer */ - - #footer { - .icons { - a { - color: _palette(accent2, fg-bold); - } - } - } \ No newline at end of file diff --git a/src/assets/scss/images/overlay.png b/src/assets/scss/images/overlay.png deleted file mode 100644 index 9389301..0000000 Binary files a/src/assets/scss/images/overlay.png and /dev/null differ diff --git a/src/assets/scss/libs/_functions.scss b/src/assets/scss/libs/_functions.scss deleted file mode 100644 index 0e08c1a..0000000 --- a/src/assets/scss/libs/_functions.scss +++ /dev/null @@ -1,34 +0,0 @@ -/// Gets a duration value. -/// @param {string} $keys Key(s). -/// @return {string} Value. -@function _duration($keys...) { - @return val($duration, $keys...); -} - -/// Gets a font value. -/// @param {string} $keys Key(s). -/// @return {string} Value. -@function _font($keys...) { - @return val($font, $keys...); -} - -/// Gets a misc value. -/// @param {string} $keys Key(s). -/// @return {string} Value. -@function _misc($keys...) { - @return val($misc, $keys...); -} - -/// Gets a palette value. -/// @param {string} $keys Key(s). -/// @return {string} Value. -@function _palette($keys...) { - @return val($palette, $keys...); -} - -/// Gets a size value. -/// @param {string} $keys Key(s). -/// @return {string} Value. -@function _size($keys...) { - @return val($size, $keys...); -} \ No newline at end of file diff --git a/src/assets/scss/libs/_mixins.scss b/src/assets/scss/libs/_mixins.scss deleted file mode 100644 index d4bf3c8..0000000 --- a/src/assets/scss/libs/_mixins.scss +++ /dev/null @@ -1,398 +0,0 @@ -/// Makes an element's :before pseudoelement a FontAwesome icon. -/// @param {string} $content Optional content value to use. -/// @param {string} $where Optional pseudoelement to target (before or after). -@mixin icon($content: false, $where: before) { - - text-decoration: none; - - &:#{$where} { - - @if $content { - content: $content; - } - - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased; - font-family: FontAwesome; - font-style: normal; - font-weight: normal; - text-transform: none !important; - - } - -} - -/// Applies padding to an element, taking the current element-margin value into account. -/// @param {mixed} $tb Top/bottom padding. -/// @param {mixed} $lr Left/right padding. -/// @param {list} $pad Optional extra padding (in the following order top, right, bottom, left) -/// @param {bool} $important If true, adds !important. -@mixin padding($tb, $lr, $pad: (0,0,0,0), $important: null) { - - @if $important { - $important: '!important'; - } - - $x: 0.1em; - - @if unit(_size(element-margin)) == 'rem' { - $x: 0.1rem; - } - - padding: ($tb + nth($pad,1)) ($lr + nth($pad,2)) max($x, $tb - _size(element-margin) + nth($pad,3)) ($lr + nth($pad,4)) #{$important}; - -} - -/// Encodes a SVG data URL so IE doesn't choke (via codepen.io/jakob-e/pen/YXXBrp). -/// @param {string} $svg SVG data URL. -/// @return {string} Encoded SVG data URL. -@function svg-url($svg) { - - $svg: str-replace($svg, '"', '\''); - $svg: str-replace($svg, '%', '%25'); - $svg: str-replace($svg, '<', '%3C'); - $svg: str-replace($svg, '>', '%3E'); - $svg: str-replace($svg, '&', '%26'); - $svg: str-replace($svg, '#', '%23'); - $svg: str-replace($svg, '{', '%7B'); - $svg: str-replace($svg, '}', '%7D'); - $svg: str-replace($svg, ';', '%3B'); - - @return url("data:image/svg+xml;charset=utf8,#{$svg}"); - -} - -/// Initializes base flexgrid classes. -/// @param {string} $vertical-align Vertical alignment of cells. -/// @param {string} $horizontal-align Horizontal alignment of cells. -@mixin flexgrid-base($vertical-align: null, $horizontal-align: null) { - - // Grid. - @include vendor('display', 'flex'); - @include vendor('flex-wrap', 'wrap'); - - // Vertical alignment. - @if ($vertical-align == top) { - @include vendor('align-items', 'flex-start'); - } - @else if ($vertical-align == bottom) { - @include vendor('align-items', 'flex-end'); - } - @else if ($vertical-align == center) { - @include vendor('align-items', 'center'); - } - @else { - @include vendor('align-items', 'stretch'); - } - - // Horizontal alignment. - @if ($horizontal-align != null) { - text-align: $horizontal-align; - } - - // Cells. - > * { - @include vendor('flex-shrink', '1'); - @include vendor('flex-grow', '0'); - } - -} - -/// Sets up flexgrid columns. -/// @param {integer} $columns Columns. -@mixin flexgrid-columns($columns) { - - > * { - $cell-width: 100% / $columns; - width: #{$cell-width}; - } - -} - -/// Sets up flexgrid gutters. -/// @param {integer} $columns Columns. -/// @param {number} $gutters Gutters. -@mixin flexgrid-gutters($columns, $gutters) { - - // Apply padding. - > * { - $cell-width: 100% / $columns; - - padding: ($gutters * 0.5); - width: $cell-width; - } - -} - -/// Sets up flexgrid gutters (flush). -/// @param {integer} $columns Columns. -/// @param {number} $gutters Gutters. -@mixin flexgrid-gutters-flush($columns, $gutters) { - - // Apply padding. - > * { - $cell-width: 100% / $columns; - $cell-width-pad: $gutters / $columns; - - padding: ($gutters * 0.5); - width: calc(#{$cell-width} + #{$cell-width-pad}); - } - - // Clear top/bottom gutters. - > :nth-child(-n + #{$columns}) { - padding-top: 0; - } - - > :nth-last-child(-n + #{$columns}) { - padding-bottom: 0; - } - - // Clear left/right gutters. - > :nth-child(#{$columns}n + 1) { - padding-left: 0; - } - - > :nth-child(#{$columns}n) { - padding-right: 0; - } - - // Adjust widths of leftmost and rightmost cells. - > :nth-child(#{$columns}n + 1), - > :nth-child(#{$columns}n) { - $cell-width: 100% / $columns; - $cell-width-pad: ($gutters / $columns) - ($gutters / 2); - - width: calc(#{$cell-width} + #{$cell-width-pad}); - } - -} - -/// Reset flexgrid gutters (flush only). -/// Used to override a previous set of flexgrid gutter classes. -/// @param {integer} $columns Columns. -/// @param {number} $gutters Gutters. -/// @param {integer} $prev-columns Previous columns. -@mixin flexgrid-gutters-flush-reset($columns, $gutters, $prev-columns) { - - // Apply padding. - > * { - $cell-width: 100% / $prev-columns; - $cell-width-pad: $gutters / $prev-columns; - - padding: ($gutters * 0.5); - width: calc(#{$cell-width} + #{$cell-width-pad}); - } - - // Clear top/bottom gutters. - > :nth-child(-n + #{$prev-columns}) { - padding-top: ($gutters * 0.5); - } - - > :nth-last-child(-n + #{$prev-columns}) { - padding-bottom: ($gutters * 0.5); - } - - // Clear left/right gutters. - > :nth-child(#{$prev-columns}n + 1) { - padding-left: ($gutters * 0.5); - } - - > :nth-child(#{$prev-columns}n) { - padding-right: ($gutters * 0.5); - } - - // Adjust widths of leftmost and rightmost cells. - > :nth-child(#{$prev-columns}n + 1), - > :nth-child(#{$prev-columns}n) { - $cell-width: 100% / $columns; - $cell-width-pad: $gutters / $columns; - - padding: ($gutters * 0.5); - width: calc(#{$cell-width} + #{$cell-width-pad}); - } - -} - -/// Adds debug styles to current flexgrid element. -@mixin flexgrid-debug() { - - box-shadow: 0 0 0 1px red; - - > * { - box-shadow: inset 0 0 0 1px blue; - position: relative; - - > * { - position: relative; - box-shadow: inset 0 0 0 1px green; - } - } - -} - -/// Initializes the current element as a flexgrid. -/// @param {integer} $columns Columns (optional). -/// @param {number} $gutters Gutters (optional). -/// @param {bool} $flush If true, clears padding around the very edge of the grid. -@mixin flexgrid($settings: ()) { - - // Settings. - - // Debug. - $debug: false; - - @if (map-has-key($settings, 'debug')) { - $debug: map-get($settings, 'debug'); - } - - // Vertical align. - $vertical-align: null; - - @if (map-has-key($settings, 'vertical-align')) { - $vertical-align: map-get($settings, 'vertical-align'); - } - - // Horizontal align. - $horizontal-align: null; - - @if (map-has-key($settings, 'horizontal-align')) { - $horizontal-align: map-get($settings, 'horizontal-align'); - } - - // Columns. - $columns: null; - - @if (map-has-key($settings, 'columns')) { - $columns: map-get($settings, 'columns'); - } - - // Gutters. - $gutters: 0; - - @if (map-has-key($settings, 'gutters')) { - $gutters: map-get($settings, 'gutters'); - } - - // Flush. - $flush: true; - - @if (map-has-key($settings, 'flush')) { - $flush: map-get($settings, 'flush'); - } - - // Initialize base grid. - @include flexgrid-base($vertical-align, $horizontal-align); - - // Debug? - @if ($debug) { - @include flexgrid-debug; - } - - // Columns specified? - @if ($columns != null) { - - // Initialize columns. - @include flexgrid-columns($columns); - - // Gutters specified? - @if ($gutters > 0) { - - // Flush gutters? - @if ($flush) { - - // Initialize gutters (flush). - @include flexgrid-gutters-flush($columns, $gutters); - - } - - // Otherwise ... - @else { - - // Initialize gutters. - @include flexgrid-gutters($columns, $gutters); - - } - - } - - } - -} - -/// Resizes a previously-initialized grid. -/// @param {integer} $columns Columns. -/// @param {number} $gutters Gutters (optional). -/// @param {list} $reset A list of previously-initialized grid columns (only if $flush is true). -/// @param {bool} $flush If true, clears padding around the very edge of the grid. -@mixin flexgrid-resize($settings: ()) { - - // Settings. - - // Columns. - $columns: 1; - - @if (map-has-key($settings, 'columns')) { - $columns: map-get($settings, 'columns'); - } - - // Gutters. - $gutters: 0; - - @if (map-has-key($settings, 'gutters')) { - $gutters: map-get($settings, 'gutters'); - } - - // Previous columns. - $prev-columns: false; - - @if (map-has-key($settings, 'prev-columns')) { - $prev-columns: map-get($settings, 'prev-columns'); - } - - // Flush. - $flush: true; - - @if (map-has-key($settings, 'flush')) { - $flush: map-get($settings, 'flush'); - } - - // Resize columns. - @include flexgrid-columns($columns); - - // Gutters specified? - @if ($gutters > 0) { - - // Flush gutters? - @if ($flush) { - - // Previous columns specified? - @if ($prev-columns) { - - // Convert to list if it isn't one already. - @if (type-of($prev-columns) != list) { - $prev-columns: ($prev-columns); - } - - // Step through list of previous columns and reset them. - @each $x in $prev-columns { - @include flexgrid-gutters-flush-reset($columns, $gutters, $x); - } - - } - - // Resize gutters (flush). - @include flexgrid-gutters-flush($columns, $gutters); - - } - - // Otherwise ... - @else { - - // Resize gutters. - @include flexgrid-gutters($columns, $gutters); - - } - - } - -} \ No newline at end of file diff --git a/src/assets/scss/libs/_skel.scss b/src/assets/scss/libs/_skel.scss deleted file mode 100644 index f5e0dcd..0000000 --- a/src/assets/scss/libs/_skel.scss +++ /dev/null @@ -1,587 +0,0 @@ -// skel.scss v3.0.2-dev | (c) skel.io | MIT licensed */ - -// Vars. - - /// Breakpoints. - /// @var {list} - $breakpoints: () !global; - - /// Vendor prefixes. - /// @var {list} - $vendor-prefixes: ( - '-moz-', - '-webkit-', - '-ms-', - '' - ); - - /// Properties that should be vendorized. - /// @var {list} - $vendor-properties: ( - 'align-content', - 'align-items', - 'align-self', - 'animation', - 'animation-delay', - 'animation-direction', - 'animation-duration', - 'animation-fill-mode', - 'animation-iteration-count', - 'animation-name', - 'animation-play-state', - 'animation-timing-function', - 'appearance', - 'backface-visibility', - 'box-sizing', - 'filter', - 'flex', - 'flex-basis', - 'flex-direction', - 'flex-flow', - 'flex-grow', - 'flex-shrink', - 'flex-wrap', - 'justify-content', - 'object-fit', - 'object-position', - 'order', - 'perspective', - 'pointer-events', - 'transform', - 'transform-origin', - 'transform-style', - 'transition', - 'transition-delay', - 'transition-duration', - 'transition-property', - 'transition-timing-function', - 'user-select' - ); - - /// Values that should be vendorized. - /// @var {list} - $vendor-values: ( - 'filter', - 'flex', - 'linear-gradient', - 'radial-gradient', - 'transform' - ); - -// Functions. - - /// Removes a specific item from a list. - /// @author Hugo Giraudel - /// @param {list} $list List. - /// @param {integer} $index Index. - /// @return {list} Updated list. - @function remove-nth($list, $index) { - - $result: null; - - @if type-of($index) != number { - @warn "$index: #{quote($index)} is not a number for `remove-nth`."; - } - @else if $index == 0 { - @warn "List index 0 must be a non-zero integer for `remove-nth`."; - } - @else if abs($index) > length($list) { - @warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`."; - } - @else { - - $result: (); - $index: if($index < 0, length($list) + $index + 1, $index); - - @for $i from 1 through length($list) { - - @if $i != $index { - $result: append($result, nth($list, $i)); - } - - } - - } - - @return $result; - - } - - /// Replaces a substring within another string. - /// @author Hugo Giraudel - /// @param {string} $string String. - /// @param {string} $search Substring. - /// @param {string} $replace Replacement. - /// @return {string} Updated string. - @function str-replace($string, $search, $replace: '') { - - $index: str-index($string, $search); - - @if $index { - @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace); - } - - @return $string; - - } - - /// Replaces a substring within each string in a list. - /// @param {list} $strings List of strings. - /// @param {string} $search Substring. - /// @param {string} $replace Replacement. - /// @return {list} Updated list of strings. - @function str-replace-all($strings, $search, $replace: '') { - - @each $string in $strings { - $strings: set-nth($strings, index($strings, $string), str-replace($string, $search, $replace)); - } - - @return $strings; - - } - - /// Gets a value from a map. - /// @author Hugo Giraudel - /// @param {map} $map Map. - /// @param {string} $keys Key(s). - /// @return {string} Value. - @function val($map, $keys...) { - - @if nth($keys, 1) == null { - $keys: remove-nth($keys, 1); - } - - @each $key in $keys { - $map: map-get($map, $key); - } - - @return $map; - - } - -// Mixins. - - /// Sets the global box model. - /// @param {string} $model Model (default is content). - @mixin boxModel($model: 'content') { - - $x: $model + '-box'; - - *, *:before, *:after { - -moz-box-sizing: #{$x}; - -webkit-box-sizing: #{$x}; - box-sizing: #{$x}; - } - - } - - /// Wraps @content in a @media block using a given breakpoint. - /// @param {string} $breakpoint Breakpoint. - /// @param {map} $queries Additional queries. - @mixin breakpoint($breakpoint: null, $queries: null) { - - $query: 'screen'; - - // Breakpoint. - @if $breakpoint and map-has-key($breakpoints, $breakpoint) { - $query: $query + ' and ' + map-get($breakpoints, $breakpoint); - } - - // Queries. - @if $queries { - @each $k, $v in $queries { - $query: $query + ' and (' + $k + ':' + $v + ')'; - } - } - - @media #{$query} { - @content; - } - - } - - /// Wraps @content in a @media block targeting a specific orientation. - /// @param {string} $orientation Orientation. - @mixin orientation($orientation) { - @media screen and (orientation: #{$orientation}) { - @content; - } - } - - /// Utility mixin for containers. - /// @param {mixed} $width Width. - @mixin containers($width) { - - // Locked? - $lock: false; - - @if length($width) == 2 { - $width: nth($width, 1); - $lock: true; - } - - // Modifiers. - .container.\31 25\25 { width: 100%; max-width: $width * 1.25; min-width: $width; } - .container.\37 5\25 { width: $width * 0.75; } - .container.\35 0\25 { width: $width * 0.5; } - .container.\32 5\25 { width: $width * 0.25; } - - // Main class. - .container { - @if $lock { - width: $width !important; - } - @else { - width: $width; - } - } - - } - - /// Utility mixin for grid. - /// @param {list} $gutters Column and row gutters (default is 40px). - /// @param {string} $breakpointName Optional breakpoint name. - @mixin grid($gutters: 40px, $breakpointName: null) { - - // Gutters. - @include grid-gutters($gutters); - @include grid-gutters($gutters, \32 00\25, 2); - @include grid-gutters($gutters, \31 50\25, 1.5); - @include grid-gutters($gutters, \35 0\25, 0.5); - @include grid-gutters($gutters, \32 5\25, 0.25); - - // Cells. - $x: ''; - - @if $breakpointName { - $x: '\\28' + $breakpointName + '\\29'; - } - - .\31 2u#{$x}, .\31 2u\24#{$x} { width: 100%; clear: none; margin-left: 0; } - .\31 1u#{$x}, .\31 1u\24#{$x} { width: 91.6666666667%; clear: none; margin-left: 0; } - .\31 0u#{$x}, .\31 0u\24#{$x} { width: 83.3333333333%; clear: none; margin-left: 0; } - .\39 u#{$x}, .\39 u\24#{$x} { width: 75%; clear: none; margin-left: 0; } - .\38 u#{$x}, .\38 u\24#{$x} { width: 66.6666666667%; clear: none; margin-left: 0; } - .\37 u#{$x}, .\37 u\24#{$x} { width: 58.3333333333%; clear: none; margin-left: 0; } - .\36 u#{$x}, .\36 u\24#{$x} { width: 50%; clear: none; margin-left: 0; } - .\35 u#{$x}, .\35 u\24#{$x} { width: 41.6666666667%; clear: none; margin-left: 0; } - .\34 u#{$x}, .\34 u\24#{$x} { width: 33.3333333333%; clear: none; margin-left: 0; } - .\33 u#{$x}, .\33 u\24#{$x} { width: 25%; clear: none; margin-left: 0; } - .\32 u#{$x}, .\32 u\24#{$x} { width: 16.6666666667%; clear: none; margin-left: 0; } - .\31 u#{$x}, .\31 u\24#{$x} { width: 8.3333333333%; clear: none; margin-left: 0; } - - .\31 2u\24#{$x} + *, - .\31 1u\24#{$x} + *, - .\31 0u\24#{$x} + *, - .\39 u\24#{$x} + *, - .\38 u\24#{$x} + *, - .\37 u\24#{$x} + *, - .\36 u\24#{$x} + *, - .\35 u\24#{$x} + *, - .\34 u\24#{$x} + *, - .\33 u\24#{$x} + *, - .\32 u\24#{$x} + *, - .\31 u\24#{$x} + * { - clear: left; - } - - .\-11u#{$x} { margin-left: 91.6666666667% } - .\-10u#{$x} { margin-left: 83.3333333333% } - .\-9u#{$x} { margin-left: 75% } - .\-8u#{$x} { margin-left: 66.6666666667% } - .\-7u#{$x} { margin-left: 58.3333333333% } - .\-6u#{$x} { margin-left: 50% } - .\-5u#{$x} { margin-left: 41.6666666667% } - .\-4u#{$x} { margin-left: 33.3333333333% } - .\-3u#{$x} { margin-left: 25% } - .\-2u#{$x} { margin-left: 16.6666666667% } - .\-1u#{$x} { margin-left: 8.3333333333% } - - } - - /// Utility mixin for grid. - /// @param {list} $gutters Gutters. - /// @param {string} $class Optional class name. - /// @param {integer} $multiplier Multiplier (default is 1). - @mixin grid-gutters($gutters, $class: null, $multiplier: 1) { - - // Expand gutters if it's not a list. - @if length($gutters) == 1 { - $gutters: ($gutters, 0); - } - - // Get column and row gutter values. - $c: nth($gutters, 1); - $r: nth($gutters, 2); - - // Get class (if provided). - $x: ''; - - @if $class { - $x: '.' + $class; - } - - // Default. - .row#{$x} > * { padding: ($r * $multiplier) 0 0 ($c * $multiplier); } - .row#{$x} { margin: ($r * $multiplier * -1) 0 -1px ($c * $multiplier * -1); } - - // Uniform. - .row.uniform#{$x} > * { padding: ($c * $multiplier) 0 0 ($c * $multiplier); } - .row.uniform#{$x} { margin: ($c * $multiplier * -1) 0 -1px ($c * $multiplier * -1); } - - } - - /// Wraps @content in vendorized keyframe blocks. - /// @param {string} $name Name. - @mixin keyframes($name) { - - @-moz-keyframes #{$name} { @content; } - @-webkit-keyframes #{$name} { @content; } - @-ms-keyframes #{$name} { @content; } - @keyframes #{$name} { @content; } - - } - - /// - /// Sets breakpoints. - /// @param {map} $x Breakpoints. - /// - @mixin skel-breakpoints($x: ()) { - $breakpoints: $x !global; - } - - /// - /// Initializes layout module. - /// @param {map} config Config. - /// - @mixin skel-layout($config: ()) { - - // Config. - $configPerBreakpoint: (); - - $z: map-get($config, 'breakpoints'); - - @if $z { - $configPerBreakpoint: $z; - } - - // Reset. - $x: map-get($config, 'reset'); - - @if $x { - - /* Reset */ - - @include reset($x); - - } - - // Box model. - $x: map-get($config, 'boxModel'); - - @if $x { - - /* Box Model */ - - @include boxModel($x); - - } - - // Containers. - $containers: map-get($config, 'containers'); - - @if $containers { - - /* Containers */ - - .container { - margin-left: auto; - margin-right: auto; - } - - // Use default is $containers is just "true". - @if $containers == true { - $containers: 960px; - } - - // Apply base. - @include containers($containers); - - // Apply per-breakpoint. - @each $name in map-keys($breakpoints) { - - // Get/use breakpoint setting if it exists. - $x: map-get($configPerBreakpoint, $name); - - // Per-breakpoint config exists? - @if $x { - $y: map-get($x, 'containers'); - - // Setting exists? Use it. - @if $y { - $containers: $y; - } - - } - - // Create @media block. - @media screen and #{map-get($breakpoints, $name)} { - @include containers($containers); - } - - } - - } - - // Grid. - $grid: map-get($config, 'grid'); - - @if $grid { - - /* Grid */ - - // Use defaults if $grid is just "true". - @if $grid == true { - $grid: (); - } - - // Sub-setting: Gutters. - $grid-gutters: 40px; - $x: map-get($grid, 'gutters'); - - @if $x { - $grid-gutters: $x; - } - - // Rows. - .row { - border-bottom: solid 1px transparent; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - box-sizing: border-box; - } - - .row > * { - float: left; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - box-sizing: border-box; - } - - .row:after, .row:before { - content: ''; - display: block; - clear: both; - height: 0; - } - - .row.uniform > * > :first-child { - margin-top: 0; - } - - .row.uniform > * > :last-child { - margin-bottom: 0; - } - - // Gutters (0%). - @include grid-gutters($grid-gutters, \30 \25, 0); - - // Apply base. - @include grid($grid-gutters); - - // Apply per-breakpoint. - @each $name in map-keys($breakpoints) { - - // Get/use breakpoint setting if it exists. - $x: map-get($configPerBreakpoint, $name); - - // Per-breakpoint config exists? - @if $x { - $y: map-get($x, 'grid'); - - // Setting exists? - @if $y { - - // Sub-setting: Gutters. - $x: map-get($y, 'gutters'); - - @if $x { - $grid-gutters: $x; - } - - } - - } - - // Create @media block. - @media screen and #{map-get($breakpoints, $name)} { - @include grid($grid-gutters, $name); - } - - } - - } - - } - - /// Resets browser styles. - /// @param {string} $mode Mode (default is 'normalize'). - @mixin reset($mode: 'normalize') { - - @if $mode == 'normalize' { - - // normalize.css v3.0.2 | MIT License | git.io/normalize - html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0} - - } - @else if $mode == 'full' { - - // meyerweb.com/eric/tools/css/reset v2.0 | 20110126 | License: none (public domain) - html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}body{-webkit-text-size-adjust:none} - - } - - } - - /// Vendorizes a declaration's property and/or value(s). - /// @param {string} $property Property. - /// @param {mixed} $value String/list of value(s). - @mixin vendor($property, $value) { - - // Determine if property should expand. - $expandProperty: index($vendor-properties, $property); - - // Determine if value should expand (and if so, add '-prefix-' placeholder). - $expandValue: false; - - @each $x in $value { - @each $y in $vendor-values { - @if $y == str-slice($x, 1, str-length($y)) { - - $value: set-nth($value, index($value, $x), '-prefix-' + $x); - $expandValue: true; - - } - } - } - - // Expand property? - @if $expandProperty { - @each $vendor in $vendor-prefixes { - #{$vendor}#{$property}: #{str-replace-all($value, '-prefix-', $vendor)}; - } - } - - // Expand just the value? - @elseif $expandValue { - @each $vendor in $vendor-prefixes { - #{$property}: #{str-replace-all($value, '-prefix-', $vendor)}; - } - } - - // Neither? Treat them as a normal declaration. - @else { - #{$property}: #{$value}; - } - - } \ No newline at end of file diff --git a/src/assets/scss/libs/_vars.scss b/src/assets/scss/libs/_vars.scss deleted file mode 100644 index 8284050..0000000 --- a/src/assets/scss/libs/_vars.scss +++ /dev/null @@ -1,58 +0,0 @@ -// Misc. - $misc: ( - z-index-base: 10000 - ); - -// Duration. - $duration: ( - transition: 0.2s - ); - -// Size. - $size: ( - border-radius: 0.35em, - element-height: 2.75em, - element-margin: 2em - ); - -// Font. - $font: ( - family: ('Source Sans Pro', Helvetica, sans-serif), - family-fixed: ('Courier New', monospace), - weight: 400, - weight-bold: 400 - ); - -// Palette. - $palette: ( - bg: #fff, - fg: #a2a2a2, - fg-bold: #787878, - fg-light: #b2b2b2, - border: #efefef, - border-bg: #f7f7f7, - border2: #dfdfdf, - border2-bg: #e7e7e7, - - accent1: ( - bg: #49bf9d, - fg: mix(#49bf9d, #ffffff, 25%), - fg-bold: #ffffff, - fg-light: mix(#49bf9d, #ffffff, 40%), - border: rgba(255,255,255,0.25), - border-bg: rgba(255,255,255,0.075), - border2: rgba(255,255,255,0.5), - border2-bg: rgba(255,255,255,0.2) - ), - - accent2: ( - bg: #1f1815, - fg: rgba(255,255,255,0.5), - fg-bold: #ffffff, - fg-light: rgba(255,255,255,0.4), - border: rgba(255,255,255,0.25), - border-bg: rgba(255,255,255,0.075), - border2: rgba(255,255,255,0.5), - border2-bg: rgba(255,255,255,0.2) - ) - ); \ No newline at end of file diff --git a/src/assets/scss/main.scss b/src/assets/scss/main.scss deleted file mode 100644 index a16cff1..0000000 --- a/src/assets/scss/main.scss +++ /dev/null @@ -1,1533 +0,0 @@ -@import 'libs/vars'; -@import 'libs/functions'; -@import 'libs/mixins'; -@import '../css/font-awesome.min.css'; -@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400italic"); - -/* - Strata by HTML5 UP - html5up.net | @ajlkn - Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) -*/ - - @import "libs/skel"; - - @include skel-breakpoints(( - xlarge: '(max-width: 1800px)', - large: '(max-width: 1280px)', - medium: '(max-width: 980px)', - small: '(max-width: 736px)', - xsmall: '(max-width: 480px)' - )); - - @include skel-layout(( - reset: 'full', - boxModel: 'border', - grid: ( gutters: 2.5em ), - conditionals: true, - containers: true, - breakpoints: ( - large: ( - grid: ( - gutters: 2em - ), - ), - small: ( - grid: ( - gutters: 1.5em - ), - ) - ) - )); - - $size-header-width: 35%; - $size-header-pad: 4em; - -/* Basic */ - - body { - background: _palette(bg); - - &.is-loading { - *, *:before, *:after { - @include vendor('animation', 'none !important'); - @include vendor('transition', 'none !important'); - } - } - } - - body, input, select, textarea { - color: _palette(fg); - font-family: _font(family); - font-size: 16pt; - font-weight: _font(weight); - line-height: 1.75em; - } - - a { - @include vendor('transition', ('color #{_duration(transition)} ease-in-out', 'border-color #{_duration(transition)} ease-in-out')); - border-bottom: dotted 1px; - color: _palette(accent1, bg); - text-decoration: none; - - &:hover { - border-bottom-color: transparent; - color: _palette(accent1, bg) !important; - text-decoration: none; - } - } - - strong, b { - color: _palette(fg-bold); - font-weight: _font(weight-bold); - } - - em, i { - font-style: italic; - } - - p { - margin: 0 0 _size(element-margin) 0; - } - - h1, h2, h3, h4, h5, h6 { - color: _palette(fg-bold); - font-weight: _font(weight-bold); - line-height: 1em; - margin: 0 0 (_size(element-margin) * 0.5) 0; - - a { - color: inherit; - text-decoration: none; - } - } - - h1 { - font-size: 2em; - line-height: 1.5em; - } - - h2 { - font-size: 1.5em; - line-height: 1.5em; - } - - h3 { - font-size: 1.25em; - line-height: 1.5em; - } - - h4 { - font-size: 1.1em; - line-height: 1.5em; - } - - h5 { - font-size: 0.9em; - line-height: 1.5em; - } - - h6 { - font-size: 0.7em; - line-height: 1.5em; - } - - sub { - font-size: 0.8em; - position: relative; - top: 0.5em; - } - - sup { - font-size: 0.8em; - position: relative; - top: -0.5em; - } - - hr { - border: 0; - border-bottom: solid 2px _palette(border); - - // This is the *only* instance where we need to rely on margin collapse. - margin: _size(element-margin) 0; - - &.major { - margin: (_size(element-margin) * 1.5) 0; - } - } - - blockquote { - border-left: solid 6px _palette(border); - font-style: italic; - margin: 0 0 _size(element-margin) 0; - padding: 0.5em 0 0.5em 1.5em; - } - - code { - background: _palette(border-bg); - border-radius: _size(border-radius); - border: solid 2px _palette(border); - font-family: _font(family-fixed); - font-size: 0.9em; - margin: 0 0.25em; - padding: 0.25em 0.65em; - } - - pre { - -webkit-overflow-scrolling: touch; - font-family: _font(family-fixed); - font-size: 0.9em; - margin: 0 0 _size(element-margin) 0; - - code { - display: block; - line-height: 1.75em; - padding: 1em 1.5em; - overflow-x: auto; - } - } - - .align-left { - text-align: left; - } - - .align-center { - text-align: center; - } - - .align-right { - text-align: right; - } - -/* Section/Article */ - - section, article { - &.special { - text-align: center; - } - } - - header { - p { - color: _palette(fg-light); - position: relative; - margin: 0 0 (_size(element-margin) * 0.75) 0; - } - - h2 + p { - font-size: 1.25em; - margin-top: (_size(element-margin) * -0.5); - line-height: 1.5em; - } - - h3 + p { - font-size: 1.1em; - margin-top: (_size(element-margin) * -0.4); - line-height: 1.5em; - } - - h4 + p, - h5 + p, - h6 + p { - font-size: 0.9em; - margin-top: (_size(element-margin) * -0.3); - line-height: 1.5em; - } - - &.major { - h2 { - font-size: 2em; - } - } - } - -/* Form */ - - form { - margin: 0 0 _size(element-margin) 0; - } - - label { - color: _palette(fg-bold); - display: block; - font-size: 0.9em; - font-weight: _font(weight-bold); - margin: 0 0 (_size(element-margin) * 0.5) 0; - } - - input[type="text"], - input[type="password"], - input[type="email"], - select, - textarea { - @include vendor('appearance', 'none'); - background: _palette(border-bg); - border-radius: _size(border-radius); - border: solid 2px transparent; - color: inherit; - display: block; - outline: 0; - padding: 0 0.75em; - text-decoration: none; - width: 100%; - - &:invalid { - box-shadow: none; - } - - &:focus { - border-color: _palette(accent1, bg); - } - } - - .select-wrapper { - @include icon; - display: block; - position: relative; - - &:before { - color: _palette(border2); - content: '\f078'; - display: block; - height: _size(element-height); - line-height: _size(element-height); - pointer-events: none; - position: absolute; - right: 0; - text-align: center; - top: 0; - width: _size(element-height); - } - - select::-ms-expand { - display: none; - } - } - - .displayErrors input:invalid { - border-color: #f73772; - } - - input[type="text"], - input[type="password"], - input[type="email"], - select { - height: _size(element-height); - } - - textarea { - padding: 0.75em; - } - - input[type="checkbox"], - input[type="radio"] { - @include vendor('appearance', 'none'); - display: block; - float: left; - margin-right: -2em; - opacity: 0; - width: 1em; - z-index: -1; - - & + label { - @include icon; - color: _palette(fg); - cursor: pointer; - display: inline-block; - font-size: 1em; - font-weight: _font(weight); - padding-left: (_size(element-height) * 0.6) + 0.75em; - padding-right: 0.75em; - position: relative; - - &:before { - background: _palette(border-bg); - border-radius: _size(border-radius); - border: solid 2px transparent; - content: ''; - display: inline-block; - height: (_size(element-height) * 0.6); - left: 0; - line-height: (_size(element-height) * 0.575); - position: absolute; - text-align: center; - top: 0; - width: (_size(element-height) * 0.6); - } - } - - &:checked + label { - &:before { - background: _palette(fg-bold); - border-color: _palette(fg-bold); - color: _palette(bg); - content: '\f00c'; - } - } - - &:focus + label { - &:before { - border-color: _palette(accent1, bg); - } - } - } - - input[type="checkbox"] { - & + label { - &:before { - border-radius: _size(border-radius); - } - } - } - - input[type="radio"] { - & + label { - &:before { - border-radius: 100%; - } - } - } - - ::-webkit-input-placeholder { - color: _palette(fg-light) !important; - opacity: 1.0; - } - - :-moz-placeholder { - color: _palette(fg-light) !important; - opacity: 1.0; - } - - ::-moz-placeholder { - color: _palette(fg-light) !important; - opacity: 1.0; - } - - :-ms-input-placeholder { - color: _palette(fg-light) !important; - opacity: 1.0; - } - - .formerize-placeholder { - color: _palette(fg-light) !important; - opacity: 1.0; - } - -/* Box */ - - .box { - border-radius: _size(border-radius); - border: solid 2px _palette(border); - margin-bottom: _size(element-margin); - padding: 1.5em; - - > :last-child, - > :last-child > :last-child, - > :last-child > :last-child > :last-child { - margin-bottom: 0; - } - - &.alt { - border: 0; - border-radius: 0; - padding: 0; - } - } - -/* Icon */ - - .icon { - @include icon; - border-bottom: none; - position: relative; - - > .label { - display: none; - } - } - -/* Image */ - - .image { - border-radius: _size(border-radius); - border: 0; - display: inline-block; - position: relative; - - &:before { - @include vendor('transition', 'opacity #{_duration(transition)} ease-in-out'); - background: url('images/overlay.png'); - border-radius: _size(border-radius); - content: ''; - display: block; - height: 100%; - left: 0; - opacity: 0.5; - position: absolute; - top: 0; - width: 100%; - } - - &.thumb { - text-align: center; - - &:after { - @include vendor('transition', 'opacity #{_duration(transition)} ease-in-out'); - border-radius: _size(border-radius); - border: solid 3px rgba(255,255,255,0.5); - color: #fff; - content: 'View'; - display: inline-block; - font-size: 0.8em; - font-weight: _font(weight-bold); - left: 50%; - line-height: 2.25em; - margin: -1.25em 0 0 -3em; - opacity: 0; - padding: 0 1.5em; - position: absolute; - text-align: center; - text-decoration: none; - top: 50%; - white-space: nowrap; - } - - &:hover { - &:after { - opacity: 1.0; - } - - &:before { - background: url('images/overlay.png'), url('images/overlay.png'); - opacity: 1.0; - } - } - } - - img { - border-radius: _size(border-radius); - display: block; - } - - &.left { - float: left; - margin: 0 1.5em 1em 0; - top: 0.25em; - } - - &.right { - float: right; - margin: 0 0 1em 1.5em; - top: 0.25em; - } - - &.left, - &.right { - max-width: 40%; - - img { - width: 100%; - } - } - - &.fit { - display: block; - margin: 0 0 _size(element-margin) 0; - width: 100%; - - img { - width: 100%; - } - } - - &.avatar { - border-radius: 100%; - - &:before { - display: none; - } - - img { - border-radius: 100%; - width: 100%; - } - } - } - -/* List */ - - ol { - list-style: decimal; - margin: 0 0 _size(element-margin) 0; - padding-left: 1.25em; - - li { - padding-left: 0.25em; - } - } - - ul { - list-style: disc; - margin: 0 0 _size(element-margin) 0; - padding-left: 1em; - - li { - padding-left: 0.5em; - } - - &.alt { - list-style: none; - padding-left: 0; - - li { - border-top: solid 2px _palette(border); - padding: 0.5em 0; - - &:first-child { - border-top: 0; - padding-top: 0; - } - } - } - - &.icons { - cursor: default; - list-style: none; - padding-left: 0; - - li { - display: inline-block; - padding: 0 1em 0 0; - - &:last-child { - padding-right: 0; - } - - .icon { - &:before { - font-size: 1.5em; - } - } - } - } - - &.actions { - cursor: default; - list-style: none; - padding-left: 0; - - li { - display: inline-block; - padding: 0 (_size(element-margin) * 0.5) 0 0; - vertical-align: middle; - - &:last-child { - padding-right: 0; - } - } - - &.small { - li { - padding: 0 (_size(element-margin) * 0.25) 0 0; - } - } - - &.vertical { - li { - display: block; - padding: (_size(element-margin) * 0.5) 0 0 0; - - &:first-child { - padding-top: 0; - } - - > * { - margin-bottom: 0; - } - } - - &.small { - li { - padding: (_size(element-margin) * 0.25) 0 0 0; - - &:first-child { - padding-top: 0; - } - } - } - } - - &.fit { - display: table; - margin-left: (_size(element-margin) * -0.5); - padding: 0; - table-layout: fixed; - width: calc(100% + #{(_size(element-margin) * 0.5)}); - - li { - display: table-cell; - padding: 0 0 0 (_size(element-margin) * 0.5); - - > * { - margin-bottom: 0; - } - } - - &.small { - margin-left: (_size(element-margin) * -0.25); - width: calc(100% + #{(_size(element-margin) * 0.25)}); - - li { - padding: 0 0 0 (_size(element-margin) * 0.25); - } - } - } - } - - &.labeled-icons { - list-style: none; - padding: 0; - - li { - line-height: 1.75em; - margin: 1.5em 0 0 0; - padding-left: 2.25em; - position: relative; - - &:first-child { - margin-top: 0; - } - - a { - color: inherit; - } - - h3 { - color: _palette(fg-light); - left: 0; - position: absolute; - text-align: center; - top: 0; - width: 1em; - } - } - } - } - - dl { - margin: 0 0 _size(element-margin) 0; - } - -/* Table */ - - .table-wrapper { - -webkit-overflow-scrolling: touch; - overflow-x: auto; - } - - table { - margin: 0 0 _size(element-margin) 0; - width: 100%; - - tbody { - tr { - border: solid 1px _palette(border); - border-left: 0; - border-right: 0; - - &:nth-child(2n + 1) { - background-color: _palette(border-bg); - } - } - } - - td { - padding: 0.75em 0.75em; - } - - th { - color: _palette(fg-bold); - font-size: 0.9em; - font-weight: _font(weight-bold); - padding: 0 0.75em 0.75em 0.75em; - text-align: left; - } - - thead { - border-bottom: solid 2px _palette(border); - } - - tfoot { - border-top: solid 2px _palette(border); - } - - &.alt { - border-collapse: separate; - - tbody { - tr { - td { - border: solid 2px _palette(border); - border-left-width: 0; - border-top-width: 0; - - &:first-child { - border-left-width: 2px; - } - } - - &:first-child { - td { - border-top-width: 2px; - } - } - } - } - - thead { - border-bottom: 0; - } - - tfoot { - border-top: 0; - } - } - } - -/* Button */ - - input[type="submit"], - input[type="reset"], - input[type="button"], - .button { - @include vendor('appearance', 'none'); - @include vendor('transition', ('background-color #{_duration(transition)} ease-in-out', 'color #{_duration(transition)} ease-in-out', 'border-color #{_duration(transition)} ease-in-out')); - background-color: transparent; - border-radius: _size(border-radius); - border: solid 3px _palette(border); - color: _palette(fg-bold) !important; - cursor: pointer; - display: inline-block; - font-weight: _font(weight-bold); - height: 3.15em; - height: calc(2.75em + 6px); - line-height: 2.75em; - min-width: 10em; - padding: 0 1.5em; - text-align: center; - text-decoration: none; - white-space: nowrap; - - &:hover { - border-color: _palette(accent1, bg); - color: _palette(accent1, bg) !important; - } - - &:active { - background-color: transparentize(_palette(accent1, bg), 0.9); - border-color: _palette(accent1, bg); - color: _palette(accent1, bg) !important; - } - - &.icon { - padding-left: 1.35em; - - &:before { - margin-right: 0.5em; - } - } - - &.fit { - display: block; - margin: 0 0 (_size(element-margin) * 0.5) 0; - min-width: 0; - width: 100%; - } - - &.small { - font-size: 0.8em; - } - - &.big { - font-size: 1.35em; - } - - &.special { - background-color: _palette(accent1, bg); - border-color: _palette(accent1, bg); - color: _palette(accent1, fg-bold) !important; - - &:hover { - background-color: lighten(_palette(accent1, bg), 5); - border-color: lighten(_palette(accent1, bg), 5); - } - - &:active { - background-color: darken(_palette(accent1, bg), 5); - border-color: darken(_palette(accent1, bg), 5); - } - } - - &.disabled, - &:disabled { - background-color: _palette(border2-bg) !important; - border-color: _palette(border2-bg) !important; - color: _palette(fg-light) !important; - cursor: default; - } - } - -/* Work Item */ - - .work-item { - margin: 0 0 _size(element-margin) 0; - - .image { - margin: 0 0 (_size(element-margin) * 0.75) 0; - } - - h3 { - font-size: 1em; - margin: 0 0 (_size(element-margin) * 0.25) 0; - } - - p { - font-size: 0.8em; - line-height: 1.5em; - margin: 0; - } - } - -/* Header */ - - #header { - @include vendor('display', 'flex'); - @include vendor('flex-direction', 'column'); - @include vendor('align-items', 'flex-end'); - @include vendor('justify-content', 'space-between'); - background-color: _palette(accent2, bg); - background-attachment: scroll, fixed; - background-image: url('images/overlay.png'), url('../images/bg.jpg'); - background-position: top left, top left; - background-repeat: repeat, no-repeat; - background-size: auto, auto 100%; - color: _palette(accent2, fg); - height: 100%; - left: 0; - padding: ($size-header-pad * 2) $size-header-pad; - position: fixed; - text-align: right; - top: 0; - width: $size-header-width; - - > * { - @include vendor('flex-shrink', '0'); - width: 100%; - } - - > .inner { - @include vendor('flex-grow', '1'); - margin: 0 0 ($size-header-pad * 0.5) 0; - } - - strong, b { - color: _palette(accent2, fg-bold); - } - - h2, h3, h4, h5, h6 { - color: _palette(accent2, fg-bold); - } - - h1 { - color: _palette(accent2, fg); - font-size: 1.35em; - line-height: 1.75em; - margin: 0; - } - - .image.avatar { - margin: 0 0 (_size(element-margin) * 0.5) 0; - width: 6.25em; - } - } - -/* Footer */ - - #footer { - .icons { - margin: (_size(element-margin) * 0.5) 0 0 0; - - a { - color: _palette(accent2, fg-light); - } - } - - .copyright { - color: _palette(accent2, fg-light); - font-size: 0.8em; - list-style: none; - margin: (_size(element-margin) * 0.5) 0 0 0; - padding: 0; - - li { - border-left: solid 1px _palette(accent2, border); - display: inline-block; - line-height: 1em; - margin-left: 0.75em; - padding-left: 0.75em; - - &:first-child { - border-left: 0; - margin-left: 0; - padding-left: 0; - } - - a { - color: inherit; - } - } - } - } - -/* Main */ - - #main { - margin-left: $size-header-width; - max-width: 50em + $size-header-pad; - padding: ($size-header-pad * 2) $size-header-pad $size-header-pad $size-header-pad; - width: calc(100% - #{$size-header-width}); - - > section { - border-top: solid 2px _palette(border); - margin: $size-header-pad 0 0 0; - padding: $size-header-pad 0 0 0; - - &:first-child { - border-top: 0; - margin-top: 0; - padding-top: 0; - } - } - } - -/* Poptrox */ - - @include keyframes('spin') { - 0% { @include vendor('transform', 'rotate(0deg)'); } - 100% { @include vendor('transform', 'rotate(360deg)'); } - }; - - .poptrox-popup { - @include vendor('box-sizing', 'content-box'); - -webkit-tap-highlight-color: rgba(255,255,255,0); - background: #fff; - border-radius: _size(border-radius); - box-shadow: 0 0.1em 0.15em 0 rgba(0,0,0,0.15); - overflow: hidden; - padding-bottom: 3em; - - .loader { - @include icon; - @include vendor('animation', 'spin 1s linear infinite'); - font-size: 1.5em; - height: 1em; - left: 50%; - line-height: 1em; - margin: -0.5em 0 0 -0.5em; - position: absolute; - top: 50%; - width: 1em; - - &:before { - content: '\f1ce'; - } - } - - .caption { - background: #fff; - bottom: 0; - cursor: default; - font-size: 0.9em; - height: 3em; - left: 0; - line-height: 2.8em; - position: absolute; - text-align: center; - width: 100%; - z-index: 1; - } - - .nav-next, - .nav-previous { - @include icon; - @include vendor('transition', 'opacity #{_duration(transition)} ease-in-out'); - -webkit-tap-highlight-color: rgba(255,255,255,0); - background: rgba(0,0,0,0.01); - cursor: pointer; - height: 100%; - opacity: 0; - position: absolute; - top: 0; - width: 50%; - - &:before { - color: #fff; - font-size: 2.5em; - height: 1em; - line-height: 1em; - margin-top: -0.75em; - position: absolute; - text-align: center; - top: 50%; - width: 1.5em; - } - } - - .nav-next { - right: 0; - - &:before { - content: '\f105'; - right: 0; - } - } - - .nav-previous { - left: 0; - - &:before { - content: '\f104'; - left: 0; - } - } - - .closer { - @include icon; - @include vendor('transition', 'opacity #{_duration(transition)} ease-in-out'); - -webkit-tap-highlight-color: rgba(255,255,255,0); - color: #fff; - height: 4em; - line-height: 4em; - opacity: 0; - position: absolute; - right: 0; - text-align: center; - top: 0; - width: 4em; - z-index: 2; - - &:before { - @include vendor('box-sizing', 'content-box'); - border-radius: 100%; - border: solid 3px rgba(255,255,255,0.5); - content: '\f00d'; - display: block; - font-size: 1em; - height: 1.75em; - left: 50%; - line-height: 1.75em; - margin: -0.875em 0 0 -0.875em; - position: absolute; - top: 50%; - width: 1.75em; - } - } - - &:hover { - .nav-next, - .nav-previous { - opacity: 0.5; - - &:hover { - opacity: 1.0; - } - } - - .closer { - opacity: 0.5; - - &:hover { - opacity: 1.0; - } - } - } - } - -/* Touch */ - - body.is-touch { - - .image { - &.thumb { - &:before { - opacity: 0.5 !important; - } - - &:after { - display: none !important; - } - } - } - - #header { - background-attachment: scroll; - background-size: auto, cover; - } - - .poptrox-popup { - .nav-next, - .nav-previous, - .closer { - opacity: 1.0 !important; - } - } - - } - -/* XLarge */ - - @include breakpoint(xlarge) { - - /* Basic */ - - body, input, select, textarea { - font-size: 12pt; - } - - } - -/* Large */ - - @include breakpoint(large) { - - $size-header-width: 30%; - $size-header-pad: 3em; - - /* Header */ - - #header { - padding: ($size-header-pad * 2) $size-header-pad $size-header-pad $size-header-pad; - width: $size-header-width; - - h1 { - font-size: 1.25em; - - br { - display: none; - } - } - } - - /* Footer */ - - #footer { - .copyright { - li { - border-left-width: 0; - display: block; - line-height: 2.25em; - margin-left: 0; - padding-left: 0; - } - } - } - - /* Main */ - - #main { - margin-left: $size-header-width; - max-width: none; - padding: ($size-header-pad * 2) $size-header-pad $size-header-pad $size-header-pad; - width: calc(100% - #{$size-header-width}); - } - - } - -/* Medium */ - - @include breakpoint(medium) { - - $size-header-pad: 4em; - - /* Basic */ - - h1, h2, h3, h4, h5, h6 { - br { - display: none; - } - } - - /* List */ - - ul { - &.icons { - li { - .icon { - font-size: 1.25em; - } - } - } - } - - /* Header */ - - #header { - background-attachment: scroll; - background-position: top left, center center; - background-size: auto, cover; - left: auto; - padding: ($size-header-pad * 1.5) $size-header-pad; - position: relative; - text-align: center; - top: auto; - width: 100%; - display: block; - - h1 { - font-size: 1.75em; - - br { - display: inline; - } - } - } - - /* Footer */ - - #footer { - bottom: auto; - left: auto; - padding: $size-header-pad $size-header-pad ($size-header-pad * 1.5) $size-header-pad; - position: relative; - text-align: center; - width: 100%; - - .icons { - margin: 0 0 (_size(element-margin) * 0.5) 0; - } - - .copyright { - margin: 0 0 (_size(element-margin) * 0.5) 0; - - li { - border-left-width: 1px; - display: inline-block; - line-height: 1em; - margin-left: 0.75em; - padding-left: 0.75em; - } - } - } - - /* Main */ - - #main { - margin: 0; - padding: ($size-header-pad * 1.5) $size-header-pad; - width: 100%; - } - - } - -/* Small */ - - @include breakpoint(small) { - - $size-header-pad: 1.5em; - - /* Basic */ - - h1 { - font-size: 1.5em; - } - - h2 { - font-size: 1.2em; - } - - h3 { - font-size: 1em; - } - - /* Section/Article */ - - section, article { - &.special { - text-align: center; - } - } - - header { - &.major { - h2 { - font-size: 1.35em; - } - } - } - - /* List */ - - ul { - &.labeled-icons { - li { - padding-left: 2em; - - h3 { - line-height: 1.75em; - } - } - } - } - - /* Header */ - - #header { - padding: ($size-header-pad * 1.5) $size-header-pad; - - h1 { - font-size: 1.35em; - } - } - - /* Footer */ - - #footer { - padding: ($size-header-pad * 1.5) $size-header-pad; - } - - /* Main */ - - #main { - padding: ($size-header-pad * 1.5) $size-header-pad (($size-header-pad * 1.5) - _size(element-margin)) $size-header-pad; - - > section { - margin: ($size-header-pad * 1.5) 0 0 0; - padding: ($size-header-pad * 1.5) 0 0 0; - } - } - - /* Poptrox */ - - .poptrox-popup { - border-radius: 0; - - .nav-next, - .nav-previous { - &:before { - margin-top: -1em; - } - } - } - - } - -/* XSmall */ - - @include breakpoint(xsmall) { - - $size-header-pad: 1.5em; - - /* List */ - - ul { - &.actions { - margin: 0 0 _size(element-margin) 0; - - li { - display: block; - padding: (_size(element-margin) * 0.5) 0 0 0; - text-align: center; - width: 100%; - - &:first-child { - padding-top: 0; - } - - > * { - margin: 0 !important; - width: 100%; - - &.icon { - &:before { - margin-left: -2em; - } - } - } - } - - &.small { - li { - padding: (_size(element-margin) * 0.25) 0 0 0; - - &:first-child { - padding-top: 0; - } - } - } - } - } - - /* Header */ - - #header { - padding: ($size-header-pad * 3) $size-header-pad; - - h1 { - br { - display: none; - } - } - } - - /* Footer */ - - #footer { - .copyright { - li { - border-left-width: 0; - display: block; - line-height: 2.25em; - margin-left: 0; - padding-left: 0; - } - } - } - - } - -@media screen and (max-width: 480px) { - .\36 u, - .\36 u24, - .\38 u, - .\38 u24, - .\34 u, - .\34 u24 { - width: 100%; - } -} - -@keyframes bounce { - from, 20%, 53%, 80%, to { - animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transform: translate3d(0,0,0); - } - - 40%, 43% { - animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - transform: translate3d(0, -30px, 0); - } - - 70% { - animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - transform: translate3d(0, -15px, 0); - } - - 90% { - transform: translate3d(0,-4px,0); - } -} - -.bounce { - animation: bounce 0.5s; - transform-origin: center bottom; -} \ No newline at end of file diff --git a/src/assets/style.css b/src/assets/style.css new file mode 100644 index 0000000..1197b37 --- /dev/null +++ b/src/assets/style.css @@ -0,0 +1,450 @@ +/* + thiessen.io — personal site + Swiss-minimal direction. Display: Space Grotesk · Body: Hanken Grotesk · Mono: Space Mono. + One accent (signal cobalt), used only for links and the live timeline node. +*/ + +:root { + --paper: #f4f5f7; + --paper-2: #ffffff; + --ink: #15171c; + --graphite: #565d66; + --graphite-2: #8a919b; + --mist: #e4e7ec; + --signal: #1f44f0; + --signal-weak: rgba(31, 68, 240, 0.10); + + --font-display: 'Space Grotesk', 'Hanken Grotesk', system-ui, sans-serif; + --font-body: 'Hanken Grotesk', system-ui, -apple-system, sans-serif; + --font-mono: 'Space Mono', ui-monospace, 'SFMono-Regular', monospace; + + --wrap: 1100px; +} + +/* ---------- reset ---------- */ + +*, *::before, *::after { box-sizing: border-box; } + +html { -webkit-text-size-adjust: 100%; } + +body { + margin: 0; + background: var(--paper); + color: var(--ink); + font-family: var(--font-body); + font-size: 1.0625rem; + line-height: 1.65; + font-weight: 400; + -webkit-font-smoothing: antialiased; + text-rendering: optimizeLegibility; +} + +img { display: block; max-width: 100%; } + +a { color: inherit; } + +::selection { background: var(--signal); color: #fff; } + +:focus-visible { + outline: 2px solid var(--signal); + outline-offset: 3px; + border-radius: 1px; +} + +/* ---------- layout ---------- */ + +.wrap { + width: 100%; + max-width: var(--wrap); + margin: 0 auto; + padding: 0 clamp(1.25rem, 5vw, 3.5rem); +} + +.section { + display: grid; + grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); + gap: 2.75rem; + padding: clamp(3.5rem, 7vw, 6rem) 0; + border-top: 1px solid var(--mist); +} + +.section__label { + position: sticky; + top: 2rem; + align-self: start; + font-family: var(--font-mono); + font-size: 0.72rem; + letter-spacing: 0.22em; + text-transform: uppercase; + color: var(--graphite-2); +} + +/* ---------- top bar ---------- */ + +.topbar { + display: flex; + align-items: center; + justify-content: space-between; + gap: 1rem; + padding: 1.75rem 0; + font-family: var(--font-mono); + font-size: 0.74rem; + letter-spacing: 0.08em; +} + +.topbar__name { color: var(--ink); text-transform: uppercase; } + +.status { + display: inline-flex; + align-items: center; + gap: 0.55rem; + text-transform: uppercase; + letter-spacing: 0.16em; + color: var(--graphite); +} + +.status__dot { + width: 7px; + height: 7px; + border-radius: 50%; + background: var(--signal); + box-shadow: 0 0 0 4px var(--signal-weak); + animation: pulse 2.6s ease-in-out infinite; +} + +@keyframes pulse { + 0%, 100% { box-shadow: 0 0 0 4px var(--signal-weak); } + 50% { box-shadow: 0 0 0 7px rgba(31, 68, 240, 0.03); } +} + +/* ---------- hero ---------- */ + +.hero { + display: grid; + grid-template-columns: minmax(0, 1.55fr) minmax(0, 0.7fr); + gap: clamp(2rem, 5vw, 4rem); + align-items: center; + padding: clamp(2rem, 5vw, 3.5rem) 0 clamp(3.5rem, 7vw, 5.5rem); +} + +.eyebrow { + font-family: var(--font-mono); + font-size: 0.74rem; + letter-spacing: 0.2em; + text-transform: uppercase; + color: var(--graphite-2); + margin: 0 0 1.5rem; +} + +.hero__name { + font-family: var(--font-display); + font-weight: 600; + font-size: clamp(3rem, 9.5vw, 7rem); + line-height: 0.92; + letter-spacing: -0.035em; + margin: 0; +} + +.hero__lead { + font-family: var(--font-display); + font-weight: 400; + font-size: clamp(1.35rem, 2.7vw, 2rem); + line-height: 1.18; + letter-spacing: -0.01em; + color: var(--ink); + max-width: 30ch; + margin: 1.75rem 0 0; +} + +.hero__meta { + margin: 1.5rem 0 0; + color: var(--graphite); + max-width: 46ch; +} + +.hero__meta strong { color: var(--ink); font-weight: 600; } + +.actions { + display: flex; + flex-wrap: wrap; + gap: 1.25rem 2rem; + margin: 2.25rem 0 0; +} + +.actions a { + font-weight: 500; + color: var(--ink); + text-decoration: none; + border-bottom: 1.5px solid var(--ink); + padding-bottom: 2px; + transition: color 0.15s ease, border-color 0.15s ease; +} + +.actions a:hover { color: var(--signal); border-color: var(--signal); } + +.portrait { + justify-self: end; + width: 100%; + max-width: 280px; +} + +.portrait img { + width: 100%; + aspect-ratio: 4 / 5; + object-fit: cover; + border-radius: 6px; + border: 1px solid var(--mist); + filter: grayscale(100%) contrast(1.02); + transition: filter 0.4s ease; +} + +.portrait img:hover { filter: grayscale(0%); } + +/* ---------- profile ---------- */ + +.prose p { + margin: 0 0 1.25rem; + color: var(--graphite); + max-width: 62ch; + font-size: 1.1rem; +} + +.prose p:last-child { margin-bottom: 0; } + +.prose strong { color: var(--ink); font-weight: 600; } + +/* ---------- experience timeline (the signature) ---------- */ + +.roles { list-style: none; margin: 0; padding: 0; } + +.role { + display: grid; + grid-template-columns: 1.5rem minmax(0, 1fr); + column-gap: 1.5rem; +} + +.role__rail { position: relative; } + +.role__rail::before { + content: ''; + position: absolute; + left: 50%; + top: 0; + bottom: 0; + width: 1px; + background: var(--mist); + transform: translateX(-50%); +} + +.role:first-child .role__rail::before { top: 0.62rem; } +.role:last-child .role__rail::before { bottom: auto; height: 0.62rem; } + +.role__node { + position: absolute; + left: 50%; + top: 0.62rem; + width: 9px; + height: 9px; + border-radius: 50%; + background: var(--paper); + border: 1.5px solid var(--ink); + transform: translate(-50%, -50%); + z-index: 1; +} + +.role--live .role__node { + background: var(--signal); + border-color: var(--signal); + box-shadow: 0 0 0 4px var(--signal-weak); + animation: pulse 2.6s ease-in-out infinite; +} + +.role__body { padding-bottom: 2.75rem; } +.role:last-child .role__body { padding-bottom: 0; } + +.role__year { + font-family: var(--font-mono); + font-size: 0.72rem; + letter-spacing: 0.08em; + color: var(--graphite-2); + margin: 0 0 0.5rem; +} + +.role--live .role__year { color: var(--signal); } + +.role__head { + display: flex; + flex-wrap: wrap; + align-items: baseline; + gap: 0.4rem 0.85rem; +} + +.role__co { + font-family: var(--font-display); + font-weight: 600; + font-size: 1.4rem; + letter-spacing: -0.015em; + margin: 0; +} + +.role__loc { + font-family: var(--font-mono); + font-size: 0.72rem; + letter-spacing: 0.06em; + color: var(--graphite-2); +} + +.role__title { + margin: 0.35rem 0 0; + font-weight: 600; + color: var(--ink); +} + +.role__desc { + margin: 0.55rem 0 0; + color: var(--graphite); + max-width: 58ch; +} + +/* ---------- stack ---------- */ + +.stack { display: flex; flex-direction: column; gap: 1.6rem; } + +.group { + display: grid; + grid-template-columns: minmax(0, 10rem) minmax(0, 1fr); + gap: 0.5rem 1.5rem; + align-items: baseline; + padding-bottom: 1.6rem; + border-bottom: 1px solid var(--mist); +} + +.stack .group:last-child { border-bottom: 0; padding-bottom: 0; } + +.group__label { + font-family: var(--font-mono); + font-size: 0.72rem; + letter-spacing: 0.14em; + text-transform: uppercase; + color: var(--graphite-2); +} + +.group__tags { + font-family: var(--font-mono); + font-size: 0.82rem; + line-height: 1.95; + color: var(--graphite-2); +} + +.group__tags .t { color: var(--ink); } + +/* ---------- contact ---------- */ + +.contact__intro { + color: var(--graphite); + max-width: 50ch; + font-size: 1.1rem; + margin: 0 0 1.75rem; +} + +.contact__email { + display: inline-block; + font-family: var(--font-display); + font-weight: 500; + font-size: clamp(1.7rem, 4.5vw, 3rem); + letter-spacing: -0.025em; + color: var(--ink); + text-decoration: none; + transition: color 0.15s ease; +} + +.contact__email:hover { color: var(--signal); } + +.contact__links { + display: flex; + flex-wrap: wrap; + gap: 1.25rem 2rem; + margin: 2rem 0 0; +} + +.contact__links a { + font-weight: 500; + color: var(--ink); + text-decoration: none; + border-bottom: 1.5px solid var(--ink); + padding-bottom: 2px; + transition: color 0.15s ease, border-color 0.15s ease; +} + +.contact__links a:hover { color: var(--signal); border-color: var(--signal); } + +/* ---------- colophon ---------- */ + +.colophon { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + gap: 0.75rem 1.5rem; + padding: 2.25rem 0 3.5rem; + border-top: 1px solid var(--mist); + font-family: var(--font-mono); + font-size: 0.7rem; + letter-spacing: 0.08em; + text-transform: uppercase; + color: var(--graphite-2); +} + +/* ---------- 404 ---------- */ + +.notfound { padding: clamp(4rem, 12vw, 9rem) 0; } + +.notfound h1 { + font-family: var(--font-display); + font-weight: 600; + font-size: clamp(2.5rem, 8vw, 5rem); + letter-spacing: -0.03em; + margin: 0 0 1rem; +} + +.notfound p { color: var(--graphite); max-width: 40ch; } + +.notfound a { + color: var(--ink); + border-bottom: 1.5px solid var(--ink); + text-decoration: none; + padding-bottom: 2px; +} + +.notfound a:hover { color: var(--signal); border-color: var(--signal); } + +/* ---------- responsive ---------- */ + +@media (max-width: 820px) { + .section { grid-template-columns: 1fr; gap: 1.5rem; } + .section__label { position: static; top: auto; } + .group { grid-template-columns: 1fr; } +} + +@media (max-width: 680px) { + .hero { + grid-template-columns: 1fr; + gap: 2.5rem; + } + .portrait { justify-self: start; order: -1; max-width: 150px; } + .portrait img { aspect-ratio: 1 / 1; } +} + +@media (max-width: 520px) { + .topbar { flex-wrap: wrap; gap: 0.4rem 1rem; } +} + +@media (max-width: 460px) { + .topbar { font-size: 0.68rem; letter-spacing: 0.05em; } + .status { letter-spacing: 0.12em; } +} + +/* ---------- motion ---------- */ + +@media (prefers-reduced-motion: reduce) { + *, *::before, *::after { animation: none !important; transition: none !important; } +} diff --git a/src/components/Footer.js b/src/components/Footer.js deleted file mode 100644 index 157cba7..0000000 --- a/src/components/Footer.js +++ /dev/null @@ -1,22 +0,0 @@ -import React from 'react' - -class Footer extends React.Component { - render() { - return ( - - ) - } -} - -export default Footer diff --git a/src/components/Gallery.js b/src/components/Gallery.js deleted file mode 100644 index 8168343..0000000 --- a/src/components/Gallery.js +++ /dev/null @@ -1,50 +0,0 @@ -import React, { useState } from 'react' -import Lightbox from "yet-another-react-lightbox" -import "yet-another-react-lightbox/styles.css" - -const Gallery = ({ images = [] }) => { - const [isOpen, setIsOpen] = useState(false) - const [photoIndex, setPhotoIndex] = useState(0) - - const openLightbox = (index) => { - setPhotoIndex(index) - setIsOpen(true) - } - - return ( - <> - {isOpen && ( - setIsOpen(false)} - index={photoIndex} - slides={images.map(img => ({ - src: img.src, - title: img.caption, - description: img.description - }))} - /> - )} -
- {images.map((obj, i) => ( - - ))} -
- - ) -} - -export default Gallery diff --git a/src/components/Header.js b/src/components/Header.js deleted file mode 100644 index 4c10d30..0000000 --- a/src/components/Header.js +++ /dev/null @@ -1,21 +0,0 @@ -import React from 'react' - -import Footer from './Footer' -import avatar from '../assets/images/avatar.jpg' - -class Header extends React.Component { - render() { - return ( - - ) - } -} - -export default Header diff --git a/src/components/layout.js b/src/components/layout.js index 0cb7955..5481c91 100644 --- a/src/components/layout.js +++ b/src/components/layout.js @@ -1,19 +1,6 @@ import React from 'react' -import '../assets/scss/main.scss' +import '../assets/style.css' -import Header from './Header' +const Layout = ({ children }) => <>{children} -class Template extends React.Component { - render() { - const { children } = this.props - - return ( -
-
- {children} -
- ) - } -} - -export default Template +export default Layout diff --git a/src/pages/404.js b/src/pages/404.js index 22e35f8..184cd21 100644 --- a/src/pages/404.js +++ b/src/pages/404.js @@ -1,10 +1,21 @@ import React from 'react' +import { Helmet } from 'react-helmet' + import Layout from '../components/layout' const NotFoundPage = () => ( -

NOT FOUND

-

You just hit a route that doesn't exist... the sadness.

+ + + Not found — Dennis Thiessen + +
+

Error 404

+

This page took a wrong turn.

+

+ The page you were after isn't here. Head back home. +

+
) diff --git a/src/pages/index.js b/src/pages/index.js index 925f875..d78a160 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -2,294 +2,201 @@ import React from 'react' import { Helmet } from 'react-helmet' import Layout from '../components/layout' -// import Lightbox from 'react-images' -import Gallery from '../components/Gallery' +import avatar from '../assets/images/avatar.jpg' -import thumb01 from '../assets/images/thumbs/01.jpg' -import thumb02 from '../assets/images/thumbs/02.jpg' -import thumb03 from '../assets/images/thumbs/03.jpg' -import thumb04 from '../assets/images/thumbs/04.jpg' -import thumb05 from '../assets/images/thumbs/05.jpg' -import thumb06 from '../assets/images/thumbs/06.jpg' -import thumb07 from '../assets/images/thumbs/07.jpg' -import thumb08 from '../assets/images/thumbs/08.jpg' -import thumb09 from '../assets/images/thumbs/09.jpg' +const SITE_TITLE = 'Dennis Thiessen — Data, Analytics & AI Engineer' +const SITE_DESCRIPTION = + 'Dennis Thiessen is a Staff Data, Analytics & AI Engineer in Bern, Switzerland, building the data pipelines and ML infrastructure that production systems run on.' -import full01 from '../assets/images/fulls/01.jpg' -import full02 from '../assets/images/fulls/02.jpg' -import full03 from '../assets/images/fulls/03.jpg' -import full04 from '../assets/images/fulls/04.jpg' -import full05 from '../assets/images/fulls/05.jpg' -import full06 from '../assets/images/fulls/06.jpg' -import full07 from '../assets/images/fulls/07.jpg' -import full08 from '../assets/images/fulls/08.jpg' -import full09 from '../assets/images/fulls/09.jpg' +const EMAIL = 'dennis@thiessen.io' +const LINKEDIN = 'https://www.linkedin.com/in/dennis-thiessen' -const DEFAULT_IMAGES = [ - { id: '9', src: full09, thumbnail: thumb09, caption: 'Swisscom (Switzerland) AG, Bern, Switzerland', description: 'Working as a (Senior) Data, Analytics and AI Engineer.'}, - { id: '8', src: full08, thumbnail: thumb08, caption: 'Robert Bosch GmbH, Dresden, Germany', description: 'Working as a (Senior) Data Engineer for 300mm Semiconductor Lab Startup.'}, - { id: '6', src: full06, thumbnail: thumb06, caption: 'Fraunhofer CML, Hamburg, Germany', description: 'Worked as Software Engineer and Research Associate with development tasks in C#, .NET and Python for workforce scheduling and machine learning.'}, - { id: '5', src: full05, thumbnail: thumb05, caption: 'Vizrt, Bergen, Norway', description: 'Worked as DevOps-Engineer with development tasks in Python and C++ for a backend transcoding engine. Video & Audio Output Test Automation as well as CI & CD with Jenkins.'}, - { id: '4', src: full04, thumbnail: thumb04, caption: 'Generali, Hamburg, Germany', description: 'Worked as Software-Developer and IT Consultant for a web-based workflow application written in Java, using OracleDB while migrating from BPM Process Engine to Camunda BPM. Moreover doing a (successful) PoC with Behaviour Driven Development.'}, - { id: '3', src: full03, thumbnail: thumb03, caption: 'Capgemini, Hamburg, Germany', description: 'Worked as Software-Developer in a multi-national distributed team for a international logistics client. Development of a package track & trace application in Java and with great focus on Test Automation.'}, - { id: '1', src: full01, thumbnail: thumb01, caption: 'Freelance - RiskAhead.net', description: 'Side-project where I developed a native android app in Java using REST services in PHP with access to a MySQL database. Huge focus on performance and scalability.'}, - { id: '2', src: full02, thumbnail: thumb02, caption: 'Freelance - MyIdealAd.com', description: 'Freelance side-project with process automation in ZAPIER, Python scripting, development and hosting of a Wordpress Web-Site.'} -]; +// Career as a pipeline — most recent first. Each node is a role. +const ROLES = [ + { + year: '2023 — PRESENT', + company: 'Swisscom', + location: 'Bern, CH', + title: 'Staff Data, Analytics & AI Engineer', + description: + 'ETL and streaming pipelines in Python, Kafka and SAP BODS feeding a Teradata warehouse — and migrating the legacy stack onto AWS (Glue, Redshift, Lambda, Step Functions, Airflow).', + live: true, + }, + { + year: '2020 — 2023', + company: 'Bosch Semiconductor', + location: 'Dresden, DE', + title: 'Senior Data Engineer', + description: + 'Containerised ML inference (Docker, Kubernetes, Ansible) into 24/7 semiconductor production lines, and built Python, Java and C# data services over Oracle and Hadoop/Impala.', + }, + { + year: '2018 — 2020', + company: 'Fraunhofer CML', + location: 'Hamburg, DE', + title: 'Research Software Engineer', + description: + 'Optimisation-based crew-scheduling decision support in C#/.NET, plus research microservices and a Jenkins CI/CD pipeline with quality gates.', + }, + { + year: '2017 — 2018', + company: 'Vizrt', + location: 'Bergen, NO', + title: 'DevOps Engineer', + description: + 'A distributed video-transcoding backend in Python and C++, with automated audio/video integration testing for reliable releases.', + }, + { + year: '2015 — 2017', + company: 'Generali', + location: 'Hamburg, DE', + title: 'Software Engineer & IT Consultant', + description: + 'A Java/J2EE workflow portal on Oracle, and introduced behaviour-driven development and RPA automation (UiPath, Camunda).', + }, +] -class HomeIndex extends React.Component { +const STACK = [ + { label: 'Languages', items: ['Python', 'SQL', 'Java', 'C#', 'TypeScript', 'C++'] }, + { label: 'Data & Pipelines', items: ['ETL / ELT', 'Kafka', 'Airflow', 'SAP BODS', 'Teradata', 'Hadoop / Impala'] }, + { label: 'Cloud & Infra', items: ['AWS', 'Docker', 'Kubernetes', 'Ansible', 'CI/CD'] }, + { label: 'ML & Observability', items: ['PyTorch', 'scikit-learn', 'ELK', 'Grafana', 'Prometheus'] }, + { label: 'Credentials', items: ['M.Eng., UniBw München', 'AWS Solutions Architect – Associate', 'iSAQB CPSA-F'] }, +] - constructor() { - super(); +const Tags = ({ items }) => + items.map((item, i) => ( + + {i > 0 && ' · '} + {item} + + )) - this.state = { - invalid: false, - displayErrors: false, - res: null - } - this.handleSubmit = this.handleSubmit.bind(this) - this.closeLightbox = this.closeLightbox.bind(this); - this.gotoNext = this.gotoNext.bind(this); - this.gotoPrevious = this.gotoPrevious.bind(this); - this.openLightbox = this.openLightbox.bind(this); - this.handleClickImage = this.handleClickImage.bind(this); - } +const IndexPage = () => ( + + + + + {SITE_TITLE} + + + + + + - handleSubmit(event) { - event.preventDefault(); - if (!event.target.checkValidity()) { - this.setState({ - invalid: true, - displayErrors: true, - }); - return; - } - const form = event.target; - const data = new FormData(form); +
+
+ Dennis Thiessen + + +
- for (let name of data.keys()) { - const input = form.elements[name]; - const parserName = input.dataset.parse; - console.log('parser name is', parserName); - if (parserName) { - const parsedValue = inputParsers[parserName](data.get(name)) - data.set(name, parsedValue); - } - } +
+
+

Data · Analytics · AI Engineering

+

Dennis Thiessen

+

+ I build the pipelines and platforms that move data and run models in production. +

+

+ Staff Data, Analytics & AI Engineer at Swisscom — based in Bern, + Switzerland, with 8+ years across data engineering, ML infrastructure and DevOps. +

+ +
+
+ Dennis Thiessen +
+
- data.append('token', 'gdfgdfashdf'); - data.append('receiver', 'dennis@thiessen.io'); - data.append('subject', 'Contact from www.thiessen.io'); - - this.setState({ - res: stringifyFormData(data), - invalid: false, - displayErrors: false, - }); - - fetch('https://www.riskahead.de/api/v1/web/sendcustommail', { - method: 'POST', - body: data, - }); - } - - openLightbox (index, event) { - event.preventDefault(); - this.setState({ - currentImage: index, - lightboxIsOpen: true, - }); - } - closeLightbox () { - this.setState({ - currentImage: 0, - lightboxIsOpen: false, - }); - } - gotoPrevious () { - this.setState({ - currentImage: this.state.currentImage - 1, - }); - } - gotoNext () { - this.setState({ - currentImage: this.state.currentImage + 1, - }); - } - handleClickImage () { - if (this.state.currentImage === this.props.images.length - 1) return; - - this.gotoNext(); - } - - render() { - const siteTitle = "Dennis Thiessen - IT Software Engineering" - const siteDescription = "Portfolio of Dennis Thiessen - IT Software Engineering" - const { res, invalid, displayErrors } = this.state; - - return ( - - - {siteTitle} - - - - - -
- -
-
-

Are you looking for a freelance Full-Stack Developer / Consultant?
Look no more!

-
-

I'm a Software, Data & AI Engineer and Consultant who has work experience in Java, C# and Python. I did multiple projects for various companies and below you can find a short resume and project portfolio. - If you are looking for a passionate IT Freelancer, don't hesitate to contact me. I mostly work in the D-A-CH area but I am also available for international remote work.

- -

Here is a short enumeration of my skills & tools. Further below you can find the project & companies I have worked with. For a full CV, or if you need further information, just contact me.

- -

Programming & Script & Markup Languages:

-
    -
  • Python
    • -
  • Java, J2EE
    • -
  • JavaScript
    • -
  • C# & .NET
    • -
  • PHP
    • -
  • HTML & CSS
    • -
  • XML, JSON & YAML
    • -
-

Databases & DWH:

-
    -
  • MySQL
    • -
  • PostgreSQL
    • -
  • Oracle
    • -
  • Teradata DWH
    • -
-

Tools & Frameworks:

-
    -
  • IDEs: IntelliJ, Android Studio, VS Code
    • -
  • Versioning: git (Gitlab, Gitea, Github)
    • -
  • Project Management: JIRA, Confluence
    • -
  • RPA: UIPath
    • -
  • Test Automation: JUnit, Selenium, Serenity BDD
    • -
  • Frameworks: Pandas, Numpy, Torch, .NET, Entity, Spring, PyMath
    • -
  • Build & Virtualization: Jenkins, Docker, Kubernetes, Gitlab CI/CD
    • -
  • Web: Nginx, RESTless Web-Services
    • -
  • OS: Win, MacOs, Linux (Debian, RedHat, Ubuntu)
    • -
-

Certifications:

-
    -
  • AWS Certified Solutions Architect – Associate (AWS)
    • -
  • Certified Professional for Software Architecture, Foundation Level (ISAQB)
    • -
  • Robotic Process Automation / UIPath Developer Training (UIPath)
    • -
  • Camunda BPM Process Engine Basic & Advanced Training (Camunda Services GmbH)
    • -
  • ITIL v3 Foundation Certificate in IT Service Management (Serview GmbH)
    • -
  • IT Project Management (Integrata AG)
    • -
-

Spoken Languages:

-
    -
  • German (mother tongue)
    • -
  • English (Fluent)
    • -
  • Russian (Basic)
    • -
  • Norwegian (Basic)
    • -
-
- -
-

Recent Work

- - ({ - src, - thumbnail, - caption, - description - }))} /> - -
- -
-

Send request

-

You can contact me via this contact form.
I will get in touch with you ASAP.

-
-
-
-
-
-
-
-
-
    -
    -
    • -
-
- -
- {invalid && ( - - )} - {!invalid && res && ( - - )} -
-
- - - - -
-
    -
  • -

    Address

    - Region Bern / Zurich
    - Switzerland -
    • -
  • -

    Phone

    - (on request) -
    • -
  • -

    Email

    - dennis@thiessen.io -
    • -
-
-
-
- - +
+

Profile

+
+

+ I work where software engineering meets operations — designing ETL/ELT + and streaming pipelines, containerising ML inference, and turning monolithic data + processes into event-driven, serverless systems. +

+

+ Right now I'm at Swisscom in Bern, moving a legacy Teradata and Oracle stack onto + AWS. What I care about most is automation and reliability: systems that + run themselves, recover on their own, and don't page anyone at 3 a.m. +

+
+
+
+

Experience

+
    + {ROLES.map((role) => ( +
  1. + +
    +

    {role.year}

    +
    +

    {role.company}

    + {role.location}
    - - ) - } -} +

    {role.title}

    +

    {role.description}

    +
    +
    2. + ))} +
+
-const inputParsers = { - uppercase(input) { - return input.toUpperCase(); - }, - number(input) { - return parseFloat(input); - }, -}; +
+

Stack

+
+ {STACK.map((group) => ( +
+

{group.label}

+

+ +

+
+ ))} +
+
-class ShakingError extends React.Component { - constructor() { super(); this.state = { key: 0 }; } +
+

Contact

+
+

+ Open to interesting problems in data, ML and platform engineering — in Switzerland or + remote. Email is the fastest way to reach me. +

+ + {EMAIL} + +
+ + LinkedIn ↗ + + {/* Add a GitHub profile URL here when you have one you want public. */} +
+
+
- componentWillReceiveProps() { - this.setState({ key: ++this.state.key }); - } - - render() { - return
{this.props.text}
; - } -} + +
+ +) -function stringifyFormData(fd) { - const data = {}; - for (let key of fd.keys()) { - data[key] = fd.get(key); - } - return JSON.stringify(data, null, 2); -} - -export default HomeIndex +export default IndexPage