I'm trying to parse https://app.xdao.app/ site using wget.
I used:
wget https://app.xdao.app/
and
wget -r -p https://app.xdao.app/
Always I got the same result:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/assets/img/favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>xDAO App</title>
<script type="module" crossorigin src="/assets/index.e975bc04.js"></script>
<link rel="modulepreload" href="/assets/vendor.ab9443f5.js">
<link rel="stylesheet" href="/assets/index.578c0be9.css">
</head>
<body>
<div id="app"></div>
</body>
</html>
Why? I want to get more full htm file, like I got result with yahoo.com for instance. I tried curl and got the same empty htm also.
PS: also when I do save as web page in FF I also get full html.
Here page downloaded with FF:
<!DOCTYPE html>
<html lang="en"><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="UTF-8">
<link rel="icon" type="image/svg+xml" href="https://app.xdao.app/assets/img/favicon.svg">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>xDAO App</title>
<script type="module" crossorigin="" src="xDAO%20App_files/index.js"></script>
<link rel="modulepreload" href="https://app.xdao.app/assets/vendor.ab9443f5.js">
<link rel="stylesheet" href="xDAO%20App_files/index.css">
</head>
<body>
<div id="app"> <div class="fixed left-0 right-0 bottom-2 text-center z-50"></div> <div class="flex justify-between p-2 lg:p-4 items-center w-full"><img src="xDAO%20App_files/logo_full_blue.svg" class="self-start h-10 hidden md:block ml-5 mt-1" alt=""> <img src="xDAO%20App_files/logo_blue.svg" class="h-10 md:hidden" alt=""> <div class="md:flex space-x-4 items-center self-end hidden"> <a class="btn btn-ghost" href="#/create"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle "><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg> <p>Create DAO</p></a> <button class="btn btn-primary">Connect Wallet</button></div> <div class="flex space-x-2 items-center self-end md:hidden"> <a class="btn-mobile btn-mobile-ghost" href="#/create"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle "><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg> <p>Create DAO</p></a> <button class="btn-mobile btn-mobile-primary">Connect Wallet</button></div></div> <div class="flex"><aside class="h-screen top-0 sticky"><div class="hidden md:flex md:flex-col md:space-y-2 md:px-5 md:py-12 md:w-64"><div class="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 px-3 py-3 md:py-4 md:px-5 rounded-xl text-grey transition duration-200 hover:bg-hovergrey hover:text-primary svelte-1i2lpd1 chosenbutton"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home "><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg> <div class="text-captionsm md:text-title font-semibold"><p slot="text">Home</p></div></div> <div class="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 px-3 py-3 md:py-4 md:px-5 rounded-xl text-grey transition duration-200 hover:bg-hovergrey hover:text-primary svelte-1i2lpd1"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-grid "><rect x="3" y="3" width="7" height="7"></rect><rect x="14" y="3" width="7" height="7"></rect><rect x="14" y="14" width="7" height="7"></rect><rect x="3" y="14" width="7" height="7"></rect></svg> <div class="text-captionsm md:text-title font-semibold"><p slot="text">Ecosystem</p></div></div> <div class="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 px-3 py-3 md:py-4 md:px-5 rounded-xl text-grey transition duration-200 hover:bg-hovergrey hover:text-primary svelte-1i2lpd1"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-list "><line x1="8" y1="6" x2="21" y2="6"></line><line x1="8" y1="12" x2="21" y2="12"></line><line x1="8" y1="18" x2="21" y2="18"></line><line x1="3" y1="6" x2="3.01" y2="6"></line><line x1="3" y1="12" x2="3.01" y2="12"></line><line x1="3" y1="18" x2="3.01" y2="18"></line></svg> <div class="text-captionsm md:text-title font-semibold"><p slot="text">My DAOs</p></div></div> <div class="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 px-3 py-3 md:py-4 md:px-5 rounded-xl text-grey transition duration-200 hover:bg-hovergrey hover:text-primary svelte-1i2lpd1"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle "><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg> <div class="text-captionsm md:text-title font-semibold"><p slot="text">Create</p></div></div></div></aside> <main class="flex-1 py-8 px-4 md:py-12 md:px-16 lg:py-9 lg:px-16 w-full"><div class="card"><p class="text-h4 font-semibold">4 Simple Steps to Start</p> <div class="w-full grid grid-cols-4 gap-8 mt-4"><div class="col-span-4 md:col-span-2 lg:col-span-1"><img src="xDAO%20App_files/01.svg" alt="" class="w-full"></div> <div class="col-span-4 md:col-span-2 lg:col-span-1"><button class="w-full"><img src="xDAO%20App_files/02.svg" alt="" class="w-full"></button></div> <div class="col-span-4 md:col-span-2 lg:col-span-1"><button class="w-full"><img src="xDAO%20App_files/03.svg" alt="" class="w-full"></button></div> <div class="col-span-4 md:col-span-2 lg:col-span-1"><img src="xDAO%20App_files/04.svg" alt="" class="w-full"></div></div> <button class="btn btn-ghost w-full h-7.5 mt-12"><svg xmlns="http://www.w3.org/2000/svg" width="18px" height="18px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-book "><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path></svg> <p>Guide</p></button></div> <div class="card mt-2"><div class="grid grid-cols-2 gap-8"><div class="col-span-2 lg:col-span-1"><p class="text-h6 font-medium">About xDAO Project</p> <p class="text-body text-grey mt-1">xDAO is a DeFi protocol for quick and easy creation of Decentralized
Autonomous Organizations — DAOs. Combine your crypto assets to manage
them in more efficient and secure way by using auto-generated smart
contracts. A clear voting system allows you to make collective decisions
and be confident in their exact execution.</p></div> <div class="col-span-2 lg:col-span-1 space-y-2"><div class="flex space-x-2 items-center text-primary"><svg xmlns="http://www.w3.org/2000/svg" width="22px" height="22px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-shield "><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path></svg> Audit</div> <div class="flex space-x-2 items-center text-primary"><svg xmlns="http://www.w3.org/2000/svg" width="22px" height="22px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-code "><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg> Source Code</div> <div class="flex space-x-2 items-center text-primary"><svg xmlns="http://www.w3.org/2000/svg" width="22px" height="22px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link "><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg> Official Website</div> <div class="flex space-x-2 items-center text-primary"><svg xmlns="http://www.w3.org/2000/svg" width="22px" height="22px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-book "><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path></svg> Docs</div></div></div></div></main></div> <div class="bg-darkactive fixed bottom-0 w-full md:hidden grid grid-cols-4 gap-2 z-50 p-2"><div class="col-span-1"><div class="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 px-3 py-3 md:py-4 md:px-5 rounded-xl text-grey transition duration-200 hover:bg-hovergrey hover:text-primary svelte-1i2lpd1 chosenbutton"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home "><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg> <div class="text-captionsm md:text-title font-semibold"><p slot="text">Home</p></div></div></div> <div class="col-span-1"><div class="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 px-3 py-3 md:py-4 md:px-5 rounded-xl text-grey transition duration-200 hover:bg-hovergrey hover:text-primary svelte-1i2lpd1"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-grid "><rect x="3" y="3" width="7" height="7"></rect><rect x="14" y="3" width="7" height="7"></rect><rect x="14" y="14" width="7" height="7"></rect><rect x="3" y="14" width="7" height="7"></rect></svg> <div class="text-captionsm md:text-title font-semibold"><p slot="text">Ecosystem</p></div></div></div> <div class="col-span-1"><div class="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 px-3 py-3 md:py-4 md:px-5 rounded-xl text-grey transition duration-200 hover:bg-hovergrey hover:text-primary svelte-1i2lpd1"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-list "><line x1="8" y1="6" x2="21" y2="6"></line><line x1="8" y1="12" x2="21" y2="12"></line><line x1="8" y1="18" x2="21" y2="18"></line><line x1="3" y1="6" x2="3.01" y2="6"></line><line x1="3" y1="12" x2="3.01" y2="12"></line><line x1="3" y1="18" x2="3.01" y2="18"></line></svg> <div class="text-captionsm md:text-title font-semibold"><p slot="text">My DAOs</p></div></div></div> <div class="col-span-1"><div class="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 px-3 py-3 md:py-4 md:px-5 rounded-xl text-grey transition duration-200 hover:bg-hovergrey hover:text-primary svelte-1i2lpd1"><svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle "><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg> <div class="text-captionsm md:text-title font-semibold"><p slot="text">Create</p></div></div></div></div> <footer class="p-4 text-center text-grey "><p><a class="hover:underline" href="#/termsandconditions">Terms and Conditions</a>
|
<a class="hover:underline" href="#/privacypolicy">Privacy Policy</a> |
<a class="hover:underline" href="#/amlpolicy">AML Policy</a> <br> <br> <a class="font-medium text-primary hover:underline" target="_blank" href="https://www.tis.bizfile.gov.sg/ngbtisinternet/faces/oracle/webcenter/portalapp/pages/TransactionMain.jspx?authNo=X21255309Q&selectedETransId=prdAuth&uen=202112101H">XGROUP GLOBAL PTE. LTD. Singapore</a> <span class="font-medium">| Powered by Binance Smart Chain</span></p></footer> <div class="h-24 md:hidden"></div></div>
</body></html>'
Thanks for any advices
This
<script type="module" crossorigin src="/assets/index.e975bc04.js"></script>
is <script> tag, when your browser encounter that it does execute JavaScript instruction in file pointed by src. In this case it apparently fill page with content, thus you might get full html via Firefox. So far I know executing JavaScript is out of scope of wget. You would need tool which is able to execute JavaScript, not only download resource.
Related
I want to reduce the size of search icon in web page (which is a facelets file). Can anyone suggest how it can be possible.
my current code of jsf is
<div>
<a href="search.html" class="nav-item toggler collapsed" data-toggle="collapse" data-target="#advancesearch" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<svg version="1.1" id="_x39_ac692fd-fab4-4127-97e6-094d15a4d3bc" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 595.3 841.9" style="enable-background:new 0 0 595.3 841.9;" xml:space="preserve">
<path class="st0" d="M509.9,643.5L354.8,488.4c26.4-28,42.4-65.5,42.4-106.7c0-86.4-70.4-156.7-156.7-156.7S83.7,295.4,83.7,381.7
s70.4,156.8,156.8,156.8c41.2,0,78.6-16,106.7-41.8l155.1,155.1c1.1,1.1,2.8,1.6,3.9,1.6s2.8-0.5,3.9-1.6
C512.1,649,512.1,645.7,509.9,643.5z M94.7,381.7c0-80.3,65.5-145.7,145.8-145.7s145.7,65.5,145.7,145.7s-65.5,145.8-145.7,145.8
C160.1,527.5,94.7,462,94.7,381.7z"></path>
</svg>
<p>Advance search</p>
</a>
</div>
You can use CSS to select and style the <svg> element just as you would any other element in an HTML document.
In this situation you might use the following (attribute) selector:
a[href="search.html"] svg {
width: 100px;
height: 100px;
}
Working Example:
a[href="search.html"] svg {
width: 100px;
height: 100px;
}
<div>
<a href="search.html" class="nav-item toggler collapsed" data-toggle="collapse" data-target="#advancesearch" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 595.3 841.9">
<path d="M509.9,643.5L354.8,488.4c26.4-28,42.4-65.5,42.4-106.7c0-86.4-70.4-156.7-156.7-156.7S83.7,295.4,83.7,381.7 s70.4,156.8,156.8,156.8c41.2,0,78.6-16,106.7-41.8l155.1,155.1c1.1,1.1,2.8,1.6,3.9,1.6s2.8-0.5,3.9-1.6 C512.1,649,512.1,645.7,509.9,643.5z M94.7,381.7c0-80.3,65.5-145.7,145.8-145.7s145.7,65.5,145.7,145.7s-65.5,145.8-145.7,145.8 C160.1,527.5,94.7,462,94.7,381.7z"></path>
</svg>
<p>Advance search</p>
</a>
</div>
I am calling out a stroke in an SVG, it works if I don't put any class on the style. But I need to put it there because needed to be fixable for the end user to pick any color they want.
symbol#icon-arrow{
stroke: #ff6600;
} /*this is working*/
.icon-orange symbol#icon-arrow{
stroke: #99CA3D;
} /*this is not working, but this is what I need*/
<div id="icon-load" style="display:none;"></div>
<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0">
<symbol id="icon-arrow" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="3" stroke-linecap="square" stroke-linejoin="arcs" >
<path class="arrow" d="M12 19V6M5 12l7-7 7 7"/>
</symbol>
</svg>
<a href="#" class="icon">
<svg class="icon icon-orange"><use xlink:href="#icon-arrow"></use></svg>
</a>
As #enxaneta said, you have to style the <use> element, and let the colour percolate down to the symbol.
But you'll first need to remove the stroke attribute from the symbol. Otherwise that presentation attribute will override the colour you want it to inherit.
.icon-orange use {
stroke: #ff6600;
}
.icon-green use {
stroke: #99CA3D;
}
<div id="icon-load" style="display:none;"></div>
<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0">
<symbol id="icon-arrow" viewBox="0 0 24 24" fill="none" stroke-width="3" stroke-linecap="square" stroke-linejoin="arcs" >
<path class="arrow" d="M12 19V6M5 12l7-7 7 7"/>
</symbol>
</svg>
<a href="#" class="icon">
<svg class="icon icon-orange"><use xlink:href="#icon-arrow"></use></svg>
</a>
<a href="#" class="icon">
<svg class="icon icon-green"><use xlink:href="#icon-arrow"></use></svg>
</a>
Inside the .icon-orange there is a <use> element. You have to style the use element. However if you need to refer the #icon-arrow here is how you can do it:
/*declare the namespace xlink*/
#namespace xlink "http://www.w3.org/1999/xlink";
/*style the use element inside the icon-orange whose's xlink:herf attribute is the icon arrow*/
.icon-orange use[xlink|href ="#icon-arrow" ]{
stroke: #99CA3D;
}
<div id="icon-load" style="display:none;"></div>
<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0">
<symbol id="icon-arrow" viewBox="0 0 24 24" fill="none" stroke-width="3" stroke-linecap="square" stroke-linejoin="arcs" >
<path class="arrow" d="M12 19V6M5 12l7-7 7 7"/>
</symbol>
</svg>
<a href="#" class="icon">
<svg class="icon icon-orange"><use xlink:href="#icon-arrow" width="24" height="24"></use></svg>
</a>
whenever i use text-outline or stroke in style. it's not work. how i can give text-outline to my text(SVG TEXT) in text tag.
<div class="slides2">
<img class="" src="//cdn.shopify.com/s/files/1/0797/1743/products/HK-CK_28785899-10b3-4f49-88be-975a69089e52_1024x1024.JPG?v=1464803870">
<div class="custom">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="410" height="70" viewBox="0 0 2326 460">
<defs>
<clipPath id="my-path">
<text id="texty" style="font-weight:bold;text-outline: 2px 2px #ff0000;" x="60" y="300" font-size="350">SVG TEXT</text>
</clipPath>
</defs>
<image xlink:href="Mother of Pearl.JPG" clip-path="url(#my-path)" width="100%" height="100%" id="filler" preserveAspectRatio="none"></image>
</svg>
</div>
</div>
Anything you include in a <clipPath> is used only to form the clipping path. It is never rendered.
If you want it to also be rendered, then you will need to include it again as a separate object.
<div class="slides2">
<img class="" src="//cdn.shopify.com/s/files/1/0797/1743/products/HK-CK_28785899-10b3-4f49-88be-975a69089e52_1024x1024.JPG?v=1464803870">
<div class="custom">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="410" height="70" viewBox="0 0 2326 460">
<defs>
<clipPath id="my-path">
<text id="texty" style="font-weight:bold;" x="60" y="300" font-size="350">SVG TEXT</text>
</clipPath>
</defs>
<image xlink:href="Mother of Pearl.JPG" clip-path="url(#my-path)" width="100%" height="100%" id="filler" preserveAspectRatio="none"></image>
<text id="texty" style="font-weight:bold; stroke: #f00; stroke-width: 2;" x="60" y="300" font-size="350">SVG TEXT</text>
</svg>
</div>
</div>
When I create an svg element that contains objects with negative coordinates as shown in this jfiddle: http://jsfiddle.net/QGq3H/1/
<div class="row">
<div class="col-sm-6">
<div style="display:inline-block; height:100px;"></div>
</div>
</div>
<div class="row">
<div class="col-sm-2"></div>
<div class="col-sm-10">
<svg class="svg-element" xmlns="http://www.w3.org/2000/svg" width="100" version="1.1" height="60">
<rect fill-opacity="0" style="fill-opacity: 0;" stroke="none" fill="#000000" ry="0" rx="0" r="0" height="60" width="100" y="0" x="0"></rect>
<circle cy="-50" cx="-50" style="" stroke="none" fill="#000000" r="10"></circle>
</svg>
</div>
</div>
In Chrome and IE the svg element has the same size as the visible part, in Firefox the svg is actually larger than the visible part. This is a problem when I want to get mouse coordinates relative to the svg element.
Which browser is correct? Is there a good workaround?
I want to put text on top of my polygons. unfortunately the text goes behind the shape is there anything similar to the css z index?
here is part of the svg in my html (its a lot of code because im drawing a map so here is only a little part of it.) Although below they all have the same coords, I did originally place them over the shape using the inspector in chrome, however the shapes remained above the text.
<svg width="400" height="800" viewBox="0 0 400 800" id="svg-doc">
<rect id="central-park" class="shape" x="154" y="370"width="53" height="127" />
<a xlink:href="/zipcodes/16">
<rect id="z10024" class="shape" x="68" y="415" width="85" height="40" />
<text x="0" y="15" fill="#5df8b8">10024</text>
</a>
<a xlink:href="/zipcodes/17">
<rect id="z10023" class="shape" x="68" y="457" width="85" height="40" />
<text x="0" y="15" fill="#5df8b8">10024</text>
</a>
<a xlink:href="/zipcodes/10">
<polygon id="z10034" class="shape" points="189,156 137,122 106,121 101,129 99,155 79,155 78,105 94,79 121,67 128,82 163,61 177,62 191,80" />
<text x="0" y="15" fill="#5df8b8">10024</text>
</a>
<a xlink:href="/zipcodes/28">
<polygon id="z10040" class="shape" points="188,167 186,155 137,122 108,122 102,126 100,153 77,156 77,166" />
<text x="0" y="15" fill="#5df8b8">10024</text>
</a>
<a xlink:href="/zipcodes/29">
<polygon id="z10033" class="shape" points="189,166 187,197 187,203 81,203 77,194 78,166" />
<text x="0" y="15" fill="#5df8b8">10024</text>
</a>
According to this site: http://alignedleft.com/tutorials/d3/an-svg-primer/
The order in which elements are coded determines their depth order.
In fact, the problem seems to be that all of your text is in the same place, at (0,15) - not underneath the polygons at all?
I edited the code from the question to move the text over the polygons, it is displayed correctly...
<svg width="400" height="800" viewBox="0 0 400 800" id="svg-doc">
<rect id="central-park" class="shape" x="154" y="370"width="53" height="127" />
<a xlink:href="/zipcodes/16">
<rect id="z10024" class="shape" x="68" y="415" width="85" height="40" />
<text x="70" y="450" fill="#5df8b8">10024</text>
</a>
<a xlink:href="/zipcodes/17">
<rect id="z10023" class="shape" x="68" y="457" width="85" height="40" />
<text x="70" y="480" fill="#5df8b8">10023</text>
</a>
<a xlink:href="/zipcodes/10">
<polygon id="z10034" class="shape" points="189,156 137,122 106,121 101,129 99,155 79,155 78,105 94,79 121,67 128,82 163,61 177,62 191,80" />
<text x="90" y="110" fill="#5df8b8">10034</text>
</a>
<a xlink:href="/zipcodes/28">
<polygon id="z10040" class="shape" points="188,167 186,155 137,122 108,122 102,126 100,153 77,156 77,166" />
<text x="120" y="160" fill="#5df8b8">10040</text>
</a>
<a xlink:href="/zipcodes/29">
<polygon id="z10033" class="shape" points="189,166 187,197 187,203 81,203 77,194 78,166" />
<text x="120" y="190" fill="#5df8b8">10033</text>
</a>
</svg>