Wip
This commit is contained in:
mmacneil
parent
3ec5244aa3
commit
68365a96bc
1
src/.gitignore
vendored
Normal file
1
src/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
node_modules/
|
||||||
3853
src/dist/css/main.bundle.css
vendored
Normal file
3853
src/dist/css/main.bundle.css
vendored
Normal file
File diff suppressed because it is too large
Load Diff
1
src/dist/js/bundle.js
vendored
Normal file
1
src/dist/js/bundle.js
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){n(1)},function(e,t,n){}]);
|
||||||
37
src/dist/mypage.html
vendored
Normal file
37
src/dist/mypage.html
vendored
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<title>My custom Bulma website</title>
|
||||||
|
<link rel="stylesheet" href="css/main.bundle.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1 class="title">
|
||||||
|
Bulma
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<p class="subtitle">
|
||||||
|
Modern CSS framework based on <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox">Flexbox</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="field">
|
||||||
|
<div class="control">
|
||||||
|
<input class="input" type="text" placeholder="Input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="field">
|
||||||
|
<p class="control">
|
||||||
|
<span class="select">
|
||||||
|
<select>
|
||||||
|
<option>Select dropdown</option>
|
||||||
|
</select>
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="buttons">
|
||||||
|
<a class="button is-primary">Primary</a>
|
||||||
|
<a class="button is-link">Link</a>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
5487
src/package-lock.json
generated
Normal file
5487
src/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
21
src/package.json
Normal file
21
src/package.json
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
{
|
||||||
|
"name": "devfolio",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "",
|
||||||
|
"main": "webpack.config.js",
|
||||||
|
"author": "Mark Macneil",
|
||||||
|
"license": "MIT",
|
||||||
|
"scripts": {
|
||||||
|
"build": "webpack --mode production"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"bulma": "^0.7.5",
|
||||||
|
"css-loader": "^3.2.0",
|
||||||
|
"mini-css-extract-plugin": "^0.8.0",
|
||||||
|
"node-sass": "^4.12.0",
|
||||||
|
"sass-loader": "^7.2.0",
|
||||||
|
"style-loader": "^1.0.0",
|
||||||
|
"webpack": "^4.39.2",
|
||||||
|
"webpack-cli": "^3.3.6"
|
||||||
|
}
|
||||||
|
}
|
||||||
1
src/src/index.js
Normal file
1
src/src/index.js
Normal file
@ -0,0 +1 @@
|
|||||||
|
require('./styles.scss');
|
||||||
38
src/src/styles.scss
Normal file
38
src/src/styles.scss
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
@charset "utf-8";
|
||||||
|
//@import "~bulma/bulma" - import everything;
|
||||||
|
|
||||||
|
// Import a Google Font
|
||||||
|
@import url('https://fonts.googleapis.com/css?family=Nunito:400,700');
|
||||||
|
|
||||||
|
// Set your brand colors
|
||||||
|
$purple: #8A4D76;
|
||||||
|
$pink: #FA7C91;
|
||||||
|
$brown: #757763;
|
||||||
|
$beige-light: #D0D1CD;
|
||||||
|
$beige-lighter: #EFF0EB;
|
||||||
|
|
||||||
|
// Update Bulma's global variables
|
||||||
|
$family-sans-serif: "Nunito", sans-serif;
|
||||||
|
$grey-dark: $brown;
|
||||||
|
$grey-light: $beige-light;
|
||||||
|
$primary: $purple;
|
||||||
|
$link: $pink;
|
||||||
|
$widescreen-enabled: false;
|
||||||
|
$fullhd-enabled: false;
|
||||||
|
|
||||||
|
// Update some of Bulma's component variables
|
||||||
|
$body-background-color: $beige-lighter;
|
||||||
|
$control-border-width: 2px;
|
||||||
|
$input-border-color: transparent;
|
||||||
|
$input-shadow: none;
|
||||||
|
|
||||||
|
// Import only what you need from Bulma
|
||||||
|
@import "../node_modules/bulma/sass/utilities/_all.sass";
|
||||||
|
@import "../node_modules/bulma/sass/base/_all.sass";
|
||||||
|
@import "../node_modules/bulma/sass/elements/button.sass";
|
||||||
|
@import "../node_modules/bulma/sass/elements/container.sass";
|
||||||
|
@import "../node_modules/bulma/sass/elements/title.sass";
|
||||||
|
@import "../node_modules/bulma/sass/form/_all.sass";
|
||||||
|
@import "../node_modules/bulma/sass/components/navbar.sass";
|
||||||
|
@import "../node_modules/bulma/sass/layout/hero.sass";
|
||||||
|
@import "../node_modules/bulma/sass/layout/section.sass";
|
||||||
33
src/webpack.config.js
Normal file
33
src/webpack.config.js
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
const path = require('path');
|
||||||
|
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
entry: './src/index.js',
|
||||||
|
output: {
|
||||||
|
path: path.resolve(__dirname, 'dist'),
|
||||||
|
filename: 'js/bundle.js'
|
||||||
|
},
|
||||||
|
module: {
|
||||||
|
rules: [{
|
||||||
|
test: /\.scss$/,
|
||||||
|
use: [
|
||||||
|
MiniCssExtractPlugin.loader,
|
||||||
|
{
|
||||||
|
loader: 'css-loader'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
loader: 'sass-loader',
|
||||||
|
options: {
|
||||||
|
sourceMap: true,
|
||||||
|
// options...
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
new MiniCssExtractPlugin({
|
||||||
|
filename: 'css/[name].bundle.css'
|
||||||
|
}),
|
||||||
|
]
|
||||||
|
};
|
||||||
Loading…
Reference in New Issue
Block a user