|
| 1 | +<footer class="bg-local_background_4 flex flex-col" id="ubication"> |
| 2 | + <section |
| 3 | + class="max-w-screen-xl mx-auto px-4 xl:px-0 flex md:flex-row flex-col-reverse gap-4 py-10" |
| 4 | + > |
| 5 | + <div class="flex-1 flex flex-col gap-4"> |
| 6 | + <a href="/" class="text-local_title"> |
| 7 | + <h2 class="text-xl font-bold">Now Technology</h2> |
| 8 | + </a> |
| 9 | + |
| 10 | + <p class="text-local_text text-sm text-pretty"> |
| 11 | + Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quod veniam |
| 12 | + itaque, minima quos est harum quia suscipit aliquid aut possimus maxime |
| 13 | + ad recusandae numquam! Natus sit cum perferendis modi dolores. |
| 14 | + </p> |
| 15 | + |
| 16 | + <div class="flex gap-x-4 gap-y-1 flex-wrap"> |
| 17 | + <a |
| 18 | + href="#" |
| 19 | + target="_blank" |
| 20 | + rel="noopener noreferrer" |
| 21 | + class="flex items-center gap-2 underline hover:text-local_accent transition-colors" |
| 22 | + > |
| 23 | + Información de garantía |
| 24 | + </a> |
| 25 | + <a |
| 26 | + href="#" |
| 27 | + target="_blank" |
| 28 | + rel="noopener noreferrer" |
| 29 | + class="flex items-center gap-2 underline hover:text-local_accent transition-colors" |
| 30 | + > |
| 31 | + Política de privacidad |
| 32 | + </a> |
| 33 | + <a |
| 34 | + href="#" |
| 35 | + target="_blank" |
| 36 | + rel="noopener noreferrer" |
| 37 | + class="flex items-center gap-2 underline hover:text-local_accent transition-colors" |
| 38 | + > |
| 39 | + Condiciones de uso |
| 40 | + </a> |
| 41 | + </div> |
| 42 | + |
| 43 | + <div class="flex flex-col gap-4"> |
| 44 | + <section> |
| 45 | + <h3 class="text-lg font-bold text-local_subtitle">Redes Sociales</h3> |
| 46 | + |
| 47 | + <div class="flex items-center gap-6 text-local_icon_2"> |
| 48 | + <a |
| 49 | + href="#" |
| 50 | + target="_blank" |
| 51 | + rel="noopener noreferrer" |
| 52 | + class="hover:text-local_icon mt-4 transition-colors scale-150" |
| 53 | + > |
| 54 | + <svg |
| 55 | + xmlns="http://www.w3.org/2000/svg" |
| 56 | + width="24" |
| 57 | + height="24" |
| 58 | + viewBox="0 0 24 24" |
| 59 | + fill="currentColor" |
| 60 | + class="icon icon-tabler icons-tabler-filled icon-tabler-brand-facebook" |
| 61 | + ><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path |
| 62 | + d="M18 2a1 1 0 0 1 .993 .883l.007 .117v4a1 1 0 0 1 -.883 .993l-.117 .007h-3v1h3a1 1 0 0 1 .991 1.131l-.02 .112l-1 4a1 1 0 0 1 -.858 .75l-.113 .007h-2v6a1 1 0 0 1 -.883 .993l-.117 .007h-4a1 1 0 0 1 -.993 -.883l-.007 -.117v-6h-2a1 1 0 0 1 -.993 -.883l-.007 -.117v-4a1 1 0 0 1 .883 -.993l.117 -.007h2v-1a6 6 0 0 1 5.775 -5.996l.225 -.004h3z" |
| 63 | + ></path></svg |
| 64 | + > |
| 65 | + </a> |
| 66 | + |
| 67 | + <a |
| 68 | + href="#" |
| 69 | + target="_blank" |
| 70 | + rel="noopener noreferrer" |
| 71 | + class="hover:text-local_icon mt-4 transition-colors scale-150" |
| 72 | + > |
| 73 | + <svg |
| 74 | + xmlns="http://www.w3.org/2000/svg" |
| 75 | + width="24" |
| 76 | + height="24" |
| 77 | + viewBox="0 0 24 24" |
| 78 | + fill="none" |
| 79 | + stroke="currentColor" |
| 80 | + stroke-width="2" |
| 81 | + stroke-linecap="round" |
| 82 | + stroke-linejoin="round" |
| 83 | + class="icon icon-tabler icons-tabler-outline icon-tabler-brand-instagram" |
| 84 | + ><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path |
| 85 | + d="M4 4m0 4a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z" |
| 86 | + ></path><path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" |
| 87 | + ></path><path d="M16.5 7.5l0 .01"></path></svg |
| 88 | + > |
| 89 | + </a> |
| 90 | + </div> |
| 91 | + </section> |
| 92 | + |
| 93 | + <section> |
| 94 | + <h3 class="text-lg font-bold text-local_title">Localización</h3> |
| 95 | + |
| 96 | + <div class="flex items-center gap-2 mt-4 text-local_icon_2"> |
| 97 | + <svg |
| 98 | + width="24" |
| 99 | + height="24" |
| 100 | + viewBox="0 0 32 32" |
| 101 | + fill="none" |
| 102 | + xmlns="http://www.w3.org/2000/svg" |
| 103 | + ><path |
| 104 | + d="M16 2.66675C10.84 2.66675 6.66669 6.84008 6.66669 12.0001C6.66669 19.0001 16 29.3334 16 29.3334C16 29.3334 25.3334 19.0001 25.3334 12.0001C25.3334 6.84008 21.16 2.66675 16 2.66675ZM16 15.3334C15.116 15.3334 14.2681 14.9822 13.643 14.3571C13.0179 13.732 12.6667 12.8841 12.6667 12.0001C12.6667 11.116 13.0179 10.2682 13.643 9.64306C14.2681 9.01794 15.116 8.66675 16 8.66675C16.8841 8.66675 17.7319 9.01794 18.357 9.64306C18.9822 10.2682 19.3334 11.116 19.3334 12.0001C19.3334 12.8841 18.9822 13.732 18.357 14.3571C17.7319 14.9822 16.8841 15.3334 16 15.3334Z" |
| 105 | + fill="currentColor"></path></svg |
| 106 | + > |
| 107 | + |
| 108 | + <a |
| 109 | + href="https://maps.app.goo.gl/VxfpQpZdFd9BUYUbA" |
| 110 | + target="_blank" |
| 111 | + class="text-sm text-local_text hover:text-local_accent font-semibold" |
| 112 | + >Cra. 20 #8b30, Popayán, Cauca</a |
| 113 | + > |
| 114 | + </div> |
| 115 | + </section> |
| 116 | + |
| 117 | + <section> |
| 118 | + <h3 class="text-lg font-bold text-local_title">Gmail</h3> |
| 119 | + |
| 120 | + <div class="flex items-center gap-2 mt-4 text-local_icon_2"> |
| 121 | + <svg |
| 122 | + xmlns="http://www.w3.org/2000/svg" |
| 123 | + width="24" |
| 124 | + height="24" |
| 125 | + viewBox="0 0 24 24" |
| 126 | + fill="currentColor" |
| 127 | + class="icon icon-tabler icons-tabler-filled icon-tabler-mail" |
| 128 | + ><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path |
| 129 | + d="M22 7.535v9.465a3 3 0 0 1 -2.824 2.995l-.176 .005h-14a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-9.465l9.445 6.297l.116 .066a1 1 0 0 0 .878 0l.116 -.066l9.445 -6.297z" |
| 130 | + ></path><path |
| 131 | + d="M19 4c1.08 0 2.027 .57 2.555 1.427l-9.555 6.37l-9.555 -6.37a2.999 2.999 0 0 1 2.354 -1.42l.201 -.007h14z" |
| 132 | + ></path></svg |
| 133 | + > |
| 134 | + |
| 135 | + <a |
| 136 | + href="https://maps.app.goo.gl/VxfpQpZdFd9BUYUbA" |
| 137 | + target="_blank" |
| 138 | + class="text-sm text-local_text hover:text-local_accent font-semibold" |
| 139 | + >richar@gmail.com</a |
| 140 | + > |
| 141 | + </div> |
| 142 | + </section> |
| 143 | + </div> |
| 144 | + </div> |
| 145 | + |
| 146 | + <div class="flex-1"> |
| 147 | + <section |
| 148 | + id="map" |
| 149 | + class="h-40 md:h-96 bg-local_background_tertiary rounded-md mb-4 !z-40" |
| 150 | + > |
| 151 | + </section> |
| 152 | + </div> |
| 153 | + </section> |
| 154 | + |
| 155 | + <section class="max-w-screen-xl mx-auto px-4 xl:px-0 w-full pb-4"> |
| 156 | + <a |
| 157 | + href="https://portfolio-igrisdev.vercel.app/" |
| 158 | + target="_blank" |
| 159 | + rel="noopener noreferrer" |
| 160 | + class="text-local_icon_2 hover:text-local_icon_2 transition-colors flex gap-1 group w-max" |
| 161 | + > |
| 162 | + <p class="text-local_text">Desarrollado con ❤️ por</p> |
| 163 | + <span class="group-hover:text-local_accent">igris.dev</span> |
| 164 | + </a> |
| 165 | + </section> |
| 166 | +</footer> |
| 167 | + |
| 168 | +<script type="module"> |
| 169 | + var map = L.map('map').setView([2.4418883220175216, -76.6189952639966], 14) |
| 170 | + |
| 171 | + L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { |
| 172 | + attribution: |
| 173 | + '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors', |
| 174 | + }).addTo(map) |
| 175 | + |
| 176 | + L.marker([2.4418883220175216, -76.6189952639966]) |
| 177 | + .addTo(map) |
| 178 | + .bindPopup('Salchipapas La 20') |
| 179 | + .openPopup() |
| 180 | +</script> |
0 commit comments