Browse Source

Cleanup

master
Dejvino 11 months ago
parent
commit
4472fab174
6 changed files with 15 additions and 189 deletions
  1. +15
    -4
      README.md
  2. +0
    -5
      postcss.config.js
  3. +0
    -11
      src/js/main.js
  4. +0
    -22
      src/scss/_icon-list.scss
  5. +0
    -93
      src/scss/styles.scss
  6. +0
    -54
      webpack.config.js

+ 15
- 4
README.md View File

@@ -1,6 +1,8 @@
# cv

Dejvino's Curriculum Vitae
Dejvino's Curriculum Vitae in a web app.

Uses React, Bootstrap and NextJs. Compiles into a static HTML/CSS/JS web page that can be easily served from any webhosting.

## Build

@@ -10,10 +12,19 @@ npm install
# Development - served on http://localhost:3000/ with auto-reload
npm run dev

# Production - output in ./dist/
# Production - output in ./out/
npm run build
```

## Info
All that is needed to deploy is to copy the contents of the `./out/` folder onto any web hosting.

## Configuration

### CV content

- src/PersonalData.ts :: source of all data for the CV, nicely structured in a type-checked TypeScript object literal

### Images

Uses React with Bootstrap and NextJs, compiles a static HTML/CSS/JS web page that can be easily served from any webhosting.
- public/favicon.ico
- public/photo.png

+ 0
- 5
postcss.config.js View File

@@ -1,5 +0,0 @@
module.exports = {
plugins: {
autoprefixer: {},
},
}

+ 0
- 11
src/js/main.js View File

@@ -1,11 +0,0 @@
// Import our custom CSS
import '../scss/styles.scss';

// Import only the Bootstrap components we need
import { Popover } from 'bootstrap';

// Create an example popover
document.querySelectorAll('[data-bs-toggle="popover"]')
.forEach(popover => {
new Popover(popover)
})

+ 0
- 22
src/scss/_icon-list.scss View File

@@ -1,22 +0,0 @@
// Example of a custom component

.icon-list {
padding-left: 0;
list-style: none;

li {
display: flex;
align-items: flex-start;
margin-bottom: .25rem;

&::before {
display: block;
flex-shrink: 0;
width: 1.5em;
height: 1.5em;
margin-right: .5rem;
content: "";
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23212529' viewBox='0 0 16 16'%3E%3Cpath d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z'/%3E%3C/svg%3E") no-repeat center center / 100% auto;
}
}
}

+ 0
- 93
src/scss/styles.scss View File

@@ -1,93 +0,0 @@
// Override Bootstrap's Sass default variables
//
// Nearly all variables in Bootstrap are written with the `!default` flag.
// This allows you to override the default values of those variables before
// you import Bootstrap's source Sass files.
//
// Overriding the default variable values is the best way to customize your
// CSS without writing _new_ styles. For example, change you can either change
// `$body-color` or write more CSS that override's Bootstrap's CSS like so:
// `body { color: red; }`.


//
// Bring in Bootstrap
//

// Option 1
//
// Import all of Bootstrap's CSS

// @import "bootstrap/scss/bootstrap";

// Option 2
//
// Place variable overrides first, then import just the styles you need. Note that some stylesheets are required no matter what.

// Toggle global options
$enable-gradients: true;
$enable-shadows: true;

$offcanvas-box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175);

// Customize some defaults
$body-color: #333;
$body-bg: #fff;
$border-radius: .4rem;
$success: #7952b3;

// Required
@import "bootstrap/scss/functions";
@import "bootstrap/scss/variables";
@import "bootstrap/scss/maps";
@import "bootstrap/scss/mixins";
@import "bootstrap/scss/utilities";
@import "bootstrap/scss/root";
@import "bootstrap/scss/reboot";

@import "bootstrap/scss/type";
// @import "bootstrap/scss/images";
@import "bootstrap/scss/containers";
@import "bootstrap/scss/grid";
// @import "bootstrap/scss/tables";
// @import "bootstrap/scss/forms";
@import "bootstrap/scss/buttons";
@import "bootstrap/scss/transitions";
@import "bootstrap/scss/dropdown";
// @import "bootstrap/scss/button-group";
// @import "bootstrap/scss/nav";
// @import "bootstrap/scss/navbar"; // Requires nav
// @import "bootstrap/scss/card";
// @import "bootstrap/scss/breadcrumb";
// @import "bootstrap/scss/accordion";
// @import "bootstrap/scss/pagination";
// @import "bootstrap/scss/badge";
// @import "bootstrap/scss/alert";
// @import "bootstrap/scss/progress";
// @import "bootstrap/scss/list-group";
@import "bootstrap/scss/close";
// @import "bootstrap/scss/toasts";
@import "bootstrap/scss/modal"; // Requires transitions
// @import "bootstrap/scss/tooltip";
@import "bootstrap/scss/popover";
// @import "bootstrap/scss/carousel";
// @import "bootstrap/scss/spinners";
@import "bootstrap/scss/offcanvas"; // Requires transitions
// @import "bootstrap/scss/placeholders";

// Helpers
// @import "bootstrap/scss/helpers";

// Utilities
@import "bootstrap/scss/utilities/api";


//
// Custom styles
//

@import "icon-list";

body {
padding: 1.5rem;
}

+ 0
- 54
webpack.config.js View File

@@ -1,54 +0,0 @@
'use strict'

const path = require('path')
const autoprefixer = require('autoprefixer')
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
mode: 'development',
entry: './src/js/main.js',
output: {
filename: 'main.js',
path: path.resolve(__dirname, 'dist'),
},
devServer:{
static: path.resolve(__dirname, 'dist'),
port: 8080,
hot: true
},
plugins: [
new HtmlWebpackPlugin({ template: './src/index.html' })
],
module: {
rules: [
{
test: /\.(scss)$/,
use: [
{
// Adds CSS to the DOM by injecting a `<style>` tag
loader: 'style-loader'
},
{
// Interprets `@import` and `url()` like `import/require()` and will resolve them
loader: 'css-loader'
},
{
// Loader for webpack to process CSS with PostCSS
loader: 'postcss-loader',
options: {
postcssOptions: {
plugins: () => [
autoprefixer
]
}
}
},
{
// Loads a SASS/SCSS file and compiles it to CSS
loader: 'sass-loader'
}
]
}
]
}
}

Loading…
Cancel
Save