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

Input now uses CodeMirror editor

Browse source
This commit is contained in:
n1474335 2022-06-29 18:02:49 +01:00
parent 54fdc05e3a
commit 85ffe48743
17 changed files with 666 additions and 182 deletions
Download patch file Download diff file Expand all files Collapse all files

101
src/web/stylesheets/layout/_io.css
View file

@ -6,7 +6,24 @@
* @license Apache-2.0
*/
#input-text,
#input-text {
position: relative;
width: 100%;
height: 100%;
margin: 0;
background-color: transparent;
}
.cm-editor {
height: 100%;
}
.cm-editor .cm-content {
font-family: var(--fixed-width-font-family);
font-size: var(--fixed-width-font-size);
color: var(--fixed-width-font-colour);
}
#output-text,
#output-html {
position: relative;
@ -163,14 +180,14 @@
#input-wrapper,
#output-wrapper,
#input-wrapper > * ,
#input-wrapper > :not(#input-text),
#output-wrapper > .textarea-wrapper > div,
#output-wrapper > .textarea-wrapper > textarea {
height: calc(100% - var(--title-height));
}
#input-wrapper.show-tabs,
#input-wrapper.show-tabs > *,
#input-wrapper.show-tabs > :not(#input-text),
#output-wrapper.show-tabs,
#output-wrapper.show-tabs > .textarea-wrapper > div,
#output-wrapper.show-tabs > .textarea-wrapper > textarea {
@ -193,7 +210,9 @@
}
.textarea-wrapper textarea,
.textarea-wrapper>div {
.textarea-wrapper #output-text,
.textarea-wrapper #output-html,
.textarea-wrapper #output-highlighter {
font-family: var(--fixed-width-font-family);
font-size: var(--fixed-width-font-size);
color: var(--fixed-width-font-colour);
@ -292,10 +311,6 @@
align-items: center;
}
#input-info {
line-height: 15px;
}
.dropping-file {
border: 5px dashed var(--drop-file-border-colour) !important;
}
@ -458,3 +473,73 @@
cursor: pointer;
filter: brightness(98%);
}
/* Status bar */
.cm-status-bar {
font-family: var(--fixed-width-font-family);
font-weight: normal;
font-size: 8pt;
margin: 0 5px;
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: center;
}
.cm-status-bar i {
font-size: 12pt;
vertical-align: middle;
margin-left: 8px;
}
.cm-status-bar>div>span:first-child i {
margin-left: 0;
}
/* Dropup Button */
.cm-status-bar-select-btn {
border: none;
cursor: pointer;
}
/* The container <div> - needed to position the dropup content */
.cm-status-bar-select {
position: relative;
display: inline-block;
}
/* Dropup content (Hidden by Default) */
.cm-status-bar-select-content {
display: none;
position: absolute;
bottom: 20px;
right: 0;
background-color: #f1f1f1;
min-width: 200px;
box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.2);
z-index: 1;
}
/* Links inside the dropup */
.cm-status-bar-select-content a {
color: black;
padding: 2px 5px;
text-decoration: none;
display: block;
}
/* Change color of dropup links on hover */
.cm-status-bar-select-content a:hover {
background-color: #ddd
}
/* Show the dropup menu on hover */
.cm-status-bar-select:hover .cm-status-bar-select-content {
display: block;
}
/* Change the background color of the dropup button when the dropup content is shown */
.cm-status-bar-select:hover .cm-status-bar-select-btn {
background-color: #f1f1f1;
}

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

@ -13,7 +13,7 @@
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url("../static/fonts/MaterialIcons-Regular.woff2") format('woff2');
src: url("../static/fonts/MaterialIcons-Regular.ttf") format('truetype');
}
.material-icons {