mirror of
				https://github.com/fooflington/selfdefined.git
				synced 2025-10-31 06:08:33 +00:00 
			
		
		
		
	🌈 Organise colors with vars only
This commit is contained in:
		
							
								
								
									
										11
									
								
								assets/css/_sass/_colours.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								assets/css/_sass/_colours.scss
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,11 @@ | ||||
| $primary-color: hsl(0, 100%, 50%); | ||||
| $secondary-color: hsl(120, 100%, 25%); | ||||
|  | ||||
| $dark-red: hsl(0, 100%, 32.2%); | ||||
| $pink: hsl(349.5, 100%, 87.6%);  | ||||
| $black: hsl(0, 0%, 13%); | ||||
| $white: hsl(0, 0%, 100%); | ||||
|  | ||||
| $dark-grey: hsl(0, 0%, 31%); | ||||
| $mid-grey: hsl(0, 0%, 46.3%); // the lightest shade of grey you can get away with, #a11y | ||||
| $light-grey: hsl(0, 0%, 93.3%); // for backgrounds only | ||||
| @@ -3,6 +3,7 @@ | ||||
|  | ||||
| @import '~prism-themes/themes/prism-a11y-dark'; | ||||
| @import '_sass/functions'; | ||||
| @import '_sass/colours' | ||||
|  | ||||
| $browser-context: 16; | ||||
|  | ||||
| @@ -11,9 +12,9 @@ pre[class*='language-'] { | ||||
| } | ||||
|  | ||||
| code { | ||||
|   background-color: #333333; | ||||
|   border: pxToRem(1) solid black; | ||||
|   color: white; | ||||
|   background-color: $dark-grey; | ||||
|   border: 1px solid $black; | ||||
|   color: $white; | ||||
|   padding: 0.15em; | ||||
|   border-radius: 0.25em; | ||||
|   font-size: 95%; | ||||
| @@ -34,18 +35,6 @@ code { | ||||
|   --l-gap: 1rem; | ||||
| } | ||||
|  | ||||
| $primary-color: #0e4bff; //cobalt blue is so pretty// | ||||
| $secondary-color: #f3f315; // | ||||
|  | ||||
| $black: #222222; | ||||
| $white: #ffffff; | ||||
| $pistachio: #e5ffe5; | ||||
| $yellow: #ffff00; | ||||
|  | ||||
| $dark-grey: #4f4f4f; | ||||
| $mid-grey: #767676; // the lightest shade of grey you can get away with, #a11y | ||||
| $light-grey: #eeeeee; // for backgrounds only | ||||
|  | ||||
| // TYPOGRAPHY // | ||||
| $sans-serif: monotype-grotesque, 'Lucida Sans', sans-serif; | ||||
| $serif: orpheuspro, Palatino, Times, serif; | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 tatianamac
					tatianamac