Use Laravel Mix to combine and minify CSS
This commit is contained in:
parent
e54df0aade
commit
826e144621
File diff suppressed because it is too large
Load Diff
|
@ -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}
|
File diff suppressed because one or more lines are too long
|
@ -0,0 +1,3 @@
|
||||||
|
{
|
||||||
|
"/css/mixed.css": "/css/mixed.css"
|
||||||
|
}
|
|
@ -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;
|
||||||
|
}
|
File diff suppressed because one or more lines are too long
|
@ -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;
|
|
|
@ -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);
|
|
||||||
}
|
|
|
@ -6,141 +6,7 @@
|
||||||
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
<link href="/cutestrap.min.css" rel="stylesheet">
|
<link href="{{ mix('/css/mixed.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>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header class="ta-center">
|
<header class="ta-center">
|
||||||
|
|
|
@ -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');
|
Loading…
Reference in New Issue