Some icons on the demo were not centered correctly, such as the custom
content tab's "plus" button. Some conflicting styles were changing
the line-height.
Change-Id: I08c9bb01642346b1a3b1162f779300221ae23246
Some very long URLs can appear in the error text, and word wrapping is
very helpful. This change sets styles on the element to wrap text
anywhere.
Change-Id: I9b1ddc97f90d5f1b2f5e532efd7c53f747576db5
This icon went missing in the change "Apply upstream styles for icons
font" (Change-Id: I615c1dfd86e5b9802d03050c5db0154ac196c2ef). We may
not be using that CSS class name any more, but the MDL library still
is. So this override that was removed needed to come back, albeit for
a different reason than before.
Change-Id: Ibf7e865604f09d9d02fe15fe9f577ea63cdf6d1d
This corrects/normalizes the license headers in CSS and LESS files.
The LESS tool respects the same "/*!" syntax for forcing the inclusion
of a license header, but will not dedup these licenses. So the LESS
files generally will not use this syntax. Instead, the build system
prepends a license header after compilation.
The exception is for our SVG spinner, which is based on third-party
CSS from codepen. The copyright header for this is forced into the
output to give proper credit to the original author.
Issue #2638
Change-Id: I4c58e2b082f2d5e550a6f0a30feaaf9ebf82a53a
When we changed the font for the icons without changing the class
name, we lost upstream styles from the font server. This was not
obvious in our demo, but was more obvious in other apps where the font
size was different.
By using the same class name as used by the font server, we get those
upstream styles applied correctly.
Issue #2633
Change-Id: I615c1dfd86e5b9802d03050c5db0154ac196c2ef
For large screens, this fixes the empty whitespace below the footer.
The main content will now expand if necessary to push the footer to
the bottom.
Fixes: b/131849286
Change-Id: I8608e7f733a06c567ce5a01ea5b87f85f901c023
Some of the files still used the old long license. This increased the
size of the compiled bundle since it had both versions.
Change-Id: Iec137f71547f91369a563145f870eb26ddc96a96
This works around google/material-design-icons#958 by switching from
the default "solid" style to the "rounded" icon style.
Change-Id: Iea29ed3732d252bd2d089c802c478a97cbda163d
In iOS 13, buttons with mdl ripple containers are broken;
seemingly, iOS 13 does not like the container having a default
opacity of 0.
This changes the default opacity to 0.01.
Fixes#2376
Change-Id: I0218d3911cce1c4b776ca6debf51ff62e4bbe4f3
Different ads have been added to three assets.
Demo search CSS has been adjusted a bit for better
experience.
Feature name has been changed from "AD" to "ADS" to
reflect the fact that a single asset can have more
than one ad.
Issue #2222:
Change-Id: I12a63b813fb4bac79362f1689b485a824f5a9682
Also unified CSS/less style based on that.
This does have to use a forked version of stylelint, since there
is a bug (?) in the globbing library they use that causes it to
fail on our buildbot. I found the simplest solution was just to add
an option to disable globbing, a feature we weren't using anyway.
Closes#1867
Change-Id: I9295b01d5b15d060356e314938b64b551b75de6a
This looks nicer, as the progress indicator is around the download button,
instead of being on the other side of the asset card.
Change-Id: If44cc39691664b95c05665665260c5938123cc4f
This makes the close (X) button on the error bigger.
It also makes the documentation link smaller; specifically, it makes the
link div only the size of the text, rather than the entire width of the
error bar.
Closes#2057
Change-Id: Icb7519daea4831edcc2f42cbb851a34356bc8548
The specificity of the css style for the close button was too low.
This meant that, in compiled mode, the close button was using the
normal button style, which was (among other things) invisible
against white backgrounds.
Change-Id: If8f73032ade3780870c913f427259d13643d47fb
When the error text is very large, it was overflowing into the "x"
button to close the error display. This fixes the layout of the error
box and makes the text small enough (through padding) to avoid the
"x".
Change-Id: I77f46da67abd27df3ac8c3ad2811f8b557b0601b
Previously, we were using MDL tooltips for our tooltips.
They seemed fine at first, but proved very temperamental; we had to
jump through hoops to get them to work inside MDL cards, and they kept
breaking for various reasons.
This instead adds the third-party tippy.js module, and uses that to make
tooltips instead.
Change-Id: I37ae9c9ade4e3c4dd6cbb1b86601377ed5d9e54f
Instead of the download button being a button called "Download" or
"Delete", this moves it to the upper-right corner and made it into an
MDL icon instead of text. That way, there's no confusion between
removing a custom asset from storage and removing a custom asset from
the assets list.
Change-Id: I74d426bc9e9030598b741afc58a3ba7d6cec4c4a
Importing in less is not enough. It will not necessarily inline what
is imported by default. The "inline" option, however, will force the
CSS file to be inlined. Without this, some of the `@import`
statements are put directly into the output file, triggering
additional network requests at runtime. This also adds the "css"
option, which forces less to treat these inputs as CSS and not as
LESS.
Finally, we import MDL for the demo app as a node dependency instead
of loading it from another origin.
This improves the demo's Lighthouse scores of "First Contentful Paint"
by 27% and "First Meaningful Paint" by 14%.
Change-Id: I28e627d3df494e3c4893d31b6bf818f09e8153e9
This reduces the number of resources we have to load by using LESS to
import them into the compiled CSS bundle.
This also gets rid of a flash of unstyled content in compiled mode by
always including the compiled CSS in HTML directly, regardless of
mode. If the app is running in uncompiled mode, LESS is still loaded
and can override the compiled styles.
Change-Id: I8cde25c15c281029a129225fc85a8baee767f424
This is so that the video is properly fullscreen on Safari.
Changing video-container into a class changes its specificity, and thus
changes in which order the css properties are applied.
Change-Id: I8b1e9e9479724d009014b97973a1aa1271a33773
The difference between the normal white background and the light-blue
highlighted asset cards was perhaps a bit too subtle for people with
vision problems.
This, instead of changing the background color, instead adds a reasonably
dark colored border.
Change-Id: I7a2ba1ba1613ca540ac05b3b464614616f8e8fd7
- Use a minified mux.js and awesomplete.js
- Add rel=noopener to offsite target=_blank links for security
- Improve contrast on selected nav button and footer text
- Add empty alt attributes to asset images, since these are
not necessary to understand the page
Change-Id: I253c7354243aaa0fe98e1f075dae304ddad4a3e2
This is a complete replacement for the old demo page, made to be more
modern-looking and easier to maintain. It contains new features such as
remembering the URIs you provide for custom assets, and searching through
the default assets by feature.
This demo page is not quite ready for release yet, but it's getting close.
Change-Id: Iad01d1fc02c3cd238d73b9b9e02dbb4301cb6f2a