generated from oddbird/polyfill-template
-
-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #271 from oddbird/brand
Update demo site with OddBird branding
- Loading branch information
Showing
8 changed files
with
104 additions
and
70 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -5,7 +5,6 @@ | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>CSS Anchor Positioning Polyfill Demo</title> | ||
| <link rel="stylesheet" href="https://unpkg.com/open-props" /> | ||
| <link | ||
| rel="stylesheet" | ||
| href="https://unpkg.com/[email protected]/themes/prism.css" | ||
|
|
@@ -15,7 +14,15 @@ | |
| crossorigin="anonymous" | ||
| defer | ||
| ></script> | ||
| <!-- TypeKit Fonts --> | ||
| <script src="https://use.typekit.net/slx1xnq.js"></script> | ||
| <script> | ||
| try { | ||
| Typekit.load({ async: true }); | ||
| } catch (e) {} | ||
| </script> | ||
| <link rel="stylesheet" href="/demo.css" /> | ||
|
|
||
| <!-- Included to test invalid stylesheets --> | ||
| <link rel="stylesheet" href="/fake.css" /> | ||
| <link rel="stylesheet" href="/anchor.css" /> | ||
|
|
@@ -236,7 +243,7 @@ <h1>CSS Anchor Positioning Polyfill</h1> | |
| >WPT results</a | ||
| > --> | ||
| <a | ||
| href="https://w3c.github.io/csswg-drafts/css-anchor-position/" | ||
| href="https://drafts.csswg.org/css-anchor-position/" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| >Draft Spec</a | ||
|
|
@@ -251,7 +258,7 @@ <h2>Anchoring Elements Using CSS</h2> | |
| <p> | ||
| The CSS anchor positioning | ||
| <a | ||
| href="https://w3c.github.io/csswg-drafts/css-anchor-position/" | ||
| href="https://drafts.csswg.org/css-anchor-position/" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| >specification</a | ||
|
|
@@ -298,7 +305,7 @@ <h2>Anchoring Elements Using CSS</h2> | |
| <li> | ||
| Browse or open issues related to the specification | ||
| <a | ||
| href="https://github.com/w3c/csswg-drafts/labels/css-anchor-1" | ||
| href="https://github.com/w3c/csswg-drafts/labels/css-anchor-position-1" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| >here</a | ||
|
|
@@ -854,8 +861,8 @@ <h2> | |
| <div id="my-target-math" class="target">Target</div> | ||
| </div> | ||
| <p class="note"> | ||
| With polyfill applied: Target's left edge is 50px left of the Anchor's | ||
| right edge). The top edge of the Target is 50px above the bottom edge of | ||
| With polyfill applied: Target's left edge is 10px left of the Anchor's | ||
| right edge). The top edge of the Target is 10px below the bottom edge of | ||
| the Anchor. | ||
| </p> | ||
| <pre><code class="language-css" | ||
|
|
@@ -865,10 +872,10 @@ <h2> | |
|
|
||
| #my-target-math { | ||
| --full-math: anchor(--my-anchor-math 100%); | ||
| --full-minus-math: calc(anchor(--my-anchor-math 100%) - 50px); | ||
| --full-minus-math: calc(anchor(--my-anchor-math 100%) - 10px); | ||
|
|
||
| position: absolute; | ||
| top: calc(var(--full-math) - 50px); | ||
| top: calc(var(--full-math) + 10px); | ||
| left: var(--full-minus-math); | ||
| }</code></pre> | ||
| </section> | ||
|
|
@@ -1303,12 +1310,6 @@ <h2>Sponsor OddBird's OSS Work</h2> | |
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| >OddBird</a | ||
| >. Designed using | ||
| <a | ||
| href="https://open-props.style/" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| >Open Props</a | ||
| >. | ||
| </p> | ||
| </footer> | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,7 +1,7 @@ | ||
| .scroll-container { | ||
| height: 400px; | ||
| overflow: scroll; | ||
| border: solid; | ||
| border: thin solid; | ||
| position: relative; | ||
| } | ||
|
|
||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.