Skip to content

Commit 670d283

Browse files
KenniMartinezMKenniMjohnsmartcoeric-schneider
authored
Updating branch to check new Dependabot issues (#66)
* Merge new 404 design into main (#57) * Initial rebranding styles Changed header and footer background color for both light and dark modes * Initial rebranding styles * Fixing styles The headings should no longer be underlined and cards should now show have black as font color in dark mode * Fixes in links The links and titles should now show properly in cards for both dark and light modes * Rebranding styles This commit includes multiple changes for the rebranding styles, like changing some colors. * The right content bar should now be sticky to the page, making it always available with no need to scroll to the top * Collapse and Expand all buttons has been added for the left navbar * The GCX code component should now take all the entire height from the body space on the website. * The code blocks should no longer have bold font * New 404 docs design This commit includes the new content and style applied to the antora 404 page. * Update 404.hbs This update includes the relative paths used on the live server * Update 404.hbs Changed location to /en/home * 404 footer fix The footer for the 404 page should now be fixed at the bottom of the device * 404 Fixes Fixed 404 design for mobile and error on console fixed * Update 404.hbs Testing permissions * Update 404.hbs Fixed relative paths on 404 page --------- Co-authored-by: Kenni Martínez <57879404+KenniM@users.noreply.github.com> * Fix 404 encoding (#61) * Initial rebranding styles Changed header and footer background color for both light and dark modes * Initial rebranding styles * Fixing styles The headings should no longer be underlined and cards should now show have black as font color in dark mode * Fixes in links The links and titles should now show properly in cards for both dark and light modes * Rebranding styles This commit includes multiple changes for the rebranding styles, like changing some colors. * The right content bar should now be sticky to the page, making it always available with no need to scroll to the top * Collapse and Expand all buttons has been added for the left navbar * The GCX code component should now take all the entire height from the body space on the website. * The code blocks should no longer have bold font * New 404 docs design This commit includes the new content and style applied to the antora 404 page. * Update 404.hbs This update includes the relative paths used on the live server * Update 404.hbs Changed location to /en/home * 404 footer fix The footer for the 404 page should now be fixed at the bottom of the device * 404 Fixes Fixed 404 design for mobile and error on console fixed * Update 404.hbs Testing permissions * Update 404.hbs Fixed relative paths on 404 page * Updated 404.hbs This should fix the encoding for this page. * Change L88 to use single plain quote in the word can't --------- Co-authored-by: Kenni Martínez <57879404+KenniM@users.noreply.github.com> Co-authored-by: John Smart <johnsmartnh@gmail.com> * Left Nav Improvements (#65) This should fix a visual issue when using some new types of nav elements Co-authored-by: Kenni Martínez <57879404+KenniM@users.noreply.github.com> * Update README.adoc * Update README.adoc --------- Co-authored-by: Kenni Martínez <57879404+KenniM@users.noreply.github.com> Co-authored-by: John Smart <johnsmartnh@gmail.com> Co-authored-by: Eric Schneider <37347760+eric-schneider@users.noreply.github.com>
1 parent 4c53fb2 commit 670d283

File tree

8 files changed

+158
-26
lines changed

8 files changed

+158
-26
lines changed

‎README.adoc‎

Lines changed: 7 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
= DataStax Antora UI
22
// Variables:
3-
:current-release: prod-2
3+
:current-release: prod-9
44
// Settings:
55
:!example-caption:
66
:experimental:
@@ -16,26 +16,21 @@ ifdef::env-github[]
1616
:!toc-title:
1717
:badges:
1818
endif::[]
19-
// Project URLs:
20-
:url-project: git@github.com:riptano/antora-ui-docs.git
19+
// Project URIs:
20+
:project-repo-name: riptano/antora-ui-docs
21+
:url-project: https://github.com/{project-repo-name}
2122
:url-site: https://docs.datastax.com
22-
//:url-preview: https://gitlab.com/antora/antora-ui-default
23-
// External URLs:
23+
:url-repo: git@github.com:{project-repo-name}.git
24+
// External URIs:
2425
:url-antora: https://antora.org
25-
:url-antora-docs: https://docs.antora.org
26-
:url-antora-default-ui: https://gitlab.com/antora/antora-ui-default
2726
:url-git: https://git-scm.com
2827
:url-git-dl: {url-git}/downloads
2928
:url-gulp: http://gulpjs.com
30-
:url-opendevise: https://opendevise.com
31-
:url-nodejs: https://nodejs.org
29+
:url-node: https://nodejs.org
3230
:url-nvm: https://github.com/creationix/nvm
3331
:url-nvm-install: {url-nvm}#installation
34-
:url-source-maps: https://developer.mozilla.org/en-US/docs/Tools/Debugger/How_to/Use_a_source_map
35-
:url-create-release: https://docs.github.com/en/repositories/releasing-projects-on-github/managing-releases-in-a-repository#creating-a-release
3632
:url-datastax: https://datastax.com
3733

38-
3934
ifdef::badges[]
4035
image:https://img.shields.io/static/v1?label=release&amp;message={current-release}&amp;color=blue[Latest Release,link={url-project}/releases/download/{current-release}/ui-bundle.zip,format=svg]
4136
endif::[]

‎gcx/gulpfile.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ const bundleJSsrc = () =>
3939

4040
// Bundle a site.js for the 404 error page, excluding 01-nav.js
4141
const bundleJS404 = () =>{
42-
return src(['styles/src/js/*.js','!styles/src/js/01-nav.js'])
42+
return src(['styles/src/js/*.js','!styles/src/js/01-nav.js', '!styles/src/js/08-gcx-helios.js'])
4343
.pipe(concat('site404.js'))
4444
.pipe(dest('build/js'));
4545
}

‎gcx/styles/src/css/helios-gcx-body.css‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -227,3 +227,8 @@ main > .content {
227227
}
228228
}
229229

230+
@media screen and (max-width: 767px) {
231+
article.doc .center{
232+
max-width: 100%!important;
233+
}
234+
}

‎gcx/styles/src/css/helios-gcx-footer.css‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,3 @@ footer .container-fluid {
1919
.copyright-line {
2020
font-weight: bold;
2121
}
22-
23-
.wh_footer.notFound{
24-
position: fixed;
25-
}
26-

‎gcx/styles/src/css/helios-gcx-links.css‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -74,4 +74,16 @@
7474

7575
.dark-mode .doc .admonitionblock.note a {
7676
color: var(--color-white)!important;
77+
}
78+
79+
.dark-mode .doc .admonitionblock.important a {
80+
color: var(--color-white)!important;
81+
}
82+
83+
.dark-mode .doc .admonitionblock.warning a {
84+
color: var(--color-white)!important;
85+
}
86+
87+
.dark-mode .doc .admonitionblock.tip a {
88+
color: var(--color-white)!important;
7789
}

‎gcx/styles/src/css/helios-gcx-sidebar.css‎

Lines changed: 52 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/*Navigation Sidebar*/
21
.nav-menu>.nav-list {
32
display: flex;
43
flex-direction: column;
@@ -67,6 +66,48 @@ a.nav-link {
6766
position: relative;
6867
}
6968

69+
/*.nav-item[data-depth="0"]:has(> span.nav-text) {
70+
padding: 8px 0px!important;
71+
margin-top: 8px!important;
72+
}
73+
74+
75+
.nav-item[data-depth="0"]:has(> span.nav-text) .nav-text:hover {
76+
background-color: #f6f8fa;
77+
}
78+
79+
.nav-item[data-depth="0"]:has(> span.nav-text):hover {
80+
background-color: #f6f8fa;
81+
}
82+
83+
.dark-mode .nav-item[data-depth="0"]:has(> span.nav-text):hover {
84+
background-color: var(--color-purple-secondary-dark);
85+
}
86+
87+
.dark-mode .nav-item[data-depth="0"]:has(> span.nav-text) .nav-text:hover {
88+
background-color: var(--color-purple-secondary-dark);
89+
}
90+
91+
.nav-item[data-depth="0"]:has(> span.nav-text) .nav-text {
92+
font-size: 15px!important;
93+
}*/
94+
.nav-item[data-depth="0"]:has(> span.nav-text) {
95+
margin-top: 8px!important;
96+
}
97+
98+
.nav-item[data-depth="0"]> span.nav-text {
99+
display: block;
100+
width: 100%;
101+
}
102+
103+
.nav-item[data-depth="0"]> span.nav-text:hover {
104+
background-color: #f6f8fa;
105+
}
106+
107+
.dark-mode .nav-item[data-depth="0"]> span.nav-text:hover {
108+
background-color: var(--color-purple-secondary-dark);
109+
}
110+
70111
li.nav-item.toggler.is-active:hover {
71112
background-color: #FFF;
72113
}
@@ -294,11 +335,17 @@ label.collapse_label:after {
294335
height: 100%;
295336
}
296337

297-
.nav-item.is-active[data-depth="1"] li[data-depth="2"]>a.nav-link {
338+
.nav-item> span.nav-text{
339+
font-size: 15px;
340+
}
341+
342+
.nav-item.is-active[data-depth="1"] li[data-depth="2"]>a.nav-link,
343+
.nav-item.is-active[data-depth="0"]>span.nav-text~ul .nav-item[data-depth="1"] >a.nav-link {
298344
padding: 8px 62px;
299345
}
300346

301-
.nav-item.is-active[data-depth="2"] li[data-depth="3"]>a.nav-link {
347+
.nav-item.is-active[data-depth="2"] li[data-depth="3"]>a.nav-link,
348+
.nav-item.is-active[data-depth="0"]>span.nav-text~ul .nav-item[data-depth="2"] >a.nav-link {
302349
padding: 8px 0 8px 90px;
303350
}
304351

@@ -322,7 +369,8 @@ label.collapse_label:after {
322369
.nav-item.is-current-path[data-depth="1"], .nav-item.is-current-path[data-depth="2"], .nav-item.is-current-path[data-depth="3"] {
323370
padding: 0;
324371
}
325-
.nav-item.is-active[data-depth="3"] li[data-depth="4"]>a.nav-link {
372+
.nav-item.is-active[data-depth="3"] li[data-depth="4"]>a.nav-link,
373+
.nav-item.is-active[data-depth="0"]>span.nav-text~ul .nav-item[data-depth="3"] >a.nav-link {
326374
padding: 8px 16px 8px 120px;
327375
}
328376

‎gcx/styles/src/js/08-gcx-helios.js‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -114,3 +114,24 @@ document.querySelector(".nav-controls button#collapse").addEventListener("click"
114114
})
115115
})
116116

117+
document.querySelectorAll(`.nav-item>span.nav-text+.nav-item-toggle`).forEach(function (btn) {
118+
btn.addEventListener('mouseover', (event) => {
119+
var theme = document.querySelector('html').classList.contains('dark-mode')
120+
if (theme) {
121+
btn.previousElementSibling.style.backgroundColor = 'var(--color-purple-secondary-dark)'
122+
} else {
123+
btn.previousElementSibling.style.backgroundColor = 'var(--color-purple-secondary-light)'
124+
btn.previousElementSibling.style.color = 'var(--color-interface-night-900)'
125+
}
126+
})
127+
btn.addEventListener('mouseout', (event) => {
128+
btn.previousElementSibling.style.backgroundColor = ''
129+
btn.previousElementSibling.style.color = ''
130+
})
131+
})
132+
133+
document.querySelectorAll(".nav-item> span.nav-text").forEach(function (item) {
134+
item.addEventListener("click", function (event) {
135+
item.parentElement.classList.toggle("is-active");
136+
})
137+
})

‎gcx/styles/src/layouts/404.hbs‎

Lines changed: 60 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,14 @@
66
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
77
<link rel="stylesheet" href="/en/home/assets/css/site.css">
88
<title>Oops! We can't find that page {{#with site.title}} :: {{this}}{{/with}}</title>
9+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
10+
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
911
</head>
1012

11-
<body class="status-404">
13+
<body class="article status-404">
1214
<header class="header">
1315
<nav class="navbar">
1416
<div class="navbar-brand">
15-
<!-- <a href="{{{or site.url (or siteRootUrl siteRootPath)}}}"> -->
1617
<a href="https://docs.datastax.com">
1718
<img src="/en/home/assets/img/logo.svg" alt="">
1819
</a>
@@ -84,7 +85,7 @@
8485
margin-top: 6rem;
8586
margin-bottom: 6rem;
8687
">
87-
<h1 class="page" style="font-size: calc(2rem + 2px);">Oops! We can’t find that page. </h1>
88+
<h1 class="page" style="font-size: calc(2rem + 2px);">Oops! We can't find that page. </h1>
8889
<div class="paragraph">
8990
<p style="font-size: calc(1rem + 2px); text-align: justify;">The page you're looking for doesn't exist. It might have been moved or
9091
maybe there was a typo in the URL. If you typed the URL of this page manually, please double check that you
@@ -166,5 +167,60 @@
166167
root.classList.add('dark-mode');
167168
}
168169
}();
170+
171+
function isMobile () {
172+
// eslint-disable-next-line no-undef
173+
if (sessionStorage.desktop) return false
174+
// eslint-disable-next-line no-undef
175+
else if (localStorage.mobile) return true
176+
// eslint-disable-next-line max-len
177+
var mobile = ['iphone', 'ipad', 'android', 'blackberry', 'nokia', 'opera mini', 'windows mobile', 'windows phone', 'iemobile']
178+
for (var i in mobile) { if (navigator.userAgent.toLowerCase().indexOf(mobile[i].toLowerCase()) > 0) return true }
179+
return false
180+
}
181+
182+
window.addEventListener('DOMContentLoaded', (event) => {
183+
var theme = window.localStorage.getItem('theme')
184+
185+
var path = window.location.pathname
186+
var page = path.split('/').pop()
187+
var name = page.replace('.html', '')
188+
console.log(name)
189+
const sidebar = document.querySelector('.sidebar')
190+
const col = document.getElementById('collapse')
191+
var checkbox = document.getElementById('switch')
192+
if (theme) {
193+
checkbox.checked = true
194+
} else {
195+
checkbox.checked = false
196+
}
197+
198+
if (name === 'landing' && !isMobile()) {
199+
col.checked = true
200+
sidebar.classList.add('small-container')
201+
}
202+
203+
var elements = document.body.getElementsByTagName('pre')
204+
for (var i = 0; i < elements.length; i++) {
205+
for (const child of elements[i].children) {
206+
if (child.tagName === 'CODE') {
207+
elements[i].classList.add('has-code')
208+
}
209+
}
210+
}
211+
212+
document.addEventListener('click', function (event) {
213+
if (event.target.matches('.switch')) {
214+
var root = document.getElementsByTagName('html')[0]
215+
if (event.target.checked) {
216+
window.localStorage.setItem('theme', 'dark')
217+
root.classList.add('dark-mode')
218+
} else {
219+
window.localStorage.removeItem('theme')
220+
root.classList.remove('dark-mode')
221+
}
222+
}
223+
}, false)
224+
})
169225
</script>
170-
</body>
226+
</body>

0 commit comments

Comments
 (0)