diff --git a/TODO.md b/TODO.md index eb52407..85a4d4f 100644 --- a/TODO.md +++ b/TODO.md @@ -1,7 +1,4 @@ ## TODO -* Galleries - thumbs on desktop - way to make them stand out aginst the image -* Home - tagline text needs to stand out more on light background areas - - shadow-deco maybe? * General - titles - shadow looks untidy before title transitions in - make part of transition? * General - sort things by sort_order diff --git a/assets/scss/style.scss b/assets/scss/style.scss index 901fe36..e6d5eb8 100644 --- a/assets/scss/style.scss +++ b/assets/scss/style.scss @@ -6,6 +6,13 @@ color: $color__neutral-900; text-align: center; + transition: opacity 3s 2s; + opacity: 0; + + @at-root .is-mounted & { + opacity: 1; + } + @media (min-width: $bp__layout) { font-size: 3.7vw; text-align: left; diff --git a/pages/index.vue b/pages/index.vue index 33de293..391098c 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -140,7 +140,6 @@ $padding: 1rem; .background-overlay { $color: $color__neutral-100; - // $color: red; background-color: rgba($color, .4); background: linear-gradient( @@ -165,9 +164,14 @@ $padding: 1rem; linear-gradient( to right, rgba($color, .4), - rgba($color, 0) 10%, - rgba($color, 0) 90%, + rgba($color, 0) 20%, + rgba($color, 0) 80%, rgba($color, .4) + ), + radial-gradient( + at 100% 100%, + rgba($color, .4) 0, + rgba($color, 0) 40% ); }