AuroraMiddleware/gtk2
1
0
Fork 0
forked from AuroraMiddleware/gtk
Code Issues Pull Requests Projects Releases Wiki Activity

css: add documentation for background-blend-mode

Browse Source 
After introducing the new CSS property, it is natural to
add some documentation explaining the behavior of it and
our support coverage.

https://bugzilla.gnome.org/show_bug.cgi?id=768305
This commit is contained in:
Georges Basile Stavracas Neto 2016-07-01 10:01:43 -03:00 committed by Matthias Clasen
parent 369db4a406
commit 27fea1c4fc
1 changed files with 14 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
docs/reference/gtk/css-properties.xml
View File

@ -1109,6 +1109,15 @@ We use <literallayout> for syntax productions, and each line is put in a <code>
<ulink url="http://www.w3.org/TR/css3-background/#background-image">CSS3</ulink></entry> <ulink url="http://www.w3.org/TR/css3-background/#background-image">CSS3</ulink></entry>
<entry>not supported: urls without quotes, CSS radial gradients, colors in crossfades</entry> <entry>not supported: urls without quotes, CSS radial gradients, colors in crossfades</entry>
</row> </row>
<row>
<entry>background-blend-mode</entry>
<entry><code>〈blend-mode〉 [ , 〈blend-mode〉 ]*</code></entry>
<entry><code>normal</code></entry>
<entry></entry>
<entry></entry>
<entry></entry>
<entry>only affects multiple backgrounds</entry>
</row>
<row> <row>
<entry>box‑shadow</entry> <entry>box‑shadow</entry>
<entry><code>none | 〈box shadow〉 [ , 〈box shadow〉 ]*</code></entry> <entry><code>none | 〈box shadow〉 [ , 〈box shadow〉 ]*</code></entry>
@ -1144,6 +1153,7 @@ We use <literallayout> for syntax productions, and each line is put in a <code>
<code>〈bg-image〉 = 〈image〉 | none</code> <code>〈bg-image〉 = 〈image〉 | none</code>
<code>〈bg-layer〉 = 〈bg-image〉 || 〈position〉 [ / 〈bg-size〉 ]? || 〈bg-repeat〉 || 〈box〉 || 〈box〉</code> <code>〈bg-layer〉 = 〈bg-image〉 || 〈position〉 [ / 〈bg-size〉 ]? || 〈bg-repeat〉 || 〈box〉 || 〈box〉</code>
<code>〈final-bg-layer〉 = 〈bg-image〉 || 〈position〉 [ / 〈bg-size〉 ]? || 〈bg-repeat〉 || 〈box〉 || 〈box〉|| 〈color〉</code> <code>〈final-bg-layer〉 = 〈bg-image〉 || 〈position〉 [ / 〈bg-size〉 ]? || 〈bg-repeat〉 || 〈box〉 || 〈box〉|| 〈color〉</code>
<code>〈blend-mode〉 = color || color-burn || color-dodge || darken || difference || exclusion || hard-light || hue || lighten || luminosity || multiply || normal || overlay || saturate || screen || soft-light</code>
<code>〈box shadow〉 = inset? &amp;&amp; 〈length〉{2,4}? &amp;&amp; 〈color〉?</code> <code>〈box shadow〉 = inset? &amp;&amp; 〈length〉{2,4}? &amp;&amp; 〈color〉?</code>
</literallayout> </literallayout>
@ -1152,6 +1162,10 @@ We use <literallayout> for syntax productions, and each line is put in a <code>
background images are absent or have transparency. background images are absent or have transparency.
</para> </para>
<para>
Alternatively, multiple backgrounds can be blended using the <code>background-blend-mode</code> property.
</para>
<table pgwide="1"> <table pgwide="1">
<title>Transition properties</title> <title>Transition properties</title>
<tgroup cols="7"> <tgroup cols="7">