| 
									
										
										
										
											2018-05-01 17:05:36 -07:00
										 |  |  | <a class="settings-nav-item {className}" | 
					
						
							|  |  |  |    aria-label={ariaLabel} | 
					
						
							|  |  |  |    {href} > | 
					
						
							|  |  |  |   {label} | 
					
						
							| 
									
										
										
										
											2018-01-13 10:53:25 -08:00
										 |  |  | </a> | 
					
						
							|  |  |  | <style> | 
					
						
							| 
									
										
										
										
											2018-01-20 12:35:38 -08:00
										 |  |  |   a.settings-nav-item { | 
					
						
							| 
									
										
										
										
											2018-01-13 10:53:25 -08:00
										 |  |  |     font-size: 1.2em; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2018-01-20 12:35:38 -08:00
										 |  |  |   a.settings-nav-item.selected { | 
					
						
							| 
									
										
										
										
											2018-01-13 10:53:25 -08:00
										 |  |  |     font-weight: 600; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | </style> | 
					
						
							|  |  |  | <script> | 
					
						
							|  |  |  |   export default { | 
					
						
							| 
									
										
										
										
											2018-04-29 18:41:56 -07:00
										 |  |  |     computed: { | 
					
						
							| 
									
										
										
										
											2018-05-01 17:05:36 -07:00
										 |  |  |       className: ({ page, name }) => page === name ? 'selected' : '', | 
					
						
							|  |  |  |       ariaLabel: ({ page, name, label }) => page === name ? `${label} (current page)` : label | 
					
						
							| 
									
										
										
										
											2018-01-13 10:53:25 -08:00
										 |  |  |     } | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | </script> |