Implement new create and manager trigger UI
Implements the new trigger setup user interface, which is now a linear workflow found on its own page, rather than a tiny modal dialog Fixes #1187
This commit is contained in:
		
							parent
							
								
									21b09a7451
								
							
						
					
					
						commit
						8e863b8cf5
					
				
					 47 changed files with 1835 additions and 1068 deletions
				
			
		
							
								
								
									
										64
									
								
								static/css/directives/ui/linear-workflow.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										64
									
								
								static/css/directives/ui/linear-workflow.css
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,64 @@ | |||
| .linear-workflow-section { | ||||
|     margin-bottom: 10px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow-section.row { | ||||
|     margin-left: 0px; | ||||
|     margin-right: 0px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow .upcoming-table { | ||||
|   vertical-align: middle; | ||||
|   margin-left: 20px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow .upcoming-table .fa { | ||||
|   margin-right: 8px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow .upcoming { | ||||
|     color: #888; | ||||
|     vertical-align: middle; | ||||
|     margin-left: 10px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow .upcoming ul { | ||||
|     padding: 0px; | ||||
|     display: inline-block; | ||||
|     margin: 0px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow .upcoming li { | ||||
|     display: inline-block; | ||||
|     margin-right: 6px; | ||||
|     margin-left: 2px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow .upcoming li:after { | ||||
|     content: "•"; | ||||
|     display: inline-block; | ||||
|     margin-left: 6px; | ||||
|     margin-right: 2px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow .upcoming li:last-child:after { | ||||
|     content: ""; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow .bottom-controls { | ||||
|     padding: 10px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow-section-element { | ||||
|   padding: 20px; | ||||
|   padding-top: 10px; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow-section-element h3, .linear-workflow-section-element strong { | ||||
|     color: #444; | ||||
| } | ||||
| 
 | ||||
| .linear-workflow-section-element.current-section h3, | ||||
| .linear-workflow-section-element.current-section strong { | ||||
|     color: black; | ||||
| } | ||||
							
								
								
									
										106
									
								
								static/css/directives/ui/manage-trigger-control.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										106
									
								
								static/css/directives/ui/manage-trigger-control.css
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,106 @@ | |||
| .manage-trigger-control .help-col { | ||||
|     padding: 30px; | ||||
|     padding-top: 100px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .main-col { | ||||
|     padding-left: 10px; | ||||
|     padding-right: 10px; | ||||
|     padding-top: 10px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control strong { | ||||
|   margin-bottom: 10px; | ||||
|   display: block; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .namespace-avatar { | ||||
|     margin-right: 4px; | ||||
|     width: 24px; | ||||
|     vertical-align: middle; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .importance-col { | ||||
|     text-align: center; | ||||
|     width: 120px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .co-top-bar { | ||||
|     margin-top: 20px; | ||||
|     height: 28px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .namespace-avatar { | ||||
|     margin-left: 2px; | ||||
|     margin-right: 2px; | ||||
|     display: inline-block; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .service-icon { | ||||
|     font-size: 24px; | ||||
|     margin-right: 4px; | ||||
|     vertical-align: middle; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .fa-exclamation-triangle { | ||||
|     color: #FCA657; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .empty-description { | ||||
|     color: #ccc; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .radio { | ||||
|   margin-bottom: 20px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .radio input[type="radio"] { | ||||
|     padding: 4px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .radio label .title { | ||||
|     font-size: 16px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .radio label .weak { | ||||
|     font-weight: 300; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .radio label .description { | ||||
|     margin-top: 6px; | ||||
|     color: #aaa; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .radio label .extended { | ||||
|     margin-top: 20px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .radio label td:first-child { | ||||
|     vertical-align: top; | ||||
|     padding: 4px; | ||||
|     padding-right: 10px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .regex-match-view { | ||||
|     margin-top: 20px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control h3 .fa { | ||||
|   margin-right: 4px; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control h3.warning { | ||||
|     color: #FCA657; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control h3.error { | ||||
|     color: #D64456; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .success { | ||||
|     color: #2FC98E !important; | ||||
| } | ||||
| 
 | ||||
| .manage-trigger-control .nowrap-col { | ||||
|     white-space: nowrap; | ||||
| } | ||||
							
								
								
									
										36
									
								
								static/css/directives/ui/regex-match-view.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										36
									
								
								static/css/directives/ui/regex-match-view.css
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,36 @@ | |||
| .regex-match-view-element .match-list { | ||||
|   list-style: none; | ||||
|   overflow: auto; | ||||
|   max-height: 150px; | ||||
| } | ||||
| 
 | ||||
| .regex-match-view-element .match-list li { | ||||
|   display: inline-block; | ||||
|   margin-right: 4px; | ||||
|   width: 120px; | ||||
|   padding: 4px; | ||||
| } | ||||
| 
 | ||||
| .regex-match-view-element .match-list li .fa { | ||||
|   margin-right: 4px; | ||||
|   vertical-align: middle; | ||||
| } | ||||
| 
 | ||||
| .regex-match-view-element .match-list.not-matching li { | ||||
|   color: #aaa; | ||||
| } | ||||
| 
 | ||||
| .regex-match-view-element .match-list.matching li { | ||||
|   color: #2fc98e; | ||||
| } | ||||
| 
 | ||||
| .regex-match-view-element .match-table td:first-child { | ||||
|   vertical-align: top; | ||||
|   white-space: nowrap; | ||||
| } | ||||
| 
 | ||||
| 
 | ||||
| .regex-match-view-element .fa-exclamation-triangle { | ||||
|   margin-right: 4px; | ||||
| } | ||||
| 
 | ||||
|  | @ -1,28 +0,0 @@ | |||
| .setup-trigger-directive-element .dockerfile-found-content { | ||||
|   margin-left: 32px; | ||||
| } | ||||
| 
 | ||||
| .setup-trigger-directive-element .dockerfile-found-content:before { | ||||
|   content: "\f071"; | ||||
|   font-family: FontAwesome; | ||||
|   color: rgb(255, 194, 0); | ||||
|   position: absolute; | ||||
|   top: 0px; | ||||
|   left: 0px; | ||||
|   font-size: 20px; | ||||
| } | ||||
| 
 | ||||
| .setup-trigger-directive-element .loading { | ||||
|   text-align: center; | ||||
| } | ||||
| 
 | ||||
| .setup-trigger-directive-element .loading .cor-loader-inline { | ||||
|   margin-right: 4px; | ||||
| } | ||||
| 
 | ||||
| .setup-trigger-directive-element .dockerfile-found { | ||||
|   position: relative; | ||||
|   margin-bottom: 16px; | ||||
|   padding-bottom: 16px; | ||||
|   border-bottom: 1px solid #eee; | ||||
| } | ||||
|  | @ -1,9 +0,0 @@ | |||
| .step-view-step-content .loading-message { | ||||
|   position: relative; | ||||
|   text-align: center; | ||||
|   display: block; | ||||
| } | ||||
| 
 | ||||
| .step-view-step-content .loading-message .cor-loader-inline { | ||||
|   margin-right: 6px; | ||||
| } | ||||
		Reference in a new issue