commit
b7f2ba447f
GPG Key ID:
1688DA83D222D0B5
@ -0,0 +1,8 @@
|
||||
node_modules
|
||||
*.log*
|
||||
.nuxt
|
||||
.nitro
|
||||
.cache
|
||||
.output
|
||||
.env
|
||||
dist
|
||||
@ -0,0 +1,4 @@
|
||||
{
|
||||
"singleQuote": true,
|
||||
"semi": true
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
{
|
||||
"editor.formatOnSave": true,
|
||||
"files.insertFinalNewline": true,
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode",
|
||||
}
|
||||
@ -0,0 +1,42 @@
|
||||
# Nuxt 3 Minimal Starter
|
||||
|
||||
Look at the [nuxt 3 documentation](https://v3.nuxtjs.org) to learn more.
|
||||
|
||||
## Setup
|
||||
|
||||
Make sure to install the dependencies:
|
||||
|
||||
```bash
|
||||
# yarn
|
||||
yarn install
|
||||
|
||||
# npm
|
||||
npm install
|
||||
|
||||
# pnpm
|
||||
pnpm install --shamefully-hoist
|
||||
```
|
||||
|
||||
## Development Server
|
||||
|
||||
Start the development server on http://localhost:3000
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
## Production
|
||||
|
||||
Build the application for production:
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
Locally preview production build:
|
||||
|
||||
```bash
|
||||
npm run preview
|
||||
```
|
||||
|
||||
Checkout the [deployment documentation](https://v3.nuxtjs.org/guide/deploy/presets) for more information.
|
||||
@ -0,0 +1,12 @@
|
||||
Font license info
|
||||
|
||||
|
||||
## Font Awesome
|
||||
|
||||
Copyright (C) 2016 by Dave Gandy
|
||||
|
||||
Author: Dave Gandy
|
||||
License: SIL ()
|
||||
Homepage: http://fortawesome.github.com/Font-Awesome/
|
||||
|
||||
|
||||
@ -0,0 +1,75 @@
|
||||
This webfont is generated by https://fontello.com open source project.
|
||||
|
||||
|
||||
================================================================================
|
||||
Please, note, that you should obey original font licenses, used to make this
|
||||
webfont pack. Details available in LICENSE.txt file.
|
||||
|
||||
- Usually, it's enough to publish content of LICENSE.txt file somewhere on your
|
||||
site in "About" section.
|
||||
|
||||
- If your project is open-source, usually, it will be ok to make LICENSE.txt
|
||||
file publicly available in your repository.
|
||||
|
||||
- Fonts, used in Fontello, don't require a clickable link on your site.
|
||||
But any kind of additional authors crediting is welcome.
|
||||
================================================================================
|
||||
|
||||
|
||||
Comments on archive content
|
||||
---------------------------
|
||||
|
||||
- /font/* - fonts in different formats
|
||||
|
||||
- /css/* - different kinds of css, for all situations. Should be ok with
|
||||
twitter bootstrap. Also, you can skip <i> style and assign icon classes
|
||||
directly to text elements, if you don't mind about IE7.
|
||||
|
||||
- demo.html - demo file, to show your webfont content
|
||||
|
||||
- LICENSE.txt - license info about source fonts, used to build your one.
|
||||
|
||||
- config.json - keeps your settings. You can import it back into fontello
|
||||
anytime, to continue your work
|
||||
|
||||
|
||||
Why so many CSS files ?
|
||||
-----------------------
|
||||
|
||||
Because we like to fit all your needs :)
|
||||
|
||||
- basic file, <your_font_name>.css - is usually enough, it contains @font-face
|
||||
and character code definitions
|
||||
|
||||
- *-ie7.css - if you need IE7 support, but still don't wish to put char codes
|
||||
directly into html
|
||||
|
||||
- *-codes.css and *-ie7-codes.css - if you like to use your own @font-face
|
||||
rules, but still wish to benefit from css generation. That can be very
|
||||
convenient for automated asset build systems. When you need to update font -
|
||||
no need to manually edit files, just override old version with archive
|
||||
content. See fontello source code for examples.
|
||||
|
||||
- *-embedded.css - basic css file, but with embedded WOFF font, to avoid
|
||||
CORS issues in Firefox and IE9+, when fonts are hosted on the separate domain.
|
||||
We strongly recommend to resolve this issue by `Access-Control-Allow-Origin`
|
||||
server headers. But if you ok with dirty hack - this file is for you. Note,
|
||||
that data url moved to separate @font-face to avoid problems with <IE9, when
|
||||
string is too long.
|
||||
|
||||
- animate.css - use it to get ideas about spinner rotation animation.
|
||||
|
||||
|
||||
Attention for server setup
|
||||
--------------------------
|
||||
|
||||
You MUST setup server to reply with proper `mime-types` for font files -
|
||||
otherwise some browsers will fail to show fonts.
|
||||
|
||||
Usually, `apache` already has necessary settings, but `nginx` and other
|
||||
webservers should be tuned. Here is list of mime types for our file extensions:
|
||||
|
||||
- `application/vnd.ms-fontobject` - eot
|
||||
- `application/x-font-woff` - woff
|
||||
- `application/x-font-ttf` - ttf
|
||||
- `image/svg+xml` - svg
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,85 @@
|
||||
/*
|
||||
Animation example, for spinners
|
||||
*/
|
||||
.animate-spin {
|
||||
-moz-animation: spin 2s infinite linear;
|
||||
-o-animation: spin 2s infinite linear;
|
||||
-webkit-animation: spin 2s infinite linear;
|
||||
animation: spin 2s infinite linear;
|
||||
display: inline-block;
|
||||
}
|
||||
@-moz-keyframes spin {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
-o-transform: rotate(0deg);
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-moz-transform: rotate(359deg);
|
||||
-o-transform: rotate(359deg);
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
-o-transform: rotate(0deg);
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-moz-transform: rotate(359deg);
|
||||
-o-transform: rotate(359deg);
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@-o-keyframes spin {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
-o-transform: rotate(0deg);
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-moz-transform: rotate(359deg);
|
||||
-o-transform: rotate(359deg);
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@-ms-keyframes spin {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
-o-transform: rotate(0deg);
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-moz-transform: rotate(359deg);
|
||||
-o-transform: rotate(359deg);
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-moz-transform: rotate(0deg);
|
||||
-o-transform: rotate(0deg);
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-moz-transform: rotate(359deg);
|
||||
-o-transform: rotate(359deg);
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,23 @@
|
||||
|
||||
.icon-language-typescript:before { content: '\e800'; } /* '๎ ' */
|
||||
.icon-language-javascript:before { content: '\e801'; } /* '๎ ' */
|
||||
.icon-nodejs:before { content: '\e802'; } /* '๎ ' */
|
||||
.icon-nestjs:before { content: '\e803'; } /* '๎ ' */
|
||||
.icon-angular:before { content: '\e804'; } /* '๎ ' */
|
||||
.icon-language-python:before { content: '\e805'; } /* '๎
' */
|
||||
.icon-language-lua:before { content: '\e806'; } /* '๎ ' */
|
||||
.icon-language-java:before { content: '\e807'; } /* '๎ ' */
|
||||
.icon-rss-box:before { content: '\e808'; } /* '๎ ' */
|
||||
.icon-controller-classic:before { content: '\e809'; } /* '๎ ' */
|
||||
.icon-key-variant:before { content: '\e80a'; } /* '๎ ' */
|
||||
.icon-icynet:before { content: '\e80b'; } /* '๎ ' */
|
||||
.icon-gitlab:before { content: '\e80c'; } /* '๎ ' */
|
||||
.icon-web:before { content: '\e80d'; } /* '๎ ' */
|
||||
.icon-flutter:before { content: '\e80e'; } /* '๎ ' */
|
||||
.icon-language-lua-variant:before { content: '\e80f'; } /* '๎ ' */
|
||||
.icon-vuejs:before { content: '\e810'; } /* '๎ ' */
|
||||
.icon-react:before { content: '\e811'; } /* '๎ ' */
|
||||
.icon-pleroma:before { content: '\e812'; } /* '๎ ' */
|
||||
.icon-github-circled:before { content: '\f09b'; } /* '๏' */
|
||||
.icon-html5:before { content: '\f13b'; } /* '๏ป' */
|
||||
.icon-reddit-alien:before { content: '\f281'; } /* '๏' */
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,23 @@
|
||||
|
||||
.icon-language-typescript { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-javascript { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-nodejs { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-nestjs { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-angular { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-python { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-lua { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-java { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-rss-box { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-controller-classic { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-key-variant { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-icynet { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-gitlab { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-web { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-flutter { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-lua-variant { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-vuejs { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-react { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-pleroma { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-github-circled { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-html5 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-reddit-alien { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
@ -0,0 +1,34 @@
|
||||
[class^="icon-"], [class*=" icon-"] {
|
||||
font-family: 'lunasquee-site';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
|
||||
/* fix buttons height */
|
||||
line-height: 1em;
|
||||
|
||||
/* you can be more comfortable with increased icons size */
|
||||
/* font-size: 120%; */
|
||||
}
|
||||
|
||||
.icon-language-typescript { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-javascript { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-nodejs { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-nestjs { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-angular { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-python { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-lua { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-java { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-rss-box { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-controller-classic { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-key-variant { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-icynet { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-gitlab { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-web { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-flutter { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-language-lua-variant { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-vuejs { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-react { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-pleroma { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-github-circled { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-html5 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
.icon-reddit-alien { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
|
||||
@ -0,0 +1,78 @@
|
||||
@font-face {
|
||||
font-family: 'lunasquee-site';
|
||||
src: url('../font/lunasquee-site.eot?67551437');
|
||||
src: url('../font/lunasquee-site.eot?67551437#iefix') format('embedded-opentype'),
|
||||
url('../font/lunasquee-site.woff2?67551437') format('woff2'),
|
||||
url('../font/lunasquee-site.woff?67551437') format('woff'),
|
||||
url('../font/lunasquee-site.ttf?67551437') format('truetype'),
|
||||
url('../font/lunasquee-site.svg?67551437#lunasquee-site') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
|
||||
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
|
||||
/*
|
||||
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
||||
@font-face {
|
||||
font-family: 'lunasquee-site';
|
||||
src: url('../font/lunasquee-site.svg?67551437#lunasquee-site') format('svg');
|
||||
}
|
||||
}
|
||||
*/
|
||||
[class^="icon-"]:before, [class*=" icon-"]:before {
|
||||
font-family: "lunasquee-site";
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
speak: never;
|
||||
|
||||
display: inline-block;
|
||||
text-decoration: inherit;
|
||||
width: 1em;
|
||||
margin-right: .2em;
|
||||
text-align: center;
|
||||
/* opacity: .8; */
|
||||
|
||||
/* For safety - reset parent styles, that can break glyph codes*/
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
|
||||
/* fix buttons height, for twitter bootstrap */
|
||||
line-height: 1em;
|
||||
|
||||
/* Animation center compensation - margins should be symmetric */
|
||||
/* remove if not needed */
|
||||
margin-left: .2em;
|
||||
|
||||
/* you can be more comfortable with increased icons size */
|
||||
/* font-size: 120%; */
|
||||
|
||||
/* Font smoothing. That was taken from TWBS */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
/* Uncomment for 3D effect */
|
||||
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
|
||||
}
|
||||
|
||||
.icon-language-typescript:before { content: '\e800'; } /* '๎ ' */
|
||||
.icon-language-javascript:before { content: '\e801'; } /* '๎ ' */
|
||||
.icon-nodejs:before { content: '\e802'; } /* '๎ ' */
|
||||
.icon-nestjs:before { content: '\e803'; } /* '๎ ' */
|
||||
.icon-angular:before { content: '\e804'; } /* '๎ ' */
|
||||
.icon-language-python:before { content: '\e805'; } /* '๎
' */
|
||||
.icon-language-lua:before { content: '\e806'; } /* '๎ ' */
|
||||
.icon-language-java:before { content: '\e807'; } /* '๎ ' */
|
||||
.icon-rss-box:before { content: '\e808'; } /* '๎ ' */
|
||||
.icon-controller-classic:before { content: '\e809'; } /* '๎ ' */
|
||||
.icon-key-variant:before { content: '\e80a'; } /* '๎ ' */
|
||||
.icon-icynet:before { content: '\e80b'; } /* '๎ ' */
|
||||
.icon-gitlab:before { content: '\e80c'; } /* '๎ ' */
|
||||
.icon-web:before { content: '\e80d'; } /* '๎ ' */
|
||||
.icon-flutter:before { content: '\e80e'; } /* '๎ ' */
|
||||
.icon-language-lua-variant:before { content: '\e80f'; } /* '๎ ' */
|
||||
.icon-vuejs:before { content: '\e810'; } /* '๎ ' */
|
||||
.icon-react:before { content: '\e811'; } /* '๎ ' */
|
||||
.icon-pleroma:before { content: '\e812'; } /* '๎ ' */
|
||||
.icon-github-circled:before { content: '\f09b'; } /* '๏' */
|
||||
.icon-html5:before { content: '\f13b'; } /* '๏ป' */
|
||||
.icon-reddit-alien:before { content: '\f281'; } /* '๏' */
|
||||
@ -0,0 +1,294 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<!--[if lt IE 9]><script language="javascript" type="text/javascript" src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
html {
|
||||
font-size: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
}
|
||||
a:focus {
|
||||
outline: thin dotted #333;
|
||||
outline: 5px auto -webkit-focus-ring-color;
|
||||
outline-offset: -2px;
|
||||
}
|
||||
a:hover,
|
||||
a:active {
|
||||
outline: 0;
|
||||
}
|
||||
input {
|
||||
margin: 0;
|
||||
font-size: 100%;
|
||||
vertical-align: middle;
|
||||
*overflow: visible;
|
||||
line-height: normal;
|
||||
}
|
||||
input::-moz-focus-inner {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: #333;
|
||||
background-color: #fff;
|
||||
}
|
||||
a {
|
||||
color: #08c;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover {
|
||||
color: #005580;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.row {
|
||||
margin-left: -20px;
|
||||
*zoom: 1;
|
||||
}
|
||||
.row:before,
|
||||
.row:after {
|
||||
display: table;
|
||||
content: "";
|
||||
line-height: 0;
|
||||
}
|
||||
.row:after {
|
||||
clear: both;
|
||||
}
|
||||
.span3 {
|
||||
float: left;
|
||||
min-height: 1px;
|
||||
margin-left: 20px;
|
||||
width: 220px;
|
||||
}
|
||||
.container {
|
||||
width: 940px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
*zoom: 1;
|
||||
}
|
||||
.container:before,
|
||||
.container:after {
|
||||
display: table;
|
||||
content: "";
|
||||
line-height: 0;
|
||||
}
|
||||
.container:after {
|
||||
clear: both;
|
||||
}
|
||||
small {
|
||||
font-size: 85%;
|
||||
}
|
||||
h1 {
|
||||
margin: 10px 0;
|
||||
font-family: inherit;
|
||||
font-weight: bold;
|
||||
line-height: 20px;
|
||||
color: inherit;
|
||||
text-rendering: optimizelegibility;
|
||||
line-height: 40px;
|
||||
font-size: 38.5px;
|
||||
}
|
||||
h1 small {
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
color: #999;
|
||||
font-size: 24.5px;
|
||||
}
|
||||
|
||||
body {
|
||||
margin-top: 90px;
|
||||
}
|
||||
.header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
margin-left: -480px;
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding-top: 10px;
|
||||
z-index: 10;
|
||||
}
|
||||
.footer {
|
||||
color: #ddd;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.footer a {
|
||||
color: #ccc;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.the-icons {
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
}
|
||||
.switch {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 10px;
|
||||
color: #666;
|
||||
}
|
||||
.switch input {
|
||||
margin-right: 0.3em;
|
||||
}
|
||||
.codesOn .i-name {
|
||||
display: none;
|
||||
}
|
||||
.codesOn .i-code {
|
||||
display: inline;
|
||||
}
|
||||
.i-code {
|
||||
display: none;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'lunasquee-site';
|
||||
src: url('./font/lunasquee-site.eot?1399245');
|
||||
src: url('./font/lunasquee-site.eot?1399245#iefix') format('embedded-opentype'),
|
||||
url('./font/lunasquee-site.woff?1399245') format('woff'),
|
||||
url('./font/lunasquee-site.ttf?1399245') format('truetype'),
|
||||
url('./font/lunasquee-site.svg?1399245#lunasquee-site') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
.demo-icon {
|
||||
font-family: "lunasquee-site";
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
speak: never;
|
||||
|
||||
display: inline-block;
|
||||
text-decoration: inherit;
|
||||
width: 1em;
|
||||
margin-right: .2em;
|
||||
text-align: center;
|
||||
/* opacity: .8; */
|
||||
|
||||
/* For safety - reset parent styles, that can break glyph codes*/
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
|
||||
/* fix buttons height, for twitter bootstrap */
|
||||
line-height: 1em;
|
||||
|
||||
/* Animation center compensation - margins should be symmetric */
|
||||
/* remove if not needed */
|
||||
margin-left: .2em;
|
||||
|
||||
/* You can be more comfortable with increased icons size */
|
||||
/* font-size: 120%; */
|
||||
|
||||
/* Font smoothing. That was taken from TWBS */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
/* Uncomment for 3D effect */
|
||||
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="css/animation.css"><!--[if IE 7]><link rel="stylesheet" href="css/" + font.fontname + "-ie7.css"><![endif]-->
|
||||
<script>
|
||||
function toggleCodes(on) {
|
||||
var obj = document.getElementById('icons');
|
||||
|
||||
if (on) {
|
||||
obj.className += ' codesOn';
|
||||
} else {
|
||||
obj.className = obj.className.replace(' codesOn', '');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container header">
|
||||
<h1>lunasquee-site <small>font demo</small></h1>
|
||||
<label class="switch">
|
||||
<input type="checkbox" onclick="toggleCodes(this.checked)">show codes
|
||||
</label>
|
||||
</div>
|
||||
<div class="container" id="icons">
|
||||
<div class="row">
|
||||
<div class="span3" title="Code: 0xe800">
|
||||
<i class="demo-icon icon-language-typescript"></i> <span class="i-name">icon-language-typescript</span><span class="i-code">0xe800</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe801">
|
||||
<i class="demo-icon icon-language-javascript"></i> <span class="i-name">icon-language-javascript</span><span class="i-code">0xe801</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe802">
|
||||
<i class="demo-icon icon-nodejs"></i> <span class="i-name">icon-nodejs</span><span class="i-code">0xe802</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe803">
|
||||
<i class="demo-icon icon-nestjs"></i> <span class="i-name">icon-nestjs</span><span class="i-code">0xe803</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span3" title="Code: 0xe804">
|
||||
<i class="demo-icon icon-angular"></i> <span class="i-name">icon-angular</span><span class="i-code">0xe804</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe805">
|
||||
<i class="demo-icon icon-language-python"></i> <span class="i-name">icon-language-python</span><span class="i-code">0xe805</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe806">
|
||||
<i class="demo-icon icon-language-lua"></i> <span class="i-name">icon-language-lua</span><span class="i-code">0xe806</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe807">
|
||||
<i class="demo-icon icon-language-java"></i> <span class="i-name">icon-language-java</span><span class="i-code">0xe807</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span3" title="Code: 0xe808">
|
||||
<i class="demo-icon icon-rss-box"></i> <span class="i-name">icon-rss-box</span><span class="i-code">0xe808</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe809">
|
||||
<i class="demo-icon icon-controller-classic"></i> <span class="i-name">icon-controller-classic</span><span class="i-code">0xe809</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe80a">
|
||||
<i class="demo-icon icon-key-variant"></i> <span class="i-name">icon-key-variant</span><span class="i-code">0xe80a</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe80b">
|
||||
<i class="demo-icon icon-icynet"></i> <span class="i-name">icon-icynet</span><span class="i-code">0xe80b</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span3" title="Code: 0xe80c">
|
||||
<i class="demo-icon icon-gitlab"></i> <span class="i-name">icon-gitlab</span><span class="i-code">0xe80c</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe80d">
|
||||
<i class="demo-icon icon-web"></i> <span class="i-name">icon-web</span><span class="i-code">0xe80d</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe80e">
|
||||
<i class="demo-icon icon-flutter"></i> <span class="i-name">icon-flutter</span><span class="i-code">0xe80e</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe80f">
|
||||
<i class="demo-icon icon-language-lua-variant"></i> <span class="i-name">icon-language-lua-variant</span><span class="i-code">0xe80f</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span3" title="Code: 0xe810">
|
||||
<i class="demo-icon icon-vuejs"></i> <span class="i-name">icon-vuejs</span><span class="i-code">0xe810</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe811">
|
||||
<i class="demo-icon icon-react"></i> <span class="i-name">icon-react</span><span class="i-code">0xe811</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xe812">
|
||||
<i class="demo-icon icon-pleroma"></i> <span class="i-name">icon-pleroma</span><span class="i-code">0xe812</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xf09b">
|
||||
<i class="demo-icon icon-github-circled"></i> <span class="i-name">icon-github-circled</span><span class="i-code">0xf09b</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span3" title="Code: 0xf13b">
|
||||
<i class="demo-icon icon-html5"></i> <span class="i-name">icon-html5</span><span class="i-code">0xf13b</span>
|
||||
</div>
|
||||
<div class="span3" title="Code: 0xf281">
|
||||
<i class="demo-icon icon-reddit-alien"></i> <span class="i-name">icon-reddit-alien</span><span class="i-code">0xf281</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container footer">Generated by <a href="https://fontello.com">fontello.com</a></div>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 454 B |
|
After Width: | Height: | Size: 731 B |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1020 B |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 518 B |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 960 B |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 602 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 834 B |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 422 B |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 595 B |
|
After Width: | Height: | Size: 368 B |
|
After Width: | Height: | Size: 1.2 KiB |
@ -0,0 +1,16 @@
|
||||
.gridbox {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: center;
|
||||
justify-content: space-around;
|
||||
flex-direction: row;
|
||||
|
||||
@media all and (max-width: 1400px) {
|
||||
margin-top: 4rem;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
$a-color: #64baff;
|
||||
|
||||
$gray-1: #424242;
|
||||
$gray-2: #383838;
|
||||
$gray-3: #252525;
|
||||
@ -0,0 +1,46 @@
|
||||
.project {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 2rem 15rem;
|
||||
background-color: #313131;
|
||||
|
||||
@media all and (max-width: 1400px) {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
flex-direction: column;
|
||||
|
||||
.project__image {
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&:nth-child(2n + 1) {
|
||||
background-color: #3e3e3e;
|
||||
}
|
||||
|
||||
&__image {
|
||||
max-width: 25rem;
|
||||
|
||||
&--left {
|
||||
margin-right: 1.5rem;
|
||||
}
|
||||
|
||||
&--right {
|
||||
margin-left: 1.5rem;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&__infobox {
|
||||
font-size: 1.2em;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,29 @@
|
||||
.icon-list {
|
||||
text-align: left;
|
||||
min-width: 200px;
|
||||
margin: 0 1.5rem;
|
||||
|
||||
@media screen and (max-width: 1100px) {
|
||||
flex-basis: 400px;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
|
||||
li {
|
||||
line-height: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.flex-center {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
[class^='icon-'] {
|
||||
color: #fff;
|
||||
margin-right: 0.25rem;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,17 @@
|
||||
.language-list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
font-size: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
|
||||
span {
|
||||
transition: opacity linear 0.33s;
|
||||
opacity: 0.5;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,37 @@
|
||||
section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: #eee;
|
||||
min-height: 100vh;
|
||||
|
||||
.section-expand {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
overflow: hidden;
|
||||
padding: 20px;
|
||||
background-color: #383838;
|
||||
border-bottom: 5px solid #252525;
|
||||
text-transform: uppercase;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.section-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
padding-top: 0;
|
||||
background-color: #313131;
|
||||
color: #fff;
|
||||
overflow: auto;
|
||||
flex-grow: 1;
|
||||
min-height: calc(100vh - 80px);
|
||||
padding: 0 20%;
|
||||
font-size: 1.5rem;
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
padding: 0 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
@use 'language-list';
|
||||
@use 'section';
|
||||
@use 'icon-link-list';
|
||||
@use 'featured-project';
|
||||
@ -0,0 +1,44 @@
|
||||
@use '@/assets/iconfont/css/lunasquee-site.css';
|
||||
@use 'components/index';
|
||||
@use 'helpers';
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
||||
Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $a-color;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
overflow: hidden;
|
||||
background-color: $gray-1;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<div class="project">
|
||||
<div class="project__image project__image--left" v-if="variant === 'left'">
|
||||
<a :href="image" target="_blank"><img :src="thumb" :alt="title" /></a>
|
||||
</div>
|
||||
|
||||
<div class="project__infobox">
|
||||
<div class="project__info-title">
|
||||
<h2>
|
||||
<a :href="href" target="_blank">{{ title }}</a>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="project__info-body">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="project__image project__image--right"
|
||||
v-if="variant === 'right'"
|
||||
>
|
||||
<a :href="image" target="_blank"><img :src="thumb" :alt="title" /></a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
variant: 'left' | 'right';
|
||||
title: string;
|
||||
href: string;
|
||||
image: string;
|
||||
}>();
|
||||
|
||||
const thumb = computed(() => {
|
||||
const split = props.image.split('/');
|
||||
const last = split.length - 1;
|
||||
split[last] = `thumb_${split[last]}`;
|
||||
return split.join('/');
|
||||
});
|
||||
</script>
|
||||
@ -0,0 +1,23 @@
|
||||
<template>
|
||||
<div class="icon-list">
|
||||
<h2>{{ title }}</h2>
|
||||
<ul>
|
||||
<li v-for="item in list">
|
||||
<a :href="item.href" v-bind:target="item.blank ? '_blank' : undefined"
|
||||
><span :class="item.icon"></span>{{ item.name }}</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
interface LinkList {
|
||||
href: string;
|
||||
name: string;
|
||||
icon: string;
|
||||
blank?: boolean;
|
||||
}
|
||||
|
||||
const props = defineProps<{ list: LinkList[]; title: string }>();
|
||||
</script>
|
||||
@ -0,0 +1,30 @@
|
||||
<template>
|
||||
<div class="language-list">
|
||||
<span
|
||||
v-for="item in langList"
|
||||
:title="item.title"
|
||||
:class="item.icon"
|
||||
></span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
interface LangListItem {
|
||||
icon: string;
|
||||
title: string;
|
||||
}
|
||||
|
||||
const langList: LangListItem[] = [
|
||||
{ icon: 'icon-html5', title: 'Web development (HTML5 / CSS3 / SASS)' },
|
||||
{ icon: 'icon-language-javascript', title: 'JavaScript' },
|
||||
{ icon: 'icon-language-typescript', title: 'TypeScript' },
|
||||
{ icon: 'icon-nodejs', title: 'Node.js' },
|
||||
{ icon: 'icon-nestjs', title: 'Nest.js' },
|
||||
{ icon: 'icon-angular', title: 'Angular' },
|
||||
{ icon: 'icon-vuejs', title: 'Vue.js (version 3+)' },
|
||||
{ icon: 'icon-react', title: 'React' },
|
||||
{ icon: 'icon-flutter', title: 'Flutter' },
|
||||
{ icon: 'icon-language-python', title: 'Python' },
|
||||
{ icon: 'icon-language-lua-variant', title: 'Lua' },
|
||||
];
|
||||
</script>
|
||||
@ -0,0 +1,8 @@
|
||||
<template>
|
||||
<section>
|
||||
<div class="section-header">
|
||||
<slot name="header"></slot>
|
||||
</div>
|
||||
<slot></slot>
|
||||
</section>
|
||||
</template>
|
||||
@ -0,0 +1,13 @@
|
||||
// https://v3.nuxtjs.org/api/configuration/nuxt.config
|
||||
export default defineNuxtConfig({
|
||||
css: ['@/assets/styles/index.scss'],
|
||||
vite: {
|
||||
css: {
|
||||
preprocessorOptions: {
|
||||
scss: {
|
||||
additionalData: '@use "@/assets/styles/_variables.scss" as *;',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,17 @@
|
||||
{
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "nuxt build",
|
||||
"dev": "nuxt dev",
|
||||
"generate": "nuxt generate",
|
||||
"preview": "nuxt preview",
|
||||
"postinstall": "nuxt prepare"
|
||||
},
|
||||
"devDependencies": {
|
||||
"nuxt": "3.0.0-rc.11",
|
||||
"prettier": "^2.7.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"sass": "^1.55.0"
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,191 @@
|
||||
<template>
|
||||
<Section>
|
||||
<template v-slot:header>
|
||||
<h1>About me</h1>
|
||||
</template>
|
||||
|
||||
<div class="section-content">
|
||||
<div class="introduction">
|
||||
<p>
|
||||
Hello, my name is Evert <q>Diamond</q> Prants. I am a
|
||||
{{ evertAge }}-year-old self-taught Web Developer and Systems
|
||||
Administrator from Estonia. I am generally a very curious person and
|
||||
thus I am interested in a very large variety of subjects, including,
|
||||
but not limited to, space exploration, electronics, computers,
|
||||
networks, programming, aviation, ships, cars and other scientific
|
||||
fields. I like to tell everyone that I use Arch Linux - sorry not
|
||||
sorry.
|
||||
</p>
|
||||
<p>
|
||||
I can pretty much code in any language and use any library with the
|
||||
help of documentation and instructional materials, so the
|
||||
<q>Programming</q> list is not very comprehensive.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="gridbox">
|
||||
<IconLinkList :list="linksList" title="Links" />
|
||||
<IconLinkList :list="socialLinks" title="Socials" />
|
||||
</div>
|
||||
|
||||
<LanguageList />
|
||||
</div>
|
||||
</Section>
|
||||
|
||||
<Section>
|
||||
<template v-slot:header>
|
||||
<h1>Featured projects</h1>
|
||||
</template>
|
||||
|
||||
<FeaturedProject
|
||||
variant="left"
|
||||
title="Icy Network"
|
||||
image="/images/projects/icy_network_portal.png"
|
||||
href="https://icynet.eu"
|
||||
>
|
||||
<p>
|
||||
<b>Icy Network</b> is a single-sign-on (SSO) provider for projects
|
||||