Skip to content
This repository was archived by the owner on Dec 21, 2019. It is now read-only.

Commit 9262353

Browse files
BraunsonBraunson
committed
Mix & Changes for CoreUI assets
- Added required packages - Updated view for CoreUI/Vue - Updated Webpack to copy over the required CoreUI assets - Updated CSS/JS to include CoreUI assets when being compiled
1 parent 2c68e25 commit 9262353

File tree

5 files changed

+85
-97
lines changed

5 files changed

+85
-97
lines changed

‎package.json‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,5 +17,12 @@
1717
"laravel-mix": "0.*",
1818
"lodash": "^4.17.4",
1919
"vue": "^2.1.10"
20+
},
21+
"dependencies": {
22+
"vue-chartjs": "2.5.4",
23+
"vue-router": "^2.3.1",
24+
"vue-strap": "github:wffranco/vue-strap",
25+
"react": "^15.4.2",
26+
"react-dom": "^15.4.2"
2027
}
2128
}

‎resources/assets/js/app.js‎

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* jshint esversion: 6 */
12

23
/**
34
* First we will load all of this project's JavaScript dependencies which
@@ -13,8 +14,18 @@ require('./bootstrap');
1314
* or customize the JavaScript scaffolding to fit your unique needs.
1415
*/
1516

16-
Vue.component('example', require('./components/Example.vue'));
17+
// Vue.component('example', require('./components/Example.vue'));
1718

19+
import Vue from 'vue';
20+
import App from './coreui/App.vue';
21+
import router from './coreui/router';
22+
23+
Vue.component('App', require('./coreui/App.vue'));
24+
25+
/* eslint-disable no-new */
1826
const app = new Vue({
19-
el: '#app'
27+
el: '#app',
28+
router,
29+
template: '<App/>',
30+
components: { App },
2031
});

‎resources/assets/sass/app.scss‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,18 @@
11

22
// Fonts
3-
@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);
3+
// @import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);
44

55
// Variables
6-
@import "variables";
6+
// @import "variables";
77

88
// Bootstrap
9-
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";
9+
// @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";
10+
11+
// Font Awesome
12+
@import "vendor/mrholek/CoreUI-Free-Bootstrap-Admin-Template/Vue_Full_Project/static/css/public/css/font-awesome";
13+
14+
// Simple Line Icons
15+
@import "vendor/mrholek/CoreUI-Free-Bootstrap-Admin-Template/Vue_Full_Project/static/css/public/css/simple-line-icons";
16+
17+
// CoreUI Style
18+
@import "coreui/style";

‎resources/views/welcome.blade.php‎

Lines changed: 41 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -1,95 +1,44 @@
11
<!DOCTYPE html>
22
<html lang="{{ config('app.locale') }}">
3-
<head>
4-
<meta charset="utf-8">
5-
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6-
<meta name="viewport" content="width=device-width, initial-scale=1">
7-
8-
<title>Laravel</title>
9-
10-
<!-- Fonts -->
11-
<link href="https://fonts.googleapis.com/css?family=Raleway:100,600" rel="stylesheet" type="text/css">
12-
13-
<!-- Styles -->
14-
<style>
15-
html, body {
16-
background-color: #fff;
17-
color: #636b6f;
18-
font-family: 'Raleway', sans-serif;
19-
font-weight: 100;
20-
height: 100vh;
21-
margin: 0;
22-
}
23-
24-
.full-height {
25-
height: 100vh;
26-
}
27-
28-
.flex-center {
29-
align-items: center;
30-
display: flex;
31-
justify-content: center;
32-
}
33-
34-
.position-ref {
35-
position: relative;
36-
}
37-
38-
.top-right {
39-
position: absolute;
40-
right: 10px;
41-
top: 18px;
42-
}
43-
44-
.content {
45-
text-align: center;
46-
}
47-
48-
.title {
49-
font-size: 84px;
50-
}
51-
52-
.links > a {
53-
color: #636b6f;
54-
padding: 0 25px;
55-
font-size: 12px;
56-
font-weight: 600;
57-
letter-spacing: .1rem;
58-
text-decoration: none;
59-
text-transform: uppercase;
60-
}
61-
62-
.m-b-md {
63-
margin-bottom: 30px;
64-
}
65-
</style>
66-
</head>
67-
<body>
68-
<div class="flex-center position-ref full-height">
69-
@if (Route::has('login'))
70-
<div class="top-right links">
71-
@if (Auth::check())
72-
<a href="{{ url('/home') }}">Home</a>
73-
@else
74-
<a href="{{ url('/login') }}">Login</a>
75-
<a href="{{ url('/register') }}">Register</a>
76-
@endif
77-
</div>
78-
@endif
79-
80-
<div class="content">
81-
<div class="title m-b-md">
82-
Laravel
83-
</div>
84-
85-
<div class="links">
86-
<a href="https://laravel.com/docs">Documentation</a>
87-
<a href="https://laracasts.com">Laracasts</a>
88-
<a href="https://laravel-news.com">News</a>
89-
<a href="https://forge.laravel.com">Forge</a>
90-
<a href="https://github.com/laravel/laravel">GitHub</a>
91-
</div>
92-
</div>
93-
</div>
94-
</body>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<meta name="csrf-token" content="{{ csrf_token() }}">
8+
9+
<title>Laravel - CoreUI Example</title>
10+
11+
<link href="{{ mix('css/app.css') }}" rel="stylesheet">
12+
13+
<script>
14+
window.Laravel = {!! json_encode([
15+
'csrfToken' => csrf_token(),
16+
]) !!};
17+
</script>
18+
19+
<!-- BODY options, add following classes to body to change options
20+
21+
// Header options
22+
1. '.header-fixed' - Fixed Header
23+
24+
// Sidebar options
25+
1. '.sidebar-fixed' - Fixed Sidebar
26+
2. '.sidebar-hidden' - Hidden Sidebar
27+
3. '.sidebar-off-canvas' - Off Canvas Sidebar
28+
4. '.sidebar-compact' - Compact Sidebar Navigation (Only icons)
29+
30+
// Aside options
31+
1. '.aside-menu-fixed' - Fixed Aside Menu
32+
2. '.aside-menu-hidden' - Hidden Aside Menu
33+
3. '.aside-menu-off-canvas' - Off Canvas Aside Menu
34+
35+
// Footer options
36+
1. '.footer-fixed' - Fixed footer
37+
38+
-->
39+
</head>
40+
<body class="app header-fixed sidebar-fixed aside-menu-fixed aside-menu-hidden">
41+
<div id="app"></div>
42+
<script src="{{ mix('js/app.js') }}"></script>
43+
</body>
9544
</html>

‎webpack.mix.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
const { mix } = require('laravel-mix');
2+
var coreui_vendor = 'vendor/mrholek/CoreUI-Free-Bootstrap-Admin-Template/Vue_Full_Project';
23

34
/*
45
|--------------------------------------------------------------------------
@@ -11,5 +12,16 @@ const { mix } = require('laravel-mix');
1112
|
1213
*/
1314

15+
// Copy over the CoreUI Assets
16+
mix.copyDirectory(coreui_vendor + '/static/img', 'public/static/img')
17+
.copyDirectory(coreui_vendor + '/static/fonts', 'public/static/fonts')
18+
.copyDirectory(coreui_vendor + '/scss', 'resources/assets/sass/coreui')
19+
.copyDirectory(coreui_vendor + '/src/assets', 'resources/assets/js/coreui/assets')
20+
.copyDirectory(coreui_vendor + '/src/components', 'resources/assets/js/coreui/components')
21+
.copyDirectory(coreui_vendor + '/src/containers', 'resources/assets/js/coreui/containers')
22+
.copyDirectory(coreui_vendor + '/src/router', 'resources/assets/js/coreui/router')
23+
.copyDirectory(coreui_vendor + '/src/views', 'resources/assets/js/coreui/views')
24+
.copy(coreui_vendor + '/src/App.vue', 'resources/assets/js/coreui/App.vue', false);
25+
1426
mix.js('resources/assets/js/app.js', 'public/js')
1527
.sass('resources/assets/sass/app.scss', 'public/css');

0 commit comments

Comments
 (0)