tonyair/silverstripe-webpack
1
1
Fork 0
mirror of https://github.com/a2nt/silverstripe-webpack.git synced 2024-10-22 17:05:31 +02:00
Code Issues Projects Releases Wiki Activity

Minor updates

Browse Source
This commit is contained in:
Tony Air 2018-07-18 13:48:55 +07:00
parent e828bfa1db
commit 7443525e6f
13 changed files with 163 additions and 155 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
app/client/src/img/.gitkeep Normal file
View File

BIN
app/client/src/img/icon-cfpb.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 3.9 KiB

BIN
app/client/src/img/icon-lender.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 946 B

BIN
app/client/src/img/logo.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 5.1 KiB

35
app/client/src/scss/_components/_ui.bootstrap.scss Normal file
View File

@ -0,0 +1,35 @@
// Bootstrap
@import "~bootstrap/scss/root";
@import "~bootstrap/scss/reboot";
@import "~bootstrap/scss/type";
@import "~bootstrap/scss/images";
@import "~bootstrap/scss/code";
@import "~bootstrap/scss/grid";
@import "~bootstrap/scss/tables";
@import "~bootstrap/scss/forms";
@import "~bootstrap/scss/buttons";
@import "~bootstrap/scss/transitions";
@import "~bootstrap/scss/dropdown";
@import "~bootstrap/scss/button-group";
@import "~bootstrap/scss/input-group";
@import "~bootstrap/scss/custom-forms";
@import "~bootstrap/scss/nav";
@import "~bootstrap/scss/navbar";
@import "~bootstrap/scss/card";
@import "~bootstrap/scss/breadcrumb";
@import "~bootstrap/scss/pagination";
@import "~bootstrap/scss/badge";
@import "~bootstrap/scss/jumbotron";
@import "~bootstrap/scss/alert";
@import "~bootstrap/scss/progress";
@import "~bootstrap/scss/media";
@import "~bootstrap/scss/list-group";
@import "~bootstrap/scss/close";
@import "~bootstrap/scss/modal";
@import "~bootstrap/scss/tooltip";
@import "~bootstrap/scss/popover";
@import "~bootstrap/scss/carousel";
@import "~bootstrap/scss/utilities";
@import "~bootstrap/scss/print";
@import "_ui.carousel";

23
app/client/src/scss/_components/_ui.carousel.scss
View File

@ -1,19 +1,24 @@
/*
* Bootstrap carousel improvement
*/
.carousel-control-prev,
.carousel-control-next {
z-index: 2;
font-size: 3rem;
text-shadow: 1px 1px #000;
&:hover,
&:focus {
background: rgba(0, 0, 0, 0.6);
}
z-index: 2;
font-size: 3rem;
text-shadow: 1px 1px #000;
&:hover,
&:focus {
background: rgba(0, 0, 0, 0.6);
}
}
.carousel-indicators li {
box-shadow: 1px 1px #000;
box-shadow: 1px 1px #000;
}
.carousel-title,
.carousel-content {
text-shadow: 1px 1px #000;
text-shadow: 1px 1px #000;
}

28
app/client/src/scss/_components/_ui.elemental.scss Normal file
View File

@ -0,0 +1,28 @@
/*
* Basic styles for silverstripe-elemental
*/
// hide default page title cuz elemental object will be used to display titles
h1 {
display: none;
}
// add top/bottom paddings for basic elements
.page-content > .element {
position: relative;
padding: ($grid-gutter-height / 2) 0;
// remove paddings of the slideshow
&.dynamic__elements__image__elements__elementimage,
&.dynamic__elements__flexslider__elements__elementslideshow {
padding: 0;
}
}
// remove container paddings for the slideshow
.dynamic__elements__image__elements__elementimage,
.dynamic__elements__flexslider__elements__elementslideshow {
.container-fluid {
padding: 0;
}
}

3
app/client/src/scss/_components/_ui.fontawesome.scss Normal file
View File

@ -0,0 +1,3 @@
$fa-font-path: "~font-awesome/fonts";
@import "~font-awesome/scss/font-awesome";

5
app/client/src/scss/_components/_ui.lightbox.scss Normal file
View File

@ -0,0 +1,5 @@
$lightbox-breakpoint: map-get($grid-breakpoints, "sm");
$lightbox-link-hover-color: $link-hover-color;
@import "~meta-lightbox/scss/meta-lightbox";
@import "~meta-lightbox/scss/meta-lightbox-theme";

63
app/client/src/scss/_components/_ui.main.scss Normal file
View File

@ -0,0 +1,63 @@
/*
* some basic styles
*/
// don't let images be wider than the parent layer
iframe,
img {
max-width: 100%;
}
a:hover,
a:focus {
opacity: .8;
.fas,
.fab,
&.fas,
&.fab {
transform: rotate(-180deg);
}
}
// transactions
.transition,
a, a img,
a .fas, a .fab,
a.fas, a.fab,
button, input, optgroup, select, textarea,
.btn,
.alert,
.dropdown,
[data-target],
.container,
.container-fluid,
.row,
[class="col-*"] {
transition: all 0.4s ease;
}
// stick navbar to top using mobile layout
#Header {
position: relative;
padding-top: $grid-gutter-height / 2;
padding-bottom: 1rem;
@media (min-width: map-get($grid-breakpoints, "lg")) {
padding-top: 1rem;
padding-bottom: 0;
}
}
#Navigation {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 10;
@media (min-width: map-get($grid-breakpoints, "lg")) {
position: relative;
margin-top: 1rem;
}
}

140
app/client/src/scss/app.scss
View File

@ -1,141 +1,13 @@
// Your custom variables
@import "_variables";
// Bootstrap
@import "~bootstrap/scss/root";
@import "~bootstrap/scss/reboot";
@import "~bootstrap/scss/type";
@import "~bootstrap/scss/images";
@import "~bootstrap/scss/code";
@import "~bootstrap/scss/grid";
@import "~bootstrap/scss/tables";
@import "~bootstrap/scss/forms";
@import "~bootstrap/scss/buttons";
@import "~bootstrap/scss/transitions";
@import "~bootstrap/scss/dropdown";
@import "~bootstrap/scss/button-group";
@import "~bootstrap/scss/input-group";
@import "~bootstrap/scss/custom-forms";
@import "~bootstrap/scss/nav";
@import "~bootstrap/scss/navbar";
@import "~bootstrap/scss/card";
@import "~bootstrap/scss/breadcrumb";
@import "~bootstrap/scss/pagination";
@import "~bootstrap/scss/badge";
@import "~bootstrap/scss/jumbotron";
@import "~bootstrap/scss/alert";
@import "~bootstrap/scss/progress";
@import "~bootstrap/scss/media";
@import "~bootstrap/scss/list-group";
@import "~bootstrap/scss/close";
@import "~bootstrap/scss/modal";
@import "~bootstrap/scss/tooltip";
@import "~bootstrap/scss/popover";
@import "~bootstrap/scss/carousel";
@import "~bootstrap/scss/utilities";
@import "~bootstrap/scss/print";
@import "_components/_ui.bootstrap";
@import "_components/_ui.fontawesome";
@import "_components/_ui.lightbox";
// Fontawesome
$fa-font-path: "~font-awesome/fonts";
@import "_components/_ui.main";
@import "_components/_ui.elemental";
@import "~font-awesome/scss/font-awesome";
// Extra modules
$lightbox-breakpoint: map-get($grid-breakpoints, "sm");
$lightbox-link-hover-color: $link-hover-color;
@import "~meta-lightbox/scss/meta-lightbox";
@import "~meta-lightbox/scss/meta-lightbox-theme";
@import "_components/ui.carousel";
/*
* some basic styles
*/
// hide default page title cuz elemental object will be used to display titles
h1 {
display: none;
}
// don't let images be wider than the parent layer
iframe,
img {
max-width: 100%;
}
a:hover,
a:focus {
opacity: .8;
.fas,
.fab,
&.fas,
&.fab {
transform: rotate(-180deg);
}
}
// transactions
.transition,
a, a img,
a .fas, a .fab,
a.fas, a.fab,
button, input, optgroup, select, textarea,
.btn,
.alert,
.dropdown,
[data-target],
.container,
.container-fluid,
.row,
[class="col-*"] {
transition: all 0.4s ease;
}
// stick navbar to top using mobile layout
#Header {
position: relative;
padding-top: $grid-gutter-height / 2;
padding-bottom: 1rem;
@media (min-width: map-get($grid-breakpoints, "lg")) {
padding-top: 1rem;
padding-bottom: 0;
}
}
#Navigation {
position: fixed;
top: 0;
left: 0;
width: 100%;
@media (min-width: map-get($grid-breakpoints, "lg")) {
position: relative;
margin-top: 1rem;
}
}
// add top/bottom paddings for basic elements
.page-content > .element {
position: relative;
padding: ($grid-gutter-height / 2) 0;
// remove paddings of the slideshow
&.dynamic__elements__image__elements__elementimage,
&.dynamic__elements__flexslider__elements__elementslideshow {
padding: 0;
}
}
// remove container paddings for the slideshow
.dynamic__elements__image__elements__elementimage,
.dynamic__elements__flexslider__elements__elementslideshow {
.container-fluid {
padding: 0;
}
}
// Your custom UI
// Your custom styling
@import "_typography";
@import "_layout";

2
app/templates/Includes/FlexSlider.ss
View File

@ -1,5 +1,5 @@
<% if $SlideShow %>
<div id="Carousel{$ID}" class="carousel slide js-carousel" data-indicators="true" data-arrows="true">
<div id="Carousel{$ID}" class="carousel slide js-carousel d-none d-sm-block" data-indicators="true" data-arrows="true">
<div class="carousel-inner">
<% loop $SlideShow %>
<div class="carousel-item<% if $First %> active<% end_if %>">

17
package.json
View File

@ -17,10 +17,10 @@
"dash": "cross-env NODE_ENV=development webpack-dashboard -- webpack-dev-server --config webpack.config.dev.js",
"prebuild": "rimraf build",
"build": "cross-env NODE_ENV=production webpack -p --config webpack.config.prod.js --progress",
"lint:check": "eslint ./site/src --config .eslintrc && sass-lint ./site/src --config .sasslintrc -v -q",
"lint:fix": "eslint ./site/src --config .eslintrc --fix && sass-lint ./site/src --config .sasslintrc -v -q --fix",
"lint:js": "eslint ./site/src --config .eslintrc",
"lint:sass": "sass-lint ./site/src --config .sasslintrc -v -q"
"lint:check": "eslint ./app/client/src --config .eslintrc && sass-lint ./app/client/src --config .sasslintrc -v -q",
"lint:fix": "eslint ./app/client/src --config .eslintrc --fix && sass-lint ./app/client/src --config .sasslintrc -v -q --fix",
"lint:js": "eslint ./app/client/src --config .eslintrc",
"lint:sass": "sass-lint ./app/client/src --config .sasslintrc -v -q"
},
"dependencies": {
"bootbox": "^4.4.0",
@ -97,8 +97,7 @@
"block-no-empty": null,
"color-no-invalid-hex": true,
"comment-empty-line-before": [
"always",
{
"always", {
"ignore": [
"stylelint-commands",
"after-comment"
@ -107,8 +106,7 @@
],
"declaration-colon-space-after": "always",
"indentation": [
4,
{
4, {
"except": [
"value"
]
@ -116,8 +114,7 @@
],
"max-empty-lines": 2,
"rule-empty-line-before": [
"always",
{
"always", {
"except": [
"first-nested"
],