Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

260: UI updates to the kitops website #57

Merged
merged 3 commits into from
Mar 4, 2024
Merged

260: UI updates to the kitops website #57

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d60c532
Update the text and some styles
javisperez Mar 4, 2024
1f570aa
Update Home.vue
javisperez Mar 4, 2024
cb0609a
Update Blog.vue
javisperez Mar 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 7 additions & 3 deletions docs/.vitepress/theme/assets/css/tailwind.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -94,22 +94,20 @@

/* Fonts/Mobile/H4 */
font-size: 24px;
font-weight: 275;
font-weight: 200;
line-height: 30px; /* 125% */
letter-spacing: -0.6px;

@media screen(md) {
/* Fonts/Tablet/H4 */
font-size: 28px;
font-weight: 275;
line-height: 34px; /* 121.429% */
letter-spacing: -0.6px;
}

@media screen(xl) {
/* Fonts/Desktop/H4 */
font-size: 32px;
font-weight: 275;
line-height: 48px; /* 150% */
letter-spacing: -0.6px;
}
Expand Down Expand Up @@ -206,6 +204,12 @@
border: 2px solid var(--color-cornflower);
}

.kit-button.kit-button-salmon {
@apply text-salmon;
@apply hocus:text-white hocus:bg-salmon;
border: 2px solid var(--color-salmon);
}

.kit-cards {
@apply grid grid-cols-1 md:grid-cols-3 gap-2;

Expand Down
10 changes: 5 additions & 5 deletions docs/.vitepress/theme/components/Blog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ const filteredPostsByTag = computed(() => {
})
})

const getColorForTag = (tag) => {
const getColorForTag = (tag: string) => {
return tagsColorsMap[
tagsByIndex[tag] % tagsColorsMap.length
]
Expand Down Expand Up @@ -85,10 +85,10 @@ watchEffect(() => {
<li v-for="tag in allTags" :key="tag">
<button
class="tag"
:class="[
getColorForTag(tag).normal,
{ [getColorForTag(tag).selected]: selectedTag === tag }
]"
:class="{
[getColorForTag(tag).normal]: selectedTag !== tag,
[getColorForTag(tag).selected]: selectedTag === tag
}"
@click="filterByTag(tag)">
{{ tag }}
</button>
Expand Down
33 changes: 13 additions & 20 deletions docs/.vitepress/theme/components/Footer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,13 +19,15 @@ const year = (new Date()).getFullYear()

<div class="flex items-center p2 gap-4">
<strong aria-label="made with love by Jozu">Made with <span class="text-red-500 text-2xl">♥️</span> by</strong>
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48" fill="none" title="Jozu">
<path d="M4.5 5.29955L23.885 0L43.27 5.29955V48C43.27 48 32.924 42.7004 23.885 42.7004C14.846 42.7004 4.5 48 4.5 48V5.29955Z" fill="white"/>
<path d="M15.1993 21.6987C13.7519 21.6987 12.6008 21.3457 11.7462 20.6397C10.8915 19.9337 10.3194 18.9923 10.03 17.8156L13.0282 16.7151C13.1109 17.1027 13.2349 17.4834 13.4004 17.8572C13.5796 18.2171 13.8139 18.5147 14.1034 18.7501C14.4067 18.9854 14.772 19.1031 15.1993 19.1031C15.8885 19.1031 16.4124 18.8885 16.7708 18.4594C17.143 18.0164 17.3291 17.2411 17.3291 16.1337V7.57852H20.5961V16.1337C20.5961 17.8641 20.1343 19.2277 19.2107 20.2244C18.3009 21.2073 16.9638 21.6987 15.1993 21.6987Z" fill="black"/>
<path d="M30.5422 21.7153C29.1361 21.7153 27.8955 21.4177 26.8203 20.8224C25.745 20.2272 24.9042 19.3897 24.2976 18.3099C23.6911 17.2301 23.3878 15.9704 23.3878 14.5307C23.3878 13.091 23.6911 11.8312 24.2976 10.7514C24.9042 9.67166 25.745 8.83414 26.8203 8.23888C27.8955 7.64361 29.1361 7.34598 30.5422 7.34598C31.962 7.34598 33.2096 7.64361 34.2848 8.23888C35.36 8.83414 36.2009 9.67166 36.8074 10.7514C37.4277 11.8312 37.7379 13.091 37.7379 14.5307C37.7379 15.9704 37.4277 17.2301 36.8074 18.3099C36.2009 19.3897 35.36 20.2272 34.2848 20.8224C33.2096 21.4177 31.962 21.7153 30.5422 21.7153ZM30.5422 19.0159C31.2176 19.0159 31.838 18.8498 32.4031 18.5175C32.9683 18.1714 33.4163 17.6662 33.7472 17.0017C34.0918 16.3372 34.2641 15.5135 34.2641 14.5307C34.2641 13.5478 34.0918 12.7241 33.7472 12.0596C33.4163 11.3951 32.9683 10.8968 32.4031 10.5646C31.838 10.2185 31.2176 10.0454 30.5422 10.0454C29.8805 10.0454 29.2671 10.2185 28.7019 10.5646C28.1367 10.8968 27.6818 11.3951 27.3372 12.0596C27.0063 12.7241 26.8409 13.5478 26.8409 14.5307C26.8409 15.5135 27.0063 16.3372 27.3372 17.0017C27.6818 17.6662 28.1367 18.1714 28.7019 18.5175C29.2671 18.8498 29.8805 19.0159 30.5422 19.0159Z" fill="black"/>
<path d="M10.4857 38.4132V35.9007L17.454 27.4286H10.7959V24.5422H21.6929V27.0548L14.7866 35.5269H22.003V38.4132H10.4857Z" fill="black"/>
<path d="M30.5157 38.6344C28.3515 38.6344 26.8145 38.1153 25.9047 37.0771C25.0087 36.0388 24.5607 34.4538 24.5607 32.3219V24.5143H27.8277V32.5918C27.8277 33.2702 27.8897 33.8654 28.0138 34.3776C28.1516 34.876 28.4135 35.2636 28.7995 35.5405C29.1855 35.8173 29.7576 35.9558 30.5157 35.9558C31.2739 35.9558 31.8391 35.8173 32.2113 35.5405C32.5973 35.2636 32.8523 34.876 32.9763 34.3776C33.1142 33.8654 33.1831 33.2702 33.1831 32.5918V24.5143H36.4501V32.3219C36.4501 34.4538 35.9952 36.0388 35.0854 37.0771C34.1756 38.1153 32.6524 38.6344 30.5157 38.6344Z" fill="black"/>
</svg>
<a href="https://jozu.com">
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48" fill="none" title="Jozu">
<path d="M4.5 5.29955L23.885 0L43.27 5.29955V48C43.27 48 32.924 42.7004 23.885 42.7004C14.846 42.7004 4.5 48 4.5 48V5.29955Z" fill="white"/>
<path d="M15.1993 21.6987C13.7519 21.6987 12.6008 21.3457 11.7462 20.6397C10.8915 19.9337 10.3194 18.9923 10.03 17.8156L13.0282 16.7151C13.1109 17.1027 13.2349 17.4834 13.4004 17.8572C13.5796 18.2171 13.8139 18.5147 14.1034 18.7501C14.4067 18.9854 14.772 19.1031 15.1993 19.1031C15.8885 19.1031 16.4124 18.8885 16.7708 18.4594C17.143 18.0164 17.3291 17.2411 17.3291 16.1337V7.57852H20.5961V16.1337C20.5961 17.8641 20.1343 19.2277 19.2107 20.2244C18.3009 21.2073 16.9638 21.6987 15.1993 21.6987Z" fill="black"/>
<path d="M30.5422 21.7153C29.1361 21.7153 27.8955 21.4177 26.8203 20.8224C25.745 20.2272 24.9042 19.3897 24.2976 18.3099C23.6911 17.2301 23.3878 15.9704 23.3878 14.5307C23.3878 13.091 23.6911 11.8312 24.2976 10.7514C24.9042 9.67166 25.745 8.83414 26.8203 8.23888C27.8955 7.64361 29.1361 7.34598 30.5422 7.34598C31.962 7.34598 33.2096 7.64361 34.2848 8.23888C35.36 8.83414 36.2009 9.67166 36.8074 10.7514C37.4277 11.8312 37.7379 13.091 37.7379 14.5307C37.7379 15.9704 37.4277 17.2301 36.8074 18.3099C36.2009 19.3897 35.36 20.2272 34.2848 20.8224C33.2096 21.4177 31.962 21.7153 30.5422 21.7153ZM30.5422 19.0159C31.2176 19.0159 31.838 18.8498 32.4031 18.5175C32.9683 18.1714 33.4163 17.6662 33.7472 17.0017C34.0918 16.3372 34.2641 15.5135 34.2641 14.5307C34.2641 13.5478 34.0918 12.7241 33.7472 12.0596C33.4163 11.3951 32.9683 10.8968 32.4031 10.5646C31.838 10.2185 31.2176 10.0454 30.5422 10.0454C29.8805 10.0454 29.2671 10.2185 28.7019 10.5646C28.1367 10.8968 27.6818 11.3951 27.3372 12.0596C27.0063 12.7241 26.8409 13.5478 26.8409 14.5307C26.8409 15.5135 27.0063 16.3372 27.3372 17.0017C27.6818 17.6662 28.1367 18.1714 28.7019 18.5175C29.2671 18.8498 29.8805 19.0159 30.5422 19.0159Z" fill="black"/>
<path d="M10.4857 38.4132V35.9007L17.454 27.4286H10.7959V24.5422H21.6929V27.0548L14.7866 35.5269H22.003V38.4132H10.4857Z" fill="black"/>
<path d="M30.5157 38.6344C28.3515 38.6344 26.8145 38.1153 25.9047 37.0771C25.0087 36.0388 24.5607 34.4538 24.5607 32.3219V24.5143H27.8277V32.5918C27.8277 33.2702 27.8897 33.8654 28.0138 34.3776C28.1516 34.876 28.4135 35.2636 28.7995 35.5405C29.1855 35.8173 29.7576 35.9558 30.5157 35.9558C31.2739 35.9558 31.8391 35.8173 32.2113 35.5405C32.5973 35.2636 32.8523 34.876 32.9763 34.3776C33.1142 33.8654 33.1831 33.2702 33.1831 32.5918V24.5143H36.4501V32.3219C36.4501 34.4538 35.9952 36.0388 35.0854 37.0771C34.1756 38.1153 32.6524 38.6344 30.5157 38.6344Z" fill="black"/>
</svg>
</a>
</div>
</div>

Expand All @@ -41,24 +43,18 @@ const year = (new Date()).getFullYear()

<div class="text-center space-y-6 text-sm font-bold">
<ul class="flex items-center gap-14 justify-center">
<li>
<a href="https://www.linkedin.com/company/jozu-saas/about/" rel="noopener noreferrer" target="_blank" class="inline-flex items-center gap-2 text-white font-bold justify-center">
Follow us
<svg xmlns="http://www.w3.org/2000/svg" width="31" height="30" viewBox="0 0 31 30" fill="none">
<path d="M24.5 4H6.5C5.395 4 4.5 4.895 4.5 6V24C4.5 25.105 5.395 26 6.5 26H24.5C25.605 26 26.5 25.105 26.5 24V6C26.5 4.895 25.605 4 24.5 4ZM11.454 22H8.504V12.508H11.454V22ZM9.949 11.151C8.998 11.151 8.229 10.38 8.229 9.431C8.229 8.482 8.999 7.712 9.949 7.712C10.897 7.712 11.668 8.483 11.668 9.431C11.668 10.38 10.897 11.151 9.949 11.151ZM22.504 22H19.556V17.384C19.556 16.283 19.536 14.867 18.023 14.867C16.488 14.867 16.252 16.066 16.252 17.304V22H13.304V12.508H16.134V13.805H16.174C16.568 13.059 17.53 12.272 18.965 12.272C21.952 12.272 22.504 14.238 22.504 16.794V22Z" fill="white"/>
</svg>
</a>
</li>
<li>
<a href="https://discord.gg/XzSmtPn3">
<span class="sr-only">discord</span>
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="18" fill="none">
<path fill="#ECECEC" d="M20.83 1.507A20.002 20.002 0 0 0 15.88 0c-.234.414-.446.84-.634 1.276a18.631 18.631 0 0 0-5.495 0C9.56.84 9.35.414 9.115 0A20.143 20.143 0 0 0 4.16 1.511C1.027 6.1.177 10.573.602 14.983A20.04 20.04 0 0 0 6.675 18a14.49 14.49 0 0 0 1.3-2.075 12.98 12.98 0 0 1-2.048-.968c.172-.123.34-.25.502-.374a14.39 14.39 0 0 0 12.142 0c.164.133.332.26.502.374-.654.382-1.34.707-2.052.97.373.726.808 1.42 1.3 2.073a19.952 19.952 0 0 0 6.077-3.015c.498-5.115-.851-9.547-3.568-13.478ZM8.513 12.271c-1.183 0-2.161-1.063-2.161-2.37 0-1.308.944-2.38 2.157-2.38 1.214 0 2.184 1.072 2.164 2.38-.021 1.307-.954 2.37-2.16 2.37Zm7.974 0c-1.186 0-2.16-1.063-2.16-2.37 0-1.308.944-2.38 2.16-2.38 1.215 0 2.178 1.072 2.157 2.38-.02 1.307-.951 2.37-2.157 2.37Z"/>
</svg>
</a>
</li>
<li>
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="24" fill="none">
<span class="sr-only">github</span>
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="24" fill="none" title="">
<path fill="#ECECEC" fill-rule="evenodd" d="M12.464 0C5.848 0 .5 5.5.5 12.304c0 5.44 3.427 10.043 8.18 11.673.595.122.813-.265.813-.59 0-.286-.02-1.264-.02-2.282-3.328.733-4.02-1.467-4.02-1.467-.536-1.426-1.328-1.793-1.328-1.793-1.09-.753.08-.753.08-.753 1.207.081 1.841 1.263 1.841 1.263 1.07 1.873 2.793 1.344 3.487 1.018.099-.795.416-1.345.752-1.65-2.654-.285-5.447-1.345-5.447-6.07 0-1.345.475-2.445 1.228-3.3-.119-.306-.535-1.57.12-3.26 0 0 1.01-.326 3.287 1.263.975-.27 1.981-.407 2.991-.408 1.01 0 2.04.143 2.991.408 2.278-1.59 3.288-1.263 3.288-1.263.654 1.69.238 2.954.12 3.26.772.855 1.227 1.955 1.227 3.3 0 4.725-2.792 5.764-5.467 6.07.436.387.812 1.12.812 2.282 0 1.65-.02 2.974-.02 3.381 0 .326.219.713.813.591 4.754-1.63 8.18-6.234 8.18-11.673C24.429 5.5 19.06 0 12.465 0Z" clip-rule="evenodd"/>
</svg>
</a>
Expand All @@ -77,10 +73,7 @@ const year = (new Date()).getFullYear()
<li><a href="https://jozu.com/acceptable-use" target="_blank">Acceptable use policy</a></li>
</ul>

<ul class="font-normal flex flex-col gap-8 xl:gap-8 items-center justify-center text-off-white list-none">
<li>© {{ year }} All Rights Reserved. Jozu is a product owned by Akara Technologies, Inc.</li>
<li>This site conforms to <strong>Web Content Accessibility Guidelines 2.1</strong></li>
</ul>
<p class="font-normal text-off-white">This site conforms to <strong>Web Content Accessibility Guidelines 2.1</strong></p>
</div>
</footer>
</template>
Loading