Feature request: support encoded | for use programmatically

[jeaye]

Hi there. I was trying to make a request to "https://css.gg/css?=link|bulb" from the JVM and it's a real pain, since | is not a valid character for java.net URL parsers, which applies to Java, Clojure, etc, and all libraries in their ecosystems.

So, the request is for css.gg to also support "https://css.gg/css?=link%7Cbulb", which has | encoded as %7C so that it can be used programmatically. If the css.gg API were to URL decode the params, this shouldn't make any difference to existing behavior. However, we can see the impact as I illustrate with these two curl commands:

❯ curl "https://css.gg/css?=link|bulb"
.gg-bulb{box-sizing:border-box;position:relative;display:block;transform:scale(var(--ggs,1));width:16px;height:16px;border:2px solid;border-bottom-color:transparent;border-radius:100px}.gg-bulb::after,.gg-bulb::before{content:"";display:block;box-sizing:border-box;position:absolute}.gg-bulb::before{border-top:0;border-bottom-left-radius:18px;border-bottom-right-radius:18px;top:10px;border-bottom:2px solid transparent;box-shadow:0 5px 0 -2px,inset 2px 0 0 0,inset -2px 0 0 0,inset 0 -4px 0 -2px;width:8px;height:8px;left:2px}.gg-bulb::after{width:12px;height:2px;border-left:3px solid;border-right:3px solid;border-radius:2px;bottom:0;left:0}
.gg-link{box-sizing:border-box;position:relative;display:block;transform:rotate(-45deg) scale(var(--ggs,1));width:8px;height:2px;background:currentColor;border-radius:4px}.gg-link::after,.gg-link::before{content:"";display:block;box-sizing:border-box;position:absolute;border-radius:3px;width:8px;height:10px;border:2px solid;top:-4px}.gg-link::before{border-right:0;border-top-left-radius:40px;border-bottom-left-radius:40px;left:-6px}.gg-link::after{border-left:0;border-top-right-radius:40px;border-bottom-right-radius:40px;right:-6px}

❯ curl "https://css.gg/css?=link%7Cbulb"
.gg-link{box-sizing:border-box;position:relative;display:block;transform:rotate(-45deg) scale(var(--ggs,1));width:8px;height:2px;background:currentColor;border-radius:4px}.gg-link::after,.gg-link::before{content:"";display:block;box-sizing:border-box;position:absolute;border-radius:3px;width:8px;height:10px;border:2px solid;top:-4px}.gg-link::before{border-right:0;border-top-left-radius:40px;border-bottom-left-radius:40px;left:-6px}.gg-link::after{border-left:0;border-top-right-radius:40px;border-bottom-right-radius:40px;right:-6px}

The first one works, since curl is fine not encoding the param, but, with the encoded param, css.gg only returns CSS for the first icon.

Thanks for the consideration!

[jeaye]

Hi! Happy new year. Any chance you considered this?

[astrit]

@jeaye sorry for late reply, this has been noted and hopefully will fix soon ✌️