From 18287f888b0c3ae80422d4068c511614b55bfa6d Mon Sep 17 00:00:00 2001 From: Emiliano Ciavatta Date: Mon, 19 Oct 2020 12:40:53 +0200 Subject: Add resizable layout --- frontend/src/components/Header.js | 28 ++++----- frontend/src/components/Header.scss | 17 ++++-- frontend/src/components/Timeline.js | 2 +- .../src/components/pages/ConfigurationPage.scss | 9 +-- frontend/src/components/pages/MainPage.js | 69 ++++++++++++++-------- frontend/src/components/pages/MainPage.scss | 22 +++---- frontend/src/components/pages/common.scss | 15 +---- frontend/src/components/panels/StreamsPane.scss | 6 ++ 8 files changed, 90 insertions(+), 78 deletions(-) (limited to 'frontend/src/components') diff --git a/frontend/src/components/Header.js b/frontend/src/components/Header.js index c46d768..4db05a5 100644 --- a/frontend/src/components/Header.js +++ b/frontend/src/components/Header.js @@ -46,19 +46,17 @@ class Header extends Component { render() { return ( -
-
-
-

- - { - this.el = el; - }}/> - -

-
+
+
+

+ + { + this.el = el; + }}/> + +

- {this.props.configured &&
+ {this.props.configured &&
-
} + } - {this.props.configured &&
+ {this.props.configured &&
@@ -91,7 +89,7 @@ class Header extends Component {
-
} + }
); diff --git a/frontend/src/components/Header.scss b/frontend/src/components/Header.scss index fff28e6..c6a88b7 100644 --- a/frontend/src/components/Header.scss +++ b/frontend/src/components/Header.scss @@ -1,16 +1,18 @@ @import "../colors"; .header { - height: 80px; - padding: 15px 30px; + padding: 15px; - > .row { + .header-content { + display: flex; + width: 100%; + padding: 0 10px; background-color: $color-primary-0; } .header-title { width: 200px; - margin: 5px 0 5px -5px; + margin: 5px 0 5px 0; } .header-buttons { @@ -24,6 +26,7 @@ } .filters-bar { + flex: 1; padding: 3px 0; .filter, @@ -38,4 +41,10 @@ border-radius: 5px; } } + + @media screen and (max-width: 1530px) { + &.configured .header-title { + display: none; + } + } } diff --git a/frontend/src/components/Timeline.js b/frontend/src/components/Timeline.js index 9ecbd80..5443a3b 100644 --- a/frontend/src/components/Timeline.js +++ b/frontend/src/components/Timeline.js @@ -256,7 +256,7 @@ class Timeline extends Component { enablePanZoom={true} utc={false} onTimeRangeChanged={this.handleTimeRangeChange}> - + diff --git a/frontend/src/components/pages/ConfigurationPage.scss b/frontend/src/components/pages/ConfigurationPage.scss index 4254547..2ceccd5 100644 --- a/frontend/src/components/pages/ConfigurationPage.scss +++ b/frontend/src/components/pages/ConfigurationPage.scss @@ -10,16 +10,10 @@ .configuration-pane { display: flex; justify-content: center; - height: 100%; - padding-top: 100px; .section-content { - background-color: $color-primary-3; margin-top: 15px; - } - - .section-table table { - background-color: red !important; + background-color: $color-primary-3; } .section-footer { @@ -27,4 +21,3 @@ } } } - diff --git a/frontend/src/components/pages/MainPage.js b/frontend/src/components/pages/MainPage.js index c4dcd20..5d42f4d 100644 --- a/frontend/src/components/pages/MainPage.js +++ b/frontend/src/components/pages/MainPage.js @@ -16,6 +16,7 @@ */ import React, {Component} from "react"; +import {ReflexContainer, ReflexElement, ReflexSplitter} from "react-reflex"; import {Route, Switch} from "react-router-dom"; import Filters from "../dialogs/Filters"; import Header from "../Header"; @@ -29,10 +30,22 @@ import StreamsPane from "../panels/StreamsPane"; import Timeline from "../Timeline"; import "./common.scss"; import "./MainPage.scss"; +import 'react-reflex/styles.css' class MainPage extends Component { - state = {}; + state = { + timelineHeight: 175 + }; + + handleTimelineResize = (e) => { + if (this.timelineTimeoutHandle) { + clearTimeout(this.timelineTimeoutHandle); + } + + this.timelineTimeoutHandle = setTimeout(() => + this.setState({timelineHeight: e.domElement.clientHeight}), 100); + }; render() { let modal; @@ -41,34 +54,40 @@ class MainPage extends Component { } return ( -
-
+ +
this.setState({filterWindowOpen: true})} configured={true}/> -
+ {modal} + -
-
- this.setState({selectedConnection: c})}/> -
-
- - }/> - }/> - }/> - }/> - }/> - }/> - -
+ + + + this.setState({selectedConnection: c})}/> + - {modal} -
+ + + + + }/> + }/> + }/> + }/> + }/> + }/> + + + + + + -
- -
-
+ + + + ); } } diff --git a/frontend/src/components/pages/MainPage.scss b/frontend/src/components/pages/MainPage.scss index 4ca54c0..4fc5853 100644 --- a/frontend/src/components/pages/MainPage.scss +++ b/frontend/src/components/pages/MainPage.scss @@ -1,25 +1,25 @@ @import "../../colors"; .main-page { + .page-header { + min-height: 80px; + } + + .page-footer { + overflow: hidden !important; + min-height: 175px; + } + .page-content { - display: flex; - flex: 1; - padding: 0 15px; - background-color: $color-primary-2; + padding: 0 7.5px; .connections-pane { - flex: 1 0; margin-right: 7.5px; } .details-pane { - position: relative; - flex: 1 1; + overflow: hidden; margin-left: 7.5px; } } - - .page-footer { - flex: 0; - } } diff --git a/frontend/src/components/pages/common.scss b/frontend/src/components/pages/common.scss index fcf5c20..2b0cd05 100644 --- a/frontend/src/components/pages/common.scss +++ b/frontend/src/components/pages/common.scss @@ -1,16 +1,3 @@ .page { - position: relative; - display: flex; - flex-direction: column; - height: 100vh; - - .page-header, - .page-footer { - flex: 0; - } - - .page-content { - overflow: hidden; - flex: 1; - } + height: 100vh !important; } diff --git a/frontend/src/components/panels/StreamsPane.scss b/frontend/src/components/panels/StreamsPane.scss index 1f641f3..1d8a250 100644 --- a/frontend/src/components/panels/StreamsPane.scss +++ b/frontend/src/components/panels/StreamsPane.scss @@ -34,6 +34,9 @@ font-size: 11px; margin-top: 6px; margin-left: -10px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .connection-message-actions { @@ -99,6 +102,9 @@ font-size: 12px; padding-top: 7px; padding-left: 25px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .header-actions { -- cgit v1.2.3-70-g09d2 From 0e82d50eb37c87ecd5a75cf842c4da8f7047e5dc Mon Sep 17 00:00:00 2001 From: Emiliano Ciavatta Date: Mon, 19 Oct 2020 15:43:53 +0200 Subject: Fix rule filter overflow --- frontend/src/components/pages/ConfigurationPage.js | 1 - frontend/src/components/pages/ConfigurationPage.scss | 1 + frontend/src/components/pages/MainPage.js | 15 ++++++++------- frontend/src/components/pages/MainPage.scss | 6 ++---- frontend/src/components/pages/common.scss | 3 --- 5 files changed, 11 insertions(+), 15 deletions(-) delete mode 100644 frontend/src/components/pages/common.scss (limited to 'frontend/src/components') diff --git a/frontend/src/components/pages/ConfigurationPage.js b/frontend/src/components/pages/ConfigurationPage.js index 8f9b68b..c8646fb 100644 --- a/frontend/src/components/pages/ConfigurationPage.js +++ b/frontend/src/components/pages/ConfigurationPage.js @@ -28,7 +28,6 @@ import TextField from "../fields/TextField"; import Header from "../Header"; import LinkPopover from "../objects/LinkPopover"; import "../panels/common.scss"; -import "./common.scss"; import "./ConfigurationPage.scss"; class ConfigurationPage extends Component { diff --git a/frontend/src/components/pages/ConfigurationPage.scss b/frontend/src/components/pages/ConfigurationPage.scss index 2ceccd5..6ff933c 100644 --- a/frontend/src/components/pages/ConfigurationPage.scss +++ b/frontend/src/components/pages/ConfigurationPage.scss @@ -1,6 +1,7 @@ @import "../../colors"; .configuration-page { + height: 100vh; background-color: $color-primary-0; .header-title { diff --git a/frontend/src/components/pages/MainPage.js b/frontend/src/components/pages/MainPage.js index 5d42f4d..3bf8065 100644 --- a/frontend/src/components/pages/MainPage.js +++ b/frontend/src/components/pages/MainPage.js @@ -17,6 +17,7 @@ import React, {Component} from "react"; import {ReflexContainer, ReflexElement, ReflexSplitter} from "react-reflex"; +import "react-reflex/styles.css" import {Route, Switch} from "react-router-dom"; import Filters from "../dialogs/Filters"; import Header from "../Header"; @@ -28,14 +29,12 @@ import SearchPane from "../panels/SearchPane"; import ServicesPane from "../panels/ServicesPane"; import StreamsPane from "../panels/StreamsPane"; import Timeline from "../Timeline"; -import "./common.scss"; import "./MainPage.scss"; -import 'react-reflex/styles.css' class MainPage extends Component { state = { - timelineHeight: 175 + timelineHeight: 210 }; handleTimelineResize = (e) => { @@ -55,10 +54,12 @@ class MainPage extends Component { return ( - -
this.setState({filterWindowOpen: true})} configured={true}/> - {modal} - +
+ +
this.setState({filterWindowOpen: true})} configured={true}/> + {modal} + +
diff --git a/frontend/src/components/pages/MainPage.scss b/frontend/src/components/pages/MainPage.scss index 4fc5853..8d1fa96 100644 --- a/frontend/src/components/pages/MainPage.scss +++ b/frontend/src/components/pages/MainPage.scss @@ -1,13 +1,11 @@ @import "../../colors"; .main-page { - .page-header { - min-height: 80px; - } + height: 100vh !important; .page-footer { overflow: hidden !important; - min-height: 175px; + min-height: 210px; } .page-content { diff --git a/frontend/src/components/pages/common.scss b/frontend/src/components/pages/common.scss deleted file mode 100644 index 2b0cd05..0000000 --- a/frontend/src/components/pages/common.scss +++ /dev/null @@ -1,3 +0,0 @@ -.page { - height: 100vh !important; -} -- cgit v1.2.3-70-g09d2 From 6b30ace7f6919d5e5122959d0abf463906fa17d7 Mon Sep 17 00:00:00 2001 From: Emiliano Ciavatta Date: Mon, 19 Oct 2020 16:20:53 +0200 Subject: Highlight rules in stream pane --- frontend/package.json | 1 + frontend/src/components/panels/StreamsPane.js | 40 ++++++++++++++++++----- frontend/src/components/panels/StreamsPane.scss | 6 ++++ frontend/src/model/rules.js | 43 +++++++++++++++++++++++++ frontend/yarn.lock | 9 +++++- 5 files changed, 90 insertions(+), 9 deletions(-) create mode 100644 frontend/src/model/rules.js (limited to 'frontend/src/components') diff --git a/frontend/package.json b/frontend/package.json index c91665f..b3a4494 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -27,6 +27,7 @@ "react-router": "^5.1.2", "react-router-dom": "^5.1.2", "react-scripts": "3.4.1", + "react-string-replace": "^0.4.4", "react-tag-autocomplete": "^6.0.0-beta.6", "react-timeseries-charts": "^0.16.1", "typed.js": "^2.0.11" diff --git a/frontend/src/components/panels/StreamsPane.js b/frontend/src/components/panels/StreamsPane.js index 9470d7d..cc3d53a 100644 --- a/frontend/src/components/panels/StreamsPane.js +++ b/frontend/src/components/panels/StreamsPane.js @@ -21,12 +21,14 @@ import {Row} from "react-bootstrap"; import ReactJson from "react-json-view"; import backend from "../../backend"; import log from "../../log"; +import rules from "../../model/rules"; import {downloadBlob, getHeaderValue} from "../../utils"; import ButtonField from "../fields/ButtonField"; import ChoiceField from "../fields/ChoiceField"; import MessageAction from "../objects/MessageAction"; import "./StreamsPane.scss"; +const reactStringReplace = require('react-string-replace') const classNames = require("classnames"); class StreamsPane extends Component { @@ -77,11 +79,9 @@ class StreamsPane extends Component { }; tryParseConnectionMessage = (connectionMessage) => { + const isClient = connectionMessage["from_client"]; if (connectionMessage.metadata == null) { - return connectionMessage.content; - } - if (connectionMessage["is_metadata_continuation"]) { - return **already parsed in previous messages**; + return this.highlightRules(connectionMessage.content, isClient); } let unrollMap = (obj) => obj == null ? null : Object.entries(obj).map(([key, value]) => @@ -96,7 +96,7 @@ class StreamsPane extends Component { return

{m.method} {url} {m.protocol}

{unrollMap(m.headers)} -
{m.body}
+
{this.highlightRules(m.body, isClient)}
{unrollMap(m.trailers)} ; case "http-response": @@ -108,20 +108,44 @@ class StreamsPane extends Component { body = ; } catch (e) { log.error(e); + body = m.body; } } return

{m.protocol} {m.status}

{unrollMap(m.headers)} -
{body}
+
{this.highlightRules(body, isClient)}
{unrollMap(m.trailers)} ; default: - return connectionMessage.content; + return this.highlightRules(connectionMessage.content, isClient); } }; + highlightRules = (content, isClient) => { + let streamContent = content; + this.props.connection["matched_rules"].forEach(ruleId => { + const rule = rules.ruleById(ruleId); + rule.patterns.forEach(pattern => { + if ((!isClient && pattern.direction === 1) || (isClient && pattern.direction === 2)) { + return; + } + let flags = ""; + pattern["caseless"] && (flags += "i"); + pattern["dot_all"] && (flags += "s"); + pattern["multi_line"] && (flags += "m"); + pattern["unicode_property"] && (flags += "u"); + const regex = new RegExp("(" + pattern.regex + ")", flags); + streamContent = reactStringReplace(streamContent, regex, (match, i) => ( + {match} + )); + }); + }); + + return streamContent; + }; + connectionsActions = (connectionMessage) => { if (!connectionMessage.metadata) { return null; @@ -187,7 +211,7 @@ class StreamsPane extends Component { }; const content = this.state.messages || []; - let payload = content.map((c, i) => + let payload = content.filter((c) => !c["is_metadata_continuation"]).map((c, i) =>
diff --git a/frontend/src/components/panels/StreamsPane.scss b/frontend/src/components/panels/StreamsPane.scss index 1d8a250..c44c7eb 100644 --- a/frontend/src/components/panels/StreamsPane.scss +++ b/frontend/src/components/panels/StreamsPane.scss @@ -18,6 +18,12 @@ &:hover::-webkit-scrollbar-thumb { background: $color-secondary-2; } + + .matched-occurrence { + color: $color-primary-4; + font-weight: 500; + border-radius: 2px; + } } .connection-message { diff --git a/frontend/src/model/rules.js b/frontend/src/model/rules.js new file mode 100644 index 0000000..625d610 --- /dev/null +++ b/frontend/src/model/rules.js @@ -0,0 +1,43 @@ +/* + * This file is part of caronte (https://github.com/eciavatta/caronte). + * Copyright (c) 2020 Emiliano Ciavatta. + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, version 3. + * + * This program is distributed in the hope that it will be useful, but + * WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ + +import backend from "../backend"; +import log from "../log"; + +const _ = require("lodash"); + +class Rules { + + constructor() { + this.rules = []; + this.loadRules(); + } + + loadRules = () => { + backend.get("/api/rules").then((res) => this.rules = res.json) + .catch((err) => log.error("Failed to load rules", err)); + }; + + allRules = () => _.clone(this.rules); + + ruleById = (id) => _.clone(this.rules.find(r => r.id === id)); + +} + +const rules = new Rules(); + +export default rules; diff --git a/frontend/yarn.lock b/frontend/yarn.lock index e9f01ac..54cc802 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -7248,7 +7248,7 @@ lodash.uniq@^4.5.0: resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773" integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M= -"lodash@>=3.5 <5", lodash@^4.0.0, lodash@^4.17.11, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.17.5, lodash@~4.17.10: +"lodash@>=3.5 <5", lodash@^4.0.0, lodash@^4.17.11, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.17.4, lodash@^4.17.5, lodash@~4.17.10: version "4.17.20" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.20.tgz#b44a9b6297bcb698f1c51a3545a2b3b368d59c52" integrity sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA== @@ -9743,6 +9743,13 @@ react-scripts@3.4.1: optionalDependencies: fsevents "2.1.2" +react-string-replace@^0.4.4: + version "0.4.4" + resolved "https://registry.yarnpkg.com/react-string-replace/-/react-string-replace-0.4.4.tgz#24006fbe0db573d5be583133df38b1a735cb4225" + integrity sha512-FAMkhxmDpCsGTwTZg7p/2v+/GTmxAp73so3fbSvlAcBBX36ujiGRNEaM/1u+jiYQrArhns+7eE92g2pi5E5FUA== + dependencies: + lodash "^4.17.4" + react-tag-autocomplete@^6.0.0-beta.6: version "6.1.0" resolved "https://registry.yarnpkg.com/react-tag-autocomplete/-/react-tag-autocomplete-6.1.0.tgz#9fb70149a69b33379013e5255bcd7ad97d8ec06b" -- cgit v1.2.3-70-g09d2 From 3920162abdcaad570b364f76efa8257fa87319c0 Mon Sep 17 00:00:00 2001 From: Emiliano Ciavatta Date: Tue, 20 Oct 2020 17:33:49 +0200 Subject: Update readme --- README.md | 40 ++++++++++++++---------- frontend/screenshots/connection_content.png | Bin 314372 -> 0 bytes frontend/screenshots/main.png | Bin 0 -> 402371 bytes frontend/screenshots/main2.png | Bin 0 -> 438349 bytes frontend/screenshots/pcaps.png | Bin 368643 -> 0 bytes frontend/screenshots/rules.png | Bin 253325 -> 0 bytes frontend/screenshots/rules_services.png | Bin 0 -> 240349 bytes frontend/screenshots/searches_pcaps.png | Bin 0 -> 345152 bytes frontend/screenshots/services.png | Bin 245420 -> 0 bytes frontend/src/components/panels/StreamsPane.js | 2 +- frontend/src/components/panels/StreamsPane.scss | 6 ++-- 11 files changed, 28 insertions(+), 20 deletions(-) delete mode 100644 frontend/screenshots/connection_content.png create mode 100644 frontend/screenshots/main.png create mode 100644 frontend/screenshots/main2.png delete mode 100644 frontend/screenshots/pcaps.png delete mode 100644 frontend/screenshots/rules.png create mode 100644 frontend/screenshots/rules_services.png create mode 100644 frontend/screenshots/searches_pcaps.png delete mode 100644 frontend/screenshots/services.png (limited to 'frontend/src/components') diff --git a/README.md b/README.md index 75158e2..980fd98 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,7 @@ # `caronte$` [![Build Status](https://travis-ci.com/eciavatta/caronte.svg?branch=develop)](https://travis-ci.com/eciavatta/caronte) +[![Docker Status](https://img.shields.io/docker/cloud/build/eciavatta/caronte)](https://hub.docker.com/r/eciavatta/caronte) [![codecov](https://codecov.io/gh/eciavatta/caronte/branch/develop/graph/badge.svg)](https://codecov.io/gh/eciavatta/caronte) [![Codacy Badge](https://api.codacy.com/project/badge/Grade/009dca44f4da4118a20aed2b9b7610c0)](https://www.codacy.com/manual/eciavatta/caronte?utm_source=github.com&utm_medium=referral&utm_content=eciavatta/caronte&utm_campaign=Badge_Grade) ![GitHub release (latest by date)](https://img.shields.io/github/v/tag/eciavatta/caronte) @@ -15,21 +16,28 @@ The connection flows are saved into a database and can be visualized with the we ## Features - immediate installation with docker-compose - no configuration file, settings can be changed via GUI or API -- the pcaps to be analyzed can be loaded via `curl`, either locally or remotely, or via the GUI +- pcaps to be analyzed can be loaded via `curl`, either locally or remotely, or via the GUI - it is also possible to download the pcaps from the GUI and see all the analysis statistics for each pcap - rules can be created to identify connections that contain certain strings - pattern matching is done through regular expressions (regex) - regex in UTF-8 and Unicode format are also supported - - it is possible to add an additional filter to the connections identified through pattern matching by type of connection -- the connections can be labeled by type of service, identified by the port number +- connections can be labeled by type of service, identified by the port number - each service can be assigned a different color -- it is possible to filter connections by addresses, ports, dimensions, time, duration, matched rules -- supports both IPv4 and IPv6 addresses - - if more addresses are assigned to the vulnerable machine to be defended, a CIDR address can be used +- ability to filter connections by addresses, ports, dimensions, time, duration, matched rules +- a timeline shows statistics with different metrics sampled per minute + - some of these metrics are *connections_per_service*, *client_bytes_per_service*, *server_bytes_per_service*, *duration_per service*, *matched_rules* + - with *matched_rules* metric it can be possible to see the relationship between *flag_in* and *flag_out* + - the timeline contains a sliding window which can be used to search for connections in a certain time interval +- advanced search by term, negated term, exact phrase, regex, negated regex + - the performed searches are saved to be instantly repeated the following times - the detected HTTP connections are automatically reconstructed - HTTP requests can be replicated through `curl`, `fetch` and `python requests` - - compressed HTTP responses (gzip/deflate) are automatically decompressed -- it is possible to export and view the content of connections in various formats, including hex and base64 + - compressed HTTP responses (gzip/deflate) are automatically decompressed +- ability to export and view the content of connections in various formats, including hex and base64 +- JSON content is displayed in a JSON tree viewer, HTML code can be rendered in a separate window +- occurrences of matched rules are highlighted in the connection content view +- supports both IPv4 and IPv6 addresses + - if more addresses are assigned to the vulnerable machine to be defended, a CIDR address can be used ## Installation There are two ways to install Caronte: @@ -77,17 +85,17 @@ The backend, written in Go language, it is designed as a service. It exposes RES ## Screenshots Below there are some screenshots showing the main features of the tool. -### Viewing the contents of a connection -![Connection Content](frontend/screenshots/connection_content.png) +### Main window, with connections list and stream content +![Connection Content](https://raw.githubusercontent.com/eciavatta/caronte/main/frontend/screenshots/main.png) -### Loading pcaps and analysis details -![Connection Content](frontend/screenshots/pcaps.png) +### Main window, with the timeline expanded +![Connection Content](https://raw.githubusercontent.com/eciavatta/caronte/main/frontend/screenshots/main2.png) -### Creating new pattern matching rules -![Connection Content](frontend/screenshots/rules.png) +### Rules and services view +![Connection Content](https://raw.githubusercontent.com/eciavatta/caronte/main/frontend/screenshots/rules_services.png) -### Creating or editing services -![Connection Content](frontend/screenshots/services.png) +### Searches and pcaps view +![Connection Content](https://raw.githubusercontent.com/eciavatta/caronte/main/frontend/screenshots/searches_pcaps.png) ## License caronte was created by [Emiliano Ciavatta](https://eciavatta.it) and is licensed under the [GPL-3.0 license](LICENSE). diff --git a/frontend/screenshots/connection_content.png b/frontend/screenshots/connection_content.png deleted file mode 100644 index 3a999bf..0000000 Binary files a/frontend/screenshots/connection_content.png and /dev/null differ diff --git a/frontend/screenshots/main.png b/frontend/screenshots/main.png new file mode 100644 index 0000000..2640afe Binary files /dev/null and b/frontend/screenshots/main.png differ diff --git a/frontend/screenshots/main2.png b/frontend/screenshots/main2.png new file mode 100644 index 0000000..5e24d52 Binary files /dev/null and b/frontend/screenshots/main2.png differ diff --git a/frontend/screenshots/pcaps.png b/frontend/screenshots/pcaps.png deleted file mode 100644 index 2b315e9..0000000 Binary files a/frontend/screenshots/pcaps.png and /dev/null differ diff --git a/frontend/screenshots/rules.png b/frontend/screenshots/rules.png deleted file mode 100644 index 1870080..0000000 Binary files a/frontend/screenshots/rules.png and /dev/null differ diff --git a/frontend/screenshots/rules_services.png b/frontend/screenshots/rules_services.png new file mode 100644 index 0000000..babf76d Binary files /dev/null and b/frontend/screenshots/rules_services.png differ diff --git a/frontend/screenshots/searches_pcaps.png b/frontend/screenshots/searches_pcaps.png new file mode 100644 index 0000000..77e927d Binary files /dev/null and b/frontend/screenshots/searches_pcaps.png differ diff --git a/frontend/screenshots/services.png b/frontend/screenshots/services.png deleted file mode 100644 index b605cc1..0000000 Binary files a/frontend/screenshots/services.png and /dev/null differ diff --git a/frontend/src/components/panels/StreamsPane.js b/frontend/src/components/panels/StreamsPane.js index cc3d53a..4c16cf1 100644 --- a/frontend/src/components/panels/StreamsPane.js +++ b/frontend/src/components/panels/StreamsPane.js @@ -28,7 +28,7 @@ import ChoiceField from "../fields/ChoiceField"; import MessageAction from "../objects/MessageAction"; import "./StreamsPane.scss"; -const reactStringReplace = require('react-string-replace') +const reactStringReplace = require("react-string-replace"); const classNames = require("classnames"); class StreamsPane extends Component { diff --git a/frontend/src/components/panels/StreamsPane.scss b/frontend/src/components/panels/StreamsPane.scss index c44c7eb..3857068 100644 --- a/frontend/src/components/panels/StreamsPane.scss +++ b/frontend/src/components/panels/StreamsPane.scss @@ -20,8 +20,8 @@ } .matched-occurrence { - color: $color-primary-4; font-weight: 500; + color: $color-primary-4; border-radius: 2px; } } @@ -38,10 +38,10 @@ .connection-message-info { font-size: 11px; + overflow: hidden; margin-top: 6px; margin-left: -10px; white-space: nowrap; - overflow: hidden; text-overflow: ellipsis; } @@ -106,10 +106,10 @@ .header-info { font-size: 12px; + overflow: hidden; padding-top: 7px; padding-left: 25px; white-space: nowrap; - overflow: hidden; text-overflow: ellipsis; } -- cgit v1.2.3-70-g09d2