Repository: metron Updated Branches: refs/heads/master 952b707df -> e0f9b48e0
http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/package.json ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/package.json b/metron-interface/metron-config/package.json index ffc92ff..07b8acf 100644 --- a/metron-interface/metron-config/package.json +++ b/metron-interface/metron-config/package.json @@ -40,14 +40,14 @@ "@types/node": "^10.9.4", "@types/tether": "^1.1.27", "ace-builds": "^1.2.5", - "bootstrap": "4.0.0-alpha.5", + "bootstrap": "^4.1.3", "core-js": "^2.5.7", "font-awesome": "^4.6.3", "jquery": "^3.3.1", "karma-phantomjs-launcher": "^1.0.4", + "popper.js": "^1.14.4", "puppeteer": "^1.8.0", "rxjs": "6.2.2", - "tether": "^1.3.4", "ts-helpers": "^1.1.1", "zone.js": "^0.8.26" }, http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/app.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/app.component.html b/metron-interface/metron-config/src/app/app.component.html index f2f5c46..6825ddc 100644 --- a/metron-interface/metron-config/src/app/app.component.html +++ b/metron-interface/metron-config/src/app/app.component.html @@ -18,8 +18,8 @@ </div> <div [ngClass]="{'container-fluid body-fill px-0': loggedIn, 'fill': !loggedIn}"> <div [ngClass]="{'card-group ': loggedIn}" class="fill"> - <div *ngIf="loggedIn" class="card fill navigation" ><metron-config-vertical-navbar></metron-config-vertical-navbar></div> - <div [ngClass]="{'card fill content px-0 ' : loggedIn , 'fill': !loggedIn}"><router-outlet></router-outlet></div> + <div *ngIf="loggedIn" class="fill navigation" ><metron-config-vertical-navbar></metron-config-vertical-navbar></div> + <div [ngClass]="{'fill content px-0 ' : loggedIn , 'fill': !loggedIn}"><router-outlet></router-outlet></div> </div> </div> <router-outlet name="dialog" ></router-outlet> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/app.component.scss ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/app.component.scss b/metron-interface/metron-config/src/app/app.component.scss index 104b980..6060e89 100644 --- a/metron-interface/metron-config/src/app/app.component.scss +++ b/metron-interface/metron-config/src/app/app.component.scss @@ -31,4 +31,5 @@ .content{ background: $gray-dark; border: none; + flex: 1; } http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/general-settings/general-settings.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/general-settings/general-settings.component.html b/metron-interface/metron-config/src/app/general-settings/general-settings.component.html index 2c16f95..22c2ccb 100644 --- a/metron-interface/metron-config/src/app/general-settings/general-settings.component.html +++ b/metron-interface/metron-config/src/app/general-settings/general-settings.component.html @@ -15,14 +15,14 @@ --> <div > <div class="container-fluid details-pane-padding"> - <div class="row mb-1 mx-0"> + <div class="row mb-3 mx-0"> <div class="metron-title"> General Settings </div> </div> <div class="row mx-0"> - <form> + <form class="flex-fill"> <div class="col-md-4 pl-0"> - <div class="section px-1 py-1"> + <div class="section px-3 py-3"> <label class="h6"> <strong> Elasticsearch </strong> </label> <div class="form-group"> <label>INDEX DATE FORMAT</label> @@ -31,7 +31,7 @@ </div> - <div class="section px-1 py-1 mt-1"> + <div class="section px-3 py-3 mt-3"> <label class="h6"> <strong> Validation </strong> </label> <div class="form-group"> @@ -48,9 +48,9 @@ </div> <div class="container-fluid metron-button-bar-settings details-pane-padding" > - <div class="row px-1 py-1"> + <div class="row px-3 py-3"> <button type="submit" class="btn btn-primary" (click)="onSave()">SAVE</button> - <button class="btn form-enable-disable-button" (click)="onCancel()">CANCEL</button> + <button class="btn form-enable-disable-button ml-1" (click)="onCancel()">CANCEL</button> </div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/login/login.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/login/login.component.html b/metron-interface/metron-config/src/app/login/login.component.html index dcd5c34..5c3a116 100644 --- a/metron-interface/metron-config/src/app/login/login.component.html +++ b/metron-interface/metron-config/src/app/login/login.component.html @@ -20,9 +20,9 @@ <input class="form-control" name="user" [(ngModel)]="user" required autofocus> <label class="label"> PASSWORD </label> <input type="password" name="password" class="form-control" [(ngModel)]="password" required> - <div class="my-1" style="color:#a94442"> + <div class="my-3" style="color:#a94442"> {{loginFailure}} - <button class="btn btn-primary pull-right" type="submit" (click)="login()">LOG IN</button> + <button class="btn btn-primary float-right" type="submit" (click)="login()">LOG IN</button> </div> </form> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/navbar/navbar.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/navbar/navbar.html b/metron-interface/metron-config/src/app/navbar/navbar.html index 0e373e1..49f4a20 100644 --- a/metron-interface/metron-config/src/app/navbar/navbar.html +++ b/metron-interface/metron-config/src/app/navbar/navbar.html @@ -13,15 +13,13 @@ OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. --> -<nav class="metron-nav navbar navbar-dark"> - <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar"> - ☰ - </button> - <div class="collapse navbar-toggleable-xs pull-left" id="exCollapsingNavbar"> +<nav class="metron-nav navbar navbar-dark justify-content-between"> + + <div class="navbar-toggleable-xs" id="exCollapsingNavbar"> <a class="navbar-brand" href="#"><img src="assets/images/logo.png" alt="Logo" width=110></a> </div> - <div class="form-inline pull-right"> + <div class="form-inline"> <i class="fa fa-user " style="padding-left: 11px" aria-hidden="true"></i> <div *ngIf="currentUser != null" class="fa logout">Logged in as {{currentUser}} - <span class="logout-link" (click)="logout()">Logout</span></div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.html b/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.html index 1dcc9f1..4ab4067 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.html @@ -16,7 +16,7 @@ <div class="metron-slider-pane-edit fill load-left-to-right dialog2x"> <div class="form-title">Schema</div> - <i class="fa fa-times pull-right close-button" aria-hidden="true" (click)="onCancel()"></i> + <i class="fa fa-times float-right close-button" aria-hidden="true" (click)="onCancel()"></i> <form role="form" class="fieldschema-form"> @@ -25,7 +25,7 @@ <br><br> <div class="metron-bg-inverse"> - <div class="p-2"> + <div class="p-4"> <div class="row placeholder" *ngIf="fieldSchemaRows.length===0 || (parserResult === {})"> A data sample is need to view/configure the complete schema. @@ -36,16 +36,16 @@ <div class="col-md-9 title text-grey"> Changes </div> </div> - <div *ngFor="let fieldSchemaRow of fieldSchemaRows" class="row pb-1 mx-0"> + <div *ngFor="let fieldSchemaRow of fieldSchemaRows" class="row pb-3 mx-0"> <!-- Readonly Field Schema Row --> <div class="field-schema-row" *ngIf="!fieldSchemaRow.showConfig" [class.field-suppressed]="fieldSchemaRow.isRemoved"> <div class="col-md-3 field-schema-cell-title"> {{ fieldSchemaRow.outputFieldName }} </div> <div class="col-md-7 field-schema-cell-value" [innerHtml]="getChanges(fieldSchemaRow)"> </div> <div class="col-md-2 field-schema-cell icon-blue" style="font-size: 16px"> - <i *ngIf="!fieldSchemaRow.isParserGenerated" class="fa fa-trash pull-right" aria-hidden="true" (click)="onDelete(fieldSchemaRow)"></i> - <i class="fa fa-pencil pull-right" aria-hidden="true" (click)="fieldSchemaRow.showConfig=true"></i> - <i *ngIf="!fieldSchemaRow.isRemoved" class="fa fa-ban pull-right" aria-hidden="true" (click)="onRemove(fieldSchemaRow)"></i> - <i *ngIf="fieldSchemaRow.isRemoved" class="fa fa-check-circle-o pull-right" style="color:lightgreen" aria-hidden="true" (click)="onEnable(fieldSchemaRow)"></i> + <i *ngIf="!fieldSchemaRow.isParserGenerated" class="fa fa-trash float-right ml-1" aria-hidden="true" (click)="onDelete(fieldSchemaRow)"></i> + <i class="fa fa-pencil float-right ml-1" aria-hidden="true" (click)="fieldSchemaRow.showConfig=true"></i> + <i *ngIf="!fieldSchemaRow.isRemoved" class="fa fa-ban float-right ml-1" aria-hidden="true" (click)="onRemove(fieldSchemaRow)"></i> + <i *ngIf="fieldSchemaRow.isRemoved" class="fa fa-check-circle-o float-right ml-1" style="color:lightgreen" aria-hidden="true" (click)="onEnable(fieldSchemaRow)"></i> </div> </div> @@ -54,15 +54,15 @@ <div class="config container" *ngIf="fieldSchemaRow.showConfig"> <!--Title--> - <div class="row py-1"> + <div class="row py-3"> <div class="col-md-10 enrichments-edit-title"> {{ fieldSchemaRow.outputFieldName }} </div> <div class="col-md-2 enrichment-cell"> - <i class="fa fa-times-circle pull-right small-close-button" aria-hidden="true" (click)="onCancelChange(fieldSchemaRow)"></i> + <i class="fa fa-times-circle float-right small-close-button" aria-hidden="true" (click)="onCancelChange(fieldSchemaRow)"></i> </div> </div> <!--Input Field Name--> - <div class="form-group px-1 col-md-10" *ngIf="fieldSchemaRow.isNew"> + <div class="form-group px-3 col-md-10" *ngIf="fieldSchemaRow.isNew"> <label>INPUT FIELD</label> <select [(ngModel)]="fieldSchemaRow.inputFieldName" [ngModelOptions]="{standalone: true}" (ngModelChange)="fieldSchemaRow.outputFieldName=fieldSchemaRow.inputFieldName+'_copy'"> <option [disabled] [selected]> </option> @@ -71,39 +71,39 @@ </div> <!-- Output Field Name--> - <div class="form-group px-1 col-md-10" *ngIf="fieldSchemaRow.isNew || !fieldSchemaRow.isParserGenerated"> + <div class="form-group px-3 col-md-10" *ngIf="fieldSchemaRow.isNew || !fieldSchemaRow.isParserGenerated"> <label>NAME</label> <input type="text" class="form-control" [name]="fieldSchemaRow.outputFieldName" [(ngModel)]="fieldSchemaRow.outputFieldName" [ngModelOptions]="{standalone: true}"> </div> <!-- Transforms --> - <div class="form-group px-1 col-md-12"> + <div class="form-group px-3 col-md-12"> <label>TRANSFORMATIONS</label> <metron-config-multiple-input [type]="'select'" [availableItems]="transformOptions" [(configuredItems)]="fieldSchemaRow.transformConfigured" (onConfigChange)="onTransformsChange(fieldSchemaRow)"> </metron-config-multiple-input> <div class="edit-pane-readonly rounded col-md-10"> {{ fieldSchemaRow.preview }} </div> </div> <!-- Enrichmnets --> - <div class="form-group px-1 col-md-12"> + <div class="form-group px-3 col-md-12"> <label>ENRICHMENTS</label> <metron-config-multiple-input [availableItems]="enrichmentOptions" [(configuredItems)]="fieldSchemaRow.enrichmentConfigured" [allowDuplicates]="false"> </metron-config-multiple-input> </div> <!-- Threat Intel --> - <div class="form-group px-1 col-md-12"> + <div class="form-group px-3 col-md-12"> <label>THREAT INTEL </label> <metron-config-multiple-input [availableItems]="threatIntelOptions" [(configuredItems)]="fieldSchemaRow.threatIntelConfigured" [allowDuplicates]="false"> </metron-config-multiple-input> </div> - <div class="form-group p-1 col-md-12"> - <button type="submit" class="btn form-enable-disable-button pull-left" (click)="onSaveChange(fieldSchemaRow)">SAVE</button> + <div class="form-group p-3 col-md-12"> + <button type="submit" class="btn form-enable-disable-button float-left" (click)="onSaveChange(fieldSchemaRow)">SAVE</button> </div> </div> </div> <div class="row mx-0 add-button" *ngIf="fieldSchemaRows.length > 0"> - <button type="submit" class="btn form-enable-disable-button" (click)="addNewRule()"><i class="fa fa-plus" aria-hidden="true"></i></button> + <button type="submit" class="btn form-enable-disable-button d-flex justify-content-center" (click)="addNewRule()"><i class="fa fa-plus" aria-hidden="true"></i></button> </div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.scss ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.scss b/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.scss index f248a70..931f21b 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.scss +++ b/metron-interface/metron-config/src/app/sensors/sensor-field-schema/sensor-field-schema.component.scss @@ -34,7 +34,7 @@ .field-schema-row { - display: table; + display: flex; width: 100%; padding: 10px 0px 10px 0px; background: #383838; http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-grok/sensor-grok.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-grok/sensor-grok.component.html b/metron-interface/metron-config/src/app/sensors/sensor-grok/sensor-grok.component.html index c9bdc06..6a5dc53 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-grok/sensor-grok.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-grok/sensor-grok.component.html @@ -16,7 +16,7 @@ <div class="metron-slider-pane-edit fill load-left-to-right dialog2x"> <div class="form-title">Grok Validator</div> - <i class="fa fa-times pull-right close-button" aria-hidden="true" (click)="onCancelGrok()"></i> + <i class="fa fa-times float-right close-button" aria-hidden="true" (click)="onCancelGrok()"></i> <form role="form" class="grok-form"> <metron-config-sample-data [topic]="sensorParserConfig.sensorTopic" @@ -30,7 +30,7 @@ <div class="buttons-bar"> <button type="submit" class="btn form-enable-disable-button" [disabled]="isTestDisabled()" (click)="onTestGrokStatement()">TEST</button> - <button type="submit" class="btn form-enable-disable-button" [disabled]="isSaveDisabled()" (click)="onSaveGrok()">SAVE</button> + <button type="submit" class="btn form-enable-disable-button ml-1" [disabled]="isSaveDisabled()" (click)="onSaveGrok()">SAVE</button> </div> <label> PREVIEW </label> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-parser-config-readonly/sensor-parser-config-readonly.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-parser-config-readonly/sensor-parser-config-readonly.component.html b/metron-interface/metron-config/src/app/sensors/sensor-parser-config-readonly/sensor-parser-config-readonly.component.html index 365a8af..bd13c1c 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-parser-config-readonly/sensor-parser-config-readonly.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-parser-config-readonly/sensor-parser-config-readonly.component.html @@ -18,8 +18,8 @@ <div class="metron-slider-pane fill load-right-to-left dialog1x"> <div class="metron-readonly-pane"> <div class="row"> - <div class="col-xs-12 form-title">{{selectedSensorName}} - <i class="fa fa-times pull-right close-button" aria-hidden="true" (click)="goBack()"></i> + <div class="col-sm-12 form-title">{{selectedSensorName}} + <i class="fa fa-times float-right close-button" aria-hidden="true" (click)="goBack()"></i> </div> </div> @@ -30,31 +30,31 @@ </div> <div *ngSwitchCase="'SPACER'" class="row"> - <div class="col-xs-12"> </div> + <div class="col-sm-12"> </div> </div> <div *ngSwitchCase="'TITLE'" class="row"> - <div class="col-xs-12 form-sub-title">{{ item.value }}</div> + <div class="col-sm-12 form-sub-title">{{ item.value }}</div> </div> <div *ngSwitchDefault class="row"> - <div *ngIf="item.label!=''" class="col-xs-6 form-label" [ngClass]="{'form-value font-weight-bold': item.boldTitle}">{{ item.label }}</div> - <div *ngIf="item.model == 'sensorParserConfig'" class="col-xs-6 px-0 pull-left form-value">{{ sensorParserConfig[item.value] ? sensorParserConfig[item.value] : "-" }}</div> - <div *ngIf="item.model == 'sensorParserConfigHistory'" class="col-xs-6 px-0 pull-left form-value">{{ sensorParserConfigHistory[item.value] ? sensorParserConfigHistory[item.value] : "-" }}</div> - <div *ngIf="item.model == 'kafkaTopic'" class="col-xs-6 px-0 pull-left form-value">{{ kafkaTopic[item.value] ? kafkaTopic[item.value] : "-" }}</div> - <div *ngIf="item.model == 'topologyStatus'" class="col-xs-6 px-0 pull-left form-value">{{ getTopologyStatus(item.value) }}</div> + <div *ngIf="item.label!=''" class="col-sm-6 form-label" [ngClass]="{'form-value font-weight-bold': item.boldTitle}">{{ item.label }}</div> + <div *ngIf="item.model == 'sensorParserConfig'" class="col-sm-6 px-0 float-left form-value">{{ sensorParserConfig[item.value] ? sensorParserConfig[item.value] : "-" }}</div> + <div *ngIf="item.model == 'sensorParserConfigHistory'" class="col-sm-6 px-0 float-left form-value">{{ sensorParserConfigHistory[item.value] ? sensorParserConfigHistory[item.value] : "-" }}</div> + <div *ngIf="item.model == 'kafkaTopic'" class="col-sm-6 px-0 float-left form-value">{{ kafkaTopic[item.value] ? kafkaTopic[item.value] : "-" }}</div> + <div *ngIf="item.model == 'topologyStatus'" class="col-sm-6 px-0 float-left form-value">{{ getTopologyStatus(item.value) }}</div> <div *ngIf="item.model == 'grokStatement' && sensorParserConfigHistory.config.parserClassName === 'org.apache.metron.parsers.GrokParser'" style="border: none"> - <div class="col-xs-12 form-sub-title">Grok Statement</div> - <div id="collapseGrok" class="col-xs-12 pull-left form-value panel-collapse collapse"></div> - <div class="col-xs-12 pull-left form-value grok" [innerHtml]="grokStatement"></div> - <a *ngIf="grokStatement.length>0" class="collapsed blue-label font-weight-bold col-xs-8 col-xs-push-4" data-toggle="collapse" href="#collapseGrok" aria-expanded="false" aria-controls="collapseGrok" #grokLink (click)="grokLink.text=(grokLink.text==='show more')?'show less':'show more'">show more</a> - <div class="px-1"> <div class="col-xs-12 form-seperator"></div> </div> + <div class="col-sm-12 form-sub-title">Grok Statement</div> + <div id="collapseGrok" class="col-sm-12 float-left form-value panel-collapse collapse"></div> + <div class="col-sm-12 float-left form-value grok" [innerHtml]="grokStatement"></div> + <a *ngIf="grokStatement.length>0" class="collapsed blue-label font-weight-bold col-sm-8 col-sm-push-4" data-toggle="collapse" href="#collapseGrok" aria-expanded="false" aria-controls="collapseGrok" #grokLink (click)="grokLink.text=(grokLink.text==='show more')?'show less':'show more'">show more</a> + <div class="px-3"> <div class="col-sm-12 form-seperator"></div> </div> </div> <div *ngIf="item.model == 'transforms'"> - <div id="collapseTransform" class="col-xs-12 pull-left form-value panel-collapse collapse"> + <div id="collapseTransform" class="col-sm-12 float-left form-value panel-collapse collapse"> <div class="form-sub-sub-title">Transforms</div> <div> <div *ngFor="let results of transformsConfigKeys" > @@ -65,24 +65,24 @@ </div> <div class="transforms"> - <div class="col-xs-12 form-sub-sub-title">Transforms</div> - <div class="col-xs-12 form-label " [innerHtml]="getTransformsOutput()"></div> + <div class="col-sm-12 form-sub-sub-title">Transforms</div> + <div class="col-sm-12 form-label " [innerHtml]="getTransformsOutput()"></div> </div> - <a *ngIf="transformsConfigKeys.length>0" class="collapsed blue-label font-weight-bold col-xs-8 col-xs-push-4" data-toggle="collapse" href="#collapseTransform" aria-expanded="false" aria-controls="collapseTransform" (click)="toggleTransformLink()">{{transformLinkText}}</a> + <a *ngIf="transformsConfigKeys.length>0" class="collapsed blue-label font-weight-bold col-sm-8 col-sm-push-4" data-toggle="collapse" href="#collapseTransform" aria-expanded="false" aria-controls="collapseTransform" (click)="toggleTransformLink()">{{transformLinkText}}</a> </div> <div *ngIf="item.model == 'threatTriageRules'" class="threat-triage-rules"> - <div class="col-xs-6 form-label">AGGREGATOR</div><div class="col-xs-6 form-value">{{sensorEnrichmentConfig.threatIntel.triageConfig.aggregator}}</div> - <div id="collapseThreatTriage" class="col-xs-12 pull-left form-value panel-collapse collapse"> + <div class="col-sm-6 form-label">AGGREGATOR</div><div class="col-sm-6 form-value">{{sensorEnrichmentConfig.threatIntel.triageConfig.aggregator}}</div> + <div id="collapseThreatTriage" class="col-sm-12 float-left form-value panel-collapse collapse"> <div> - <div class="col-xs-6 form-sub-sub-title">NAME</div><div class="col-xs-6 form-sub-sub-title">SCORE</div> + <div class="col-sm-6 form-sub-sub-title">NAME</div><div class="col-sm-6 form-sub-sub-title">SCORE</div> <div *ngFor="let riskLevelRule of rules" > - <div class="col-xs-6 form-label">{{ getDisplayName(riskLevelRule) }}</div> - <div class="col-xs-6 form-value">{{ riskLevelRule.score }}</div> + <div class="col-sm-6 form-label">{{ getDisplayName(riskLevelRule) }}</div> + <div class="col-sm-6 form-value">{{ riskLevelRule.score }}</div> </div> </div> </div> - <div class="col-xs-12 form-label threatIntel">{{ getRuleDisplayName() }}</div> - <a *ngIf="rules.length>0" class="collapsed blue-label font-weight-bold col-xs-8 col-xs-push-4" data-toggle="collapse" href="#collapseThreatTriage" aria-expanded="false" aria-controls="collapseThreatTriage" (click)="toggleThreatTriageLink()">{{threatTriageLinkText}}</a> + <div class="col-sm-12 form-label threatIntel">{{ getRuleDisplayName() }}</div> + <a *ngIf="rules.length>0" class="collapsed blue-label font-weight-bold col-sm-8 col-sm-push-4" data-toggle="collapse" href="#collapseThreatTriage" aria-expanded="false" aria-controls="collapseThreatTriage" (click)="toggleThreatTriageLink()">{{threatTriageLinkText}}</a> </div> </div> </div> @@ -90,18 +90,18 @@ </div> <div class="metron-button-bar" > - <div class="row pl-0 py-1"> + <div class="row pl-0 py-3"> <button class="btn btn-primary" type="button" (click)="onEditSensor()" [disabled]="startStopInProgress">EDIT</button> - <button class="btn btn-primary" type="button" (click)="onStartSensor()" [disabled]="startStopInProgress" [hidden]="isStartHidden()">START</button> - <button class="btn form-enable-disable-button" type="button" (click)="onStopSensor()" [disabled]="startStopInProgress" [hidden]="isStopHidden()">STOP</button> + <button class="btn btn-primary ml-1" type="button" (click)="onStartSensor()" [disabled]="startStopInProgress" [hidden]="isStartHidden()">START</button> + <button class="btn form-enable-disable-button ml-1" type="button" (click)="onStopSensor()" [disabled]="startStopInProgress" [hidden]="isStopHidden()">STOP</button> - <button class="btn btn-primary" type="button" (click)="onEnableSensor()" [disabled]="startStopInProgress" [hidden]="isEnableHidden()" >ENABLE</button> - <button class="btn form-enable-disable-button" type="button" (click)="onDisableSensor()" [disabled]="startStopInProgress" [hidden]="isDisableHidden()">DISABLE</button> + <button class="btn btn-primary ml-1" type="button" (click)="onEnableSensor()" [disabled]="startStopInProgress" [hidden]="isEnableHidden()" >ENABLE</button> + <button class="btn form-enable-disable-button ml-1" type="button" (click)="onDisableSensor()" [disabled]="startStopInProgress" [hidden]="isDisableHidden()">DISABLE</button> - <button class="btn btn-link delete" type="button" (click)="onDeleteSensor()"> Delete </button> + <button class="btn btn-link delete ml-1" type="button" (click)="onDeleteSensor()"> Delete </button> - <div class="start-stop-progress"> <i class="fa fa-circle-o-notch fa-spin fa-lg fa-fw" [hidden]="!startStopInProgress"></i> </div> + <div class="start-stop-progress ml-1"> <i class="fa fa-circle-o-notch fa-spin fa-lg fa-fw" [hidden]="!startStopInProgress"></i> </div> </div> </div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.html b/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.html index a784436..22c4289 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.html @@ -42,7 +42,7 @@ <div class="metron-slider-pane-edit fill load-right-to-left dialog1x" style="overflow: auto" > <div style="height:100%"> <div class="form-title">{{sensorName}} </div> - <i class="fa fa-times pull-right main close-button" aria-hidden="true" (click)="goBack()"></i> + <i class="fa fa-times float-right main close-button" aria-hidden="true" (click)="goBack()"></i> <form role="form" [formGroup]="sensorConfigForm"> <div class="form-group"> @@ -85,7 +85,7 @@ <div class="form-group" [ngClass]="{'panel-selected': showFieldSchema }" > <label attr.for="fieldSchema">SCHEMA</label> <div class="input-group" [attr.disabled]="!configValid"> - <div class="form-control" style="height: 80px; resize: none;" readonly> + <div class="form-control table-wrapper" readonly> <table cellspacing="10"> <tr> <td class="p-l-1">TRANSFORMATIONS </td> <td class="p-l-1"> </td><td class="p-1-1">{{getTransformationCount()}}</td> </tr> <tr> <td>ENRICHMENTS</td> <td class="p-l-1"> </td> <td class="p-1-1">{{getEnrichmentCount()}}</td></tr> @@ -106,7 +106,7 @@ <div class="input-group" [attr.disabled]="!configValid"> <div class="form-control" style="resize: none;" readonly> <table style="margin: 0"> - <tr> <td class="p-l-1">RULES </td> <td class="p-l-1"> </td><td class="p-1-1">{{getRuleCount()}}</td> </tr> + <tr> <td class="p-l-1">RULES </td> <td class="p-l-1"> </td><td class="p-3-1">{{getRuleCount()}}</td> </tr> </table> </div> <span class="input-group-btn"> @@ -135,7 +135,7 @@ <div class="form-group"> <div class="form-seperator-edit"></div> <div class="advanced-title">Advanced</div> - <i class="fa fa-times pull-right small-close-button" aria-hidden="true" (click)="onAdvancedConfigFormClose()"></i> + <i class="fa fa-times float-right small-close-button" aria-hidden="true" (click)="onAdvancedConfigFormClose()"></i> </div> <div class="form-group" [ngClass]="{'panel-selected': showRawJson }"> <label attr.for="stellar">RAW JSON</label> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.scss ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.scss b/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.scss index 298163a..ef00dc6 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.scss +++ b/metron-interface/metron-config/src/app/sensors/sensor-parser-config/sensor-parser-config.component.scss @@ -30,6 +30,12 @@ padding-bottom: 10px; } +.table-wrapper { + height: 80px; + line-height: 1.25; + resize: none; +} + .close-button { padding-right: 20px; http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.html b/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.html index 576b5a3..726cf77 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.html @@ -21,7 +21,7 @@ <div class="metron-title"> {{componentName}} ({{count}}) </div> </div> <div class="col-lg-2"> - <div class="dropdown pull-right"> + <div class="dropdown float-right"> <button class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> ACTIONS </button> @@ -37,7 +37,7 @@ </div> </div> - <table class="table card-deck" metron-config-table #table (onSort)="onSort($event)"> + <table class="table config-table" metron-config-table #table (onSort)="onSort($event)"> <thead> <tr> <th> <metron-config-sorter [sortBy]="'sensorName'"> Name </metron-config-sorter> </th> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.scss ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.scss b/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.scss index 5d5f1e3..c17939a 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.scss +++ b/metron-interface/metron-config/src/app/sensors/sensor-parser-list/sensor-parser-list.component.scss @@ -15,3 +15,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ + +.config-table { + table-layout: fixed; +} http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-raw-json/sensor-raw-json.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-raw-json/sensor-raw-json.component.html b/metron-interface/metron-config/src/app/sensors/sensor-raw-json/sensor-raw-json.component.html index 291327f..ded2f5a 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-raw-json/sensor-raw-json.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-raw-json/sensor-raw-json.component.html @@ -17,7 +17,7 @@ <div class="form-group"> <div class="form-title">Configure Raw JSON</div> - <i class="fa fa-times pull-right close-button" aria-hidden="true" (click)="onCancel()"></i> + <i class="fa fa-times float-right close-button" aria-hidden="true" (click)="onCancel()"></i> </div> @@ -40,7 +40,7 @@ <div class="form-seperator-edit"></div> <div class="button-row"> <button type="submit" class="btn form-enable-disable-button" (click)="onSave()">SAVE</button> - <button class="btn form-enable-disable-button" (click)="onCancel()" >CANCEL</button> + <button class="btn form-enable-disable-button ml-1" (click)="onCancel()" >CANCEL</button> </div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-storm-settings/sensor-storm-settings.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-storm-settings/sensor-storm-settings.component.html b/metron-interface/metron-config/src/app/sensors/sensor-storm-settings/sensor-storm-settings.component.html index 0e33324..70e817e 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-storm-settings/sensor-storm-settings.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-storm-settings/sensor-storm-settings.component.html @@ -17,7 +17,7 @@ <div class="form-group"> <div class="form-title">Configure Storm Settings</div> - <i class="fa fa-times pull-right close-button" aria-hidden="true" (click)="onCancel()"></i> + <i class="fa fa-times float-right close-button" aria-hidden="true" (click)="onCancel()"></i> </div> @@ -95,7 +95,7 @@ <div class="form-seperator-edit"></div> <div class="button-row"> <button type="submit" class="btn form-enable-disable-button" (click)="onSave()">SAVE</button> - <button class="btn form-enable-disable-button" (click)="onCancel()" >CANCEL</button> + <button class="btn form-enable-disable-button ml-1" (click)="onCancel()" >CANCEL</button> </div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/rule-editor/sensor-rule-editor.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/rule-editor/sensor-rule-editor.component.html b/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/rule-editor/sensor-rule-editor.component.html index 1a1f9f0..512a990 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/rule-editor/sensor-rule-editor.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/rule-editor/sensor-rule-editor.component.html @@ -16,7 +16,7 @@ <div class="metron-slider-pane-edit fill load-left-to-right dialog1x"> <div class="form-title">Edit Rule</div> - <i class="fa fa-times pull-right close-button" aria-hidden="true" (click)="onCancel()"></i> + <i class="fa fa-times float-right close-button" aria-hidden="true" (click)="onCancel()"></i> <form role="form" class="threat-intel-form"> @@ -43,7 +43,7 @@ <div class="form-seperator-edit"></div> <div class="button-row"> <button type="submit" class="btn form-enable-disable-button" (click)="onSave()">SAVE</button> - <button class="btn form-enable-disable-button" (click)="onCancel()" >CANCEL</button> + <button class="btn form-enable-disable-button ml-1" (click)="onCancel()" >CANCEL</button> </div> </div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/sensor-threat-triage.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/sensor-threat-triage.component.html b/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/sensor-threat-triage.component.html index 9d67df6..96892f7 100644 --- a/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/sensor-threat-triage.component.html +++ b/metron-interface/metron-config/src/app/sensors/sensor-threat-triage/sensor-threat-triage.component.html @@ -20,7 +20,7 @@ <div class="metron-slider-pane-edit fill load-left-to-right dialog1x"> <div class="form-title">Threat Triage Rules</div> - <i class="fa fa-times pull-right close-button" aria-hidden="true" (click)="onClose()"></i> + <i class="fa fa-times float-right close-button" aria-hidden="true" (click)="onClose()"></i> <form role="form" class="threat-intel-form"> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/shared/metron-dialog-box.ts ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/shared/metron-dialog-box.ts b/metron-interface/metron-config/src/app/shared/metron-dialog-box.ts index d2910fc..a3d8b86 100644 --- a/metron-interface/metron-config/src/app/shared/metron-dialog-box.ts +++ b/metron-interface/metron-config/src/app/shared/metron-dialog-box.ts @@ -35,7 +35,7 @@ export class MetronDialogBox { </div> <div class="modal-footer"> <button type="button" class="btn btn-primary">OK</button> - <button type="button" class="btn form-enable-disable-button" data-dismiss="modal">Cancel</button> + <button type="button" class="btn form-enable-disable-button ml-1" data-dismiss="modal">Cancel</button> </div> </div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/shared/number-spinner/number-spinner.component.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/shared/number-spinner/number-spinner.component.html b/metron-interface/metron-config/src/app/shared/number-spinner/number-spinner.component.html index b63908f..60e453b 100644 --- a/metron-interface/metron-config/src/app/shared/number-spinner/number-spinner.component.html +++ b/metron-interface/metron-config/src/app/shared/number-spinner/number-spinner.component.html @@ -17,6 +17,6 @@ <input type="text" class="form-control" [(ngModel)]="value"> <div class="input-group-btn-vertical"> <button class="btn btn-default" type="button" (click)="value=value+1" [disabled]="value >= max"><i class="fa fa-caret-up"></i></button> - <button class="btn btn-default" type="button" (click)="value=value-1" [disabled]="value <= min"><i class="fa fa-caret-down"></i></button> + <button class="btn btn-default ml-1" type="button" (click)="value=value-1" [disabled]="value <= min"><i class="fa fa-caret-down"></i></button> </div> </div> http://git-wip-us.apache.org/repos/asf/metron/blob/e0f9b48e/metron-interface/metron-config/src/app/verticalnavbar/verticalnavbar.html ---------------------------------------------------------------------- diff --git a/metron-interface/metron-config/src/app/verticalnavbar/verticalnavbar.html b/metron-interface/metron-config/src/app/verticalnavbar/verticalnavbar.html index 994711a..0160d8f 100644 --- a/metron-interface/metron-config/src/app/verticalnavbar/verticalnavbar.html +++ b/metron-interface/metron-config/src/app/verticalnavbar/verticalnavbar.html @@ -17,12 +17,12 @@ <div class="nav-link-title">Operations</div> - <ul class="nav"> + <ul class="nav flex-column"> <li class="nav-item"> - <a [routerLink]="['/sensors']" class="nav-link" routerLinkActive="active" href="#">Sensors</a> + <a [routerLink]="['/sensors']" class="nav-link py-0" routerLinkActive="active" href="#">Sensors</a> </li> <li class="nav-item"> - <a [routerLink]="['/general-settings']" class="nav-link" routerLinkActive="active" href="#">General Settings</a> + <a [routerLink]="['/general-settings']" class="nav-link py-0" routerLinkActive="active" href="#">General Settings</a> </li> </ul>
