Skip to content

Commit

Permalink
update package structure
Browse files Browse the repository at this point in the history
  • Loading branch information
Beth3346 committed Oct 26, 2021
1 parent ef2d8c5 commit 4ed8a80
Show file tree
Hide file tree
Showing 11 changed files with 10,116 additions and 4,783 deletions.
12 changes: 0 additions & 12 deletions .travis.yml

This file was deleted.

89 changes: 29 additions & 60 deletions gulpfile.js
Original file line number Diff line number Diff line change
@@ -1,86 +1,55 @@
const gulp = require('gulp');
const path = require('path');
const sass = require('gulp-sass');
const plumber = require('gulp-plumber');
const autoprefixer = require('gulp-autoprefixer');
const cleanCSS = require('gulp-clean-css');
const browsersync = require('browser-sync').create();
const del = require('del');
const gulp = require("gulp");
const sass = require("gulp-sass")(require("sass"));
const plumber = require("gulp-plumber");
const autoprefixer = require("gulp-autoprefixer");
const cleanCSS = require("gulp-clean-css");
const del = require("del");

var paths = {
app: 'dist/',
css: 'dist/css/'
app: "dist/",
css: "dist/css/",
images: "dist/images/",
};

// BrowserSync
function browserSync(done) {
browsersync.init({
server: {
baseDir: './dist/'
},
port: 3000
});
done();
// Clean assets
function clean() {
return del(["./dist/css/", "./dist/images/", "./dist/index.html"]);
}

// BrowserSync Reload
function browserSyncReload(done) {
browsersync.reload();
done();
// Copy HTML
function copyIndex() {
return gulp.src("./index.html").pipe(gulp.dest(paths.app));
}

// Clean assets
function clean() {
return del(['./dist/css/']);
function copyImages() {
return gulp
.src("./images/**/*.{gif,jpg,png,svg}")
.pipe(gulp.dest(paths.images));
}

// Watch files
function watchFiles(done) {
gulp.watch(['./**/*.scss', 'dist/index.html'], () => {
return gulp
.src('./*.scss')
.pipe(plumber())
.pipe(
sass({
includePaths: ['node_modules']
}).on('error', sass.logError)
)
.pipe(gulp.dest(paths.css))
.pipe(
autoprefixer({
browsers: ['last 3 versions'],
cascade: false
})
)
.pipe(gulp.dest(paths.css))
.pipe(cleanCSS({ debug: true }))
.pipe(gulp.dest(paths.css))
.pipe(browserSyncReload(done));
});
}
gulp.task("default", () => {
copyImages();

gulp.task('default', () => {
return gulp
.src('./*.scss')
.src("./*.scss")
.pipe(plumber())
.pipe(
sass({
includePaths: ['node_modules']
}).on('error', sass.logError)
includePaths: ["node_modules"],
}).on("error", sass.logError)
)
.pipe(gulp.dest(paths.css))
.pipe(
autoprefixer({
browsers: ['last 3 versions'],
cascade: false
cascade: false,
})
)
.pipe(gulp.dest(paths.css))
.pipe(cleanCSS({ debug: true }))
.pipe(gulp.dest(paths.css));
.pipe(gulp.dest(paths.css))
.pipe(copyIndex());
});

const watch = gulp.parallel(watchFiles, browserSync);

exports.clean = clean;
exports.watch = watch;
exports.copyIndex = copyIndex;
exports.copyImages = copyImages;
95 changes: 95 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,95 @@
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js">
<!--<![endif]-->

<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Animated Icons Demo | ELR CSS Utilities</title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link
href="https://fonts.googleapis.com/css?family=Lato:400,700"
rel="stylesheet"
/>
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.0.10/css/all.css"
integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="./css/style.css" />
<link rel="stylesheet" href="./css/animations.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>
<!--[if lt IE 7]>
<p class="browsehappy">
You are using an <strong>outdated</strong> browser. Please
<a href="#">upgrade your browser</a> to improve your experience.
</p>
<![endif]-->
<div class="wrapper">
<div class="content-holder">
<h1>Animations</h1>
<div class="demo-content">
<div class="circle elr-spin">Spinning!</div>
<div class="circle elr-spin-4s">Spinning Faster!</div>
</div>
<div class="demo-content">
<div class="slide-down">
<h4>Slide Down</h4>
<ul class="drop-list elr-slide">
<li>Item One</li>
<li>Item Two</li>
<li>Item Three</li>
<li>Item Four</li>
</ul>
</div>
</div>
<div class="demo-content">
<div class="demo-box elr-fade-out">
<div class="elr-fade-item circle">Fade Out</div>
<p>Hello!</p>
</div>
<div class="demo-box elr-fade-in">
<div class="elr-fade-item circle">Fade In</div>
<p>Hover</p>
</div>
</div>
<div class="demo-content">
<div class="elr-flipper">
<div class="elr-flipper-container js-flipper-container">
<div class="elr-flipper-front">
<p>Click Me!</p>
</div>
<div class="elr-flipper-back">
<p>Here is some content.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
$('.slide-down').on('click', function() {
$(this)
.find('.elr-slide')
.toggleClass('active');
});
$('.slide-down')
.find('.elr-slide')
.on('click', function(e) {
e.stopPropagation();
});
$('.js-flipper-container').on('click', function() {
$(this).toggleClass('active');
});
</script>
</body>
</html>

0 comments on commit 4ed8a80

Please sign in to comment.