aboutsummaryrefslogtreecommitdiff
path: root/assets/scss/home.scss
diff options
context:
space:
mode:
authorYour Name <you@example.com>2018-01-02 13:38:27 +0100
committerYour Name <you@example.com>2018-01-02 13:38:27 +0100
commitc2cb20f53b015388c8a84c824111fe844ce318ad (patch)
tree8ee3c35cbfb483c27f9dcb1e98780106270377d2 /assets/scss/home.scss
parentb50c7ddaca113317720c2c929cb5d1bfbb5ea2b0 (diff)
downloadlesoiseaux.io-c2cb20f53b015388c8a84c824111fe844ce318ad.tar.gz
Add sinewaves to home page
Diffstat (limited to 'assets/scss/home.scss')
-rw-r--r--assets/scss/home.scss64
1 files changed, 47 insertions, 17 deletions
diff --git a/assets/scss/home.scss b/assets/scss/home.scss
index 7a1a0e3..d20d5a3 100644
--- a/assets/scss/home.scss
+++ b/assets/scss/home.scss
@@ -425,25 +425,40 @@ body > footer {
transform: rotate(-4deg);
margin: 0 -5vw 0 -2vw;
left: 0;
- }
- .media #gfx h3 {
- transform: rotate(4deg) translateX(1vw);
- font-size: 5rem;
- }
- .media #gfx:hover {
- background: rgba(191, 138, 112, 0.9);
- transform: rotate(0);
- margin: 0;
- p, h4 {
- display: none;
+ h3 {
+ transform: rotate(4deg) translateX(1vw);
+ font-size: 5rem;
+ }
+
+ svg {
+ position: absolute;
+ top: 0;
+ left: 0;
+ opacity: 0.1;
+ }
+
+ &:hover {
+ background: rgba(191, 138, 112, 0.9);
+ transform: rotate(0);
+ margin: 0;
+
+ p, h4 {
+ display: none;
+ }
+
+ h3 {
+ transform: rotate(0) translateX(0) translateY(-4rem);
+ }
+
+ svg {
+ opacity: 0.9;
+ }
+
+ + #txt {
+ margin-left: -3vw;
+ }
}
- }
- .media #gfx:hover h3 {
- transform: rotate(0) translateX(0) translateY(-4rem);
- }
- .media #gfx:hover + #txt {
- margin-left: -3vw;
}
.media #txt {
@@ -579,3 +594,18 @@ body > footer {
}
}
+
+.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);
+ }
+}