Skip to content

Commit

Permalink
Rename inset-area to position-area
Browse files Browse the repository at this point in the history
  • Loading branch information
@akhmadullin
akhmadullin committed Sep 22, 2024
1 parent f797848 commit ab6dc17
Show file tree
Hide file tree
Showing 7 changed files with 26 additions and 26 deletions.
2 changes: 1 addition & 1 deletion demos/popover-css-anchor-positioning-1/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
border-radius: 6px;
padding: 10px 7px;
position-anchor: --anchor-el;
inset-area: top;
position-area: top;

width: max-content;
}
Expand Down
4 changes: 2 additions & 2 deletions demos/popover-css-anchor-positioning-2/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,14 +48,14 @@
border-radius: 6px;
padding: 10px 7px;
position-anchor: --anchor-el;
inset-area: top;
position-area: top;
position-try-fallbacks: --bottom;

width: max-content;
}

@position-try --bottom {
inset-area: bottom;
position-area: bottom;
}
</style>
<div class="cap-supports-notification">
Expand Down
4 changes: 2 additions & 2 deletions demos/popover-css-anchor-positioning-3/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
border-radius: 6px;
padding: 10px 7px;
position-anchor: --anchor-el;
inset-area: top;
position-area: top;
position-try-fallbacks: --bottom;

width: max-content;
Expand Down Expand Up @@ -78,7 +78,7 @@
}

@position-try --bottom {
inset-area: bottom;
position-area: bottom;
}
</style>
<div class="cap-supports-notification">
Expand Down
4 changes: 2 additions & 2 deletions demos/popover-css-anchor-positioning-4/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
border-radius: 6px;
padding: 10px 7px;
position-anchor: --anchor-el;
inset-area: top;
position-area: top;
position-try-fallbacks: --bottom;

background: hsl(0, 0%, 0%);
Expand Down Expand Up @@ -99,7 +99,7 @@
}

@position-try --bottom {
inset-area: bottom;
position-area: bottom;
}
</style>
<div class="cap-supports-notification">
Expand Down
8 changes: 4 additions & 4 deletions demos/popover-css-anchor-positioning-5/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
border-radius: 6px;
padding: 10px 7px;
position-anchor: --anchor-el;
inset-area: top;
position-area: top;
position-try-fallbacks: --bottom, --left, --right;


Expand Down Expand Up @@ -136,15 +136,15 @@
}

@position-try --bottom {
inset-area: bottom;
position-area: bottom;
}

@position-try --left {
inset-area: left;
position-area: left;
}

@position-try --right {
inset-area: right;
position-area: right;
}
</style>
<div class="cap-supports-notification">
Expand Down
28 changes: 14 additions & 14 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3581,9 +3581,9 @@ <h2 class="place slide_title centered-text">CSS Anchor Positioning</h2>
/* более простой способ записи
для стандартных положений */
inset-area: top;
position-area: top;
/* или так */
inset-area: block-start;
position-area: block-start;
}
</code>
</pre>
Expand All @@ -3606,9 +3606,9 @@ <h2 class="place slide_title centered-text">CSS Anchor Positioning</h2>
<span style="text-decoration: line-through;"><span class="hljs-attribute">justify-self</span>: anchor-center;</span>

<span class="hljs-comment">/* физическое значение */</span>
<span class="hljs-attribute">inset-area</span>: top;
<span class="hljs-attribute">position-area</span>: top;
<span class="hljs-comment">/* логическое значение */</span>
<span class="hljs-attribute">inset-area</span>: block-start;
<span class="hljs-attribute">position-area</span>: block-start;
}
</code>
</pre>
Expand All @@ -3634,25 +3634,25 @@ <h2 class="place slide_title centered-text">CSS Anchor Positioning</h2>
<pre class="place">
<code class="language-css">
[popover] {
inset-area: top;
position-area: top;
position-try-fallbacks: --bottom;
}
@position-try --bottom {
inset-area: bottom;
position-area: bottom;
}
</code>
</pre>
</section> -->
<section class="slide">
<pre class="place"> <code class="language-css hljs" data-highlighted="yes">
<span class="hljs-selector-attr">[popover]</span> {
<span class="hljs-attribute">inset-area</span>: top;
<span class="hljs-attribute">position-area</span>: top;
<span class="hljs-attribute">position-try-fallbacks</span>: --bottom;
}

<span class="hljs-keyword">@position-try</span> --bottom {
<span class="hljs-attribute">inset-area</span>: bottom;
<span class="hljs-attribute">position-area</span>: bottom;
}
</code>
</pre>
Expand All @@ -3661,12 +3661,12 @@ <h2 class="place slide_title centered-text">CSS Anchor Positioning</h2>
<section class="slide">
<pre class="place"> <code class="language-css hljs" data-highlighted="yes">
<span class="muted"><span class="hljs-selector-attr">[popover]</span> {</span>
<span class="hljs-attribute">inset-area</span>: top;
<span class="hljs-attribute">position-area</span>: top;
<span class="muted"><span class="hljs-attribute">position-try-fallbacks</span>: --bottom;
}

<span class="hljs-keyword">@position-try</span> --bottom {
<span class="hljs-attribute">inset-area</span>: bottom;
<span class="hljs-attribute">position-area</span>: bottom;
}</span>
</code>
</pre>
Expand All @@ -3675,12 +3675,12 @@ <h2 class="place slide_title centered-text">CSS Anchor Positioning</h2>
<section class="slide">
<pre class="place"> <code class="language-css hljs" data-highlighted="yes">
<span class="muted"><span class="hljs-selector-attr">[popover]</span> {
<span class="hljs-attribute">inset-area</span>: top;</span>
<span class="hljs-attribute">position-area</span>: top;</span>
<span class="hljs-attribute">position-try-fallbacks</span>: --bottom;
<span class="muted">}

<span class="hljs-keyword">@position-try</span> --bottom {
<span class="hljs-attribute">inset-area</span>: bottom;
<span class="hljs-attribute">position-area</span>: bottom;
}</span>
</code>
</pre>
Expand All @@ -3689,12 +3689,12 @@ <h2 class="place slide_title centered-text">CSS Anchor Positioning</h2>
<section class="slide">
<pre class="place"> <code class="language-css hljs" data-highlighted="yes">
<span class="muted"><span class="hljs-selector-attr">[popover]</span> {
<span class="hljs-attribute">inset-area</span>: top;
<span class="hljs-attribute">position-area</span>: top;
<span class="hljs-attribute">position-try-fallbacks</span>: --bottom;
}</span>

<span class="hljs-keyword">@position-try</span> --bottom {
<span class="hljs-attribute">inset-area</span>: bottom;
<span class="hljs-attribute">position-area</span>: bottom;
}
</code>
</pre>
Expand Down
2 changes: 1 addition & 1 deletion lib/highlight/highlight.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3109,7 +3109,7 @@ if (typeof exports === 'object' && typeof module !== 'undefined') { module.expor
'ime-mode',
'inline-size',
'inset',
'inset-area',
'position-area',
'inset-block',
'inset-block-end',
'inset-block-start',
Expand Down

0 comments on commit ab6dc17

Please sign in to comment.