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

typography, cta and colors #135

Merged
merged 5 commits into from
Nov 17, 2023
Merged

typography, cta and colors #135

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
5f4ffd2
typography, cta and colors
ObedVega Nov 16, 2023
5b40933
fix in request footer
ObedVega Nov 17, 2023
49896d3
new contribute svg icon
ObedVega Nov 17, 2023
04b0cc5
no padding in tile-action class
ObedVega Nov 17, 2023
462c679
padding in icon
ObedVega Nov 17, 2023
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
3 changes: 3 additions & 0 deletions supplemental_ui/img/icons/contribute-icon.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
21 changes: 15 additions & 6 deletions supplemental_ui/partials/head-meta.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -681,8 +681,8 @@ aside.toc.sidebar {
}

.toc .toc-menu a.is-active {
border-left-color: #007373;
color: #333;
border-left-color: #FF5F02;
color: rgba(0, 0, 0, 0.87);
}

.page-controls {
Expand Down Expand Up @@ -727,7 +727,7 @@ aside.toc.sidebar {
}

.doc .admonitionblock.question {
background-color: #eaf3f2;
background-color: #0000000A;
}

.doc .admonitionblock.tip {
Expand All @@ -747,7 +747,7 @@ aside.toc.sidebar {

.doc .admonitionblock.question .icon {
background-color: initial;
color: #007373;
color: rgba(0, 0, 0, 0.87);;
}

.doc .admonitionblock.tip .icon {
Expand All @@ -757,10 +757,15 @@ aside.toc.sidebar {

.doc .admonitionblock .icon {
position: absolute;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px;
letter-spacing: 0.25px;
padding: 12px 0px 0px 72px;
-webkit-transform: none;
transform: none;
text-transform: capitalize;

}

.doc .admonitionblock td.content {
Expand All @@ -777,7 +782,11 @@ aside.toc.sidebar {

.doc .admonitionblock p,
.doc .admonitionblock td.content {
font-size: 16px;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px;
letter-spacing: 0.25px;
}

i.fa[class*=' icon-']::before {
Expand Down
12 changes: 6 additions & 6 deletions supplemental_ui/partials/header-content.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,10 +133,10 @@
<div class="slide-up-down__container hidden" style="--content-height: 94; transition: height 500ms ease-in-out 0s;">
<ul class="ps-3 list">
<li>
<a class="nav-2 py-4 d-block color-slate" href="/Getting-Started/Pricing">VantageCloud Lake Documentation</a>
<a class="nav-2 py-4 d-block color-slate" href="https://docs.teradata.com/p/VantageCloud/Lake">VantageCloud Lake Documentation</a>
</li>
<li>
<a class="nav-2 py-4 d-block color-slate" href="/Getting-Started/Pricing/Calculator">All Documentation</a>
<a class="nav-2 py-4 d-block color-slate" href="https://docs.teradata.com/">All Documentation</a>
</li>
</ul>
</div>
Expand All @@ -158,20 +158,20 @@
<div class="slide-up-down__container hidden" aria-hidden="false" style="--content-height: 235; transition: height 500ms ease-in-out 0s;">
<ul class="ps-3 list">
<li>
<a class="nav-2 py-4 d-block color-slate" href="/University/Overview">Teradata Community</a>
<a class="nav-2 py-4 d-block color-slate" href="https://support.teradata.com">Teradata Community</a>
</li>
<li>
<a class="nav-2 py-4 d-flex align-items-center color-slate" href="/University/Certification">
<a class="nav-2 py-4 d-flex align-items-center color-slate" href="https://medium.com/teradata">
Technical Medium Blogs&nbsp;&nbsp;<img src='{{uiRootPath}}/img/small-external.svg' class="mtop">
</a>
</li>
<li>
<a class="nav-2 py-4 d-flex color-slate" href="https://docs.teradata.com" target="_blank" rel="noopener">
<a class="nav-2 py-4 d-flex color-slate" href="https://github.com/Teradata" target="_blank" rel="noopener">
GitHub&nbsp;&nbsp;<img src='{{uiRootPath}}/img/small-external.svg' class="e">
</a>
</li>
<li>
<a class="nav-2 py-4 d-flex color-slate" href="https://downloads.teradata.com" target="_blank" rel="noopener">
<a class="nav-2 py-4 d-flex color-slate" href="https://stackoverflow.com/questions/tagged/teradata" target="_blank" rel="noopener">
Stack Overflow&nbsp;&nbsp;<img src='{{uiRootPath}}/img/small-external.svg' class="">
</a>
</li>
Expand Down
136 changes: 83 additions & 53 deletions supplemental_ui/partials/landing.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,16 @@
Get up to speed with Teradata Vantage. Learn about its features. Find solutions for common tasks. Explore sample source code.
</div>
<div class="button-container">
<a class="call-to-action-button" href="https://www.teradata.com/experience">Get access to Teradata Vantage</a>
<a class="call-to-action-button-secondary" href="#browse-content">Browse content</a>
<a class="call-to-action-button-secondary" href="https://www.teradata.com/experience" style="width: 154px;">Contribute
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path d="M9.35008 11.9669L8.63341 11.2669L11.4334 8.46686H2.66675V7.46686H11.4334L8.61675 4.6502L9.33341 3.9502L13.3501 7.96686L9.35008 11.9669Z" fill="#00233C"/>
</svg>
</a>
<a class="call-to-action-button-secondary" href="#browse-content" style="width: 132px;">Request
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path d="M9.35008 11.9669L8.63341 11.2669L11.4334 8.46686H2.66675V7.46686H11.4334L8.61675 4.6502L9.33341 3.9502L13.3501 7.96686L9.35008 11.9669Z" fill="#00233C"/>
</svg>
</a>
</div>
<div class="alternate-action">
Existing customer or partner? Explore courses at <a href="https://teradata.com/University/Overview">Teradata University</a>.
Expand Down Expand Up @@ -293,7 +301,12 @@
<img src="{{uiRootPath}}/img/mulesoft.logo.svg" alt="Mulesoft Logo" title="Mulesoft" width="" height=""/>
<img src="{{uiRootPath}}/img/teradata-logo.png" alt="Teradata Logo" title="Teradata" width="" height=""/>
</div>
<div class="tile-action">view</div>
<div class="tile-action">
View
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path d="M9.35008 11.9669L8.63341 11.2669L11.4334 8.46686H2.66675V7.46686H11.4334L8.61675 4.6502L9.33341 3.9502L13.3501 7.96686L9.35008 11.9669Z" fill="#00233C"></path>
</svg>
</div>
</div>
</a>
</div>
Expand All @@ -308,7 +321,12 @@
<img src="{{uiRootPath}}/img/gcp.logo.svg" alt="Google Cloud Logo" title="Google Cloud" width="" height=""/>
<img src="{{uiRootPath}}/img/teradata-logo.png" alt="Teradata Logo" title="Teradata" width="" height=""/>
</div>
<div class="tile-action">view</div>
<div class="tile-action">
View
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path d="M9.35008 11.9669L8.63341 11.2669L11.4334 8.46686H2.66675V7.46686H11.4334L8.61675 4.6502L9.33341 3.9502L13.3501 7.96686L9.35008 11.9669Z" fill="#00233C"></path>
</svg>
</div>
</div>
</a>
</div>
Expand All @@ -321,7 +339,12 @@
<img src="{{uiRootPath}}/img/java.logo.svg" alt="Java Logo" title="Java" width="" height=""/>
<img src="{{uiRootPath}}/img/teradata-logo.png" alt="Teradata Logo" title="Teradata" width="" height=""/>
</div>
<div class="tile-action">view</div>
<div class="tile-action">
View
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path d="M9.35008 11.9669L8.63341 11.2669L11.4334 8.46686H2.66675V7.46686H11.4334L8.61675 4.6502L9.33341 3.9502L13.3501 7.96686L9.35008 11.9669Z" fill="#00233C"></path>
</svg>
</div>
</div>
</a>
</div>
Expand All @@ -330,18 +353,20 @@
<div class="doc">
<div class="admonitionblock question landing-page">
<table>
<tbody><tr>
<td class="icon">
<i class="fa icon-question"></i>Didn’t find what you were looking for?
</td>
<td class="content">
Contribute or request a topic
</td>
<td class="question-action">
<a href="https://github.com/Teradata/quickstarts/issues">request</a>
<a href="https://github.com/Teradata/quickstarts">contribute</a>
</td>
</tr>
<tbody>
<tr>
<td class="icon">
<img src="{{uiRootPath}}/img/icons/contribute-icon.svg" class="icon-color">
Didn’t find what you were looking for?
</td>
<td class="content">
Contribute or request a topic
</td>
<td class="question-action">
<a href="https://github.com/Teradata/quickstarts/issues">Request</a>
<a href="https://github.com/Teradata/quickstarts">Contribute</a>
</td>
</tr>
</tbody>
</table>
</div>
Expand All @@ -361,14 +386,14 @@
main.article {
padding-bottom: 30px;
}

/*
@media screen and (max-width: 576px) {
.call-to-action .call-to-action-button,
.call-to-action .call-to-action-button-secondary {
width: 100%;
}
}

*/
@media screen and (max-width: 820px) {
.call-to-action {
background-image: none;
Expand Down Expand Up @@ -446,6 +471,7 @@
font-family: Inter,sans-serif;
font-size: 20px;
line-height: 28px;
font-weight: 600;
letter-spacing: 0.15px;
color: rgba(0, 0, 0, 0.87);
}
Expand Down Expand Up @@ -585,24 +611,24 @@
}

.tile-action {
font-family: Inter,sans-serif;
font-size: 14px;
line-height: 16px;
letter-spacing: 0.5px;
text-transform: uppercase;
color: #007373;
border: 1px #007373 solid;
border-radius: 8px;
padding: 9px 8px;
font-family: Inter;
font-size: 16px;
line-height: 24px;
font-style: normal;
font-weight: 600;
line-height: 24px;
color: #00233C;
/* padding: 9px 8px;*/
position: absolute;
bottom: 24px;
right: 24px;
}

.call-to-action-button {
.call-to-action-button{
background: #007373;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.14), 0px 3px 4px rgba(0, 0, 0, 0.12), 0px 1px 5px rgba(0, 0, 0, 0.2);
border-radius: 8px;
border-radius: 12px;
border: 1px solid #00233C;
text-transform: uppercase;
text-decoration: none;
font-family: Inter,sans-serif;
Expand All @@ -619,35 +645,35 @@

.button-container {
margin-top: 15px;
display: inline-flex;
gap: 5px;
}

.call-to-action-button:hover {
text-decoration: none;
}

.call-to-action-button-secondary {
border: 1px solid rgba(0, 0, 0, 0.6);
box-sizing: border-box;
border-radius: 8px;
text-transform: uppercase;
text-decoration: none;
font-family: Inter,sans-serif;
font-size: 14px;
line-height: 16px;
letter-spacing: 0.5px;
text-align: center;
text-transform: uppercase;
color: rgba(0, 0, 0, 0.87);
padding: 11px 12px;
margin-top: 15px;
background: #eaf2f2;
display: inline-block;
color: #00233C;
font-family: Inter;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 26px;
border-radius: 12px;
border: 1px solid #00233C;
padding: 16px;
height: 58px;
}

.call-to-action-button-secondary:hover {
text-decoration: none;
background-color: #dfdddd;
}

.call-to-action-button-secondary svg {
margin-left: 5px;
}
.search-result-dropdown-menu {
top: initial;
right: initial;
Expand All @@ -666,15 +692,19 @@

.question-action {
width: 280px;
font-family: Inter,sans-serif;
font-size: 14px;
line-height: 16px;
letter-spacing: 0.5px;
text-transform: uppercase;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 24px;
}
.icon-color{
position: absolute;
top: 24px;
left: 26px;
}

.question-action a {
color: rgba(0, 0, 0, 0.87);
color: #00233C;
padding: 0px 20px;
}

Expand Down
Loading