Switched CSS framework to Bootstrap
This commit is contained in:
		
							
								
								
									
										147
									
								
								assets/styles/nardah-old.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										147
									
								
								assets/styles/nardah-old.scss
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,147 @@ | |||||||
|  | $primary-color: navy; | ||||||
|  | $primary-color-highlight: lighten($primary-color, 10%); | ||||||
|  |  | ||||||
|  | $nav-height: 65px; | ||||||
|  |  | ||||||
|  | $textarea-min-height: 100px; | ||||||
|  |  | ||||||
|  | $shadow-normal: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px; | ||||||
|  | $shadow-light: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; | ||||||
|  | $shadow-heavy: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px; | ||||||
|  |  | ||||||
|  | body{ | ||||||
|  |   margin: 0; | ||||||
|  |   padding: $nav-height 0 0; | ||||||
|  |   background: #f6f6f6; | ||||||
|  |   font-size: 16px; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | a{ | ||||||
|  |   color: $primary-color; | ||||||
|  |   transition: all 230ms ease-in-out; | ||||||
|  |   &:hover{ | ||||||
|  |     color: $primary-color-highlight; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table{ | ||||||
|  |   border: 1px solid #e1e1e1; | ||||||
|  |   border-collapse: collapse; | ||||||
|  |   box-shadow: $shadow-light; | ||||||
|  |   border-radius: 7px; | ||||||
|  |   overflow: hidden; | ||||||
|  |  | ||||||
|  |   thead{ | ||||||
|  |     border-bottom: 2px solid #212121; | ||||||
|  |     font-size: 2rem; | ||||||
|  |   } | ||||||
|  |  | ||||||
|  |   tr, | ||||||
|  |   th, | ||||||
|  |   td{ | ||||||
|  |     border: none; | ||||||
|  |   } | ||||||
|  |  | ||||||
|  |   tr:nth-child(even){ | ||||||
|  |     background-color: #eee; | ||||||
|  |   } | ||||||
|  |  | ||||||
|  |   th, | ||||||
|  |   td{ | ||||||
|  |     padding: 12px 15px !important; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  |  | ||||||
|  | textarea{ | ||||||
|  |   min-width: 100%; | ||||||
|  |   max-width: 100%; | ||||||
|  |   min-height: $textarea-min-height; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | input[type=submit].button-primary, | ||||||
|  | button.button-primary, | ||||||
|  | .button.button-primary{ | ||||||
|  |   background-color: $primary-color; | ||||||
|  |   font-size: 1.5rem; | ||||||
|  |  | ||||||
|  |   &:hover{ | ||||||
|  |     background-color: lighten($primary-color, 10%); | ||||||
|  |   } | ||||||
|  | } | ||||||
|  |  | ||||||
|  | select[multiple]{ | ||||||
|  |   max-width: 100%; | ||||||
|  |   min-height: 100px; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #main-nav{ | ||||||
|  |   position: fixed; | ||||||
|  |   top: 0; | ||||||
|  |   left: 0; | ||||||
|  |   width: 100%; | ||||||
|  |   height: $nav-height; | ||||||
|  |   background: $primary-color; | ||||||
|  |   box-shadow: $shadow-normal; | ||||||
|  |   color: #eee; | ||||||
|  |   font-size: 2rem; | ||||||
|  |   z-index: 100; | ||||||
|  |  | ||||||
|  |   ul{ | ||||||
|  |     list-style: none; | ||||||
|  |     li{ | ||||||
|  |       display: inline-block; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |  | ||||||
|  |   .nav-left{ | ||||||
|  |     float: left; | ||||||
|  |   } | ||||||
|  |   .nav-right{ | ||||||
|  |     float: right; | ||||||
|  |   } | ||||||
|  |  | ||||||
|  |   a{ | ||||||
|  |     display: inline-block; | ||||||
|  |     padding: 15px 10px; | ||||||
|  |     color: #eee; | ||||||
|  |     font-weight: bold; | ||||||
|  |     text-decoration: none; | ||||||
|  |     &:hover{ | ||||||
|  |       color: white; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |  | ||||||
|  |   .site-logo{ | ||||||
|  |     margin-left: 25px; | ||||||
|  |     margin-right: 25px; | ||||||
|  |     font-weight: bold; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #main-wrapper{ | ||||||
|  |   max-width: 1180px; | ||||||
|  |   margin-top: 15px; | ||||||
|  |   padding: 15px 20px; | ||||||
|  |   background-color: white; | ||||||
|  |   box-shadow: $shadow-normal; | ||||||
|  |   border-radius: 10px; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #main-footer{ | ||||||
|  |   margin-top: 25px; | ||||||
|  |  | ||||||
|  |   p{ | ||||||
|  |     margin-bottom: 5px; | ||||||
|  |     text-align: center; | ||||||
|  |   } | ||||||
|  | } | ||||||
|  |  | ||||||
|  | #result-form{ | ||||||
|  |   margin: 0; | ||||||
|  |  | ||||||
|  |   button, | ||||||
|  |   input, | ||||||
|  |   select{ | ||||||
|  |     margin: 0; | ||||||
|  |   } | ||||||
|  | } | ||||||
| @@ -10,138 +10,5 @@ $shadow-light: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; | |||||||
| $shadow-heavy: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px; | $shadow-heavy: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px; | ||||||
|  |  | ||||||
| body{ | body{ | ||||||
|   margin: 0; |   font-size: 18px; | ||||||
|   padding: $nav-height 0 0; |  | ||||||
|   background: #f6f6f6; |  | ||||||
|   font-size: 16px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| a{ |  | ||||||
|   color: $primary-color; |  | ||||||
|   transition: all 230ms ease-in-out; |  | ||||||
|   &:hover{ |  | ||||||
|     color: $primary-color-highlight; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
|  |  | ||||||
| table{ |  | ||||||
|   border: 1px solid #e1e1e1; |  | ||||||
|   border-collapse: collapse; |  | ||||||
|   box-shadow: $shadow-light; |  | ||||||
|   border-radius: 7px; |  | ||||||
|   overflow: hidden; |  | ||||||
|  |  | ||||||
|   thead{ |  | ||||||
|     border-bottom: 2px solid #212121; |  | ||||||
|     font-size: 2rem; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   tr, |  | ||||||
|   th, |  | ||||||
|   td{ |  | ||||||
|     border: none; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   tr:nth-child(even){ |  | ||||||
|     background-color: #eee; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   th, |  | ||||||
|   td{ |  | ||||||
|     padding: 12px 15px !important; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
|  |  | ||||||
| textarea{ |  | ||||||
|   min-width: 100%; |  | ||||||
|   max-width: 100%; |  | ||||||
|   min-height: $textarea-min-height; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| input[type=submit].button-primary, |  | ||||||
| button.button-primary, |  | ||||||
| .button.button-primary{ |  | ||||||
|   background-color: $primary-color; |  | ||||||
|   font-size: 1.5rem; |  | ||||||
|  |  | ||||||
|   &:hover{ |  | ||||||
|     background-color: lighten($primary-color, 10%); |  | ||||||
|   } |  | ||||||
| } |  | ||||||
|  |  | ||||||
| select[multiple]{ |  | ||||||
|   max-width: 100%; |  | ||||||
|   min-height: 100px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| #main-nav{ |  | ||||||
|   position: fixed; |  | ||||||
|   top: 0; |  | ||||||
|   left: 0; |  | ||||||
|   width: 100%; |  | ||||||
|   height: $nav-height; |  | ||||||
|   background: $primary-color; |  | ||||||
|   box-shadow: $shadow-normal; |  | ||||||
|   color: #eee; |  | ||||||
|   font-size: 2rem; |  | ||||||
|   z-index: 100; |  | ||||||
|  |  | ||||||
|   ul{ |  | ||||||
|     list-style: none; |  | ||||||
|     li{ |  | ||||||
|       display: inline-block; |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .nav-left{ |  | ||||||
|     float: left; |  | ||||||
|   } |  | ||||||
|   .nav-right{ |  | ||||||
|     float: right; |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   a{ |  | ||||||
|     display: inline-block; |  | ||||||
|     padding: 15px 10px; |  | ||||||
|     color: #eee; |  | ||||||
|     font-weight: bold; |  | ||||||
|     text-decoration: none; |  | ||||||
|     &:hover{ |  | ||||||
|       color: white; |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
|  |  | ||||||
|   .site-logo{ |  | ||||||
|     margin-left: 25px; |  | ||||||
|     margin-right: 25px; |  | ||||||
|     font-weight: bold; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
|  |  | ||||||
| #main-wrapper{ |  | ||||||
|   max-width: 1180px; |  | ||||||
|   margin-top: 15px; |  | ||||||
|   padding: 15px 20px; |  | ||||||
|   background-color: white; |  | ||||||
|   box-shadow: $shadow-normal; |  | ||||||
|   border-radius: 10px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| #main-footer{ |  | ||||||
|   margin-top: 25px; |  | ||||||
|  |  | ||||||
|   p{ |  | ||||||
|     margin-bottom: 5px; |  | ||||||
|     text-align: center; |  | ||||||
|   } |  | ||||||
| } |  | ||||||
|  |  | ||||||
| #result-form{ |  | ||||||
|   margin: 0; |  | ||||||
|  |  | ||||||
|   button, |  | ||||||
|   input, |  | ||||||
|   select{ |  | ||||||
|     margin: 0; |  | ||||||
|   } |  | ||||||
| } | } | ||||||
|   | |||||||
| @@ -4,43 +4,39 @@ | |||||||
|  |  | ||||||
| {% block content %} | {% block content %} | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row mb-4"> | ||||||
|   <div class="twelve columns"> |   <div class="col-12"> | ||||||
|     <h1>Add new benchmark</h1> |     <h1>Add new benchmark</h1> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row"> | ||||||
|   <div class="twelve columns"> |   <form action="{{ url_for('benchmark.add') }}" method="POST"> | ||||||
|     <form action="{{ url_for('benchmark.add') }}" method="POST" class="u-full-width"> |     <div class="row"> | ||||||
|       <div class="row"> |       <div class="col-9 mb-3"> | ||||||
|         <div class="nine columns"> |         <label class="form-label" for="benchmark_name">Benchmark name:</label> | ||||||
|           <label for="benchmark_name">Benchmark name:</label> |         <input id="benchmark_name" class="form-control" type="text" name="benchmark_name"> | ||||||
|           <input type="text" id="benchmark_name" class="u-full-width" name="benchmark_name"> |  | ||||||
|         </div> |  | ||||||
|  |  | ||||||
|         <div class="three columns"> |  | ||||||
|           <label> |  | ||||||
|             Scoring type |  | ||||||
|             <select class="u-full-width" name="benchmark_scoring"> |  | ||||||
|               <option value="fps">Frames per Second (fps)</option> |  | ||||||
|               <option value="ms">Frame Time (ms)</option> |  | ||||||
|               <option value="pts">Total Points</option> |  | ||||||
|             </select> |  | ||||||
|           </label> |  | ||||||
|         </div> |  | ||||||
|       </div> |       </div> | ||||||
|  |  | ||||||
|       <div class="row"> |       <div class="col-3 mb-3"> | ||||||
|         <div class="twelve columns"> |         <label class="form-label" for="benchmark_scoring">Scoring type:</label> | ||||||
|           <label for="benchmark_description">Description</label> |         <select id="benchmark_scoring" class="form-select" name="benchmark_scoring"> | ||||||
|           <textarea class="u-full-width" name="benchmark_description" id="benchmark_description" rows="5" placeholder="Describe this benchmark..."></textarea> |           <option value="fps">Frames per Second (fps)</option> | ||||||
|         </div> |           <option value="ms">Frame Time (ms)</option> | ||||||
|  |           <option value="pts">Total Points</option> | ||||||
|  |         </select> | ||||||
|       </div> |       </div> | ||||||
|  |     </div> | ||||||
|  |  | ||||||
|       <input class="button button-primary u-full-width" type="submit" value="Submit"> |     <div class="row mb-3"> | ||||||
|     </form> |       <div class="col-12"> | ||||||
|   </div> |         <label for="benchmark_description">Description</label> | ||||||
|  |         <textarea id="benchmark_description" class="form-control" name="benchmark_description" rows="5" placeholder="Describe this benchmark..."></textarea> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |  | ||||||
|  |     <input class="btn btn-primary" type="submit" value="Create Benchmark"> | ||||||
|  |   </form> | ||||||
| </div> | </div> | ||||||
|  |  | ||||||
| {% endblock %} | {% endblock %} | ||||||
|   | |||||||
| @@ -4,43 +4,39 @@ | |||||||
|  |  | ||||||
| {% block content %} | {% block content %} | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row mb-4"> | ||||||
|   <div class="twelve columns"> |   <div class="col-12"> | ||||||
|     <h1>Editing Benchmark: {{ benchmark.name }}</h1> |     <h1>Editing Benchmark: {{ benchmark.name }}</h1> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row"> | ||||||
|   <div class="twelve columns"> |   <form action="{{ url_for('benchmark.edit', { benchmark_id: benchmark.id }) }}" method="POST"> | ||||||
|     <form action="{{ url_for('benchmark.edit', { benchmark_id: benchmark.id }) }}" method="POST" class="u-full-width"> |     <div class="row"> | ||||||
|       <div class="row"> |       <div class="col-9 mb-3"> | ||||||
|         <div class="nine columns"> |         <label class="form-label" for="benchmark_name">Benchmark name:</label> | ||||||
|           <label for="benchmark_name">Benchmark name:</label> |         <input id="benchmark_name" class="form-control" type="text" name="benchmark_name" value="{{ benchmark.name }}"> | ||||||
|           <input type="text" id="benchmark_name" class="u-full-width" name="benchmark_name" value="{{ benchmark.name }}"> |  | ||||||
|         </div> |  | ||||||
|  |  | ||||||
|         <div class="three columns"> |  | ||||||
|           <label> |  | ||||||
|             Scoring type |  | ||||||
|             <select class="u-full-width" name="benchmark_scoring"> |  | ||||||
|               <option value="fps" {% if benchmark.scoring == 'fps' %}selected{% endif %}>Frames per Second (fps)</option> |  | ||||||
|               <option value="ms" {% if benchmark.scoring == 'ms' %}selected{% endif %}>Frame Time (ms)</option> |  | ||||||
|               <option value="pts" {% if benchmark.scoring == 'pts' %}selected{% endif %}>Total Points</option> |  | ||||||
|             </select> |  | ||||||
|           </label> |  | ||||||
|         </div> |  | ||||||
|       </div> |       </div> | ||||||
|  |  | ||||||
|       <div class="row"> |       <div class="col-3 mb-3"> | ||||||
|         <div class="twelve columns"> |         <label class="form-label" for="benchmark_scoring">Scoring type:</label> | ||||||
|           <label for="benchmark_description">Description</label> |         <select id="benchmark_scoring" class="form-select" name="benchmark_scoring"> | ||||||
|           <textarea class="u-full-width" name="benchmark_description" id="benchmark_description" rows="5" placeholder="Describe this benchmark...">{{ benchmark.description }}</textarea> |           <option value="fps" {% if benchmark.scoring == 'fps' %}selected{% endif %}>Frames per Second (fps)</option> | ||||||
|         </div> |           <option value="ms" {% if benchmark.scoring == 'ms' %}selected{% endif %}>Frame Time (ms)</option> | ||||||
|  |           <option value="pts" {% if benchmark.scoring == 'pts' %}selected{% endif %}>Total Points</option> | ||||||
|  |         </select> | ||||||
|       </div> |       </div> | ||||||
|  |     </div> | ||||||
|  |  | ||||||
|       <input class="button button-primary u-full-width" type="submit" value="Submit"> |     <div class="row mb-3"> | ||||||
|     </form> |       <div class="col-12"> | ||||||
|   </div> |         <label for="benchmark_description">Description</label> | ||||||
|  |         <textarea id="benchmark_description" class="form-control" name="benchmark_description" rows="5" placeholder="Describe this benchmark...">{{ benchmark.description }}</textarea> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |  | ||||||
|  |     <input class="btn btn-primary" type="submit" value="Submit Changes"> | ||||||
|  |   </form> | ||||||
| </div> | </div> | ||||||
|  |  | ||||||
| {% endblock %} | {% endblock %} | ||||||
|   | |||||||
| @@ -6,8 +6,8 @@ | |||||||
|   <p><a href="{{ url_for('benchmark.add') }}">Create new Benchmark</a></p> |   <p><a href="{{ url_for('benchmark.add') }}">Create new Benchmark</a></p> | ||||||
|  |  | ||||||
|   {% if benchmarks | length > 0 %} |   {% if benchmarks | length > 0 %} | ||||||
|     <table class="u-full-width"> |     <table class="table table-hover table-responsive"> | ||||||
|       <thead> |       <thead class="table-light"> | ||||||
|         <tr> |         <tr> | ||||||
|           <th>Benchmark name</th> |           <th>Benchmark name</th> | ||||||
|           <th>Description</th> |           <th>Description</th> | ||||||
|   | |||||||
| @@ -4,7 +4,7 @@ | |||||||
|  |  | ||||||
| {% block content %} | {% block content %} | ||||||
|   <div class="row"> |   <div class="row"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <h1>{{ benchmark.name }}</h1> |       <h1>{{ benchmark.name }}</h1> | ||||||
|       <p><a href="{{ url_for('benchmark.edit', { benchmark_id: benchmark.id }) }}">Edit</a></p> |       <p><a href="{{ url_for('benchmark.edit', { benchmark_id: benchmark.id }) }}">Edit</a></p> | ||||||
|       <p>{{ benchmark.description }}</p> |       <p>{{ benchmark.description }}</p> | ||||||
| @@ -14,12 +14,12 @@ | |||||||
|   <hr> |   <hr> | ||||||
|  |  | ||||||
|   <div class="row"> |   <div class="row"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <h3>Tests using this benchmark:</h3> |       <h3 class="mb-3">Tests using this benchmark:</h3> | ||||||
|  |  | ||||||
|       {% if benchmark.tests | length > 0 %} |       {% if benchmark.tests | length > 0 %} | ||||||
|         <table class="u-full-width"> |         <table class="table table-hover table-responsive"> | ||||||
|           <thead> |           <thead class="table-light"> | ||||||
|             <tr> |             <tr> | ||||||
|               <th>Test title</th> |               <th>Test title</th> | ||||||
|               <th>Benchmarks</th> |               <th>Benchmarks</th> | ||||||
|   | |||||||
| @@ -4,33 +4,31 @@ | |||||||
|  |  | ||||||
| {% block content %} | {% block content %} | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row mb-4"> | ||||||
|   <div class="twelve columns"> |   <div class="col-12"> | ||||||
|     <h1>Add new component</h1> |     <h1>Add new component</h1> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row"> | ||||||
|   <div class="twelve columns"> |   <div class="col-12"> | ||||||
|     <form action="{{ url_for('component.add') }}" method="POST" class="u-full-width"> |     <form action="{{ url_for('component.add') }}" method="POST"> | ||||||
|       <div class="row"> |       <div class="row mb-3"> | ||||||
|         <div class="nine columns"> |         <div class="col-9"> | ||||||
|           <label for="component_name">Component name:</label> |           <label class="form-label" for="component_name">Component name:</label> | ||||||
|           <input type="text" id="component_name" class="u-full-width" name="component_name"> |           <input id="component_name" class="form-control" type="text" name="component_name"> | ||||||
|         </div> |         </div> | ||||||
|  |  | ||||||
|         <div class="three columns"> |         <div class="col-3"> | ||||||
|           <label> |           <label class="form-label" for="component_type">Component type:</label> | ||||||
|             Component type: |           <select id="component_type" class="form-select" name="component_type"> | ||||||
|             <select class="u-full-width" name="component_type"> |             <option value="gpu">Graphics card</option> | ||||||
|               <option value="gpu">Graphics card</option> |             <option value="cpu">Processor</option> | ||||||
|               <option value="cpu">Processor</option> |           </select> | ||||||
|             </select> |  | ||||||
|           </label> |  | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|  |  | ||||||
|       <input class="button button-primary u-full-width" type="submit" value="Submit"> |       <input class="btn btn-primary" type="submit" value="Create Component"> | ||||||
|     </form> |     </form> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|   | |||||||
| @@ -4,35 +4,31 @@ | |||||||
|  |  | ||||||
| {% block content %} | {% block content %} | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row mb-4"> | ||||||
|   <div class="twelve columns"> |   <div class="col-12"> | ||||||
|     <h1>Editing Component: {{ component.name }}</h1> |     <h1>Editing Component: {{ component.name }}</h1> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row"> | ||||||
|   <div class="twelve columns"> |   <div class="col-12"> | ||||||
|     <form action="{{ url_for('component.edit', { component_id: component.id }) }}" method="POST" class="u-full-width"> |     <form action="{{ url_for('component.edit', { component_id: component.id }) }}" method="POST" class="u-full-width"> | ||||||
|       <div class="row"> |       <div class="row mb-3"> | ||||||
|         <div class="nine columns"> |         <div class="col-9"> | ||||||
| 					<label> |           <label class="form-label" for="component_name">Component name:</label> | ||||||
| 						Component name: |           <input id="component_name" class="form-control" type="text" name="component_name" value="{{ component.name }}"> | ||||||
| 						<input type="text" id="component_name" class="u-full-width" name="component_name" value="{{ component.name }}"> |  | ||||||
| 					</label> |  | ||||||
|         </div> |         </div> | ||||||
|  |  | ||||||
|         <div class="three columns"> |         <div class="col-3"> | ||||||
|           <label> |           <label class="form-label" for="component_type">Component type:</label> | ||||||
|             Component type: |           <select id="component_type" class="form-select" name="component_type"> | ||||||
|             <select class="u-full-width" name="component_type"> |             <option value="gpu" {% if component.type == 'gpu' %}selected{% endif %}>Graphics card</option> | ||||||
|               <option value="gpu" {% if component.type == 'gpu' %}selected{% endif %}>Graphics card</option> |             <option value="cpu" {% if component.type == 'cpu' %}selected{% endif %}>Processor</option> | ||||||
|               <option value="cpu" {% if component.type == 'cpu' %}selected{% endif %}>Processor</option> |           </select> | ||||||
|             </select> |  | ||||||
|           </label> |  | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|  |  | ||||||
|       <input class="button button-primary u-full-width" type="submit" value="Submit"> |       <input class="btn btn-primary" type="submit" value="Submit Changes"> | ||||||
|     </form> |     </form> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|   | |||||||
| @@ -6,8 +6,8 @@ | |||||||
|   <p><a href="{{ url_for('component.add') }}">Create new Hardware Component</a></p> |   <p><a href="{{ url_for('component.add') }}">Create new Hardware Component</a></p> | ||||||
|  |  | ||||||
|   {% if components | length > 0 %} |   {% if components | length > 0 %} | ||||||
|     <table class="u-full-width"> |     <table class="table table-hover table-responsive"> | ||||||
|       <thead> |       <thead class="table-light"> | ||||||
|         <tr> |         <tr> | ||||||
|           <th>Component name</th> |           <th>Component name</th> | ||||||
|           <th>Type</th> |           <th>Type</th> | ||||||
|   | |||||||
| @@ -4,7 +4,7 @@ | |||||||
|  |  | ||||||
| {% block content %} | {% block content %} | ||||||
|   <div class="row"> |   <div class="row"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <h1>{{ component.name }}</h1> |       <h1>{{ component.name }}</h1> | ||||||
|       <p><a href="{{ url_for('component.edit', { component_id: component.id }) }}">Edit</a></p> |       <p><a href="{{ url_for('component.edit', { component_id: component.id }) }}">Edit</a></p> | ||||||
|       <p>{{ component.type }}</p> |       <p>{{ component.type }}</p> | ||||||
| @@ -14,12 +14,12 @@ | |||||||
|   <hr> |   <hr> | ||||||
|  |  | ||||||
|   <div class="row"> |   <div class="row"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <h3>Tests using this component:</h3> |       <h3>Tests using this component:</h3> | ||||||
|  |  | ||||||
|       {% if component.tests | length > 0 %} |       {% if component.tests | length > 0 %} | ||||||
|         <table class="u-full-width"> |         <table class="table table-hover table-responsive"> | ||||||
|           <thead> |           <thead class="table-light"> | ||||||
|             <tr> |             <tr> | ||||||
|               <th>Test title</th> |               <th>Test title</th> | ||||||
|               <th>Benchmarks</th> |               <th>Benchmarks</th> | ||||||
|   | |||||||
| @@ -5,7 +5,7 @@ | |||||||
| {% block content %} | {% block content %} | ||||||
|  |  | ||||||
|   <div class="row"> |   <div class="row"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <h1>Welcome to Colossus!</h1> |       <h1>Welcome to Colossus!</h1> | ||||||
|       <p>Using Colossus, you can easily organize your hardware benchmark results.</p> |       <p>Using Colossus, you can easily organize your hardware benchmark results.</p> | ||||||
|     </div> |     </div> | ||||||
| @@ -14,7 +14,7 @@ | |||||||
|   <hr> |   <hr> | ||||||
|  |  | ||||||
|   <div class="row"> |   <div class="row"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <p><a href="{{ url_for('test.list') }}">View current tests</a></p> |       <p><a href="{{ url_for('test.list') }}">View current tests</a></p> | ||||||
|       <p><a href="{{ url_for('test.add') }}">Add a new test</a></p> |       <p><a href="{{ url_for('test.add') }}">Add a new test</a></p> | ||||||
|     </div> |     </div> | ||||||
|   | |||||||
| @@ -4,15 +4,16 @@ | |||||||
|   <meta charset="UTF-8"> |   <meta charset="UTF-8"> | ||||||
|   <meta name="viewport" content="width=device-width, initial-scale=1.0"> |   <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||||||
|   <title>{% block title %}{% endblock %} | Colossus</title> |   <title>{% block title %}{% endblock %} | Colossus</title> | ||||||
|   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css"> |   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.7/css/bootstrap.min.css"> | ||||||
|   <link rel="stylesheet" href="/css/nardah.css"> |   <link rel="stylesheet" href="/css/nardah.css"> | ||||||
|   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> |   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> | ||||||
|  |   <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.7/js/bootstrap.min.js"></script> | ||||||
|   <script src="/js/bedabin.js"></script> |   <script src="/js/bedabin.js"></script> | ||||||
| </head> | </head> | ||||||
| <body> | <body> | ||||||
|   {% include 'partials/navbar.twig' %} |   {% include 'partials/navbar.twig' %} | ||||||
|  |  | ||||||
|   <div id="main-wrapper" class="container"> |   <div id="main-wrapper" class="container mb-5"> | ||||||
|     {% block content %}{% endblock %} |     {% block content %}{% endblock %} | ||||||
|   </div> |   </div> | ||||||
|  |  | ||||||
|   | |||||||
| @@ -1,6 +1,6 @@ | |||||||
| <footer id="main-footer" class="container"> | <footer id="main-footer" class="container"> | ||||||
| 	<div class="row"> | 	<div class="row"> | ||||||
| 		<div class="twelve columns"> | 		<div class="col-12"> | ||||||
| 			<p>Colossus version {{ APP_VERSION }}.</p> | 			<p>Colossus version {{ APP_VERSION }}.</p> | ||||||
| 			<p>Running PHP version {{ PHP_VERSION }}.</p> | 			<p>Running PHP version {{ PHP_VERSION }}.</p> | ||||||
| 		</div> | 		</div> | ||||||
|   | |||||||
| @@ -1,12 +1,29 @@ | |||||||
| <nav id="main-nav"> | <nav id="main-nav" class="navbar navbar-expand-md bg-body-secondary mb-3"> | ||||||
|  |   <div class="container-fluid"> | ||||||
|  |     <a class="navbar-brand mb-0 h1" href="#">Colossus</a> | ||||||
|  |  | ||||||
|   <ul class="nav-left"> |     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> | ||||||
|     <li class="site-logo">Colossus</li> |       <span class="navbar-toggler-icon"></span> | ||||||
|     <li><a href="{{ url_for('dashboard') }}">Dashboard</a></li> |     </button> | ||||||
|     <li><a href="{{ url_for('benchmark.list') }}">Benchmarks</a></li> |  | ||||||
|     <li><a href="{{ url_for('component.list') }}">Components</a></li> |  | ||||||
|     <li><a href="{{ url_for('test.list') }}">Test</a></li> |  | ||||||
|     <li><a href="{{ url_for('reports.generate') }}">Reports</a></li> |  | ||||||
|   </ul> |  | ||||||
|  |  | ||||||
|  |     <div class="collapse navbar-collapse" id="navbarSupportedContent"> | ||||||
|  |       <ul class="navbar-nav me-auto mb-2 mb-md-0"> | ||||||
|  |         <li class="nav-item"> | ||||||
|  |           <a class="nav-link" href="{{ url_for('dashboard') }}">Dashboard</a> | ||||||
|  |         </li> | ||||||
|  |         <li class="nav-item"> | ||||||
|  |           <a class="nav-link" href="{{ url_for('benchmark.list') }}">Benchmarks</a> | ||||||
|  |         </li> | ||||||
|  |         <li class="nav-item"> | ||||||
|  |           <a class="nav-link" href="{{ url_for('component.list') }}">Components</a> | ||||||
|  |         </li> | ||||||
|  |         <li class="nav-item"> | ||||||
|  |           <a class="nav-link" href="{{ url_for('test.list') }}">Test</a> | ||||||
|  |         </li> | ||||||
|  |         <li class="nav-item"> | ||||||
|  |           <a class="nav-link" href="{{ url_for('reports.generate') }}">Reports</a> | ||||||
|  |         </li> | ||||||
|  |       </ul> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
| </nav> | </nav> | ||||||
|   | |||||||
| @@ -4,58 +4,50 @@ | |||||||
|  |  | ||||||
| {% block content %} | {% block content %} | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row mb-4"> | ||||||
|   <div class="twelve columns"> |   <div class="col-12"> | ||||||
|     <h1>Add new test</h1> |     <h1>Add new test</h1> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|  |  | ||||||
| <div class="row"> | <div class="row"> | ||||||
|   <div class="twelve columns"> |   <div class="col-12"> | ||||||
|     <form action="{{ url_for('test.add') }}" method="POST" class="u-full-width"> |     <form action="{{ url_for('test.add') }}" method="POST"> | ||||||
|       <div class="row"> |       <div class="row mb-3"> | ||||||
|         <div class="six columns"> |         <div class="col-6"> | ||||||
|           <label> |           <label class="form-label" for="test_title">Test title:</label> | ||||||
|             Test title: |           <input id="test_title" class="form-control" type="text" name="test_title" placeholder="My new test"> | ||||||
|             <input class="u-full-width" type="text" name="test_title" placeholder="My new test"> |  | ||||||
|           </label> |  | ||||||
|         </div> |         </div> | ||||||
|  |  | ||||||
|         <div class="six columns"> |         <div class="col-6"> | ||||||
|           <label> |           <label class="form-label" for="test_component">Hardware component:</label> | ||||||
|             Hardware component: |           <select id="test_component" class="form-select" name="test_component"> | ||||||
|             <select class="u-full-width" name="test_component"> |             {% for c in components %} | ||||||
|               {% for c in components %} |               <option value="{{ c.id }}">{{ c.name }}</option> | ||||||
|                 <option value="{{ c.id }}">{{ c.name }}</option> |             {% endfor %} | ||||||
|               {% endfor %} |           </select> | ||||||
|             </select> |  | ||||||
|           </label> |  | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|  |  | ||||||
|       <div class="row"> |       <div class="row"> | ||||||
|         <div class="twelve columns"> |         <div class="col-12 mb-3"> | ||||||
|           <label> |           <label class="form-label" for="test_benchmarks">Benchmarks:</label> | ||||||
|             Benchmarks: |           <select id="test_benchmarks" class="form-select" name="test_benchmarks[]" multiple> | ||||||
|             <select id="benchmark-selector" class="u-full-width" name="test_benchmarks[]" multiple> |             {% for b in benchmarks %} | ||||||
|               {% for b in benchmarks %} |               <option value="{{ b.id }}">{{ b.name }}</option> | ||||||
|                 <option value="{{ b.id }}">{{ b.name }}</option> |             {% endfor %} | ||||||
|                 {% endfor %} |           </select> | ||||||
|             </select> |  | ||||||
|           </label> |  | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|  |  | ||||||
|       <div class="row"> |       <div class="row mb-3"> | ||||||
|         <div class="twelve columns"> |         <div class="col-12"> | ||||||
|           <label> |           <label class="form-label" for="test_description">Test description:</label> | ||||||
|             Test description: |           <textarea id="test_description" class="form-control" name="test_description" rows="8"></textarea> | ||||||
|             <textarea class="u-full-width" name="test_description" rows="8"></textarea> |  | ||||||
|           </label> |  | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|  |  | ||||||
|       <input class="button button-primary u-full-width" type="submit" value="Submit"> |       <input class="btn btn-primary" type="submit" value="Create Test"> | ||||||
|     </form> |     </form> | ||||||
|   </div> |   </div> | ||||||
| </div> | </div> | ||||||
|   | |||||||
| @@ -6,8 +6,8 @@ | |||||||
|   <p><a href="{{ url_for('test.add') }}">Create new test</a></p> |   <p><a href="{{ url_for('test.add') }}">Create new test</a></p> | ||||||
|  |  | ||||||
|   {% if tests | length > 0 %} |   {% if tests | length > 0 %} | ||||||
|     <table class="u-full-width"> |     <table class="table table-hover table-responsive"> | ||||||
|       <thead> |       <thead class="table-light"> | ||||||
|         <tr> |         <tr> | ||||||
|           <th>Test title</th> |           <th>Test title</th> | ||||||
|           <th>Hardware</th> |           <th>Hardware</th> | ||||||
|   | |||||||
| @@ -3,39 +3,39 @@ | |||||||
| {% block title %}Test: {{ test.title }}{% endblock %} | {% block title %}Test: {{ test.title }}{% endblock %} | ||||||
|  |  | ||||||
| {% block content %} | {% block content %} | ||||||
|   <div class="row"> |   <div class="row mb-3"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <h1>{{ test.title }}</h1> |       <h1>{{ test.title }}</h1> | ||||||
|       <p>{{ test.description }}</p> |       <p>{{ test.description }}</p> | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
|  |  | ||||||
|   <hr> |   <hr class="mb-4"> | ||||||
|  |  | ||||||
|   <div class="row"> |   <div class="row mb-4"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <form id="result-form" class="u-full-width" action="{{ url_for('api.resultAdd') }}" method="POST"> |       <form id="result-form" action="{{ url_for('api.resultAdd') }}" method="POST"> | ||||||
|         <div class="row"> |         <div class="row"> | ||||||
|           <div class="four columns"> |           <div class="col-4"> | ||||||
|             <select class="u-full-width" name="result_benchmark"> |             <select class="form-select" name="result_benchmark"> | ||||||
|               {% for b in test.benchmarks %} |               {% for b in test.benchmarks %} | ||||||
|                 <option value="{{ b.id }}">{{ b.name }}</option> |                 <option value="{{ b.id }}">{{ b.name }}</option> | ||||||
|               {% endfor %} |               {% endfor %} | ||||||
|             </select> |             </select> | ||||||
|           </div> |           </div> | ||||||
|  |  | ||||||
|           <div class="two columns"> |           <div class="col-2"> | ||||||
|             <input class="u-full-width" type="number" step="0.01" name="result_avg" placeholder="0.0"> |             <input class="form-control" type="number" step="0.01" name="result_avg" placeholder="0.0"> | ||||||
|           </div> |           </div> | ||||||
|           <div class="two columns"> |           <div class="col-2"> | ||||||
|             <input class="u-full-width" type="number" step="0.01" name="result_min" placeholder="0.0"> |             <input class="form-control" type="number" step="0.01" name="result_min" placeholder="0.0"> | ||||||
|           </div> |           </div> | ||||||
|           <div class="two columns"> |           <div class="col-2"> | ||||||
|             <input class="u-full-width" type="number" step="0.01" name="result_max" placeholder="0.0"> |             <input class="form-control" type="number" step="0.01" name="result_max" placeholder="0.0"> | ||||||
|           </div> |           </div> | ||||||
|  |  | ||||||
|           <div class="two columns"> |           <div class="col-2"> | ||||||
|             <button class="button-primary u-full-width" type="submit" name="button">Submit</button> |             <button class="btn btn-primary w-100" type="submit" name="button">Submit Result</button> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
|  |  | ||||||
| @@ -45,14 +45,14 @@ | |||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
|  |  | ||||||
|   <hr> |   <hr class="mb-4"> | ||||||
|  |  | ||||||
|   <div class="row"> |   <div class="row"> | ||||||
|     <div class="twelve columns"> |     <div class="col-12"> | ||||||
|       <h3>Benchmark results:</h3> |       <h3 class="mb-3">Benchmark results:</h3> | ||||||
|  |  | ||||||
|       <table id="results-table" class="u-full-width" data-test-id="{{ test.id }}"> |       <table id="results-table" class="table table-hover table-responsive" data-test-id="{{ test.id }}"> | ||||||
|         <thead> |         <thead class="table-light"> | ||||||
|           <tr> |           <tr> | ||||||
|             <th>Benchmark</th> |             <th>Benchmark</th> | ||||||
|             <th>Scoring</th> |             <th>Scoring</th> | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user