mirror of
https://github.com/aurora-dot/pastel.codes.git
synced 2024-11-24 09:02:22 +00:00
Made code shorter & work, started on main content
This commit is contained in:
parent
0651e89219
commit
a8e5cf3015
@ -6,8 +6,28 @@
|
||||
font-family: 'Grifter';
|
||||
src: url("../fonts/GRIFTER.otf") format("opentype"); }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Gilroy';
|
||||
src: url("../fonts/Gilroy-ExtraBold.otf") format("opentype"); }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Apercu Mono';
|
||||
src: url("../fonts/ApercuMono.ttf") format("truetype"); }
|
||||
|
||||
html, body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: white; }
|
||||
|
||||
body {
|
||||
background-color: #002234; }
|
||||
background-color: #002234;
|
||||
color: #CC7A98; }
|
||||
|
||||
h1 {
|
||||
font-family: "Gilroy"; }
|
||||
|
||||
p {
|
||||
font-family: "Apercu Mono"; }
|
||||
|
||||
article {
|
||||
min-height: 100%;
|
||||
@ -15,13 +35,32 @@ article {
|
||||
grid-template-rows: auto 1fr auto;
|
||||
grid-template-columns: 100%; }
|
||||
|
||||
header nav a span {
|
||||
font-size: 3vh;
|
||||
font-family: 'Titling Gothic FB';
|
||||
color: #CC7A98; }
|
||||
header nav a span span {
|
||||
font-size: 3.2vh;
|
||||
font-family: 'Grifter'; }
|
||||
|
||||
header nav #navbarSupportedContent23 ul {
|
||||
background-color: #CC7A98; }
|
||||
header nav #navbarSupportedContent23 ul li {
|
||||
text-align: center; }
|
||||
header nav #navbarSupportedContent23 ul li a {
|
||||
color: #002234; }
|
||||
|
||||
main {
|
||||
padding: 0.5rem; }
|
||||
main h1 span {
|
||||
text-decoration: underline #CC7A98; }
|
||||
main p {
|
||||
margin-bottom: 5px; }
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
padding-bottom: 0.5rem; }
|
||||
|
||||
/* Icon 1 */
|
||||
.ham {
|
||||
width: 30px;
|
||||
height: 20px;
|
||||
@ -52,9 +91,7 @@ footer {
|
||||
-webkit-transition: .25s ease-in-out;
|
||||
-moz-transition: .25s ease-in-out;
|
||||
-o-transition: .25s ease-in-out;
|
||||
transition: .25s ease-in-out; }
|
||||
|
||||
.ham span {
|
||||
transition: .25s ease-in-out;
|
||||
background: #CC7A98; }
|
||||
|
||||
.ham span:nth-child(1) {
|
||||
@ -88,16 +125,4 @@ footer {
|
||||
width: 0%;
|
||||
left: 50%; }
|
||||
|
||||
header {
|
||||
padding-top: 0.5rem;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem; }
|
||||
header nav a p {
|
||||
font-size: 3vh;
|
||||
font-family: 'Titling Gothic FB';
|
||||
color: #CC7A98; }
|
||||
header nav a p span {
|
||||
font-size: 3.2vh;
|
||||
font-family: 'Grifter'; }
|
||||
|
||||
/*# sourceMappingURL=style.css.map */
|
@ -9,8 +9,28 @@ $black: #002234
|
||||
font-family: 'Grifter'
|
||||
src: url("../fonts/GRIFTER.otf") format('opentype')
|
||||
|
||||
@font-face
|
||||
font-family: 'Gilroy'
|
||||
src: url("../fonts/Gilroy-ExtraBold.otf") format('opentype')
|
||||
|
||||
@font-face
|
||||
font-family: 'Apercu Mono'
|
||||
src: url("../fonts/ApercuMono.ttf") format('truetype')
|
||||
|
||||
html, body
|
||||
width: 100%
|
||||
height: 100%
|
||||
color: white
|
||||
|
||||
body
|
||||
background-color: $black
|
||||
color: $pink
|
||||
|
||||
h1
|
||||
font-family: "Gilroy"
|
||||
|
||||
p
|
||||
font-family: "Apercu Mono"
|
||||
|
||||
article
|
||||
min-height: 100%
|
||||
@ -18,23 +38,39 @@ article
|
||||
grid-template-rows: auto 1fr auto
|
||||
grid-template-columns: 100%
|
||||
|
||||
header
|
||||
nav
|
||||
a
|
||||
span
|
||||
font-size: 3vh
|
||||
font-family: 'Titling Gothic FB'
|
||||
color: $pink
|
||||
span
|
||||
font-size: 3.2vh
|
||||
font-family: 'Grifter'
|
||||
|
||||
#navbarSupportedContent23
|
||||
ul
|
||||
background-color: $pink
|
||||
li
|
||||
text-align: center
|
||||
a
|
||||
color: $black
|
||||
|
||||
main
|
||||
padding: 0.5rem
|
||||
h1
|
||||
span
|
||||
text-decoration: underline $pink
|
||||
p
|
||||
margin-bottom: 5px
|
||||
|
||||
|
||||
footer
|
||||
text-align: center
|
||||
padding-bottom: 0.5rem
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// nav stuff
|
||||
/* Icon 1 */
|
||||
// Nav stuff
|
||||
|
||||
.ham
|
||||
width: 30px
|
||||
@ -51,7 +87,6 @@ footer
|
||||
transition: .5s ease-in-out
|
||||
cursor: pointer
|
||||
|
||||
|
||||
.ham span
|
||||
display: block
|
||||
position: absolute
|
||||
@ -68,60 +103,35 @@ footer
|
||||
-moz-transition: .25s ease-in-out
|
||||
-o-transition: .25s ease-in-out
|
||||
transition: .25s ease-in-out
|
||||
|
||||
|
||||
.ham span
|
||||
background: $pink
|
||||
|
||||
.ham span:nth-child(1)
|
||||
top: 0px
|
||||
|
||||
|
||||
.ham span:nth-child(2), .ham span:nth-child(3)
|
||||
top: 10px
|
||||
|
||||
|
||||
.ham span:nth-child(4)
|
||||
top: 20px
|
||||
|
||||
|
||||
.ham.open span:nth-child(1)
|
||||
top: 11px
|
||||
width: 0%
|
||||
left: 50%
|
||||
|
||||
|
||||
.ham.open span:nth-child(2)
|
||||
-webkit-transform: rotate(45deg)
|
||||
-moz-transform: rotate(45deg)
|
||||
-o-transform: rotate(45deg)
|
||||
transform: rotate(45deg)
|
||||
|
||||
|
||||
.ham.open span:nth-child(3)
|
||||
-webkit-transform: rotate(-45deg)
|
||||
-moz-transform: rotate(-45deg)
|
||||
-o-transform: rotate(-45deg)
|
||||
transform: rotate(-45deg)
|
||||
|
||||
|
||||
.ham.open span:nth-child(4)
|
||||
top: 11px
|
||||
width: 0%
|
||||
left: 50%
|
||||
|
||||
|
||||
header
|
||||
padding-top: 0.5rem
|
||||
padding-left: 1rem
|
||||
padding-right: 1rem
|
||||
nav
|
||||
a
|
||||
p
|
||||
font-size: 3vh
|
||||
font-family: 'Titling Gothic FB'
|
||||
color: $pink
|
||||
|
||||
span
|
||||
font-size: 3.2vh
|
||||
font-family: 'Grifter'
|
||||
|
@ -4,13 +4,13 @@ block content
|
||||
article
|
||||
header
|
||||
// Navbar
|
||||
nav.navbar.mb-4
|
||||
nav.navbar
|
||||
// Navbar brand
|
||||
a.navbar-brand(href='#')
|
||||
p ESTR
|
||||
span ESTR
|
||||
span //
|
||||
// Collapse button
|
||||
button.navbar-toggler.ham-button(type='button' data-toggle='collapse' data-target='#navbarSupportedContent23' aria-controls='navbarSupportedContent23' aria-expanded='false' aria-label='Toggle navigation')
|
||||
button.navbar-toggler.ham-button(type='button' data-toggle='collapse' data-target='#navbarSupportedContent23' aria-controls='navbarSupportedContent23' aria-expanded='false' aria-label='Toggle navigation' style='cursor: pointer;')
|
||||
.ham
|
||||
span
|
||||
span
|
||||
@ -25,23 +25,31 @@ block content
|
||||
| Home
|
||||
span.sr-only (current)
|
||||
li.nav-item
|
||||
a.nav-link(href='#') Features
|
||||
a.nav-link(href='#') About
|
||||
li.nav-item
|
||||
a.nav-link(href='#') Pricing
|
||||
// Links
|
||||
// Collapsible content
|
||||
|
||||
a.nav-link(href='#') CV
|
||||
li.nav-item
|
||||
a.nav-link(href='#') Projects
|
||||
li.nav-item
|
||||
a.nav-link(href='#') Blog
|
||||
li.nav-item
|
||||
a.nav-link(href='#') Contact
|
||||
|
||||
main
|
||||
// left hand text
|
||||
.home-content
|
||||
.left
|
||||
h1
|
||||
| Hello,
|
||||
br
|
||||
| I'm Esther
|
||||
| I'm
|
||||
|
|
||||
span Esther
|
||||
p I'm a Programmer & Designer from the UK.
|
||||
p I like to make stuff
|
||||
|
||||
// The pink right block images and stuff here
|
||||
p I like to make stuff.
|
||||
.right
|
||||
.pink-box
|
||||
//icons
|
||||
|
||||
footer
|
||||
p piss
|
||||
|
Loading…
Reference in New Issue
Block a user