Added Grunt to compile SASS and JS files; added navbar
This commit is contained in:
parent
9eaa42dacc
commit
6960c9f884
4
.gitignore
vendored
4
.gitignore
vendored
@ -130,3 +130,7 @@ dist
|
|||||||
.yarn/install-state.gz
|
.yarn/install-state.gz
|
||||||
.pnp.*
|
.pnp.*
|
||||||
|
|
||||||
|
|
||||||
|
# Compiled CSS and JS files
|
||||||
|
public/css/
|
||||||
|
public/js/
|
||||||
61
Gruntfile.js
Normal file
61
Gruntfile.js
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
module.exports = function(grunt) {
|
||||||
|
|
||||||
|
// Project configuration.
|
||||||
|
grunt.initConfig({
|
||||||
|
pkg: grunt.file.readJSON('package.json'),
|
||||||
|
|
||||||
|
sass: {
|
||||||
|
dist: {
|
||||||
|
options: {
|
||||||
|
style: 'compressed'
|
||||||
|
},
|
||||||
|
files: [{
|
||||||
|
expand: true,
|
||||||
|
cwd: 'assets/styles',
|
||||||
|
src: ['**/*.scss'],
|
||||||
|
dest: 'public/css',
|
||||||
|
ext: '.css'
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
uglify: {
|
||||||
|
options: {
|
||||||
|
mangle: false
|
||||||
|
},
|
||||||
|
compile: {
|
||||||
|
files: {
|
||||||
|
'public/js/bedabin.min.js': ['assets/js/**/*.js']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
watch: {
|
||||||
|
css: {
|
||||||
|
files: ['assets/styles/**/*.scss'],
|
||||||
|
tasks: ['sass'],
|
||||||
|
options: {
|
||||||
|
atBegin: true,
|
||||||
|
spawn: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
js: {
|
||||||
|
files: ['assets/js/**/*.js'],
|
||||||
|
tasks: ['uglify'],
|
||||||
|
options: {
|
||||||
|
atBegin: true,
|
||||||
|
spawn: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Load plugins.
|
||||||
|
grunt.loadNpmTasks('grunt-contrib-watch');
|
||||||
|
grunt.loadNpmTasks('grunt-contrib-sass');
|
||||||
|
grunt.loadNpmTasks('grunt-contrib-uglify');
|
||||||
|
|
||||||
|
// CLI tasks.
|
||||||
|
grunt.registerTask('default', ['sass', 'uglify']);
|
||||||
|
|
||||||
|
};
|
||||||
3
assets/js/bedabin.js
Normal file
3
assets/js/bedabin.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
$(document).ready(function() {
|
||||||
|
console.log("ready");
|
||||||
|
});
|
||||||
65
assets/styles/nardah.scss
Normal file
65
assets/styles/nardah.scss
Normal file
@ -0,0 +1,65 @@
|
|||||||
|
$primary-color: navy;
|
||||||
|
$primary-color-highlight: lighten($primary-color, 10%);
|
||||||
|
|
||||||
|
$nav-height: 65px;
|
||||||
|
|
||||||
|
body{
|
||||||
|
margin: 0;
|
||||||
|
padding: $nav-height 0 0;
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
a{
|
||||||
|
color: $primary-color;
|
||||||
|
transition: all 230ms ease-in-out;
|
||||||
|
&:hover{
|
||||||
|
color: $primary-color-highlight;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#main-nav{
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: $nav-height;
|
||||||
|
background: $primary-color;
|
||||||
|
color: #eee;
|
||||||
|
font-size: 2rem;
|
||||||
|
|
||||||
|
ul{
|
||||||
|
list-style: none;
|
||||||
|
li{
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-left{
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.nav-right{
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
a{
|
||||||
|
display: inline-block;
|
||||||
|
padding: 15px 10px;
|
||||||
|
color: #eee;
|
||||||
|
text-decoration: none;
|
||||||
|
&:hover{
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-logo{
|
||||||
|
margin-left: 25px;
|
||||||
|
margin-right: 25px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#main-wrapper{
|
||||||
|
max-width: 1180px;
|
||||||
|
margin-top: 15px;
|
||||||
|
padding: 15px 20px;
|
||||||
|
}
|
||||||
1562
package-lock.json
generated
1562
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
10
package.json
10
package.json
@ -5,7 +5,8 @@
|
|||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"test": "echo \"Error: no test specified\" && exit 1",
|
"test": "echo \"Error: no test specified\" && exit 1",
|
||||||
"nodemon": "nodemon"
|
"nodemon": "nodemon",
|
||||||
|
"grunt": "grunt"
|
||||||
},
|
},
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
@ -23,6 +24,11 @@
|
|||||||
"twig": "^1.16.0"
|
"twig": "^1.16.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"nodemon": "^3.0.1"
|
"grunt": "^1.6.1",
|
||||||
|
"grunt-contrib-sass": "^2.0.0",
|
||||||
|
"grunt-contrib-uglify": "^5.2.2",
|
||||||
|
"grunt-contrib-watch": "^1.1.0",
|
||||||
|
"nodemon": "^3.0.1",
|
||||||
|
"sass": "^1.68.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -5,9 +5,13 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>{% block title %}{% endblock %} | BLT</title>
|
<title>{% block title %}{% endblock %} | BLT</title>
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css">
|
||||||
|
<link rel="stylesheet" href="/css/nardah.css">
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
|
||||||
|
<script src="/js/bedabin.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
{% include 'partials/navbar.twig' %}
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
10
views/partials/navbar.twig
Normal file
10
views/partials/navbar.twig
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
<nav id="main-nav">
|
||||||
|
|
||||||
|
<ul class="nav-left">
|
||||||
|
<li class="site-logo">BLT</li>
|
||||||
|
<li><a href="/">Dashboard</a></li>
|
||||||
|
<li><a href="/test">Test</a></li>
|
||||||
|
<li><a href="/result">Results</a></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
</nav>
|
||||||
Loading…
Reference in New Issue
Block a user