aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--README.md42
-rw-r--r--frontend/src/components/Notifications.scss28
-rw-r--r--frontend/src/components/fields/ChoiceField.scss4
-rw-r--r--frontend/src/components/fields/InputField.scss15
-rw-r--r--frontend/src/components/fields/common.scss3
-rw-r--r--frontend/src/index.scss2
-rw-r--r--frontend/src/views/App.scss3
7 files changed, 48 insertions, 49 deletions
diff --git a/README.md b/README.md
index 0251be1..75158e2 100644
--- a/README.md
+++ b/README.md
@@ -13,23 +13,23 @@ The patterns can be defined as regex or using protocol specific rules.
The connection flows are saved into a database and can be visualized with the web application. REST API are also provided.
## 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
- - 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
- - 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
-- 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
+- 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
+ - 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
+ - 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
+- 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
## Installation
There are two ways to install Caronte:
@@ -77,16 +77,16 @@ 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
+### Viewing the contents of a connection
![Connection Content](frontend/screenshots/connection_content.png)
-#### Loading pcaps and analysis details
+### Loading pcaps and analysis details
![Connection Content](frontend/screenshots/pcaps.png)
-#### Creating new pattern matching rules
+### Creating new pattern matching rules
![Connection Content](frontend/screenshots/rules.png)
-#### Creating or editing services
+### Creating or editing services
![Connection Content](frontend/screenshots/services.png)
## License
diff --git a/frontend/src/components/Notifications.scss b/frontend/src/components/Notifications.scss
index b0c334b..bec7734 100644
--- a/frontend/src/components/Notifications.scss
+++ b/frontend/src/components/Notifications.scss
@@ -2,27 +2,22 @@
.notifications {
position: absolute;
-
- left: 30px;
- bottom: 50px;
z-index: 50;
-
- .notifications-list {
-
- }
+ bottom: 50px;
+ left: 30px;
.notification {
- background-color: $color-green;
- border-left: 5px solid $color-green-dark;
- padding: 10px;
- margin: 10px 0;
+ overflow: hidden;
width: 250px;
- color: $color-green-light;
- transform: translateX(-300px);
+ margin: 10px 0;
+ padding: 10px;
transition: all 1s ease;
+ transform: translateX(-300px);
white-space: nowrap;
- overflow: hidden;
text-overflow: ellipsis;
+ color: $color-green-light;
+ border-left: 5px solid $color-green-dark;
+ background-color: $color-green;
.notification-title {
font-size: 0.9em;
@@ -41,8 +36,5 @@
transform: translateY(-50px);
opacity: 0;
}
-
}
-
-
-} \ No newline at end of file
+}
diff --git a/frontend/src/components/fields/ChoiceField.scss b/frontend/src/components/fields/ChoiceField.scss
index 0b5e510..c8c7ff1 100644
--- a/frontend/src/components/fields/ChoiceField.scss
+++ b/frontend/src/components/fields/ChoiceField.scss
@@ -19,7 +19,7 @@
border-radius: 5px;
background-color: $color-primary-2;
- &:after {
+ &::after {
position: absolute;
right: 10px;
content: "⋎";
@@ -58,7 +58,7 @@
display: block;
}
- .field-value:after {
+ .field-value::after {
content: "⋏";
}
}
diff --git a/frontend/src/components/fields/InputField.scss b/frontend/src/components/fields/InputField.scss
index 7cc34d9..e8ef46a 100644
--- a/frontend/src/components/fields/InputField.scss
+++ b/frontend/src/components/fields/InputField.scss
@@ -28,7 +28,7 @@
display: none;
}
- .file-label:after {
+ .file-label::after {
position: absolute;
top: 0;
right: 0;
@@ -47,12 +47,13 @@
background-color: $color-primary-4 !important;
}
- .field-value input, .field-value .file-label {
+ .field-value input,
+ .field-value .file-label {
color: $color-primary-3 !important;
background-color: $color-primary-4 !important;
}
- .file-label:after {
+ .file-label::after {
background-color: $color-secondary-4 !important;
}
}
@@ -63,12 +64,13 @@
background-color: $color-secondary-2 !important;
}
- .field-value input, .field-value .file-label {
+ .field-value input,
+ .field-value .file-label {
color: $color-primary-4 !important;
background-color: $color-secondary-2 !important;
}
- .file-label:after {
+ .file-label::after {
background-color: $color-secondary-1 !important;
}
}
@@ -90,7 +92,8 @@
.field-input {
width: 100%;
- input, .file-label {
+ input,
+ .file-label {
padding-left: 3px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
diff --git a/frontend/src/components/fields/common.scss b/frontend/src/components/fields/common.scss
index f37369e..8fbef0d 100644
--- a/frontend/src/components/fields/common.scss
+++ b/frontend/src/components/fields/common.scss
@@ -1,7 +1,8 @@
@import "../../colors.scss";
.field {
- input, textarea {
+ input,
+ textarea {
width: 100%;
padding: 7px 10px;
color: $color-primary-4;
diff --git a/frontend/src/index.scss b/frontend/src/index.scss
index 2e5b6b9..9d6afc4 100644
--- a/frontend/src/index.scss
+++ b/frontend/src/index.scss
@@ -1,7 +1,9 @@
@import url("https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500&display=swap");
@import-normalize ;
+
@import "colors.scss";
+
body {
font-family: "Fira Code", monospace;
font-size: 100%;
diff --git a/frontend/src/views/App.scss b/frontend/src/views/App.scss
index 5c5bd99..87661c3 100644
--- a/frontend/src/views/App.scss
+++ b/frontend/src/views/App.scss
@@ -9,7 +9,8 @@
flex: 1 1;
}
- .main-header, .main-footer {
+ .main-header,
+ .main-footer {
flex: 0 0;
}
}