mirrors/CyberChef
1
0
Fork 0
mirror of https://github.com/gchq/CyberChef.git synced 2025-04-26 17:56:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Converted operation arguments to material design

Browse source
This commit is contained in:
n1474335 2018-06-10 12:03:55 +01:00
parent 27b0505ede
commit 2bacd6424d
14 changed files with 186 additions and 262 deletions
Download patch file Download diff file Expand all files Collapse all files

118
src/web/stylesheets/components/_operation.css
View file

@ -18,111 +18,63 @@
border-right: none;
}
/* .arg-group {
display: table;
width: 100%;
margin-top: 10px;
} */
/* .arg-group-text {
display: block;
}
.inline-args {
float: left;
width: auto;
margin-right: 30px;
height: 34px;
} */
/* .inline-args input[type="checkbox"] {
margin-top: 10px;
} */
/* .inline-args input[type="number"] {
width: 100px;
} */
.op-title {
font-weight: var(--op-title-font-weight);
}
/* .arg-input {
display: table-cell;
width: 100%;
padding: 6px 12px;
vertical-align: middle;
height: var(--arg-input-height);
font-size: var(--arg-input-font-size);
line-height: var(--arg-input-line-height);
color: var(--arg-font-colour);
background-color: var(--arg-background);
border: 1px solid var(--arg-border-colour);
.arg {
font-family: var(--fixed-width-font-family);
text-overflow: ellipsis;
} */
/* .short-string {
width: 150px;
}
select {
display: block;
padding: 6px 8px;
height: 34px;
border: 1px solid var(--arg-border-colour);
background-color: var(--arg-background);
color: var(--arg-font-colour);
}
.arg[disabled] {
cursor: not-allowed;
opacity: 1;
background-color: var(--arg-disabled-background);
select.arg {
font-family: var(--primary-font-family);
min-width: 100px;
}
textarea.arg {
width: 100%;
min-height: 50px;
height: 70px;
margin-top: 5px;
border: 1px solid var(--arg-border-colour);
min-height: 68px;
resize: vertical;
color: var(--arg-font-colour);
background-color: var(--arg-background);
font-family: var(--fixed-width-font-family);
}
.arg-label {
display: table-cell;
width: 1px;
padding-right: 10px;
font-weight: normal;
vertical-align: middle;
white-space: pre;
@media (min-width: 576px) {
.arg.inline {
display: inline-block;
width: auto;
vertical-align: middle;
}
.form-group.inline {
display: inline-block;
margin-right: 20px;
width: unset;
}
.input-group-append.inline {
display: inline-block;
}
}
.editable-option {
position: relative;
display: inline-block;
div.toggle-string {
flex: 1;
}
.editable-option-select {
min-width: 250px;
.bmd-form-group.is-filled div.toggle-string label.bmd-label-floating,
.bmd-form-group.is-focused div.toggle-string label.bmd-label-floating {
left: unset;
}
.editable-option-input {
position: absolute;
top: 1px;
left: 1px;
width: calc(100% - 20px);
height: calc(100% - 2px) !important;
border: none !important;
.editable-option-menu {
height: auto;
max-height: 300px;
overflow-x: hidden;
}
button.dropdown-toggle {
background-color: var(--secondary-background-colour);
} */
.editable-option-menu .dropdown-item {
padding: 0.3rem 1rem 0.3rem 1rem;
min-height: 1.6rem;
max-width: 20rem;
}
.register-list {
background-color: var(--fc-operation-border-colour);

5
src/web/stylesheets/layout/_modals.css
View file

@ -24,11 +24,6 @@
height: 28px;
padding: 3px 10px;
vertical-align: middle;
font-size: calc(var(--arg-input-font-size) - 1px);
line-height: var(--arg-input-line-height);
color: var(--arg-font-colour);
background-color: var(--arg-background);
border: 1px solid var(--primary-border-colour);
}
.option-item select {

3
src/web/stylesheets/themes/_classic.css
View file

@ -69,9 +69,6 @@
/* Operation arguments */
--op-title-font-weight: bold;
--arg-input-height: 34px;
--arg-input-line-height: 20px;
--arg-input-font-size: 15px;
--arg-font-colour: #424242;
--arg-background: #fff;
--arg-border-colour: #ddd;

3
src/web/stylesheets/themes/_dark.css
View file

@ -65,9 +65,6 @@
/* Operation arguments */
--op-title-font-weight: bold;
--arg-input-height: 34px;
--arg-input-line-height: 20px;
--arg-input-font-size: 15px;
--arg-font-colour: #bbb;
--arg-background: #3c3c3c;
--arg-border-colour: #3c3c3c;

3
src/web/stylesheets/themes/_geocities.css
View file

@ -65,9 +65,6 @@
/* Operation arguments */
--op-title-font-weight: bold;
--arg-input-height: 34px;
--arg-input-line-height: 20px;
--arg-input-font-size: 15px;
--arg-font-colour: white;
--arg-background: black;
--arg-border-colour: lime;

9
src/web/stylesheets/utils/_overrides.css
View file

@ -32,6 +32,10 @@
-webkit-font-smoothing: antialiased;
}
.form-group {
margin-bottom: 0;
}
/*
button,
a:focus {
@ -95,17 +99,16 @@ a:focus {
border-radius: 0 !important;
}*/
.btn.dropdown-toggle {
height: 34px;
}
input[type="search"] {
-webkit-appearance: searchfield;
appearance: searchfield;
box-shadow: none;
}
input[type="search"]::-webkit-search-cancel-button {
-webkit-appearance: searchfield-cancel-button;
appearance: searchfield-cancel-button;
}
.modal {

1
src/web/stylesheets/vendors/bootstrap.scss vendored
View file

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