Converted modals to Bootstrap 4 Material Design

feature-extract-files
n1474335 2018-06-17 12:44:12 +01:00
parent 7d410fcdc9
commit 4147ec719b
14 changed files with 250 additions and 250 deletions

6
package-lock.json generated
View File

@ -7719,9 +7719,15 @@
"resolved": "https://registry.npmjs.org/nomnom/-/nomnom-1.5.2.tgz",
"integrity": "sha1-9DRUSKhTz71cDSYyDyR3qwUm/i8=",
"requires": {
"colors": "0.5.x",
"underscore": "1.1.x"
},
"dependencies": {
"colors": {
"version": "0.5.1",
"resolved": "https://registry.npmjs.org/colors/-/colors-0.5.1.tgz",
"integrity": "sha1-fQAj6usVTo7p/Oddy5I9DtFmd3Q="
},
"underscore": {
"version": "1.1.7",
"resolved": "https://registry.npmjs.org/underscore/-/underscore-1.1.7.tgz",

View File

@ -60,8 +60,8 @@
"postcss-css-variables": "^0.8.1",
"postcss-import": "^11.1.0",
"postcss-loader": "^2.1.4",
"sass-loader": "^7.0.2",
"prompt": "^1.0.0",
"sass-loader": "^7.0.2",
"sitemap": "^1.13.0",
"style-loader": "^0.21.0",
"url-loader": "^1.0.1",
@ -79,7 +79,6 @@
"bignumber.js": "^7.0.1",
"bootstrap-colorpicker": "^2.5.2",
"bootstrap-material-design": "^4.1.1",
"bootstrap-switch": "^3.3.4",
"bson": "^2.0.6",
"chi-squared": "^1.1.0",
"crypto-api": "^0.8.0",

View File

@ -270,7 +270,10 @@ class ControlsWaiter {
}
// Populate textarea with first recipe
document.getElementById("load-text").value = savedRecipes.length ? savedRecipes[0].recipe : "";
const loadText = document.getElementById("load-text");
const evt = new Event("change");
loadText.value = savedRecipes.length ? savedRecipes[0].recipe : "";
loadText.dispatchEvent(evt);
}

View File

@ -172,9 +172,9 @@ class Manager {
// Options
document.getElementById("options").addEventListener("click", this.options.optionsClick.bind(this.options));
document.getElementById("reset-options").addEventListener("click", this.options.resetOptionsClick.bind(this.options));
$(document).on("switchChange.bootstrapSwitch", ".option-item input:checkbox", this.options.switchChange.bind(this.options));
$(document).on("switchChange.bootstrapSwitch", ".option-item input:checkbox", this.options.setWordWrap.bind(this.options));
$(document).on("switchChange.bootstrapSwitch", ".option-item input:checkbox#useMetaKey", this.bindings.updateKeybList.bind(this.bindings));
this.addDynamicListener(".option-item input[type=checkbox]", "change", this.options.switchChange, this.options);
this.addDynamicListener(".option-item input[type=checkbox]", "change", this.options.setWordWrap, this.options);
this.addDynamicListener(".option-item input[type=checkbox]#useMetaKey", "change", this.bindings.updateKeybList, this.bindings);
this.addDynamicListener(".option-item input[type=number]", "keyup", this.options.numberChange, this.options);
this.addDynamicListener(".option-item input[type=number]", "change", this.options.numberChange, this.options);
this.addDynamicListener(".option-item select", "change", this.options.selectChange, this.options);

View File

@ -268,7 +268,7 @@ class OperationsWaiter {
*/
saveFavouritesClick() {
const favs = document.querySelectorAll("#edit-favourites-list li");
const favouritesList = Array.from(favs, e => e.textContent);
const favouritesList = Array.from(favs, e => e.childNodes[0].textContent);
this.app.saveFavourites(favouritesList);
this.app.loadFavourites();

View File

@ -20,11 +20,6 @@ const OptionsWaiter = function(app, manager) {
* @param {Object} options
*/
OptionsWaiter.prototype.load = function(options) {
$(".option-item input:checkbox").bootstrapSwitch({
size: "small",
animate: false,
});
for (const option in options) {
this.app.options[option] = options[option];
}
@ -33,7 +28,7 @@ OptionsWaiter.prototype.load = function(options) {
const cboxes = document.querySelectorAll("#options-body input[type=checkbox]");
let i;
for (i = 0; i < cboxes.length; i++) {
$(cboxes[i]).bootstrapSwitch("state", this.app.options[cboxes[i].getAttribute("option")]);
cboxes[i].checked = this.app.options[cboxes[i].getAttribute("option")];
}
const nboxes = document.querySelectorAll("#options-body input[type=number]");
@ -81,11 +76,11 @@ OptionsWaiter.prototype.resetOptionsClick = function() {
* Modifies the option state and saves it to local storage.
*
* @param {event} e
* @param {boolean} state
*/
OptionsWaiter.prototype.switchChange = function(e, state) {
OptionsWaiter.prototype.switchChange = function(e) {
const el = e.target;
const option = el.getAttribute("option");
const state = el.checked;
log.debug(`Setting ${option} to ${state}`);
this.app.options[option] = state;

View File

@ -203,7 +203,7 @@
<div id="controls" class="no-select">
<div class="d-flex align-items-center">
<button type="button" class="mx-2 btn btn-lg btn-outline-secondary" id="step" data-toggle="tooltip" title="Step through the recipe">
<button type="button" class="mx-2 btn btn-lg btn-secondary" id="step" data-toggle="tooltip" title="Step through the recipe">
Step
</button>
@ -320,19 +320,23 @@
</div>
<div class="modal" id="save-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<img aria-hidden="true" class="pull-right" src="<%- require('../static/images/save-22x22.png') %>" alt="Save Icon"/>
<h4 class="modal-title">Save recipe</h4>
<h5 class="modal-title">Save recipe</h5>
</div>
<div class="modal-body">
<div class="form-group">
<label for="save-text">Save your recipe to local storage or copy the following string to load later</label>
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#chef-format" role="tab" data-toggle="tab">Chef format</a></li>
<li role="presentation"><a href="#clean-json" role="tab" data-toggle="tab">Clean JSON</a></li>
<li role="presentation"><a href="#compact-json" role="tab" data-toggle="tab">Compact JSON</a></li>
<li class="nav-item">
<a class="nav-link active" href="#chef-format" role="tab" data-toggle="tab">Chef format</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#clean-json" role="tab" data-toggle="tab">Clean JSON</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#compact-json" role="tab" data-toggle="tab">Compact JSON</a>
</li>
</ul>
<div class="tab-content" id="save-texts">
<div role="tabpanel" class="tab-pane active" id="chef-format">
@ -347,8 +351,9 @@
</div>
</div>
<div class="form-group">
<label for="save-name">Recipe name</label>
<input type="text" class="form-control" id="save-name" placeholder="Recipe name">
<label for="save-name" class="bmd-label-floating">Recipe name</label>
<input type="text" class="form-control" id="save-name">
<span class="bmd-help">Save your recipe to local storage using this name, or copy it to load later</span>
</div>
</div>
<div class="modal-footer" id="save-footer">
@ -357,12 +362,16 @@
</div>
<div class="modal-body">
<div class="form-group" id="save-link-group">
<label>Data link</label>
<h6 style="display: inline">Data link</h6>
<div class="save-link-options">
<input type="checkbox" id="save-link-recipe-checkbox" checked> <label for="save-link-recipe-checkbox"> Include recipe </label>
<input type="checkbox" id="save-link-input-checkbox" checked> <label for="save-link-input-checkbox"> Include input </label>
<label class="checkbox-inline">
<input type="checkbox" id="save-link-recipe-checkbox" checked> Include recipe
</label>
<label class="checkbox-inline">
<input type="checkbox" id="save-link-input-checkbox" checked> Include input
</label>
</div>
<br>
<br><br>
<a id="save-link" style="word-wrap: break-word;"></a>
</div>
</div>
@ -371,20 +380,21 @@
</div>
<div class="modal" id="load-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<img aria-hidden="true" class="pull-right" src="<%- require('../static/images/open_yellow-24x24.png') %>" alt="Open Icon"/>
<h4 class="modal-title">Load recipe</h4>
<h5 class="modal-title">Load recipe</h5>
</div>
<div class="modal-body">
<div class="form-group">
<label for="load-name">Load your recipe from local storage by selecting its name from the drop-down</label>
<label for="load-name" class="bmd-label-floating">Recipe name</label>
<select class="form-control" id="load-name"></select>
<span class="bmd-help">Load your recipe from local storage by selecting its name from the drop-down</span>
</div>
<div class="form-group">
<label for="load-text">Load your recipe by pasting it in the box below</label>
<label for="load-text" class="bmd-label-floating">Recipe</label>
<textarea class="form-control" id="load-text" rows="5"></textarea>
<span class="bmd-help">Load your recipe by pasting it into this box</span>
</div>
</div>
<div class="modal-footer">
@ -397,56 +407,36 @@
</div>
<div class="modal" id="options-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<img aria-hidden="true" class="pull-right" src="<%- require('../static/images/settings-22x22.png') %>" alt="Settings Icon"/>
<h4 class="modal-title">Options</h4>
<h5 class="modal-title">Options</h5>
</div>
<div class="modal-body" id="options-body">
<p style="font-weight: bold">Please note that these options will persist between sessions.</p>
<div class="option-item">
<select option="theme" id="theme">
<div class="form-group option-item">
<label for="theme" class="bmd-label-floating"> Theme (only supported in modern browsers)</label>
<select class="form-control" option="theme" id="theme">
<option value="classic">Classic</option>
<option value="dark">Dark</option>
<option value="geocities">GeoCities</option>
</select>
<label for="theme"> Theme (only supported in modern browsers)</label>
</div>
<div class="option-item">
<input type="checkbox" option="updateUrl" id="updateUrl" checked />
<label for="updateUrl"> Update the URL when the input or recipe changes</label>
<div class="form-group option-item">
<label for="errorTimeout" class="bmd-label-floating">Operation error timeout in ms (0 for never)</label>
<input type="number" class="form-control" option="errorTimeout" id="errorTimeout">
</div>
<div class="option-item">
<input type="checkbox" option="showHighlighter" id="showHighlighter" checked />
<label for="showHighlighter"> Highlight selected bytes in output and input (when possible)</label>
<div class="form-group option-item">
<label for="ioDisplayThreshold" class="bmd-label-floating">Size threshold for treating the input and output as a file (KiB)</label>
<input type="number" class="form-control" option="ioDisplayThreshold" id="ioDisplayThreshold">
</div>
<div class="option-item">
<input type="checkbox" option="treatAsUtf8" id="treatAsUtf8" checked />
<label for="treatAsUtf8"> Treat output as UTF-8 if possible</label>
</div>
<div class="option-item">
<input type="checkbox" option="wordWrap" id="wordWrap" checked />
<label for="wordWrap"> Word wrap the input and output</label>
</div>
<div class="option-item">
<input type="checkbox" option="showErrors" id="showErrors" checked />
<label for="showErrors"> Operation error reporting (recommended)</label>
</div>
<div class="option-item">
<input type="checkbox" option="useMetaKey" id="useMetaKey" />
<label for="useMetaKey"> Use meta key for keybindings (Windows ⊞/Command ⌘)</label>
</div>
<div class="option-item">
<input type="number" option="errorTimeout" id="errorTimeout" />
<label for="errorTimeout"> Operation error timeout in ms (0 for never)</label>
</div>
<div class="option-item">
<input type="number" option="ioDisplayThreshold" id="ioDisplayThreshold" />
<label for="ioDisplayThreshold"> Size threshold for treating the input and output as a file (KiB)</label>
</div>
<div class="option-item">
<select option="logLevel" id="logLevel">
<div class="form-group option-item">
<label for="logLevel" class="bmd-label-floating">Console logging level</label>
<select class="form-control" option="logLevel" id="logLevel">
<option value="silent">Silent</option>
<option value="error">Error</option>
<option value="warn">Warn</option>
@ -454,7 +444,48 @@
<option value="debug">Debug</option>
<option value="trace">Trace</option>
</select>
<label for="logLevel"> Console logging level</label>
</div>
<div class="switch option-item">
<label for="updateUrl">
<input type="checkbox" option="updateUrl" id="updateUrl" checked>
Update the URL when the input or recipe changes
</label>
</div>
<div class="switch option-item">
<label for="showHighlighter">
<input type="checkbox" option="showHighlighter" id="showHighlighter" checked>
Highlight selected bytes in output and input (when possible)
</label>
</div>
<div class="switch option-item">
<label for="treatAsUtf8">
<input type="checkbox" option="treatAsUtf8" id="treatAsUtf8" checked>
Treat output as UTF-8 if possible
</label>
</div>
<div class="switch option-item">
<label for="wordWrap">
<input type="checkbox" option="wordWrap" id="wordWrap" checked>
Word wrap the input and output
</label>
</div>
<div class="switch option-item">
<label for="showErrors">
<input type="checkbox" option="showErrors" id="showErrors" checked>
Operation error reporting (recommended)
</label>
</div>
<div class="switch option-item">
<label for="useMetaKey">
<input type="checkbox" option="useMetaKey" id="useMetaKey">
Use meta key for keybindings (Windows ⊞/Command ⌘)
</label>
</div>
</div>
<div class="modal-footer">
@ -466,11 +497,10 @@
</div>
<div class="modal" id="favourites-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<img aria-hidden="true" class="pull-right" src="<%- require('../static/images/favourite-24x24.png') %>" alt="Star Icon"/>
<h4 class="modal-title">Edit Favourites</h4>
<h5 class="modal-title">Edit Favourites</h5>
</div>
<div class="modal-body" id="favourites-body">
<ul>
@ -493,11 +523,10 @@
</div>
<div class="modal" id="support-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<img aria-hidden="true" class="pull-right" src="<%- require('../static/images/help-22x22.png') %>" alt="Question Mark Icon"/>
<h4 class="modal-title">CyberChef - The Cyber Swiss Army Knife</h4>
<h5 class="modal-title">CyberChef - The Cyber Swiss Army Knife</h5>
</div>
<div class="modal-body">
<img aria-hidden="true" class="about-img-left" src="<%- require('../static/images/cyberchef-128x128.png') %>" alt="CyberChef Logo"/>
@ -507,40 +536,38 @@
</p>
<p>&copy; Crown Copyright 2016.</p>
<p>Released under the Apache Licence, Version 2.0.</p>
<p>
<a href="https://gitter.im/gchq/CyberChef">
<p><a href="https://gitter.im/gchq/CyberChef">
<img src="<%- require('../static/images/gitter-badge.svg') %>">
</a>
</p>
<br>
<br>
<div>
</a></p>
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#faqs" aria-controls="profile" role="tab" data-toggle="tab">
<img aria-hidden="true" src="<%- require('../static/images/help-16x16.png') %>" alt="Question Mark Icon"/>
<li class="nav-item" role="presentation">
<a class="nav-link active" href="#faqs" aria-controls="profile" role="tab" data-toggle="tab">
FAQs
</a></li>
<li role="presentation"><a href="#report-bug" aria-controls="messages" role="tab" data-toggle="tab">
<img aria-hidden="true" src="<%- require('../static/images/bug-16x16.png') %>" alt="Bug Icon"/>
</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link" href="#report-bug" aria-controls="messages" role="tab" data-toggle="tab">
Report a bug
</a></li>
<li role="presentation"><a href="#about" aria-controls="messages" role="tab" data-toggle="tab">
<img aria-hidden="true" src="<%- require('../static/images/speech-16x16.png') %>" alt="Speech Balloon Icon"/>
</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link" href="#about" aria-controls="messages" role="tab" data-toggle="tab">
About
</a></li>
<li role="presentation"><a href="#keybindings" aria-controls="messages" role="tab" data-toggle="tab">
<img aria-hidden="true" src="<%- require('../static/images/code-16x16.png') %>" alt="List Icon"/>
</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link" href="#keybindings" aria-controls="messages" role="tab" data-toggle="tab">
Keybindings
</a></li>
</a>
</li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="faqs">
<br>
<blockquote>
<a data-toggle="collapse" data-target="#faq-examples">
<a class="btn btn-primary" data-toggle="collapse" data-target="#faq-examples">
What sort of things can I do with CyberChef?
</a>
</blockquote>
<div class="collapse" id="faq-examples">
<p>There are around 200 operations in CyberChef allowing you to carry out simple and complex tasks easily. Here are some examples:</p>
<ul>
@ -554,21 +581,21 @@
<li><a href="#recipe=Register('key%3D(%5B%5C%5Cda-f%5D*)',true,false)Find_/_Replace(%7B'option':'Regex','string':'.*data%3D(.*)'%7D,'$1',true,false,true)RC4(%7B'option':'Hex','string':'$R0'%7D,'Hex','Latin1')&input=aHR0cDovL21hbHdhcmV6LmJpei9iZWFjb24ucGhwP2tleT0wZTkzMmE1YyZkYXRhPThkYjdkNWViZTM4NjYzYTU0ZWNiYjMzNGUzZGIxMQ">Use parts of the input as arguments to operations</a></li>
</ul>
</div>
<blockquote>
<a data-toggle="collapse" data-target="#faq-load-files">
<br>
<a class="btn btn-primary" data-toggle="collapse" data-target="#faq-load-files">
Can I load input directly from files?
</a>
</blockquote>
<div class="collapse" id="faq-load-files">
<p>Yes! Just drag your file over the input box and drop it.</p>
<p>CyberChef can handle files up to around 500MB (depending on your browser), however some of the operations may take a very long time to run over this much data.</p>
<p>If the output is larger than a certain threshold (default 1MiB), it will be presented to you as a file available for download. Slices of the file can be viewed in the output if you need to inspect them.</p>
</div>
<blockquote>
<a data-toggle="collapse" data-target="#faq-fork">
<br>
<a class="btn btn-primary" data-toggle="collapse" data-target="#faq-fork">
How do I run operation X over multiple inputs at once?
</a>
</blockquote>
<div class="collapse" id="faq-fork">
<p>Maybe you have 10 timestamps that you want to parse or 16 encoded strings that all have the same key.</p>
<p>The 'Fork' operation (found in the 'Flow control' category) splits up the input line by line and runs all subsequent operations on each line separately. Each output is then displayed on a separate line. These delimiters can be changed, so if your inputs are separated by commas, you can change the split delimiter to a comma instead.</p>
@ -613,7 +640,6 @@
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
@ -625,19 +651,17 @@
</div>
<div class="modal" id="confirm-modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="confirm-title"></h4>
<h5 class="modal-title" id="confirm-title"></h5>
</div>
<div class="modal-body" id="confirm-body"></div>
<div class="modal-footer">
<button type="button" class="btn btn-success" id="confirm-yes">
<img aria-hidden="true" src="<%- require('../static/images/thumb_up-16x16.png') %>" alt="Thumbs Up"/>
Yes
</button>
<button type="button" class="btn btn-danger" id="confirm-no" data-dismiss="modal">
<img aria-hidden="true" src="<%- require('../static/images/thumb_down-16x16.png') %>" alt="Thumbs Down"/>
No
</button>
</div>

View File

@ -11,7 +11,6 @@ import "./stylesheets/index.js";
import "babel-polyfill";
import "arrive";
import "bootstrap-material-design";
import "bootstrap-switch";
import "bootstrap-colorpicker";
import moment from "moment-timezone";
import * as CanvasComponents from "../core/lib/CanvasComponents";

View File

@ -11,7 +11,6 @@ import "highlight.js/styles/vs.css";
/* Frameworks */
import "./vendors/bootstrap.scss";
import "bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.css";
import "bootstrap-colorpicker/dist/css/bootstrap-colorpicker.css";
/* CyberChef styles */

View File

@ -29,6 +29,7 @@
text-align: center;
color: var(--primary-font-colour);
font-size: 14px;
cursor: pointer;
}
#auto-bake-label .checkbox-decorator {
@ -38,3 +39,7 @@
#bake {
box-shadow: none;
}
#controls .btn {
border-radius: 0;
}

View File

@ -6,29 +6,12 @@
* @license Apache-2.0
*/
.option-item .bootstrap-switch {
margin: 15px 10px;
.modal-content {
background-color: var(--primary-background-colour);
}
.option-item button {
margin: 10px;
}
.option-item label {
font-weight: normal;
}
.option-item input[type=number] {
margin: 15px 10px;
width: 80px;
height: 28px;
padding: 3px 10px;
vertical-align: middle;
}
.option-item select {
margin: 10px;
display: inline-block;
.option-item {
margin-bottom: 20px;
}
#edit-favourites-list {
@ -55,11 +38,15 @@
margin: 10px 0 20px 20px;
}
#save-link-group {
padding-top: 0;
}
.save-link-options {
float: right;
}
.save-link-options input{
.save-link-options label {
margin-left: 10px;
}
@ -79,7 +66,9 @@
}
#save-texts textarea {
border-top: none;
box-shadow: none;
height: 200px;
}
#faqs a.btn {
text-transform: unset;
}

View File

@ -31,3 +31,29 @@
border: 2px dashed var(--rec-list-operation-font-colour) !important;
padding: 8px 8px 9px 8px;
}
.operation input.form-control,
.operation select.form-control,
.operation .bmd-label-floating,
.operation .bmd-label-static {
padding-left: 5px;
padding-right: 5px;
}
.operation [class^='bmd-label'],
.operation [class*=' bmd-label'] {
color: #388e3c;
}
.operation .is-focused [class^='bmd-label'],
.operation .is-focused [class*=' bmd-label'],
.operation .is-focused [class^='bmd-label'],
.operation .is-focused [class*=' bmd-label'] {
color: #1976d2;
}
.operation .form-control {
background-color: transparent;
border-color: var(--primary-border-colour);
color: var(--primary-font-colour);
}

View File

@ -108,25 +108,6 @@ input[type="search"]::-webkit-search-cancel-button {
appearance: searchfield-cancel-button;
}
.modal {
overflow-y: auto;
}
.modal-content {
background-color: var(--primary-background-colour);
}
.modal-header,
.modal-footer {
border-color: var(--primary-border-colour);
}
.form-control {
background-color: transparent;
border-color: var(--primary-border-colour);
color: var(--primary-font-colour);
}
code {
border: 0;
white-space: pre-wrap;
@ -224,30 +205,6 @@ optgroup {
}
/* Bootstrap-switch */
.bootstrap-switch,
.bootstrap-switch-container,
.bootstrap-switch-handle-on,
.bootstrap-switch-handle-off,
.bootstrap-switch-label {
border-radius: 0 !important;
}
.bootstrap-switch .bootstrap-switch-label {
background-color: transparent;
}
.bootstrap-switch {
border-color: var(--primary-border-colour);
}
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default {
background-color: var(--primary-border-colour);
color: var(--primary-font-colour);
}
/* Sortable */
.sortable-ghost {

View File

@ -18,8 +18,6 @@ $theme-colors: (
dark: $grey-800
);
$bmd-label-color: $green-700;
$bmd-label-color-inner-focus: $green-500;
$bmd-form-line-height: 1.25;
@import "~bootstrap-material-design/scss/core";