lesderid
/
pollthingy
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

Use Laravel Mix to combine and minify CSS

master
Les De Ridder 3 years ago
parent
e54df0aade
commit
826e144621
11 changed files with 12241 additions and 169 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 11308
      package-lock.json
  2. 1
      public/css/app.css
  3. 0
      public/css/cutestrap.min.css
  4. 1
      public/css/mixed.css
  5. 3
      public/mix-manifest.json
  6. 132
      resources/css/app.css
  7. 781
      resources/css/cutestrap.css
  8. 20
      resources/sass/_variables.scss
  9. 14
      resources/sass/app.scss
  10. 136
      resources/views/layouts/app.blade.php
  11. 14
      webpack.mix.js

11308
package-lock.json
File diff suppressed because it is too large
View File

1
public/css/app.css
View File

@ -0,0 +1 @@
input[type=text]{padding-top:.8rem!important}.no-top-padding{padding-top:0!important}.no-bottom-margin{margin-bottom:0!important}.some-bottom-margin{margin-bottom:.5rem!important}.some-bottom-padding{padding-bottom:3rem!important}.some-top-margin{margin-top:2rem}.some-more-bottom-margin{margin-bottom:2rem}.inline-block{display:inline-block}.text-browser{display:none}.huge-button{width:100%}.float-right{float:right}.primary-box{padding:1rem 1rem 1rem 1rem!important;border:2px solid #e83fb8}.vote-bar{background-color:#e83fb8;height:2rem}img.centered-image{display:block;margin:0 auto}.copyarea{user-select:all;width:calc(100% - .4rem);height:15rem;margin-top:.5rem;border:1px solid #7d7d7e;font-family:"Roboto Mono",monospace;font-size:1rem;padding:0 0 0 .4rem}.copyarea:focus{outline:0}.ta-center{margin-top:1rem}.post-input-label{display:inline-block;font-size:1.2rem}.number{display:inline-block;margin-bottom:2.4rem;padding:0 1rem 0 2rem;position:relative}.number>input[type=number]{display:inline-block;border:1px solid #7d7d7e;margin-top:.5rem;margin-left:1rem}.number>input[type=number]:focus{border-color:#e83fb8;box-shadow:0 1px 2px 0 #dededf inset;outline:0}.free-number{display:inline-block;margin-bottom:0;padding:0 1rem 0 0;position:relative}.free-number>input[type=number]{display:inline-block;border:1px solid #7d7d7e;margin-top:.5rem;margin-left:0}.free-number>input[type=number]:focus{border-color:#e83fb8;box-shadow:0 1px 2px 0 #dededf inset;outline:0}input[type=datetime-local]{margin-top:.2rem;margin-bottom:.2rem;font-size:1.3rem;padding:.2rem .5rem 0 .5rem!important;display:inline-block;border:1px solid #7d7d7e}input[type=datetime-local]:focus{border-color:#e83fb8;box-shadow:0 1px 2px 0 #dededf inset;outline:0}body{min-height:initial}footer,footer>*{display:flex;justify-content:center;padding-bottom:0}input.inline-text[type=text]{margin-top:.2rem;margin-bottom:.2rem;padding:.2rem .5rem 0 .5rem!important;font-size:1.3rem;display:inline-block;border:1px solid #7d7d7e}input.inline-text[type=text]:focus{border-color:#e83fb8;box-shadow:0 1px 2px 0 #dededf inset;outline:0}

0
public/cutestrap.min.css → public/css/cutestrap.min.css
View File

1
public/css/mixed.css
File diff suppressed because it is too large
View File

3
public/mix-manifest.json
View File

@ -0,0 +1,3 @@
{
"/css/mixed.css": "/css/mixed.css"
}

132
resources/css/app.css
View File

@ -0,0 +1,132 @@
input[type="text"] { padding-top: 0.8rem!important; }
.no-top-padding { padding-top: 0!important; }
.no-bottom-margin { margin-bottom: 0!important; }
.some-bottom-margin { margin-bottom: 0.5rem!important; }
.some-bottom-padding { padding-bottom: 3rem!important; }
.some-top-margin { margin-top: 2.0rem; }
.some-more-bottom-margin { margin-bottom: 2.0rem; }
.inline-block { display: inline-block; }
.text-browser { display: none; }
.huge-button { width: 100%; }
.float-right { float: right; }
.primary-box {
padding: 1rem 1rem 1rem 1rem!important;
border: 2px solid #e83fb8;
}
.vote-bar {
background-color: #e83fb8;
height: 2rem;
}
img.centered-image {
display: block;
margin: 0 auto;
}
.copyarea {
user-select: all;
width: calc(100% - 0.4rem);
height: 15rem;
margin-top: 0.5rem;
border: 1px solid #7d7d7e;
font-family: "Roboto Mono", monospace;
font-size: 1rem;
padding: 0 0rem 0 0.4rem;
}
.copyarea:focus {
outline: 0;
}
.ta-center {
margin-top: 1rem;
}
.post-input-label {
display: inline-block;
font-size: 1.2rem;
}
.number {
display: inline-block;
margin-bottom: 2.4rem;
padding: 0 1rem 0 2rem;
position: relative;
}
.number > input[type="number"] {
display: inline-block;
border: 1px solid #7d7d7e;
margin-top: 0.5rem;
margin-left: 1rem;
}
.number > input[type="number"]:focus {
border-color: #e83fb8;
box-shadow: 0 1px 2px 0 #dededf inset;
outline: 0;
}
.free-number {
display: inline-block;
margin-bottom: 0;
padding: 0 1rem 0 0;
position: relative;
}
.free-number > input[type="number"] {
display: inline-block;
border: 1px solid #7d7d7e;
margin-top: 0.5rem;
margin-left: 0;
}
.free-number > input[type="number"]:focus {
border-color: #e83fb8;
box-shadow: 0 1px 2px 0 #dededf inset;
outline: 0;
}
input[type="datetime-local"] {
margin-top: 0.2rem;
margin-bottom: 0.2rem;
font-size: 1.3rem;
padding: 0.2rem 0.5rem 0 0.5rem!important;
display: inline-block;
border: 1px solid #7d7d7e;
}
input[type="datetime-local"]:focus {
border-color: #e83fb8;
box-shadow: 0 1px 2px 0 #dededf inset;
outline: 0;
}
/* TODO: Fix footer: should stick to bottom (with some padding/margin at the bottom) and centered */
body {
min-height: initial;
}
footer, footer > * {
display: flex;
justify-content: center;
padding-bottom: 0;
}
input.inline-text[type="text"] {
margin-top: 0.2rem;
margin-bottom: 0.2rem;
padding: 0.2rem 0.5rem 0 0.5rem!important;
font-size: 1.3rem;
display: inline-block;
border: 1px solid #7d7d7e;
}
input.inline-text[type="text"]:focus {
border-color: #e83fb8;
box-shadow: 0 1px 2px 0 #dededf inset;
outline: 0;
}

781
resources/css/cutestrap.css
File diff suppressed because it is too large
View File

20
resources/sass/_variables.scss
View File

@ -1,20 +0,0 @@
// Body
$body-bg: #f8fafc;
// Typography
$font-family-sans-serif: "Nunito", sans-serif;
$font-size-base: 0.9rem;
$line-height-base: 1.6;
// Colors
$blue: #3490dc;
$indigo: #6574cd;
$purple: #9561e2;
$pink: #f66D9b;
$red: #e3342f;
$orange: #f6993f;
$yellow: #ffed4a;
$green: #38c172;
$teal: #4dc0b5;
$cyan: #6cb2eb;

14
resources/sass/app.scss
View File

@ -1,14 +0,0 @@
// Fonts
@import url('https://fonts.googleapis.com/css?family=Nunito');
// Variables
@import 'variables';
// Bootstrap
@import '~bootstrap/scss/bootstrap';
.navbar-laravel {
background-color: #fff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

136
resources/views/layouts/app.blade.php
View File

@ -6,141 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/cutestrap.min.css" rel="stylesheet">
<style>
input[type="text"] { padding-top: 0.8rem!important; }
.no-top-padding { padding-top: 0!important; }
.no-bottom-margin { margin-bottom: 0!important; }
.some-bottom-margin { margin-bottom: 0.5rem!important; }
.some-bottom-padding { padding-bottom: 3rem!important; }
.some-top-margin { margin-top: 2.0rem; }
.some-more-bottom-margin { margin-bottom: 2.0rem; }
.inline-block { display: inline-block; }
.text-browser { display: none; }
.huge-button { width: 100%; }
.float-right { float: right; }
.primary-box {
padding: 1rem 1rem 1rem 1rem!important;
border: 2px solid #e83fb8;
}
.vote-bar {
background-color: #e83fb8;
height: 2rem;
}
img.centered-image {
display: block;
margin: 0 auto;
}
.copyarea {
user-select: all;
width: calc(100% - 0.4rem);
height: 15rem;
margin-top: 0.5rem;
border: 1px solid #7d7d7e;
font-family: "Roboto Mono", monospace;
font-size: 1rem;
padding: 0 0rem 0 0.4rem;
}
.copyarea:focus {
outline: 0;
}
.ta-center {
margin-top: 1rem;
}
.post-input-label {
display: inline-block;
font-size: 1.2rem;
}
.number {
display: inline-block;
margin-bottom: 2.4rem;
padding: 0 1rem 0 2rem;
position: relative;
}
.number > input[type="number"] {
display: inline-block;
border: 1px solid #7d7d7e;
margin-top: 0.5rem;
margin-left: 1rem;
}
.number > input[type="number"]:focus {
border-color: #e83fb8;
box-shadow: 0 1px 2px 0 #dededf inset;
outline: 0;
}
.free-number {
display: inline-block;
margin-bottom: 0;
padding: 0 1rem 0 0;
position: relative;
}
.free-number > input[type="number"] {
display: inline-block;
border: 1px solid #7d7d7e;
margin-top: 0.5rem;
margin-left: 0;
}
.free-number > input[type="number"]:focus {
border-color: #e83fb8;
box-shadow: 0 1px 2px 0 #dededf inset;
outline: 0;
}
input[type="datetime-local"] {
margin-top: 0.2rem;
margin-bottom: 0.2rem;
font-size: 1.3rem;
padding: 0.2rem 0.5rem 0 0.5rem!important;
display: inline-block;
border: 1px solid #7d7d7e;
}
input[type="datetime-local"]:focus {
border-color: #e83fb8;
box-shadow: 0 1px 2px 0 #dededf inset;
outline: 0;
}
/* TODO: Fix footer: should stick to bottom (with some padding/margin at the bottom) and centered */
body {
min-height: initial;
}
footer, footer > * {
display: flex;
justify-content: center;
padding-bottom: 0;
}
input.inline-text[type="text"] {
margin-top: 0.2rem;
margin-bottom: 0.2rem;
padding: 0.2rem 0.5rem 0 0.5rem!important;
font-size: 1.3rem;
display: inline-block;
border: 1px solid #7d7d7e;
}
input.inline-text[type="text"]:focus {
border-color: #e83fb8;
box-shadow: 0 1px 2px 0 #dededf inset;
outline: 0;
}
</style>
<link href="{{ mix('/css/mixed.css') }}" rel="stylesheet">
</head>
<body>
<header class="ta-center">

14
webpack.mix.js
View File

@ -0,0 +1,14 @@
const mix = require('laravel-mix');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel application. By default, we are compiling the Sass
| file for the application as well as bundling up all the JS files.
|
*/
mix.styles(['resources/css/cutestrap.css', 'resources/css/app.css'], 'public/css/mixed.css');
Write Preview
Loading…
Cancel
Save