Added Grunt to compile SASS and JS files; added navbar
This commit is contained in:
4
.gitignore
vendored
4
.gitignore
vendored
@@ -130,3 +130,7 @@ dist
|
||||
.yarn/install-state.gz
|
||||
.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",
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"nodemon": "nodemon"
|
||||
"nodemon": "nodemon",
|
||||
"grunt": "grunt"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@@ -23,6 +24,11 @@
|
||||
"twig": "^1.16.0"
|
||||
},
|
||||
"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">
|
||||
<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="/css/nardah.css">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
|
||||
<script src="/js/bedabin.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
{% include 'partials/navbar.twig' %}
|
||||
|
||||
<div class="container">
|
||||
{% block content %}{% endblock %}
|
||||
</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>
|
||||
Reference in New Issue
Block a user