#divtober 12: Glass

_pug/index.pug

@@ -7,6 +7,10 @@ block vars
 
 block content
 
+ // 12 Oct 2023 - #divtober
+ .entry.wide#glass
+ div
+
  // 11 Oct 2023 - #divtober
  .entry#bones
  div

_styl/entries/glass.styl

@@ -0,0 +1,222 @@
+/*-----------------------------
+
+Glass
+
+-----------------------------*/
+
+#glass
+ background-color: darken(indigo,5)
+
+ div
+ box-sizing: border-box
+ width: 12em
+ height: 17em
+ margin-left: -(@width/2)
+ margin-top: -(@height/2)
+ background: radial-gradient(circle at 50% 100%, black(0) 64.5%,
+ black 64.7%,
+ black 67%,
+ black(0) 67.2%) 50% 0 / 100% 35.5%,
+ linear-gradient(black, black) 2.5% 100.2% / 1.7% 65.5%,
+ linear-gradient(black, black) 97.6% 100.2% / 1.7% 65.5%,
+ linear-gradient(black, black) 50% 98.2% / 94% 1.4%,
+ linear-gradient(black, black) 0% 85% / 3% 1.4%,
+ linear-gradient(45deg, gold, orange) 0 100.2% / 3% 15%,
+ linear-gradient(black, black) 0% 70% / 3% 1.4%,
+ linear-gradient(45deg, gold, orange) 0 82% / 3% 15%,
+ linear-gradient(black, black) 0% 52% / 3% 1.4%,
+ linear-gradient(45deg, gold, orange) 0 63% / 3% 18%,
+ linear-gradient(black, black) 0% 35% / 3% 1.4%,
+ linear-gradient(45deg, orange, coral) 0 42% / 3% 16%,
+ linear-gradient(black, black) 100% 85% / 3% 1.4%,
+ linear-gradient(45deg, gold, orange) 100% 100.2% / 3% 15%,
+ linear-gradient(black, black) 100% 70% / 3% 1.4%,
+ linear-gradient(45deg, gold, orange) 100% 82% / 3% 15%,
+ linear-gradient(black, black) 100% 52% / 3% 1.4%,
+ linear-gradient(45deg, gold, orange) 100% 63% / 3% 18%,
+ linear-gradient(black, black) 100% 35% / 3% 1.4%,
+ linear-gradient(45deg, orange, coral) 100% 42% / 3% 16%,
+ linear-gradient(30deg, black(0) 24%,
+ black 24.2%,
+ black 36%,
+ black(0) 36.2%) -.5% 11% / 10% 10%,
+ linear-gradient(50deg, black(0) 24%,
+ black 24.2%,
+ black 36%,
+ black(0) 36.2%) 21.5% -2.8% / 10% 10%,
+ linear-gradient(black, black) 50% 0 / 1.8% 3%,
+ linear-gradient(-50deg, black(0) 24%,
+ black 24.2%,
+ black 36%,
+ black(0) 36.2%) 78.5% -2.8% / 10% 10%,
+ linear-gradient(-30deg, black(0) 24%,
+ black 24.2%,
+ black 36%,
+ black(0) 36.2%) 100.5% 11% / 10% 10%,
+ radial-gradient(circle at 50% 100%, black(0) 67%,
+ coral 67.2%,
+ crimson 85%) 50% 0 / 100% 35.5%,
+ linear-gradient(black, black) 30% 100.2% / 1.8% 3%,
+ linear-gradient(black, black) 70% 100.2% / 1.8% 3%,
+ linear-gradient(to top, gold, orange) 0 100.2% / 100% 2.8%,
+ linear-gradient(black, black) 50% 42% / 100% 1.2%,
+ radial-gradient(circle at 50% 100%, black(0) 24.5%,
+ black 24.7%,
+ black 27.3%,
+ black(0) 27.5%) 50% 10% / 100% 35.5%,
+ radial-gradient(circle at 50% 100%, tomato 10%,
+ orangered 24.7%,
+ black(0) 27%) 50% 10% / 100% 35.5%,
+ linear-gradient( 80deg, black(0) 44%,
+ black 44.2%,
+ black 45.6%,
+ black(0) 45.8%) 50% 0 / 100% 42%,
+ linear-gradient(black, black) 50% 15% / 15% 1.2%,
+ linear-gradient(-80deg, black(0) 44%,
+ black 44.2%,
+ black 45.6%,
+ black(0) 45.8%) 50% 0 / 100% 42%,
+ linear-gradient( 80deg, black(0) 81%,
+ orange 81%) 0 0 / 49% 15%,
+ linear-gradient(-80deg, black(0) 78%,
+ orange 78%,
+ darkorange 100%) 100% 0 / 51% 15%,
+ linear-gradient( 80deg, black(0) 80%,
+ tomato 80%) 0 0 / 51% 42%,
+ linear-gradient(-80deg, black(0) 80%,
+ tomato 80%,
+ coral 100%) 100% 0 / 51% 42%,
+ linear-gradient( 49deg, black(0) 33%,
+ black 33.2%,
+ black 34.5%,
+ black(0) 34.7%) 50% 0 / 100% 42%,
+ linear-gradient(black, black) 33% 22% / 18% 1.2%,
+ linear-gradient(black, black) 67% 22% / 18% 1.2%,
+ linear-gradient(-49deg, black(0) 33%,
+ black 33.2%,
+ black 34.5%,
+ black(0) 34.7%) 50% 0 / 100% 42%,
+ linear-gradient( 49deg, black(0) 35%,
+ gold 35.2%,
+ lemonchiffon 100%) 0 0 / 50% 22%,
+ linear-gradient( 49deg, black(0) 50%,
+ khaki 50.2%,
+ lemonchiffon 100%) 0 0 / 50% 42%,
+ linear-gradient(-49deg, black(0) 35%,
+ khaki 35.2%,
+ gold 100%) 100% 0 / 50% 22%,
+ linear-gradient(-49deg, black(0) 50%,
+ gold 50.2%) 100% 0 / 50% 42%,
+ linear-gradient( 25deg, black(0) 22%,
+ black 22.2%,
+ black 23.6%,
+ black(0) 23.8%) 50% 0 / 100% 42%,
+ linear-gradient(black, black) 9.5% 27% / 26.5% 1.2%,
+ linear-gradient(black, black) 90.5% 27% / 26.5% 1.2%,
+ linear-gradient(-25deg, black(0) 22%,
+ black 22.2%,
+ black 23.6%,
+ black(0) 23.8%) 50% 0 / 100% 42%,
+ linear-gradient( 25deg, black(0) 6%,
+ tomato 6.2%,
+ coral 30%) 0 0 / 50% 27%,
+ linear-gradient(-25deg, black(0) 6%,
+ tomato 6.2%,
+ coral 30%) 100% 0 / 50% 27%,
+ linear-gradient( 25deg, black(0) 30%,
+ orange 30.2%,
+ darkorange 50%) 0 0 / 50% 42%,
+ linear-gradient(-25deg, black(0) 30%,
+ orange 30.2%,
+ darkorange 50%) 100% 0 / 50% 42%,
+ linear-gradient(black, black) 16% 34.5% / 1.7% 11%,
+ linear-gradient(black, black) 84% 34.5% / 1.7% 11%,
+ linear-gradient(60deg, khaki, lemonchiffon 60%) 0 0 / 16% 42%,
+ linear-gradient(60deg, gold 30%, khaki) 0 0 / 50% 42%,
+ linear-gradient(60deg, gold, khaki 60%) 100% 0 / 16% 42%,
+ linear-gradient(60deg, khaki 30%, lemonchiffon) 100% 0 / 50% 42%,
+ linear-gradient(-68deg, black(0) 62%,
+ black 62.2%,
+ black 63.6%,
+ black(0) 63.8%) 50% 100% / 100% 58%,
+ linear-gradient(black, black) 50% 55% / 17% 1.3%,
+ linear-gradient(black, black) 50% 77% / 42% 1.3%,
+ linear-gradient( 68deg, black(0) 62%,
+ black 62.2%,
+ black 63.6%,
+ black(0) 63.8%) 50% 100% / 100% 58%,
+ linear-gradient(-68deg, darkolivegreen 10%,
+ black(0) 10%) 0 9% / 50% 50%,
+ linear-gradient( 68deg, darkolivegreen,
+ olivedrab 10%,
+ black(0) 10%) 100% 9% / 50% 50%,
+ linear-gradient(-68deg, seagreen 15%,
+ forestgreen 26%,
+ black(0) 26%) 0 44% / 51% 58%,
+ linear-gradient( 68deg, seagreen 15%,
+ mediumseagreen 26%,
+ black(0) 26%) 100% 44% / 51% 58%,
+ linear-gradient(-68deg, mediumseagreen 15%,
+ forestgreen 40%,
+ black(0) 40%) 0 100% / 51% 58%,
+ linear-gradient( 68deg, mediumseagreen 20%,
+ lightseagreen 40%,
+ black(0) 40%) 100% 100% / 50% 58%,
+ linear-gradient(-47deg, black(0) 72%,
+ black 72.2%,
+ black 73.6%,
+ black(0) 73.8%) 50% 100% / 100% 58%,
+ linear-gradient(black, black) 21.5% 65% / 20% 1.3%,
+ linear-gradient(black, black) 79% 65% / 20% 1.3%,
+ linear-gradient( 47deg, black(0) 72%,
+ black 72.2%,
+ black 73.6%,
+ black(0) 73.8%) 50% 100% / 100% 58%,
+ linear-gradient(-47deg, darkcyan,
+ cadetblue 26%,
+ black(0) 26%) 0 17% / 50% 58%,
+ linear-gradient( 47deg, cadetblue,
+ darkcyan 26%,
+ black(0) 26%) 100% 17% / 50% 58%,
+ linear-gradient(-47deg, lightseagreen,
+ seagreen 62%,
+ black(0) 62%) 0 100% / 50% 58%,
+ linear-gradient( 47deg, mediumturquoise,
+ mediumseagreen 62%,
+ black(0) 62%) 100% 100% / 50% 58%,
+ linear-gradient(-20deg, black(0) 84%,
+ black 84.2%,
+ black 85.6%,
+ black(0) 85.8%) 50% 100% / 100% 58%,
+ linear-gradient(black, black) 22% 50% / 20% 1.3%,
+ linear-gradient(black, black) 78% 50% / 20% 1.3%,
+ linear-gradient( 20deg, black(0) 84%,
+ black 84.2%,
+ black 85.6%,
+ black(0) 85.8%) 50% 100% / 100% 58%,
+ linear-gradient(-20deg, olivedrab 13%,
+ black(0) 13%) 0 10% / 50% 44%,
+ linear-gradient( 20deg, darkolivegreen 13%,
+ black(0) 13%) 100% 10% / 50% 44%,
+ linear-gradient(-20deg, lightseagreen 50%,
+ mediumseagreen 82%,
+ black(0) 82%) 0 100% / 50% 58%,
+ linear-gradient( 20deg, mediumseagreen 50%,
+ lightseagreen 82%,
+ black(0) 82%) 100% 100% / 50% 58%,
+ linear-gradient(45deg, yellowgreen, darkolivegreen 80%) 0 40% / 50% 25%,
+ linear-gradient(45deg, yellowgreen, darkolivegreen 80%) 100% 40% / 50% 25%
+ background-repeat: no-repeat
+ border-radius: 6em 6em 0 0
+ border: .2em solid black
+ box-shadow: 0 0 0 .7em white(.1)
+
+ &::before
+ width: 100%
+ height: 100%
+ border-radius: 6em 6em 0 0
+ background: radial-gradient(circle, white 10%, white(0) 50%) 11% 12% / 20% 20%,
+ radial-gradient(ellipse, white 20%, white(0) 50%) 17.5% 10% / 3% 30%,
+ linear-gradient(to right, black(0), black(.2) 30%) 100% 0 / 20% 100%,
+ radial-gradient(circle, black(.2) 10%, black(0) 60%) -10% 140% / 60% 60%
+ background-repeat: no-repeat

_styl/main.styl

@@ -255,4 +255,5 @@
 @import 'entries/space'
 @import 'entries/sparkle'
 @import 'entries/bones'
+@import 'entries/glass'