Github integration

This commit is contained in:
2018-07-17 00:34:42 +05:30
parent d6934656d2
commit a5996f1f2d
16 changed files with 17396 additions and 17 deletions

View File

@@ -1 +0,0 @@
!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=2)}([function(e,t){},function(e,t,n){new(n(0))("Sapient");document.write("<h1>${g.greet()} </h1>")},function(e,t,n){e.exports=n(1)}]);

234
dist/bundle.js vendored Normal file

File diff suppressed because one or more lines are too long

199
dist/index.html vendored Normal file
View File

@@ -0,0 +1,199 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Webpack</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" crossorigin="anonymous">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt"
crossorigin="anonymous">
</head>
<body>
<div class="wrapper">
<!-- Sidebar -->
<nav id="sidebar">
<div class="sidebar-header">
<button type="button" id="sidebarCollapse" class="btn btn-info">
<i class="fas fa-align-justify"></i>
</button>
<h3 class="logotext">Microbot</h3>
<!-- <strong>MB</strong> -->
</div>
<ul class="list-unstyled components">
<li class="active">
<!-- data-toggle="collapse" -->
<a href="#homeSubmenu">
<i class="fas fa-home"></i>
<span class="hideable">Home</span>
</a>
<!-- <ul class="collapse list-unstyled" id="homeSubmenu">
<li>
<a href="#">Home 1</a>
</li>
<li>
<a href="#">Home 2</a>
</li>
<li>
<a href="#">Home 3</a>
</li>
</ul> -->
</li>
<li>
<a href="#">
<i class="fas fa-briefcase"></i>
<span class="hideable">About</span>
</a>
<a href="#pageSubmenu" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle">
<i class="fas fa-copy"></i>
<span class="hideable">Tasks</span>
</a>
<ul class="collapse list-unstyled" id="pageSubmenu">
<li>
<a href="#">Repo</a>
</li>
<li>
<a href="#">Issues</a>
</li>
<li>
<a href="#">Admin</a>
</li>
</ul>
</li>
<li>
<a href="#">
<i class="fas fa-image"></i>
<span class="hideable">Favorites</span>
</a>
</li>
<li>
<a href="#">
<i class="fas fa-question"></i>
<span class="hideable">FAQ</span>
</a>
</li>
<li>
<a href="#">
<i class="fas fa-paper-plane"></i>
<span class="hideable">Contact</span>
</a>
</li>
</ul>
<!-- <ul class="list-unstyled CTAs">
<li>
<a href="https://bootstrapious.com/tutorial/files/sidebar.zip" class="download">Download source</a>
</li>
<li>
<a href="https://bootstrapious.com/p/bootstrap-sidebar" class="article">Back to article</a>
</li>
</ul> -->
</nav>
<!-- Page Content -->
<div id="content">
<div id="header" class="headerprompt">
<div class="prompt">
<p class="promptext">$_</p>
</div>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<form onsubmit="processRequest();" class="navbar-form" role="search">
<input type="text" class="form-control" placeholder="What you need..." name="command" id="command">
</form>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="nav navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="#">
<i class="far fa-star"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="far fa-trash-alt"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="far fa-paper-plane"></i>
</a>
</li>
</ul>
</div>
</div>
</nav>
</div>
<div>
<h2>Placeholder header</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
anim id est laborum.</p>
</div>
<div class="line"></div>
<h2>Lorem Ipsum Dolor</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div class="line"></div>
<h2>Lorem Ipsum Dolor</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div class="line"></div>
<h3>Lorem Ipsum Dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<!-- jQuery CDN - Slim version (=without AJAX) -->
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<!-- Popper.JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ"
crossorigin="anonymous"></script>
<!-- Bootstrap JS -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" crossorigin="anonymous"></script>
<script>
$(document).ready(function () {
$('#sidebarCollapse').on('click', function () {
$('#sidebar').toggleClass('active');
$('.hideable').toggleClass('hide');
});
$('#content nav div.collapse li a.nav-link i.far.fa-star').hover(function () {
$('#content nav div.collapse li a.nav-link i.far.fa-star').toggleClass('fas');
});
$('#content nav div.collapse li a.nav-link i.far.fa-trash-alt').hover(function () {
$('#content nav div.collapse li a.nav-link i.far.fa-trash-alt').toggleClass('fas');
});
$('#content nav div.collapse li a.nav-link i.far.fa-paper-plane').hover(function () {
$('#content nav div.collapse li a.nav-link i.far.fa-paper-plane').toggleClass('fas');
});
});
</script>
<script type="text/javascript" src="./bundle.js"></script></body>
</html>

16272
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -1,9 +1,9 @@
{
"name": "stack_route_prj8",
"name": "mohiit1502.github.io",
"private": true,
"version": "0.0.0",
"description": "A starter project for JavaScript - Webpack",
"repository": "https://github.com/mohiit1502/stack_route_prj8",
"repository": "https://github.com/mohiit1502/mohiit1502.github.io",
"license": "The Unlicense",
"devDependencies": {
"bower": "^1.3.1",
@@ -25,19 +25,24 @@
"update-webdriver": "webdriver-manager update"
},
"dependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"bootstrap": "4.1.1",
"bootswatch": "^4.1.1",
"browser-sync": "^2.24.5",
"css-loader": "^1.0.0",
"gulp": "^4.0.0",
"gulp-sass": "^4.0.1",
"html-webpack-plugin": "^3.2.0",
"json-server": "^0.14.0",
"raw-loader": "^0.5.1",
"node-sass": "^4.9.2",
"octonode": "^0.9.2",
"popper": "1.0.1",
"raw-loader": "^0.5.1",
"sass": "1.9.0",
"sass-loader": "^7.0.3",
"style-loader": "^0.21.0",
"webpack": "^4.16.0",
"webpack-dev-server": "^3.1.4",
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5"
"webpack-dev-server": "^3.1.4"
}
}

View File

@@ -1,12 +1,199 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Webpack</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" crossorigin="anonymous">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt"
crossorigin="anonymous">
</head>
<body>
<h1>Hello, Spaient Immersive!</h1>
<script type="text/javascript" src="./bundle.js"></script></body>
<div class="wrapper">
<!-- Sidebar -->
<nav id="sidebar">
<div class="sidebar-header">
<button type="button" id="sidebarCollapse" class="btn btn-info">
<i class="fas fa-align-justify"></i>
</button>
<h3 class="logotext">Microbot</h3>
<!-- <strong>MB</strong> -->
</div>
<ul class="list-unstyled components">
<li class="active">
<!-- data-toggle="collapse" -->
<a href="#homeSubmenu">
<i class="fas fa-home"></i>
<span class="hideable">Home</span>
</a>
<!-- <ul class="collapse list-unstyled" id="homeSubmenu">
<li>
<a href="#">Home 1</a>
</li>
<li>
<a href="#">Home 2</a>
</li>
<li>
<a href="#">Home 3</a>
</li>
</ul> -->
</li>
<li>
<a href="#">
<i class="fas fa-briefcase"></i>
<span class="hideable">About</span>
</a>
<a href="#pageSubmenu" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle">
<i class="fas fa-copy"></i>
<span class="hideable">Tasks</span>
</a>
<ul class="collapse list-unstyled" id="pageSubmenu">
<li>
<a href="#">Repo</a>
</li>
<li>
<a href="#">Issues</a>
</li>
<li>
<a href="#">Admin</a>
</li>
</ul>
</li>
<li>
<a href="#">
<i class="fas fa-image"></i>
<span class="hideable">Favorites</span>
</a>
</li>
<li>
<a href="#">
<i class="fas fa-question"></i>
<span class="hideable">FAQ</span>
</a>
</li>
<li>
<a href="#">
<i class="fas fa-paper-plane"></i>
<span class="hideable">Contact</span>
</a>
</li>
</ul>
<!-- <ul class="list-unstyled CTAs">
<li>
<a href="https://bootstrapious.com/tutorial/files/sidebar.zip" class="download">Download source</a>
</li>
<li>
<a href="https://bootstrapious.com/p/bootstrap-sidebar" class="article">Back to article</a>
</li>
</ul> -->
</nav>
<!-- Page Content -->
<div id="content">
<div id="header" class="headerprompt">
<div class="prompt">
<p class="promptext">$_</p>
</div>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<form onsubmit="processRequest();" class="navbar-form" role="search">
<input type="text" class="form-control" placeholder="What you need..." name="command" id="command">
</form>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="nav navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="#">
<i class="far fa-star"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="far fa-trash-alt"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="far fa-paper-plane"></i>
</a>
</li>
</ul>
</div>
</div>
</nav>
</div>
<div>
<h2>Placeholder header</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
anim id est laborum.</p>
</div>
<div class="line"></div>
<h2>Lorem Ipsum Dolor</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div class="line"></div>
<h2>Lorem Ipsum Dolor</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div class="line"></div>
<h3>Lorem Ipsum Dolor</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<!-- jQuery CDN - Slim version (=without AJAX) -->
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<!-- Popper.JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ"
crossorigin="anonymous"></script>
<!-- Bootstrap JS -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" crossorigin="anonymous"></script>
<script>
$(document).ready(function () {
$('#sidebarCollapse').on('click', function () {
$('#sidebar').toggleClass('active');
$('.hideable').toggleClass('hide');
});
$('#content nav div.collapse li a.nav-link i.far.fa-star').hover(function () {
$('#content nav div.collapse li a.nav-link i.far.fa-star').toggleClass('fas');
});
$('#content nav div.collapse li a.nav-link i.far.fa-trash-alt').hover(function () {
$('#content nav div.collapse li a.nav-link i.far.fa-trash-alt').toggleClass('fas');
});
$('#content nav div.collapse li a.nav-link i.far.fa-paper-plane').hover(function () {
$('#content nav div.collapse li a.nav-link i.far.fa-paper-plane').toggleClass('fas');
});
});
</script>
</body>
</html>

12
public/login.html Normal file
View File

@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body id="login">
<a href="https://github.com/login/oauth/authorize?scope=user:email:repo&client_id=f6f649a1fe2dfea082ba">Click here</a> to begin!</a>
</body>
</html>

41
src/js/app.js Normal file
View File

@@ -0,0 +1,41 @@
import './../styles/scss/base.scss';
import './../styles/css/base.css';
import { parseWebDriverCommand } from '../../node_modules/blocking-proxy/built/lib/webdriver_commands';
const Microbot = require("./microbot-ops.js");
const app = new Microbot();
document.write('<h1>' + app.createRepository() + '</h1>');
var getUrlParameter = function getUrlParameter(sParam) {
var sPageURL = decodeURIComponent(window.location.search.substring(1)),
sURLVariables = sPageURL.split('&'),
sParameterName,
i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : sParameterName[1];
}
}
};
// window.onload = function() {
// var code = getUrlParameter('code');
// console.log(code)
// if(code !== undefined) {
// var result = $.ajax({
// type: "POST",
// url: 'https://github.com/login/oauth/access_token',
// data: {
// client_id: app.clientId,
// client_secret: app.clientSecret,
// code: code
// }
// });
// // alert(JSON.stringify(result));
// }
// //access_token = JSON.parse(result)['access_token']
// return code;
// };

61
src/js/github-ops.js Normal file
View File

@@ -0,0 +1,61 @@
module.exports = class Github {
getToken() {
}
createRepository(newRepoJson) {
$.ajax({
type: "POST",
headers: {'Authorization' : 'token bcce9020b0604acc8a535d6d0e026b04b4996432'},
url: "https://api.github.com/user/repos",
contentType: "application/json",
dataType: "jsonp",
data: newRepoJson
})
}
updateRepository(updateRepoJson) {
}
deleteRepositoy(repoId) {
}
createIssue(newIssueJson) {
}
updateIssue(updateIssueJson) {
}
deleteIssue(issueId) {
}
closeIssue(issueId) {
}
createUser(newuserJson) {
}
updateUser(updateUserJson) {
}
deleteUser(userId) {
}
addCollaborator(userId, collaboratorId) {
}
removeCollaborator(userId, collaboratorId) {
}
}

View File

@@ -1,4 +1,4 @@
class Greeter {
module.exports = class Greeter {
constructor(name) {
this.name = name;
}

View File

@@ -1,5 +0,0 @@
const Greeter = require("./Greeter");
const g = new Greeter('Sapient');
document.write('<h1>${g.greet()} </h1>')

27
src/js/microbot-ops.js Normal file
View File

@@ -0,0 +1,27 @@
const Github = require('./github-ops.js');
const $github = new Github()
module.exports = class Microbot {
constructor(clientId, clientSecret) {
// TODO move to config or env variables
this.clientId = 'f6f649a1fe2dfea082ba';
this.clientSecret = '7e9a33d05ffdb36b4a498140bb9bb06d62de4f0e';
}
createRepository(repoName, repoType) {
$github.createRepository({
"name": "first-js-git-api-repo",
"description": "This is your first repository",
"homepage": "https://github.com",
"private": false,
"has_issues": true,
"has_wiki": true
})
}
// testingWebpackcalls() {
// console.log('call successful');
// }
}

0
src/styles/css/base.css Normal file
View File

333
src/styles/scss/base.scss Normal file
View File

@@ -0,0 +1,333 @@
$themeColor-Light: #f3e2c7;
$themeColor-Dark:#252525;
$theme-font: verdana, sans-serif;
$theme-supplementer: #f39c12;
body {
font-family: 'Poppins', sans-serif;
background-color: $themeColor-Dark;
}
p {
font-family: 'Poppins', sans-serif;
font-size: 1.1em;
font-weight: 300;
line-height: 1.7em;
color: #999;
}
a,
a:hover,
a:focus {
color: inherit;
text-decoration: none;
transition: all 0.3s;
}
.navbar {
padding: 15px 10px;
background: #fff;
border: none;
border-radius: 0;
margin-bottom: 40px;
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}
.navbar-btn {
box-shadow: none;
outline: none !important;
border: none;
}
.line {
width: 100%;
height: 1px;
border-bottom: 1px dashed #ddd;
margin: 40px 0;
}
i,
span {
display: inline-block;
}
/* ---------------------------------------------------
SIDEBAR STYLE
----------------------------------------------------- */
.wrapper {
display: flex;
align-items: stretch;
}
#sidebar {
min-width: 250px;
max-width: 250px;
background: $theme-supplementer;
color: $themeColor-Dark;
transition: all 0.3s;
}
#sidebar.active {
min-width: 80px;
max-width: 80px;
text-align: center;
}
#sidebar.active .sidebar-header h3,
#sidebar.active .CTAs {
display: none;
}
.sidebar-header h3 {
display: inline;
padding-left: 0.6em;
vertical-align: middle;
}
#sidebar.active .sidebar-header strong {
display: block;
}
#sidebar ul li a {
text-align: left;
}
#sidebar.active ul li a {
padding: 20px 10px;
text-align: center;
font-size: 0.85em;
}
#sidebar.active ul li a i {
margin-right: 0;
display: block;
font-size: 1.8em;
margin-bottom: 5px;
}
#sidebar.active ul ul a {
padding: 10px !important;
}
#sidebar.active .dropdown-toggle::after {
top: auto;
bottom: 10px;
right: 50%;
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%);
}
#sidebar .sidebar-header {
padding: 20px;
background:$themeColor-Dark;
}
#sidebar .sidebar-header strong {
display: none;
font-size: 1.8em;
}
#sidebar ul.components {
padding: 20px 0;
border-bottom: 1px solid #47748b;
}
#sidebar ul li a {
padding: 10px;
font-size: 1.1em;
display: block;
}
#sidebar ul li a:hover {
color: #7386D5;
background: #fff;
}
#sidebar ul li a i {
margin-right: 10px;
}
#sidebar ul li.active>a,
a[aria-expanded="true"] {
color: $theme-supplementer;
background:$themeColor-Dark;
}
a[data-toggle="collapse"] {
position: relative;
}
.dropdown-toggle::after {
display: block;
position: absolute;
top: 50%;
right: 20px;
transform: translateY(-50%);
}
ul ul a {
font-size: 0.9em !important;
padding-left: 30px !important;
background: white;
font-weight: bolder;
}
ul.CTAs {
padding: 20px;
}
ul.CTAs a {
text-align: center;
font-size: 0.9em !important;
display: block;
border-radius: 5px;
margin-bottom: 5px;
}
a.download {
background: #fff;
color: #7386D5;
}
a.article,
a.article:hover {
background: #6d7fcc !important;
color: #fff !important;
}
/* ---------------------------------------------------
CONTENT STYLE
----------------------------------------------------- */
#content {
width: 100%;
padding: 20px;
min-height: 100vh;
transition: all 0.3s;
}
/* ---------------------------------------------------
MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 768px) {
#sidebar {
min-width: 80px;
max-width: 80px;
text-align: center;
margin-left: -80px !important;
}
.dropdown-toggle::after {
top: auto;
bottom: 10px;
right: 50%;
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%);
}
#sidebar.active {
margin-left: 0 !important;
}
#sidebar .sidebar-header h3,
#sidebar .CTAs {
display: none;
}
#sidebar .sidebar-header strong {
display: block;
}
#sidebar ul li a {
padding: 20px 10px;
}
#sidebar ul li a span {
font-size: 0.85em;
}
#sidebar ul li a i {
margin-right: 0;
display: block;
}
#sidebar ul ul a {
padding: 10px !important;
}
#sidebar ul li a i {
font-size: 1.3em;
}
#sidebar {
margin-left: 0;
}
#sidebarCollapse span {
display: none;
}
}
/* -------------------------------------------------
ADDITIONS
--------------------------------------------------*/
.hide {
display: none;
}
.prompt {
display: flex;
width: 2em;
border-right: 1px solid #c99034;
background-color: #f5d38b;
width: 4%;
margin-bottom: 40px;
border-radius: 4px 0 0 4px;
}
.promptext {
animation:blinkingText 0.8s infinite;
color: #975f04;
text-align: center;
line-height: 2em;
font: 1.5em bolder;
margin: auto;
}
@keyframes blinkingText {
0%{ color: #000; }
49%{ color: transparent; }
50%{ color: transparent; }
99%{ color:transparent; }
100%{ color: #000; }
}
.headerprompt {
display: flex;
width: 100%;
}
.logotext {
color: $theme-supplementer;
}
#content nav div.collapse li a.nav-link i.far {
color: $theme-supplementer;
font-size: 1.8em;
padding: 0.2em;
}
/* --------------------------------------------------
OVERRIDES
--------------------------------------------------*/
.btn {
background-color: $theme-supplementer;
color: $themeColor-Dark
}
#content #header .navbar {
width: 96%;
}
.navbar-form {
width: 88%;
}
.form-control {
padding: .6rem 1em;
}
.container-fluid {
padding-left: 0.3em;
}

12
test.html Normal file
View File

@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
Hi
</body>
</html>

View File

@@ -1,7 +1,7 @@
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: ['./src/js/index.js'],
entry: ['./src/js/app.js'],
output: {
path: __dirname + '/dist',
filename: './bundle.js'
@@ -9,12 +9,14 @@ module.exports = {
module: {
rules: [
{ test: /.js/, loader: 'babel-loader', exclude: /node_modules/ },
{ test: /.html/, loader: 'raw-loader', exclude: /node_modules/ }
{ test: /.html/, loader: 'raw-loader', exclude: /node_modules/ },
{ test: /\.(s*)css$/, use: ['style-loader', 'css-loader', 'sass-loader']}
]
},
plugins: [
new HtmlWebpackPlugin({
template: './public/index.html'
// template: './test.html'
})
],
mode: 'development'