Design Docs

For sharing mockups of features not yet part of the initial push to the repo.

Update Pages

1. Election Infrastructure

• Need ability to add multiple election systems by pressing the Add Row button to pop down another row.

/* Colors: */
--yellow-500: #FFDC17;
--yellow-300: #FFF1A2;
--yellow-400: #FFE75D;
--orange-500-warning-: #FDB515;
--blue-700: #006890;
--black: #000000;
--blue-200: #BFE2EF;
--blue-300: #99D1E6;
--gray-900-dark-: #1B1C1D;
--gray-100-light-: #EFEFEF;
--blue-500-primary-: #008BC0;
--red-500-danger-: #BB0000;
--gray-700-secondary-: #525356;
--gray-500-tertiary-: #88898D;
--red-50: #FCF2F2;
--red-700: #8C0000;
--red-800: #700000;
--red-300: #E49999;
--red-400: #CF4D4D;
--unnamed-color-a64d87: #A64D87;

/* Font/text values */
--unnamed-font-family-open-sans: Open Sans;
--unnamed-font-style-normal: normal;
--unnamed-font-weight-normal: normal;
--unnamed-font-size-14: 14px;
--unnamed-font-size-16: 16px;
--unnamed-character-spacing-0: 0px;
--unnamed-line-spacing-20: 20px;
--unnamed-line-spacing-24: 24px;
}

/* Character Styles */
.text-base-open-sans-—-16pt {
font-family: var(--unnamed-font-family-open-sans);
font-style: var(--unnamed-font-style-normal);
font-weight: var(--unnamed-font-weight-normal);
font-size: var(--unnamed-font-size-16);
line-height: var(--unnamed-line-spacing-24);
letter-spacing: var(--unnamed-character-spacing-0);
color: var(--black);
}
.text-sm-open-sans-—-14pt {
font-family: var(--unnamed-font-family-open-sans);
font-style: var(--unnamed-font-style-normal);
font-weight: var(--unnamed-font-weight-normal);
font-size: var(--unnamed-font-size-14);
line-height: var(--unnamed-line-spacing-20);
letter-spacing: var(--unnamed-character-spacing-0);
color: var(--black);
}

---

New Pages

1. Data Exfil page

• Needs a spot on the navbar somewhere

/* Colors: */
--blue-700: #006890;
--black: #000000;
--blue-200: #BFE2EF;
--blue-300: #99D1E6;
--gray-900-dark-: #1B1C1D;
--gray-100-light-: #EFEFEF;
--blue-500-primary-: #008BC0;
--red-500-danger-: #BB0000;
--gray-700-secondary-: #525356;
--gray-500-tertiary-: #88898D;
--red-50: #FCF2F2;
--red-700: #8C0000;
--red-800: #700000;
--red-300: #E49999;
--red-400: #CF4D4D;
--unnamed-color-a64d87: #A64D87;

2. Add KEVs from Nessus file

Use the FileUploader to upload nessus csv file(s), parse, and display relevant KEVs in a list to select what should be reported. Show the Kevs selected for reporting so far. To link a Kev to a finding, do so through the Add Finding page.

/* Colors: */
--blue-700: #006890;
--black: #000000;
--blue-200: #BFE2EF;
--blue-300: #99D1E6;
--gray-900-dark-: #1B1C1D;
--gray-100-light-: #EFEFEF;
--blue-500-primary-: #008BC0;
--red-500-danger-: #BB0000;
--gray-700-secondary-: #525356;
--gray-500-tertiary-: #88898D;
--red-50: #FCF2F2;
--red-700: #8C0000;
--red-800: #700000;
--red-300: #E49999;
--red-400: #CF4D4D;
--unnamed-color-a64d87: #A64D87;

3. Narrative/Attack Paths

This is a work in progress, and will be updated with new versions of the SEI SDS (Specifically updates to components to select multiple techniques)