forked from MountainLinuxClub/website
				
			
		
			
				
	
	
		
			69 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			SCSS
		
	
	
	
			
		
		
	
	
			69 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			SCSS
		
	
	
	
| @import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@300&display=swap');
 | |
| 
 | |
| $sidebar_width: 15%;
 | |
| $sidebar_background: rgba(45, 45, 45, 1);
 | |
| $body_background: rgba(30, 30, 30, 1);
 | |
| $content_background: rgb(35, 35, 35);
 | |
| 
 | |
| body {
 | |
|     margin: 0;
 | |
|     font-family: 'Fira Code', monospace;
 | |
| 
 | |
|     // Sidebar
 | |
|     nav {
 | |
|         height: 100%;
 | |
|         position: fixed;
 | |
|         width: $sidebar_width;
 | |
|         background: $sidebar_background;
 | |
|         padding-top: 32px;
 | |
|         padding-bottom: 16px;
 | |
|         border-right-style: solid;
 | |
|         border-width: 2px;
 | |
|         border-color: black;
 | |
|         color: white;
 | |
| 
 | |
|         div {
 | |
|             padding: 0 16px 0 16px;
 | |
|         }
 | |
| 
 | |
|         img { 
 | |
|             width: auto;
 | |
|         }
 | |
|         
 | |
|         // Refrence to the tab interface
 | |
|         .tabs {
 | |
|             a {
 | |
|                 text-decoration: none;
 | |
|                 color: rgb(190, 190, 190);
 | |
| 
 | |
|                 &:hover {
 | |
|                     color: white;
 | |
|                     background-color: rgba(40, 40, 40, 0.5);
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     main {
 | |
|         height: 100%;
 | |
|         box-sizing: border-box;
 | |
|         margin-left: $sidebar_width;
 | |
|         background: $body_background;
 | |
|         padding-top: 32px;
 | |
|         color: white;
 | |
| 
 | |
|         article {
 | |
|             margin: auto;
 | |
|             border: 1px solid white;
 | |
|             border-radius: 3px;
 | |
|             padding: 13px;
 | |
|             max-width: 1500px;
 | |
|             background: $content_background;
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| @media screen and (max-width: 1000px) {
 | |
|     @import "mobile.scss";
 | |
| }
 |