Release/v0.1.8 (#461)

* Add documentation link at models workspace * Add colors.scss - Define color variables - brand-primary - gray scale - Pure black & white - Accent color - Meaning related (Dnager, highlight - Theme colors - Gray - Green - Purple * Update brand primary color variables - Update it on .scss files - Update it on .svg files * Update color brand-primary color at react theme file * Update brand-primary color at templateLoader.js Not sure what's the purpose of this file but I'm updating it anyways to keep consistency * Use --brand-default color variabloe accross the border This way we have more control to change all colors in a central place if needed * Migrate border color to color variables - Create color variables values for borders (light, default, dark) - Over write some Bootstrap border values * Remove duplicated <statur-bar> element - Also organize the bottom of each file (Keep consistency in the comments and spaces) * Remove Fira Sans as default font - Use default system font instead - Arguably better legibility - Save extra request to get fonts from Google Fonts servers * Remove duplicated ";" from some files * Font-color legibility + .model-properties improv - Use color variables to improve font-legibility .model-properties improvements: - Increase size of clickable element to show/hide .model-properties - Add cursor icon at the empty-state message * Replace multiple hard coded color values - Use variables instead - Change .warning button color from orange to default gray - Change validation error "red" to use --danger-default color - Relave multiple HEX white and black and use --white --black instead " * Use --brand-primary-30 as default color for links * Update BRMW logo - Add SVG with (not that) new logo; - Replace logo at login page - Update favicon * Fix typo in --black color variable * Small padding adjustment at model-properties sidebar * Adjust .navbar-default colors for better contrast * Update --border-default value * Remove old logo assets * Bump mongodb from 4.8.1 to 4.17.0 (#451) Bumps [mongodb](https://github.com/mongodb/node-mongodb-native) from 4.8.1 to 4.17.0. - [Release notes](https://github.com/mongodb/node-mongodb-native/releases) - [Changelog](https://github.com/mongodb/node-mongodb-native/blob/v4.17.0/HISTORY.md) - [Commits](mongodb/node-mongodb-native@v4.8.1...v4.17.0) --- updated-dependencies: - dependency-name: mongodb dependency-type: direct:production ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Idmar Ramos Jr. (Id) <[email protected]>
brmodeloweb · Sep 7, 2023 · 80ebb4e · 80ebb4e
1 parent 3a1f7b5
commit 80ebb4e
Show file tree

Hide file tree

Showing 42 changed files with 3,309 additions and 3,383 deletions.
diff --git a/app/angular/components/queryExpressionModal/styles.scss b/app/angular/components/queryExpressionModal/styles.scss
@@ -7,7 +7,7 @@
 
 		.condition-label {
 			padding: 6px;
-			background: #3d9970;
+			background: hsl(170, 100%, 20%);
 			color: white;
 			border-radius: 4px;
 			margin-right: 8px;

diff --git a/app/angular/components/statusBar/styles.scss b/app/angular/components/statusBar/styles.scss
@@ -1,6 +1,5 @@
 .status-bar {
 	font-size: 0.9em;
-	font-style: italic;
 	font-weight: 300;
-	color: rgba(#000, 1);
+	color: var(--black);
 }
diff --git a/app/angular/conceptual/conceptual.html b/app/angular/conceptual/conceptual.html
@@ -35,6 +35,7 @@ <h2 class="h4">{{ 'Conceptual model of:' | translate }} {{$ctrl.model.name}}</h2
 						<status-bar updated-at="$ctrl.modelState.updatedAt"></status-bar>
 					</div>
 					<aside class="header-actions pull-right">
+						<a class="docs-icon" href="https://docs.brmodeloweb.com" target="_blank" rel="noopener noreferrer" title="{{ 'Documentation' | translate }}"><i class="fa fa-book"></i></a>
 						<a class="br-button" data-ng-click="$ctrl.saveModel()" title="{{ 'Save (CTRL S)' | translate }}">{{ 'Save' | translate }}</a>
 					</aside>
 				</div>
@@ -54,10 +55,8 @@ <h2 class="h4">{{ 'Conceptual model of:' | translate }} {{$ctrl.model.name}}</h2
 					</div>
 				</aside>
 			</header><!-- End .workspace-header -->
-		</section>
-	  	<sidebar-control-conceptual selected="$ctrl.selectedElement" on-update="$ctrl.onUpdate(event)"></sidebar-control-conceptual>
+		</section><!-- End .model-area -->
+		<sidebar-control-conceptual selected="$ctrl.selectedElement" on-update="$ctrl.onUpdate(event)"></sidebar-control-conceptual>
 		<bug-report-button></bug-report-button>
-	</div>
-	<!-- End .mainContent -->
-</section>
-<!-- End .view -->
+	</div><!-- End .mainContent -->
+</section><!-- End .view -->
diff --git a/app/angular/conceptual/sidebarControl.html b/app/angular/conceptual/sidebarControl.html
@@ -1,14 +1,14 @@
 <aside class="model-properties" data-ng-class="{'active': $ctrl.visible}">
 
 	<span class="action" data-ng-click="$ctrl.changeVisible()">
-		<i class="fa angle-double-icon"
-			data-ng-class="!$ctrl.visible ? 'fa-angle-double-left' : 'fa-angle-double-right'"></i>
+		<i class="fa angle-double-icon" data-ng-class="!$ctrl.visible ? 'fa-angle-double-left' : 'fa-angle-double-right'"></i>
 	</span>
 
 	<div class="properties-content old">
 
 		<div class="form-group" ng-if="$ctrl.configuration.emptyState">
 			<div class="empty-state">
+				<i class="fa fa-mouse-pointer" aria-hidden="true"></i>
 				<p>{{ 'Select an element to edit' | translate }}</p>
 			</div>
 		</div><!-- End .form-group -->

diff --git a/app/angular/editor/editorActions.js b/app/angular/editor/editorActions.js
@@ -80,7 +80,7 @@ joint.ui.EditorActions = Backbone.Model.extend({
                 runningCommand.action = commandAction;
                 runningCommand.data.id = cellView.id;
                 runningCommand.data.type = cellView.attributes.type;
-                runningCommand.data.attributes = { ...cellView.toJSON() };;
+                runningCommand.data.attributes = { ...cellView.toJSON() };
                 runningCommand.options = d || {};
                 runningCommand.data.view = cellView;
                 this.saveCommand(runningCommand);

diff --git a/app/angular/logic/logic.html b/app/angular/logic/logic.html
@@ -32,6 +32,7 @@ <h2 class="h4 pull-left">{{ 'Logical model of:' | translate }} {{$ctrl.model.nam
 						<status-bar updated-at="$ctrl.modelState.updatedAt"></status-bar>
 					</div>
 					<aside class="header-actions pull-right">
+						<a class="docs-icon" href="https://docs.brmodeloweb.com" target="_blank" rel="noopener noreferrer"  title="{{ 'Documentation' | translate }}"><i class="fa fa-book"></i></a>
 						<a class="br-button" data-ng-click="$ctrl.saveModel()" title="{{ 'Save (CTRL S)' | translate }}">{{ 'Save' | translate }}</a>
 					</aside>
 				</div>
@@ -52,12 +53,7 @@ <h2 class="h4 pull-left">{{ 'Logical model of:' | translate }} {{$ctrl.model.nam
 				</aside>
 			</header><!-- End .workspace-header -->
 		</section><!-- End .model-area -->
-
 		<sidebar-control-logical selected="$ctrl.selectedElement" show-feedback="$ctrl.showFeedback"></sidebar-control-logical>
-
-		<status-bar updated-at="$ctrl.modelState.updatedAt"></status-bar>
-
 		<bug-report-button></bug-report-button>
-
 	</section><!-- End .mainContent -->
 </section><!-- End .view -->
diff --git a/app/angular/logic/sidebarControl.html b/app/angular/logic/sidebarControl.html
@@ -7,6 +7,7 @@
 	<div class="properties-content old" ng-if="$ctrl.selectedElement == null">
 		<div class="form-group">
 			<div class="empty-state">
+				<i class="fa fa-mouse-pointer" aria-hidden="true"></i>
 				<p>{{ 'Select an element to edit' | translate }}</p>
 			</div>
 		</div><!-- End .form-group -->

diff --git a/app/angular/login/login.html b/app/angular/login/login.html
@@ -8,7 +8,7 @@
 		/>
 		<section class="login-page">
 			<header class="public-logo">
-				<img src="../../img/brmodelo-logo-square.svg" alt="BR Modelo Web logo" height="42" width="42" />
+				<img src="../../img/brmw-logo.svg" alt="BR Modelo Web logo" height="42" width="42" />
 				<h1>BR Modelo Web</h1>
 			</header>
 			<div class="alert alert-danger" role="alert" data-ng-class="{'hide': !$ctrl.feedback.showing}">

diff --git a/app/angular/preferences/preferences.html b/app/angular/preferences/preferences.html
@@ -36,7 +36,7 @@ <h2 class="h2 pull-left">{{ 'Preferences' | translate }}</h2>
 
 			<!-- User information -->
 			<form class="form-horizontal" role="form" name="userPreferencesForm">
-				
+
 				<section class="form-section deleteAccount">
 					<header>
 						<h3>{{ 'Delete account' | translate }}</h3>
@@ -46,7 +46,7 @@ <h3>{{ 'Delete account' | translate }}</h3>
 				</section>
 
 			</form>
-		</div><!-- End .container.projectsList -->
+		</div><!-- End .container -->
 
 		<bug-report-button></bug-report-button>
 	</section><!-- End .mainContent -->

diff --git a/app/favicon.ico b/app/favicon.ico
diff --git a/app/img/brlogo.png b/app/img/brlogo.png
diff --git a/app/img/brmodelo-logo-round.svg b/app/img/brmodelo-logo-round.svg
diff --git a/app/img/brmodelo-logo-square.svg b/app/img/brmodelo-logo-square.svg
diff --git a/app/img/brmw-logo.svg b/app/img/brmw-logo.svg
diff --git a/app/img/wave01.svg b/app/img/wave01.svg
diff --git a/app/img/wave02.svg b/app/img/wave02.svg
diff --git a/app/img/wave03.svg b/app/img/wave03.svg
diff --git a/app/index.html b/app/index.html
@@ -3,10 +3,6 @@
 	<head lang="en">
 		<meta charset="UTF-8">
 		<title ng-bind="title">brModeloWeb</title>
-		<!-- Custom Fonts -->
-		<link rel="preconnect" href="https://fonts.googleapis.com" />
-		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-		<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet" />
 
 		<!-- Global site tag (gtag.js) - Google Analytics -->
 		<script async src="https://www.googletagmanager.com/gtag/js?id=G-NQ9Z9PV306"></script>

diff --git a/app/joint/shapes.js b/app/joint/shapes.js
@@ -303,7 +303,7 @@ erd.InfoButton = joint.linkTools.InfoButton = joint.linkTools.Button.extend({
 			distance: 40,
 			offset: 0,
 			action: function(evt) {
-				this.notify('link:options', evt, this.sourceView, this.sourceMagnet, 'source');;
+				this.notify('link:options', evt, this.sourceView, this.sourceMagnet, 'source');
 			}
 	}
 });

diff --git a/app/joint/table.js b/app/joint/table.js
@@ -27,15 +27,15 @@ uml.Class = joint.shapes.basic.Generic.extend({
 
             '.uml-class-name-text': {
                 'ref': '.uml-class-name-rect', 'ref-y': .5, 'ref-x': .5, 'text-anchor': 'middle', 'y-alignment': 'middle', 'font-weight': 'bold',
-                'fill': 'black', 'font-size': 12, 'font-family': 'Fira Sans'
+                'fill': 'black', 'font-size': 12, 'font-family': 'BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif'
             },
             '.uml-class-attrs-text': {
                 'ref': '.uml-class-attrs-rect', 'ref-y': 5, 'ref-x': 5,
-                'fill': 'black', 'font-size': 12, 'font-family': 'Fira Sans'
+                'fill': 'black', 'font-size': 12, 'font-family': 'BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif'
             },
             '.uml-class-methods-text': {
                 'ref': '.uml-class-methods-rect', 'ref-y': 5, 'ref-x': 5,
-                'fill': 'black', 'font-size': 12, 'font-family': 'Fira Sans'
+                'fill': 'black', 'font-size': 12, 'font-family': 'BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif'
             }
         },
 
@@ -147,15 +147,15 @@ uml.Abstract = joint.shapes.basic.Generic.extend({
 
             '.uml-class-name-text': {
                 'ref': '.uml-class-name-rect', 'ref-y': .5, 'ref-x': .5, 'text-anchor': 'middle', 'y-alignment': 'middle', 'font-weight': 'bold',
-                'fill': 'black', 'font-size': 12, 'font-family': 'Fira Sans'
+                'fill': 'black', 'font-size': 12, 'font-family': 'BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif'
             },
             '.uml-class-attrs-text': {
                 'ref': '.uml-class-attrs-rect', 'ref-y': 5, 'ref-x': 5,
-                'fill': 'black', 'font-size': 12, 'font-family': 'Fira Sans'
+                'fill': 'black', 'font-size': 12, 'font-family': 'BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif'
             },
             '.uml-class-methods-text': {
                 'ref': '.uml-class-methods-rect', 'ref-y': 5, 'ref-x': 5,
-                'fill': 'black', 'font-size': 12, 'font-family': 'Fira Sans'
+                'fill': 'black', 'font-size': 12, 'font-family': 'BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif'
             }
         },
 

diff --git a/app/react/theme/index.ts b/app/react/theme/index.ts
@@ -1,16 +1,16 @@
 const theme = {
 	colors: {
 		primary: {
-			500: "#3d9970",
+			500: "hsl(170, 100%, 30%)",
 		},
 		secondary: {
-			500: "#dd7c58",
+			500: "hsl(170, 100%, 40%)",
 		},
 		gray: {
-			100: "#f8f8f8",
+			100: "hsl(0, 0%, 10%",
 		},
-		white: "#fff",
-		black: "#000",
+		white: "hsl(0, 0%, 100%)",
+		black: "hsl(0, 0, 0)",
 	},
 	shadows: {
 		default: "0 0 20px rgb(0, 0, 0, 0.1)",

diff --git a/app/sass/app.scss b/app/sass/app.scss
@@ -1,3 +1,4 @@
+@import 'colors.scss';
 @import 'public.scss';
 @import 'mainHeader.scss';
 @import 'structure.scss';

diff --git a/app/sass/buttons.scss b/app/sass/buttons.scss
@@ -6,10 +6,10 @@
 	cursor: pointer;
 	font-size: 1em;
 	padding: 4px 8px;
-	border: 1px solid #3d9970;
+	border: 1px solid var(--brand-primary-30);
 	border-radius: 2px;
 	margin: 0 4px 0 0;
-	color: #3D9970;
+	color: var(--brand-primary-30);
 	font-weight: 400;
 	text-transform: uppercase;
 	background-color: transparent;
@@ -21,29 +21,29 @@
 }
 
 .br-button:hover {
-	color: #fff;
-	background: #3d9970;
+	color: var(--white);
+	background: var(--brand-primary-30);
 	text-decoration: none;
 }
 
 .br-button.warning {
-	border-color: #f58056;
-	color: #f58056;
+	border-color: var(--gray-20);
+	color: var(--gray-20);
 }
 
 .br-button.warning:hover {
-	background: #f58056;
-	color: #fff;
+	background: var(--gray-30);
+	color: var(--white);
 }
 
 .br-button.destructive {
-	border-color: #af1010;
-	color: #af1010;
+	border-color: var(--danger-base);
+	color: var(--danger-base);
 }
 
 .br-button.destructive:hover {
-	background: #af1010;
-	color: #fff;
+	background: var(--danger-base);
+	color: var(--white);
 }
 
 .br-button.btn-disable {
@@ -57,28 +57,28 @@
 // .btn-alt
 ////////////////////////////////////////////////////////////////////////////////
 .btn-alt {
-	background-color: #3d9970;
-	color: #fff;
+	background-color: var(--brand-default);
+	color: var(--white);
 	text-transform: none;
 }
 
 .btn-alt:hover {
 	background-color: transparent;
-	color: #3d9970;
+	color: var(--brand-default);
 }
 
 ////////////////////////////////////////////////////////////////////////////////
 // .btn-alt
 ////////////////////////////////////////////////////////////////////////////////
 .btn-alt {
-	background-color: #3d9970;
-	color: #fff;
+	background-color: var(--brand-default);
+	color: var(--white);
 	text-transform: none;
 }
 
 .btn-alt:hover {
 	background-color: transparent;
-	color: #3d9970;
+	color: var(--brand-default);
 }
 
 ////////////////////////////////////////////////////////////////////////////////
@@ -100,7 +100,7 @@
 }
 
 .br-help:visited {
-	color: #3d9970;
+	color: var(--brand-default);
 }
 
 .br-help:hover {