diff options
Diffstat (limited to 'assets/scss/_gfx.scss')
| -rw-r--r-- | assets/scss/_gfx.scss | 64 |
1 files changed, 57 insertions, 7 deletions
diff --git a/assets/scss/_gfx.scss b/assets/scss/_gfx.scss index 43003f9..e344d5a 100644 --- a/assets/scss/_gfx.scss +++ b/assets/scss/_gfx.scss @@ -1,13 +1,63 @@ body.gfx { > main > article { - background: $bg-gfx-on; + background: $bg-gfx-on; } > aside { - &:hover, &:focus { - background-color: $bg-gfx-on; - nav ul li:first-child { - background: $bg-gfx-on; - } - } + &:hover, &:focus { + background-color: $bg-gfx-on; + nav ul li:first-child { + background: $bg-gfx-on; + } + } + } + + #krto img { + float: left; + padding-right: 2rem; + margin-left: -6rem; + } + + #cw { + clear: both; + position: relative; + z-index: 0; + a { + z-index: 200; + } + #gfx { + position: absolute; + margin-top: -1.5rem; + z-index: -1; + opacity: 1; + height: 22.5rem; + width: 72rem; + animation: fade-in 1s linear; + + svg { + position: relative; + margin-left: -7rem; /* Something is wrong with sine.js and reload */ + height: 100%; + } + } + + &:hover #gfx { + opacity: 0.2; + animation: fade-out 1s linear; + } + } + + .sinewave{ + &.w0 { + fill: rgba(240, 40, 142, 0.5); + } + &.w1 { + fill: rgba(140, 140, 42, 0.5); + } + &.w2 { + fill: rgba(240, 142, 1, 0.5); + } + &.w3 { + fill: rgba(0, 110, 12, 0.5); + } } } |