diff options
author | Matthew Lemon <y@yulqen.org> | 2024-03-22 11:19:15 +0000 |
---|---|---|
committer | Matthew Lemon <y@yulqen.org> | 2024-03-22 11:19:15 +0000 |
commit | 85f2b54a2985cf0f56a052b8cb37f1b0c3954e02 (patch) | |
tree | a031f1975219cdc396b2dad19e92c3fc28401f52 | |
parent | c0d0e2e4daeb1a4165034b2c351226a3f592f5a5 (diff) |
Adds rainbow header
-rw-r--r-- | index.html | 3 | ||||
-rw-r--r-- | style.css | 48 |
2 files changed, 47 insertions, 4 deletions
@@ -41,7 +41,6 @@ <div class="cell"> <h2>Paper based resources</h2> - <hr class="divider"> <div class="inner-grid_1"> <div> <img src="img/Springthings.jpg" alt=""/> @@ -68,7 +67,6 @@ <div class="cell"> <h2>Hand sewn resources</h2> - <hr class="divider"> <div class="inner-grid_1"> <div> <img src="img/TVHC Resources.jpg" alt=""/> @@ -95,7 +93,6 @@ <div class="cell"> <h2>Collaged resources</h2> - <hr class="divider"> <div class="inner-grid_1"> <div> <img src="img/RhinoRockHyraxRr.jpg" alt=""/> @@ -24,8 +24,54 @@ h1 { } h2 { - color: #4e8273; + /* color: #4e8273; */ + color: white; font-size: 1.8rem; + margin-right: 20px; + padding-left: 10px; + background-size: 100% 50px; + background-repeat: no-repeat; + border-bottom: 10px solid #E4E5E7; + overflow: auto; + background-image: -webkit-linear-gradient(left, + hsl(210, 30%, 20%), hsl(210, 30%, 20%) 25%, /* #34495e */ + hsl(280, 30%, 40%) 25%, hsl(280, 30%, 40%) 35%, /* #9b59b6 */ + hsl(210, 50%, 40%) 35%, hsl(210, 50%, 40%) 45%, /* #3498db */ + hsl(120, 40%, 35%) 45%, hsl(120, 40%, 35%) 55%, /* #62cb31 */ + hsl(44, 80%, 40%) 55%, hsl(44, 80%, 40%) 65%, /* #ffb606 */ + hsl(30, 80%, 40%) 65%, hsl(30, 80%, 40%) 75%, /* #e67e22 */ + hsl(0, 50%, 40%) 85%, hsl(0, 50%, 40%) 85%, /* #e74c3c */ + hsl(5, 50%, 35%) 85%, hsl(5, 50%, 35%) 100%); /* #c0392b */ + + background-image: -moz-linear-gradient(left, + hsl(210, 30%, 20%), hsl(210, 30%, 20%) 25%, /* #34495e */ + hsl(280, 30%, 40%) 25%, hsl(280, 30%, 40%) 35%, /* #9b59b6 */ + hsl(210, 50%, 40%) 35%, hsl(210, 50%, 40%) 45%, /* #3498db */ + hsl(120, 40%, 35%) 45%, hsl(120, 40%, 35%) 55%, /* #62cb31 */ + hsl(44, 80%, 40%) 55%, hsl(44, 80%, 40%) 65%, /* #ffb606 */ + hsl(30, 80%, 40%) 65%, hsl(30, 80%, 40%) 75%, /* #e67e22 */ + hsl(0, 50%, 40%) 85%, hsl(0, 50%, 40%) 85%, /* #e74c3c */ + hsl(5, 50%, 35%) 85%, hsl(5, 50%, 35%) 100%); /* #c0392b */ + + background-image: -ms-linear-gradient(left, + hsl(210, 30%, 20%), hsl(210, 30%, 20%) 25%, /* #34495e */ + hsl(280, 30%, 40%) 25%, hsl(280, 30%, 40%) 35%, /* #9b59b6 */ + hsl(210, 50%, 40%) 35%, hsl(210, 50%, 40%) 45%, /* #3498db */ + hsl(120, 40%, 35%) 45%, hsl(120, 40%, 35%) 55%, /* #62cb31 */ + hsl(44, 80%, 40%) 55%, hsl(44, 80%, 40%) 65%, /* #ffb606 */ + hsl(30, 80%, 40%) 65%, hsl(30, 80%, 40%) 75%, /* #e67e22 */ + hsl(0, 50%, 40%) 85%, hsl(0, 50%, 40%) 85%, /* #e74c3c */ + hsl(5, 50%, 35%) 85%, hsl(5, 50%, 35%) 100%); /* #c0392b */ + + background-image: linear-gradient(to right, + hsl(210, 100%, 20%), hsl(210, 30%, 20%) 25%, /* #34495e */ + hsl(280, 30%, 40%) 25%, hsl(280, 30%, 40%) 35%, /* #9b59b6 */ + hsl(210, 50%, 40%) 35%, hsl(210, 50%, 40%) 45%, /* #3498db */ + hsl(120, 40%, 35%) 45%, hsl(120, 40%, 35%) 55%, /* #62cb31 */ + hsl(44, 80%, 40%) 55%, hsl(44, 80%, 40%) 65%, /* #ffb606 */ + hsl(30, 80%, 40%) 65%, hsl(30, 80%, 40%) 75%, /* #e67e22 */ + hsl(0, 50%, 40%) 85%, hsl(0, 50%, 40%) 85%, /* #e74c3c */ + hsl(5, 50%, 35%) 85%, hsl(5, 50%, 35%) 100%); /* #c0392b */ } .container { |