diff --git a/shrimpjects.js b/shrimpjects.js index b45acf4..b515fbc 100644 --- a/shrimpjects.js +++ b/shrimpjects.js @@ -22,7 +22,7 @@ export const projects = {
One week to make a game and this is what we made! A game based on the movie Hackers.
Your goal is to hack the Gibson computer and collect the garbage file. Which will then in turn let you HACK THE PLANET!
- Try it out!`, + `, images: { left: {src:"htp1.png",alt:"visual puzzle with different colours"}, right: {src:"htp2.png",alt:"the player character standing surrounded by various text characters"}, diff --git a/shrimpy-styles.css b/shrimpy-styles.css index 7b769ef..82dc674 100644 --- a/shrimpy-styles.css +++ b/shrimpy-styles.css @@ -92,7 +92,7 @@ body { flex-basis: 32%; } -#shrimp-project-content .upper div{ +#shrimp-project-content .upper > div{ background-color:var(--tangerine-dream-shrimp); padding: 0 10px; } @@ -114,6 +114,12 @@ body { #shrimp-gif > * { width:50%; } +#project-content{ + display:flex; + flex-flow:column; + margin: 0 auto; + +} @media screen and (orientation: portrait) { #shrimp-project-content .upper{ @@ -128,4 +134,28 @@ body { .bold { font-weight: bold; -} \ No newline at end of file +} + +/* buttons */ + +.cta-wrapper{ + margin-top:16px; + background-color: var(--space-shrimp-blue); + border-radius: 5px; + padding:15px; + width:fit-content; +} +.cta-wrapper .cta { + text-decoration: none; + border-right: 2px solid var(--ashy-shrimp); + color: var(--ashy-shrimp); + font-size: 24px; + animation: blink-border .75s step-end infinite; +} + +@keyframes blink-border { + from, to { border-color: transparent } + 50% { border-color: var(--ashy-shrimp); } +} + +/* end buttons */ \ No newline at end of file