Commit Graph

191 Commits

Author SHA1 Message Date
Martin Taillefer 533a3efc0e
Merge from release-1.1 branch (#4012) 2019-04-20 08:16:09 -07:00
mtail 3f6e52e399 Site improvements
- Darken the text color of the selected tab in a tab set.

- Remove extra bottom border line in collapsed sidebar panels.

- Cleaned up accessibility annotations for the sidebar.
2019-03-20 07:28:46 -07:00
Martin Taillefer 28bb1d2ce1 Fix a few text block bugs (#3769)
- HTML tags appearing in bash text block output weren't being escaped properly, making them
disappear.

- Never call prism when syntax coloring is turned off, otherwise things
fail with an exception.
2019-03-19 07:26:41 -07:00
mtail 78b8cb3e29 Fix a couple bugs when the site is switched to release mode. 2019-03-19 06:21:00 -07:00
Martin Taillefer c85c0ca03a Fix tab selection on non-Chrome browsers. (#3733) 2019-03-18 07:56:43 -07:00
Martin Taillefer 2258d0b03b
Improve text blocks. (#3727)
- Add tests for the various text block features.

- Combine text_file and text_dynamic into text_import

- Add support for snippet extraction for text downloaded from a URL

- Add support for formatting output blocks in a different style for
content downloaded from a URL

- Report some errors when unable to fetch content from a URL.

- Fixed a few small bugs along the way.
2019-03-18 06:31:26 -07:00
Martin Taillefer 69830194de
Finish accessibility support in tab sets. (#3720) 2019-03-16 06:55:45 -07:00
mtail 9e9bcd8d14 Improve tab visuals. 2019-03-15 20:09:39 -07:00
Martin Taillefer 0951a97b5f
Text block download fixes. (#3711) 2019-03-15 14:05:08 -07:00
Martin Taillefer bb81b68d9c
Improve boilerplates by adding front-matter marker. (#3693)
Also fixed formatting of multi-paragraph callouts. There
was some unsightly extra spacing at the top and bottom of the callout
in that case.
2019-03-14 13:19:23 -07:00
Martin Taillefer e76ecb4154
1.1 Release notes (#3558)
Note done yet, but need to update the place holder...
2019-03-13 22:30:31 -07:00
Martin Taillefer 1cc06a6e9c
Site improvements (#3677)
- Added call-to-action buttons in the 1.1 announcements. We can use the same
buttons in future release announcements.

- Fixed broken large warning icon on the 404 error page.

- Fix oerder of blog posts in the side bar.

- Add support to not expand @@ notations in text blocks and use
it for a text blocks that's currently triggering a build failure

- Fixed broken rendering of some text blocks when syntax coloring
is turned off via the menu.
2019-03-13 21:53:55 -07:00
Martin Taillefer b67e5126b4
Fix tab problem. (#3614) 2019-03-10 10:55:57 -07:00
Martin Taillefer 74e7ef56b1
Finish keyboard navigation for header & menu. (#3607) 2019-03-10 07:57:42 -07:00
mtail 373916fcfa Improve accessibility
- Increase the constrast for links, per LightHouse analysis.

- Add support for disabling syntax coloring in example text blocks. This
can be controlled from the menu.
2019-03-09 11:56:32 -08:00
Martin Taillefer 4d20265c5c
Bunch of site improvements. (#3601)
- Work on keyboard navigation support. It's not totally done yet,
but its a lot better than it's ever been.

- Fix incorrect font use for code blocks. They were coming out way
smaller than intended.

- Improve the HTML in a variety of ways to make it better for
screen readers.
2019-03-09 07:31:29 -08:00
mtail 92bc65af57 Update Slack logos.
Also, run SVG optimizer on all our images.
2019-03-07 16:10:05 -08:00
mtail c4ea43e386 Tweak the menu display.
Use animation to bring the menu up, and support the ESC
key to hide it.
2019-03-06 18:18:26 -08:00
mtail 6c58f80a7e Tweak positioning of gear menu. 2019-03-06 10:45:00 -08:00
mtail b02af28135 Fix bugs around highlighting the current section in the TOC. 2019-03-06 06:23:01 -08:00
Martin Taillefer beaaf83ba4
Update reference docs. (#3497)
Also fixed a couple CI failures that snuck in.
2019-03-04 14:03:05 -08:00
Martin Taillefer d093f22d0c
Bunch of structural improvements. (#3488)
- Make better use of html semantic elements to help
search & screen readers.

- Add or improve ARIA annotations for accessibility

- Improve print-time formatting.
2019-03-04 07:26:48 -08:00
Martin Taillefer 1d7a4a161e
Fix problem with disappearing hamburger menu on Android. (#3482) 2019-03-03 12:05:51 -08:00
Martin Taillefer 1d4dd5f3e6
Layout improvements for mobile. (#3481) 2019-03-03 11:11:30 -08:00
Martin Taillefer e9e69d0c71
A few formatting fixes. (#3473)
- Reshuffle the floating icons to put the most common thing on top

- In the sidebar, if a card has only top-level items (no subsections)
then move the text to the left to soak up the unused room normally
reserved for the chevron. This improves the look for blog-related cards

- Put a wee bit more spacing between the links in the header on mobile
to make 'em easier to hit with fat fingers.
2019-03-03 08:37:26 -08:00
Martin Taillefer 5a9f78e843
Add a fast language switcher button in preliminary mode. (#3464)
Also, when switching languages, the site now stays at the same page if possible.
This should help with translation work.
2019-03-02 17:39:32 -08:00
Martin Taillefer 18ce618eda
Simplify sidebar logic. (#3463) 2019-03-02 14:45:30 -08:00
Martin Taillefer 33193040a1
Open up Slack to the world. (#3457) 2019-03-01 15:02:21 -08:00
mtail 748fe46dd3 Normalize search result CSS. 2019-02-28 02:20:52 -08:00
Martin Taillefer bedbc83da6
JavaScript cleanup. (#3427)
- Now that the scripts are loaded with 'defer', no need to trigger all
behavior via a DOMContentLoaded event handler as the scripts will all
naturally run after the DOM has been loaded.

- Use a considerably simpler approach to copy to the clipboard in code
blocks. This saves around 10K of script code believe it or not.
2019-02-28 01:38:52 -08:00
mtail 8f3a92c419 Improve page load time by better sequencing things. 2019-02-27 07:41:41 -08:00
mtail b0e49a95a9 Adjust the layout of the headline and sidebar a bit. 2019-02-26 21:37:34 -08:00
mtail 21baddab58 Add s classroom icon. 2019-02-26 20:42:07 -08:00
mtail 58643b10d7 Find a much better icon for Helm. 2019-02-25 21:46:00 -08:00
Martin Taillefer 5ce2285a01
Script cleanup (#3372) 2019-02-25 07:19:06 -08:00
mtail 30e7405e18 CSS cleanup. 2019-02-24 16:55:13 -08:00
Martin Taillefer 19f40b74b7
Redo theming logic. (#3370)
This all got much simpler, more robust, and faster to load by using
CSS variables.
2019-02-24 11:15:17 -08:00
mtail 8103d1f6e1 Disable the Edit This Page functionality for generated files. 2019-02-23 12:54:27 -08:00
Martin Taillefer 0ef9135a83
Add some buttons in preliminary mode. (#3365)
- We now display an "Edit this Page" and a "Report Bugs" button on every page
when rendering the preliminary mode site.

- Optimized the SVG imagery for smaller size and thus faster download & parsing.
2019-02-23 08:34:21 -08:00
mtail aadab8322c Implement a hack to ensure deep-linked table rows don't land under the page header. 2019-02-23 06:46:00 -08:00
mtail 70f61a6549 Fix bad rendering that happened when deep-linking to a table row. 2019-02-22 17:49:35 -08:00
Martin Taillefer 591815c72f
Eliminate the use of bootstrap and jquery. (#3323)
This removes two very large dependencies which ends up making
each page load considerably faster, especially on mobile. Plus,
not using bootstrap actually made several things simpler throughout
the site's logic.
2019-02-21 09:40:10 -08:00
mtail 405ad98764 A few infrastructure fixes
- Added some missing styling on the landing page.

- Fixed extra margin values in the dropdown menu.

- Improved popover positioning on small screens.
2019-02-20 07:44:55 -08:00
Martin Taillefer 959da91043
Infrastructure improvements. (#3306)
- Stop using Bootstrap's tab component.

- Improve the formatting of the hesder on mobile.
2019-02-20 06:41:40 -08:00
mtail 3762b1eda0 Ensure menu links are left-aligned 2019-02-19 09:40:53 -08:00
Martin Taillefer d5a9610fde
Implement custom navbar logic. (#3292)
- Stop using the bootstrap navbar. This new logic is considerably
simpler and gives a much better experience on mobile.
2019-02-19 07:55:45 -08:00
Martin Taillefer 532fe7d365
Add an icon in the title area of glossary term popovers. (#3286) 2019-02-18 13:34:04 -08:00
Martin Taillefer 4fb531c106
Add a sticky effect on the glossary page. (#3283) 2019-02-18 09:10:46 -08:00
Martin Taillefer 2dac7e0ff3
Site infra cleanup. (#3281)
- Refactor script code into smaller more manageable files.

- Use consistent naming style in script code.

- Stop using Bootstrap's dropdowns and popovers in favor of custom implementation.
There are only a few uses of Bootstrap to purge before I can ditch
the dependency on the Bootstrap & JQuery libraries, which will speed
up page loads.

- Find a few more static strings that should come from the xlation
dictionary instead.
2019-02-18 07:35:37 -08:00
mtail 569a4cfde1 A few fixes.
- Fix ordering of the new "Older Notes" entry in the release notes
area to ensure it is always last.

- Fix layout issue with narrow widths clipping a few characters off the left
edge of the page.

- Remove offending href syntax leading to bogus complaints from htmlproofer.
2019-02-15 06:58:41 -08:00
mtail c8e6f0e285 Make switching site versions smarter.
When you select a different version of the site from the gear menu,
we now try to put you on the same page in the other version if that
page exists. If the same page can't be found, then you land at the
root of the other site, like you did before.
2019-02-14 21:34:52 -08:00
mtail a846186fc3 Eliminate manipulation of styles from JavaScript, only deal with classes. 2019-02-14 11:52:47 -08:00
mtail 3102359979 Simplify theme loading. 2019-02-14 05:52:50 -08:00
mtail 1a661fa80d Add support for legacy cookie values. 2019-02-13 22:28:27 -08:00
mtail 0077232110 Fix style switching problem in the updated JavaScript. 2019-02-13 20:34:17 -08:00
mtail 995ade5d61 Fix a null reference in JavaScript. 2019-02-13 20:02:34 -08:00
mtail 27ee224471 NOP changes to see if this will fix Chrome caching issues. 2019-02-13 15:51:16 -08:00
Martin Taillefer 3eba576a89
JavaScript cleanup (#3253)
- Upgrade from UglifyJS to Babel as a JS preprocessor. This lets me use modern ES6 syntax
in the JS code.

- Update JS code to leverage ES6.

- Remove most dependencies on JQuery for faster & smaller code. Once I remove the
dependency on the Bootstrap library, then the dependency on JQuery will also completely
go away.
2019-02-13 10:10:28 -08:00
Martin Taillefer d6b3bfac56
Add support for {{< quote >}} (#3237) 2019-02-12 08:22:28 -08:00
mtail 6875addb8c Layout tweaks. 2019-02-12 07:13:40 -08:00
mtail 99d49417ab Style tweak. 2019-02-11 22:11:02 -08:00
mtail 5728d9c7d1 Adjust callout icon position. 2019-02-11 21:55:10 -08:00
mtail 44db7ca6a0 Adjust color of callout icon. 2019-02-11 21:49:05 -08:00
mtail 8da1d3e8bc Update callout icons to be more in-line with our general style. 2019-02-11 21:42:05 -08:00
Martin Taillefer e9112e7a65
More style cleanup. (#3230) 2019-02-11 21:07:03 -08:00
Martin Taillefer eefe51cdac Fix #1324 to the code block EOF logic. (#3229) 2019-02-11 13:23:23 -08:00
mtail 8a204d754e Fix behavior of <<EOF in the middle of a line in a text block. 2019-02-11 10:07:02 -08:00
mtail a84091c02c A few more layout fixes.
- Improve primary layout to deal with edge cases better.

- Make FAQ landing page use a masonry layout.
2019-02-11 09:44:26 -08:00
mtail e2aec3458e Improve the glossary popovers so they work better on mobile. 2019-02-10 20:36:25 -08:00
mtail 9ad3ad771c A few more fixes. 2019-02-10 19:12:13 -08:00
mtail efdae03b36 A few more fixes following the big cleanup. 2019-02-10 16:17:45 -08:00
mtail 6f7fa1445f A few layout tweaks following the big cleanup. 2019-02-10 07:52:43 -08:00
Martin Taillefer 141a2182c2
A bunch of infrastructure cleanup. (#3221)
- Switch from the Bootstrap grid system to the CSS grid. Much cleaner and faster.

- Add "See also" and "Links" to the list of translation strings

- Prevent the breadcrumb line from being included in the link endnotes when printing a page.

- Cleanup/rename several of the CSS and layout files for clarity.

- Switch the community page from using clumsy tables to a much cleaner approach
with shortcodes.

- Don't show buttons in the link endnotes when printing a page.

- Don't render the link endnotes section at all if the page has no links to include
2019-02-10 07:21:19 -08:00
Martin Taillefer c32db038ed
Introduce support for glossary term highlighting. (#3211)
- You can now mark a word as being a glossary term. This will trigger special rendering inviting the
user to click on the item in order to get a popup window showing the glossary text for the term. This
is very nice when introducing a new term within a page.

- Updated our dependency  on Bootstrap and ClipboardJS to the latest versions.
2019-02-08 07:29:38 -08:00
Martin Taillefer 68bb3e5b4e
Fix hard-to-read color combination with table headers + code blocks. (#3207) 2019-02-07 10:05:25 -08:00
mtail 66b3dbee50 Quick CSS adjustments to the new warning/tip/idea callouts 2019-02-01 17:12:48 -08:00
Martin Taillefer dd782b3d12
Improve the looks of warnings, info blobs, and tips. (#3181) 2019-01-31 12:11:53 -08:00
Martin Taillefer 4b22211317
Add breadcrumbs at the top of each content page. (#3093) 2019-01-16 09:46:52 -08:00
Martin Taillefer 4c17edcd56
Fix a few issues. (#3092)
- Fix formatting for the Subscribe link on blog pages. That got broken in some refactoring I did a while back.

- Remove a few *NOTE* and _NOTE_ instances and replace with the canonical icons

- Add a link to our community repo in the Getting Involved page.
2019-01-15 20:50:00 -08:00
Martin Taillefer d7c4eb33f5
Switch to discuss.istio.io (#3071) 2019-01-10 07:11:00 -08:00
Martin Taillefer 777abf274a
Improve tab behavior. (#2923)
- Address rendering issue with text blocks nested in a tab that use
the magic @@ linking sequence.

- Made it so when selecting a tab in a particular tab set, other tabset
sharing the same cookie name on the current page will also switch to their
corresponding tab.
2018-11-27 07:25:15 -08:00
Martin Taillefer 9cbb0db783
Clearly indicate which version of k8s we support. (#2786) 2018-10-19 12:53:12 -07:00
Mark van Straten e146dbb97f Fix logo hover state rotation (#2781)
* Fix logo hover state rotation

The logo rotates upon hover but it was not centered correctly. This was caused
because no explicit height was defined for the logo container. By doing so
we now can have the transform use 50%,50% as the center point for smooth
rotations.

This change has been tested in Chrome Version 69.0.3497.100 (Official Build)

* Make the logo be actually circulair

The SVG radius did not account for the border of the circle
causing it to be chopped off at the edges. By subtracting
the border size from the radius (*2) we now have a perfect
looking circle.

This change has been tested in Chrome Version 69.0.3497.100 (Official Build)

* make build scss => css
2018-10-19 11:14:23 -07:00
Martin Taillefer a2026aab5e
Clean up a bunch of loose ends (#2745) 2018-10-05 22:21:56 -07:00
mtail ecbdbd787f Fix logo rendering for partner components. 2018-10-05 11:59:25 -07:00
Martin Taillefer aec96f3233
Add support for logos in partner components (#2724)
* Add support for logos for partner components.

* Update reference docs.
2018-10-02 12:04:15 -07:00
Martin Taillefer 208760597b
Add support for partner components. (#2704)
Partner components (adapters not controlled by the Istio org) are now
called out as such on their page. Component authors have a chance to put
all sorts of info about their component to make it easy for customers
to find and use their component.
2018-09-28 15:40:10 -07:00
Martin Taillefer edfdf7d795
Site improvements. (#2663)
* Site improvements.

- For SVG images, authors no longer need to specify image ratios
(which is a constant source of errors)

- Move more icons into the new icons.svg file to further reduce
average page load times.

- Rationalize Istio logo file names.

- Improve underlining behavior for sidebar headers and the RSS feed
Subscribe link.

- Made the RSS feed subscribe link open in a new tab.

- Increase the constract ratio for some elements in dark mode
text blocks (namely, YAML field names)

- Reduce the "brightness" of the light bulb icon which helps it
not pop so much in dark mode.

- Optimize the fonts we load and the order we load them in so as to improve page load time and
reduce the initial render time.

* Sadly, embedding SVGs into the HTML results in duplicate element ids, which is invalid HTML :-(
2018-09-21 17:56:46 -07:00
Martin Taillefer 0a4264417f
Site improvements (#2633)
- Use a new approach to managing icons. This has two primary benefits:

  - It makes it possible to color the icons such that they look good in the
    dark theme. Previously, the icons were rendered in black on dark grey when
    using the dark theme.

  - The average payload size for our web pages is reduced and we better use the
    browser cache.

- The new icon approach makes it possible to remove our dependency on the fontawesome
  package, which further slims down our payload requirement

- Refresh our iconography for a slightly lighter look.

- Remove the extra thick left-hand border of text blocks to lighten the
look.

- Added a "NN minutes to read" indication on top of each page. This is
only displayed if the count is > 1 minute.

- Added a calendar icon next to the blog post date.

- Exposed a bunch of strings that were buried in CSS/JS to translation.

- Add the 'keywords:' front-matter fields to the Hugo archetypes.
2018-09-17 08:52:23 -07:00
Martin Taillefer ab869ca88f
Fix compatibility issue with dynamic text and Firefox. (#2523) 2018-09-05 09:36:18 -07:00
mtail 69905f95da Fix rendering bug with the output section of some text blocks, 2018-09-02 08:53:42 -07:00
Martin Taillefer 815aaaa72e
Finish implementing tab support. (#2492)
- Support cookies. Tab setting are now remembered across page visits. Set it, and forget it.

- Fix problems with nested text blocks.
2018-09-01 08:59:39 -07:00
Martin Taillefer 99be6fd164
Add support for tabbed content. (#2484) 2018-08-31 08:13:21 -07:00
Martin Taillefer 2796aca4ac
Add download, diff, and docs links to release notes. (#2441) 2018-08-28 13:07:27 -07:00
Martin Taillefer 7c34e8aaa1
Add 'Customers' and 'Partners' pages (#2266) 2018-08-27 07:27:38 -07:00
Martin Taillefer 59fe531036
Formatting improvements for mobile. (#2397)
- Fix background color of text areas not being applied correctly for extra-wide blocks.

- Incressed padding around text areas in mobile to make selection easier.

- Removed the right-hand side indent of text areas and block quotas when in mobile.

- Reduced the left-hand side indent of block quotas on mobile.
2018-08-26 06:00:31 -07:00
mtail dc8076aba2 Fix overlapping sidenav button on mobile. 2018-08-25 07:17:07 -07:00
mtail 0cfa623f60 Fix position of hero text on landing page, on mobile. 2018-08-25 07:17:07 -07:00
Martin Taillefer 5e29d61ff2
Bunch of site fixes & improvements. (#2306)
- Correct the use of OpenGraph annotations. I used the wrong attribute name, so the
annotations were never recognized.

- Added support for Twitter cards to our site, improving the experience of referencing
the site from Twitter posts.

- Added support for the twitter: front matter field for use in blog posts. Specifying this
front-matter entry will show the author's twitter address on the blog post, and will
add a Twitter card entry to the page noting the author's address.

- Renamed the page_icon front matter field to just icon to be consistent with other
entries.

- Made it so the subtitle front matter field can be used anywhere, not just on blog posts.

- Added a lint check to ensure subtitles don't end with a period.

- We now insert an "author" metadata entry whenever the attribution: front matter
field is used.
2018-08-19 11:51:03 -07:00
Martin Taillefer 894b0b6b5a
CSS fixes (#2229)
Improve long-standing hack that makes link anchors and a sticky nav header
work together. The improved hack deals correctly with varying font sizes,
removing the need for custom hackery for the FAQ and Glossary pages.

Fixes a slight rendering discrepency when printing pages.
2018-08-12 05:46:57 -07:00