Sara/saragerretsen.nl
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

tweaks to styling to make for a better user experience

Browse source
This commit is contained in:
SG101 2022-10-09 22:46:18 +02:00
parent 6f6dfabbe8
commit 742b9575ad
1 changed files with 46 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

70
shared/style.css
View file

@ -7,26 +7,37 @@ body {
max-width: 1040px;
margin-left: auto;
margin-right: auto;
padding-right: 30px;
padding-right: auto;
padding-bottom: 50px;
}
h1 {
font-size: 300%;
font-size: 3.5em;
}
h2 {
font-size: 200%;
font-size: 2.5em;
margin-bottom: 1px;
margin-top: 50px;
}
h2.inline {
margin: 0px;
}
h3 {
margin-top: 50px;
}
a.internal {
text-decoration: none;
color: black;
}
a:hover {
color: #99FF;
}
section {
display: block;
padding-top: 10px;
@ -35,6 +46,11 @@ section {
padding-right: 20px;
}
p.intro-paragraph {
color: #999F;
font-size: 1.25em;
}
div {
display: block;
}
@ -44,15 +60,6 @@ div.info {
color: #222F;
font-style: italic;
}
div.info-old {
background-color: #0000000C;
margin-bottom: 10px;
border-radius: 10px;
padding-top: 25px;
padding-bottom: 25px;
padding-left: 40px;
padding-right: 40px;
}
.embed {
background-color: #000F;
@ -74,8 +81,8 @@ div.info-old {
color: white;
grid-template-columns: 125px auto;
vertical-align: center;
max-width: 650px;
width: 100%;
max-width: 660px;
width: 94%;
margin-left: 0px;
background-color: #445F;
border-color: #111F;
@ -84,6 +91,11 @@ div.info-old {
padding: 20px;
}
.github-block > h2 {
margin-top: auto;
margin-bottom: auto;
}
div.github-logo {
background-color: #0000;
background-image: url("../assets/octicon.png");
@ -114,15 +126,21 @@ div.github-logo {
margin-left: 30px;
}
.project-grid {
display: grid;
grid-gap: 20px;
grid-template-columns: 50% 50%;
.site-header > ul > li > a > h2 {
text-decoration: underline;
font-size: 175%;
padding: 5px 25px;
}
.site-header > ul > li > a > h2:hover {
background: #DDF8;
color: #334F;
border-radius: 10px;
}
.personal-info-grid {
display: grid;
grid-gap: 20px;
gap: 20px;
grid-template-columns: 80% auto;
}
@ -133,10 +151,14 @@ div.github-logo {
background-repeat: no-repeat;
}
.experience-grid > div {
display: inline-block;
margin-left: 10px;
margin-right: 10px;
.experience-grid {
display: grid;
grid-template-columns: auto auto;
gap: 40px;
}
p.experience-grid-time {
color: #999F;
}
*[indented] {
@ -145,7 +167,6 @@ div.github-logo {
.code-box {
background-color: #2C2C3CFF;
padding: 10px;
border-radius: 10px;
overflow: visible;
margin-bottom: 3px;
@ -154,4 +175,5 @@ div.github-logo {
.code-content {
overflow-y: hidden;
overflow-x: scroll;
padding: 10px;
}