Skip to content

Container queries #7938

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 35 commits into from
Closed

Container queries #7938

wants to merge 35 commits into from

Conversation

danwalmsley
Copy link
Member

@danwalmsley danwalmsley commented Apr 6, 2022

What does the pull request do?

Prototype for implementation of css like media queries.

Essential to support multiple form factors.

What is the current behavior?

What is the updated/expected behavior with this PR?

How was the solution implemented (if it's not obvious)?

Checklist

Breaking changes

Obsoletions / Deprecations

Fixed issues

@avaloniaui-team
Copy link
Contributor

You can test this PR using the following package version. 0.10.999-cibuild0019708-beta. (feed url: https://nuget.avaloniaui.net/repository/avalonia-all/index.json) [PRBUILDID]

@avaloniaui-team
Copy link
Contributor

You can test this PR using the following package version. 0.10.999-cibuild0019738-beta. (feed url: https://nuget.avaloniaui.net/repository/avalonia-all/index.json) [PRBUILDID]

@robloo
Copy link
Contributor

robloo commented Apr 7, 2022

I certainly think this is useful in some cases. However, I'm a big fan of fully adaptive/responsive UI's that adjust based on resolution or orientation though. This type of functionality in my mind is needed for less-powerful UI frameworks. XAML is resolution independent, fully vector-based and composable. You can generally-speaking design a good UI that works everywhere and automatically adjusts itself.

@workgroupengineering
Copy link
Contributor

workgroupengineering commented Apr 8, 2022

It's a great addition, but I'd like to suggest an improvement

eg:

      <Style Selector=":min-width(600) TextBlock#MinWidth">
        <Setter Property="Foreground" Value="Red" />
      </Style>
      <Style Selector=":max-width(600) TextBox">
        <Setter Property="Foreground" Value="Red" />
      </Style>
      <Style Selector=":max-width(600) Rectangle">
        <Setter Property="Fill" Value="Red" />
      </Style>
      <Style Selector=":min-width(800) TextBlock#MinWidth">
        <Setter Property="Foreground" Value="Blue" />
      </Style>
      <Style Selector=":max-width(800) TextBox">
        <Setter Property="Foreground" Value="Blue" />
      </Style>
      <Style Selector=":max-width(800) Rectangle">
        <Setter Property="Fill" Value="Blue" />
      </Style>
      ....

will became:

       <Media Selector=":min-width(600)">
         <Style "TextBlock#MinWidth">
           <Setter Property="Foreground" Value="Red" />
         </Style>
         <Style Selector="TextBox">
           <Setter Property="Foreground" Value="Red" />
         </Style>
         <Style Selector=" Rectangle">
           <Setter Property="Fill" Value="Red" />
         </Style>
       </Media>
       <Media Selector=":min-width(800)">
         <Style Selector="TextBlock#MinWidth">
           <Setter Property="Foreground" Value="Blue" />
         </Style>
         <Style Selector="TextBox">
           <Setter Property="Foreground" Value="Blue" />
         </Style>
         <Style Selector="Rectangle">
            <Setter Property="Fill" Value="Blue" />
         </Style>
       </Media>
      ....

Other possible MediaSelector:

Selector Description
resolution select the style based on the DPI
media-type select the style based on media type (screen,printer, ecc.)
orientation The orientation of the viewport (landscape or portrait mode)
light-level Current ambient light level (added in Media Queries Level 4)
aspectratio The Current aspect ratio (4:3,16:9,...)

@Gillibald
Copy link
Contributor

Gillibald commented Apr 8, 2022

This should just work

      <Style Selector=":min-width(600)">
         <Style "TextBlock#MinWidth">
           <Setter Property="Foreground" Value="Red" />
         </Style>
         <Style Selector="TextBox">
           <Setter Property="Foreground" Value="Red" />
         </Style>
         <Style Selector=" Rectangle">
           <Setter Property="Fill" Value="Red" />
         </Style>
       </Style>
       <Style Selector=":min-width(800)">
         <Style Selector="TextBlock#MinWidth">
           <Setter Property="Foreground" Value="Blue" />
         </Style>
         <Style Selector="TextBox">
           <Setter Property="Foreground" Value="Blue" />
         </Style>
         <Style Selector="Rectangle">
            <Setter Property="Fill" Value="Blue" />
         </Style>
       </Style>

@MarchingCube
Copy link
Collaborator

I certainly think this is useful in some cases. However, I'm a big fan of fully adaptive/responsive UI's that adjust based on resolution or orientation though. This type of functionality in my mind is needed for less-powerful UI frameworks. XAML is resolution independent, fully vector-based and composable. You can generally-speaking design a good UI that works everywhere and automatically adjusts itself.

From my perspective it is quite hard to create truly responsive controls in pure XAML. For example TextBox that shows/hides extra buttons based on available space. So this media query setup could be quite useful to remove code and move such behavior to styles. This is still no as flexible as doing this in C# though since there visual tree can be patched easily to adapt control to given size constraint.

@robloo
Copy link
Contributor

robloo commented Apr 8, 2022

So this media query setup could be quite useful to remove code and move such behavior to styles. This is still no as flexible as doing this in C# though since there visual tree can be patched easily to adapt control to given size constraint.

Yea, this can certainly be useful and I'm not against it all. I guess my point was more it isnt a blocker for supporting multiple devices and form factors. I generally found that there was a solution by rethinking designs and your app at a fundamental level. XAML with minimal C# code-behind is already powerful enough to do everything needed.

A desktop XAML app was made to work with mobile with the thinking I'm describing here. The only layout changes were triggered based on orientation and pixel size of the window -- very simple and done in code behind. It turned out quite well.

That said, the examples above based on width/height are good ones. AdaptiveTriggers in UWP were useful in several cases. I'm sure I can find a use for this too.

@MarchingCube
Copy link
Collaborator

FYI: CSS spec for container queries: w3c/csswg-drafts#5796

@robloo
Copy link
Contributor

robloo commented Apr 9, 2022

I had another thought about this. It's common for many views to share the same trigger width/height in pixels when the layout should change. Is there any way to declare a resource for width/height and then use it in a selector (I know the answer to this is no...) but is it possible in the future? Should it be?

<Style Selector=":min-width({StaticResource MinWindowWidth})">

Doing this would greatly help updating many views that use this type of selector.

@maxkatz6
Copy link
Member

maxkatz6 commented Apr 9, 2022

With CSS syntax it's a bit of a pain. Yet another reason to split "selector" and "media-query" (as it is in CSS), so we will be able to write:

<Style MediaQuery="min-width(600) and pointer(mouse)" Selector="Border" />

as well as

<Style Selector="Border">
   <Style.MediaQuery>
       <AndMediaQuery>
           <!--  Any other non-bindable markup extension should work here without any problem -->
           <SizeMediaQuery MinWidth="{StaticResource MinWindowWidth}" />
           <PointerMediaQuery PointerType="Mouse" />
       </AndMediaQuery>
   </Style.MediaQuery>
</Style>

Which also can be extended with custom MediaQuery types (like it's possible with AdaptiveTriggers).

CSS seems to not support variables in media queries, but only environment variables (consts), see w3c/csswg-drafts#1693

@workgroupengineering
Copy link
Contributor

workgroupengineering commented Apr 9, 2022

Perhaps it is better to shift the conversation into a discussion so as not to dirty the PR.

With CSS syntax it's a bit of a pain. Yet another reason to split "selector" and "media-query" (as it is in CSS), so we will be able to write:

<Style MediaQuery="min-width(600) and pointer(mouse)" Selector="Border" />

as well as

<Style Selector="Border">
   <Style.MediaQuery>
       <AndMediaQuery>
           <!--  Any other non-bindable markup extension should work here without any problem -->
           <SizeMediaQuery MinWidth="{StaticResource MinWindowWidth}" />
           <PointerMediaQuery PointerType="Mouse" />
       </AndMediaQuery>
   </Style.MediaQuery>
</Style>

Which also can be extended with custom MediaQuery types (like it's possible with AdaptiveTriggers).

CSS seems to not support variables in media queries, but only environment variables (consts), see w3c/csswg-drafts#1693

I don't see the need to add a new attribute when it's really nothing more than a selector.
The change I would like to propose to you is to add Selector to StyleInclude. So you can use it like this:

   <StyleInclude Selector="max-width(600)" Source="avares://MyApp/Assets/screen_small.xaml"/>
   <StyleInclude Selector="max-width(1024)" Source="avares://MyApp/Assets/screen_medium.xaml"/>
   <StyleInclude Selector="min-width(1280)" Source="avares://MyApp/Assets/screen_high.xaml"/>

@danwalmsley
Copy link
Member Author

JFYI: This is just an initial prototype of how to make the functionality work, and its expected that the final syntax of media queries would be seperated from selectors.

We have identified this is a 2-stage process.

  1. implement the parsing and infrastructure / logic to implement queries themselves.
  2. implement child styles

@workgroupengineering
Copy link
Contributor

JFYI: This is just an initial prototype of how to make the functionality work, and its expected that the final syntax of media queries would be seperated from selectors.

Why this choice? I don't see any difference between MediaQuery and Selector, they both allow you to activate / deactivate a style based on a condition. Adding an extra attribute would increase cofusion.

<Style Selector="Border">
   <Style.MediaQuery>
       <AndMediaQuery>
           <!--  Any other non-bindable markup extension should work here without any problem -->
           <SizeMediaQuery MinWidth="{StaticResource MinWindowWidth}" />
           <PointerMediaQuery PointerType="Mouse" />
       </AndMediaQuery>
   </Style.MediaQuery>
</Style>

Greats idea of syntax could also be extended to selector. It would make the approach easier for those like me who do not have a web background and at the beginning find it difficult to read and write a Selector.

@maxkatz6 maxkatz6 added this to the 11.0 milestone Jun 19, 2022
@maxkatz6
Copy link
Member

Closing as inactive.
Just in case, it's still something we want one day. Potentially can be added in 11.x as it doesn't introduce breaking changes.

@maxkatz6 maxkatz6 closed this Jan 18, 2023
# Conflicts:
#	samples/ControlCatalog/MainView.xaml
#	samples/ControlCatalog/MainView.xaml.cs
#	src/Avalonia.Base/LogicalTree/IScreenSizeProvider.cs
#	src/Avalonia.Base/LogicalTree/ITopLevelScreenSizeProvider.cs
#	src/Avalonia.Base/Styling/Activators/ScreenActivator.cs
#	src/Avalonia.Base/Styling/ScreenSelector.cs
#	src/Avalonia.Base/Visual.cs
#	src/Avalonia.Controls/TopLevel.cs
#	src/Markup/Avalonia.Markup/Markup/Parsers/SelectorGrammar.cs
@danwalmsley danwalmsley reopened this Jun 7, 2023
@avaloniaui-team
Copy link
Contributor

You can test this PR using the following package version. 11.0.999-cibuild0038298-beta. (feed url: https://nuget-feed-all.avaloniaui.net/v3/index.json) [PRBUILDID]

@avaloniaui-team
Copy link
Contributor

You can test this PR using the following package version. 11.0.999-cibuild0039517-beta. (feed url: https://nuget-feed-all.avaloniaui.net/v3/index.json) [PRBUILDID]

@jmacato
Copy link
Member

jmacato commented Nov 17, 2023

@emmauss any status updates for this?

# Conflicts:
#	src/Markup/Avalonia.Markup.Xaml.Loader/IncludeXamlIlSre.props
@maxkatz6 maxkatz6 self-assigned this Dec 19, 2023
@maxkatz6 maxkatz6 self-requested a review December 19, 2023 11:23
@avaloniaui-bot
Copy link

You can test this PR using the following package version. 11.1.999-cibuild0043599-beta. (feed url: https://nuget-feed-all.avaloniaui.net/v3/index.json) [PRBUILDID]

@maxkatz6 maxkatz6 removed their assignment Apr 25, 2024
@maxkatz6 maxkatz6 removed their request for review April 25, 2024 00:57
@avaloniaui-bot
Copy link

You can test this PR using the following package version. 11.2.999-cibuild0047870-alpha. (feed url: https://nuget-feed-all.avaloniaui.net/v3/index.json) [PRBUILDID]

@cla-avalonia
Copy link
Collaborator

@dan Walmsley,

Please read the following Contributor License Agreement (CLA). If you agree with the CLA, please reply with the following:

@cla-avalonia agree
Contributor License Agreement

Contribution License Agreement

This Contribution License Agreement ( “Agreement” ) is agreed to by the party signing below ( “You” ),
and conveys certain license rights to the AvaloniaUI OÜ ( “AvaloniaUI OÜ” ) for Your contributions to
AvaloniaUI OÜ open source projects. This Agreement is effective as of the latest signature date below.

1. Definitions.

“Code” means the computer software code, whether in human-readable or machine-executable form,
that is delivered by You to AvaloniaUI OÜ under this Agreement.

“Project” means any of the projects owned or managed by AvaloniaUI OÜ and offered under a license
approved by the Open Source Initiative (www.opensource.org).

“Submit” is the act of uploading, submitting, transmitting, or distributing code or other content to any
Project, including but not limited to communication on electronic mailing lists, source code control
systems, and issue tracking systems that are managed by, or on behalf of, the Project for the purpose of
discussing and improving that Project, but excluding communication that is conspicuously marked or
otherwise designated in writing by You as “Not a Submission.”

“Submission” means the Code and any other copyrightable material Submitted by You, including any
associated comments and documentation.

2. Your Submission. You must agree to the terms of this Agreement before making a Submission to any
Project. This Agreement covers any and all Submissions that You, now or in the future (except as
described in Section 4 below), Submit to any Project.

3. Originality of Work. You represent that each of Your Submissions is entirely Your
original work. Should You wish to Submit materials that are not Your original work,
You may Submit them separately to the Project if You (a) retain all copyright and
license information that was in the materials as you received them, (b) in the
description accompanying your Submission, include the phrase "Submission
containing materials of a third party:" followed by the names of the third party and any
licenses or other restrictions of which You are aware, and (c) follow any other
instructions in the Project's written guidelines concerning Submissions.

4. Your Employer. References to “employer” in this Agreement include Your employer or anyone else
for whom You are acting in making Your Submission, e.g. as a contractor, vendor, or agent. If Your
Submission is made in the course of Your work for an employer or Your employer has intellectual
property rights in Your Submission by contract or applicable law, You must secure permission from Your
employer to make the Submission before signing this Agreement. In that case, the term “You” in this
Agreement will refer to You and the employer collectively. If You change employers in the future and
desire to Submit additional Submissions for the new employer, then You agree to sign a new Agreement
and secure permission from the new employer before Submitting those Submissions.

5. Licenses.

a. Copyright License. You grant AvaloniaUI OÜ, and those who receive the Submission directly
or indirectly from AvaloniaUI OÜ, a perpetual, worldwide, non-exclusive, royalty-free, irrevocable
license in the Submission to reproduce, prepare derivative works of, publicly display, publicly perform,
and distribute the Submission and such derivative works, and to sublicense any or all of the foregoing
rights to third parties.

b. Patent License. You grant AvaloniaUI OÜ, and those who receive the Submission directly or
indirectly from AvaloniaUI OÜ, a perpetual, worldwide, non-exclusive, royalty-free, irrevocable license
under Your patent claims that are necessarily infringed by the Submission or the combination of the
Submission with the Project to which it was Submitted to make, have made, use, offer to sell, sell and
import or otherwise dispose of the Submission alone or with the Project.

c. Other Rights Reserved. Each party reserves all rights not expressly granted in this Agreement.
No additional licenses or rights whatsoever (including, without limitation, any implied licenses) are
granted by implication, exhaustion, estoppel or otherwise.

6. Representations and Warranties. You represent that You are legally entitled to grant the above
licenses. You represent that each of Your Submissions is entirely Your original work (except as You may
have disclosed under Section 3 ). You represent that You have secured permission from Your employer to
make the Submission in cases where Your Submission is made in the course of Your work for Your
employer or Your employer has intellectual property rights in Your Submission by contract or applicable
law. If You are signing this Agreement on behalf of Your employer, You represent and warrant that You
have the necessary authority to bind the listed employer to the obligations contained in this Agreement.
You are not expected to provide support for Your Submission, unless You choose to do so. UNLESS
REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING, AND EXCEPT FOR THE WARRANTIES
EXPRESSLY STATED IN SECTIONS 3, 4, AND 6 , THE SUBMISSION PROVIDED UNDER THIS AGREEMENT IS
PROVIDED WITHOUT WARRANTY OF ANY KIND, INCLUDING, BUT NOT LIMITED TO, ANY WARRANTY OF
NONINFRINGEMENT, MERCHANTABILITY, OR FITNESS FOR A PARTICULAR PURPOSE.

7. Notice to AvaloniaUI OÜ. You agree to notify AvaloniaUI OÜ in writing of any facts or
circumstances of which You later become aware that would make Your representations in this
Agreement inaccurate in any respect.

8. Information about Submissions. You agree that contributions to Projects and information about
contributions may be maintained indefinitely and disclosed publicly, including Your name and other
information that You submit with Your Submission.

9. Governing Law/Jurisdiction. This Agreement is governed by the laws of the Republic of Estonia, and
the parties consent to exclusive jurisdiction and venue in the courts sitting in Talinn,
Estonia. The parties waive all defenses of lack of personal jurisdiction and forum non-conveniens.

10. Entire Agreement/Assignment. This Agreement is the entire agreement between the parties, and
supersedes any and all prior agreements, understandings or communications, written or oral, between
the parties relating to the subject matter hereof. This Agreement may be assigned by AvaloniaUI OÜ.

AvaloniaUI OÜ dedicates this Contribution License Agreement to the public domain according to the Creative Commons CC0 1.

2 out of 3 committers have signed the CLA.

Dan Walmsley doesn't seem to be a GitHub user.
Please add the emails used in your commits to your Github account accordingly.

@avaloniaui-bot
Copy link

You can test this PR using the following package version. 11.2.999-cibuild0047876-alpha. (feed url: https://nuget-feed-all.avaloniaui.net/v3/index.json) [PRBUILDID]

@cla-avalonia
Copy link
Collaborator

@dan Walmsley,

Please read the following Contributor License Agreement (CLA). If you agree with the CLA, please reply with the following:

@cla-avalonia agree
Contributor License Agreement

Contribution License Agreement

This Contribution License Agreement ( “Agreement” ) is agreed to by the party signing below ( “You” ),
and conveys certain license rights to the AvaloniaUI OÜ ( “AvaloniaUI OÜ” ) for Your contributions to
AvaloniaUI OÜ open source projects. This Agreement is effective as of the latest signature date below.

1. Definitions.

“Code” means the computer software code, whether in human-readable or machine-executable form,
that is delivered by You to AvaloniaUI OÜ under this Agreement.

“Project” means any of the projects owned or managed by AvaloniaUI OÜ and offered under a license
approved by the Open Source Initiative (www.opensource.org).

“Submit” is the act of uploading, submitting, transmitting, or distributing code or other content to any
Project, including but not limited to communication on electronic mailing lists, source code control
systems, and issue tracking systems that are managed by, or on behalf of, the Project for the purpose of
discussing and improving that Project, but excluding communication that is conspicuously marked or
otherwise designated in writing by You as “Not a Submission.”

“Submission” means the Code and any other copyrightable material Submitted by You, including any
associated comments and documentation.

2. Your Submission. You must agree to the terms of this Agreement before making a Submission to any
Project. This Agreement covers any and all Submissions that You, now or in the future (except as
described in Section 4 below), Submit to any Project.

3. Originality of Work. You represent that each of Your Submissions is entirely Your
original work. Should You wish to Submit materials that are not Your original work,
You may Submit them separately to the Project if You (a) retain all copyright and
license information that was in the materials as you received them, (b) in the
description accompanying your Submission, include the phrase "Submission
containing materials of a third party:" followed by the names of the third party and any
licenses or other restrictions of which You are aware, and (c) follow any other
instructions in the Project's written guidelines concerning Submissions.

4. Your Employer. References to “employer” in this Agreement include Your employer or anyone else
for whom You are acting in making Your Submission, e.g. as a contractor, vendor, or agent. If Your
Submission is made in the course of Your work for an employer or Your employer has intellectual
property rights in Your Submission by contract or applicable law, You must secure permission from Your
employer to make the Submission before signing this Agreement. In that case, the term “You” in this
Agreement will refer to You and the employer collectively. If You change employers in the future and
desire to Submit additional Submissions for the new employer, then You agree to sign a new Agreement
and secure permission from the new employer before Submitting those Submissions.

5. Licenses.

a. Copyright License. You grant AvaloniaUI OÜ, and those who receive the Submission directly
or indirectly from AvaloniaUI OÜ, a perpetual, worldwide, non-exclusive, royalty-free, irrevocable
license in the Submission to reproduce, prepare derivative works of, publicly display, publicly perform,
and distribute the Submission and such derivative works, and to sublicense any or all of the foregoing
rights to third parties.

b. Patent License. You grant AvaloniaUI OÜ, and those who receive the Submission directly or
indirectly from AvaloniaUI OÜ, a perpetual, worldwide, non-exclusive, royalty-free, irrevocable license
under Your patent claims that are necessarily infringed by the Submission or the combination of the
Submission with the Project to which it was Submitted to make, have made, use, offer to sell, sell and
import or otherwise dispose of the Submission alone or with the Project.

c. Other Rights Reserved. Each party reserves all rights not expressly granted in this Agreement.
No additional licenses or rights whatsoever (including, without limitation, any implied licenses) are
granted by implication, exhaustion, estoppel or otherwise.

6. Representations and Warranties. You represent that You are legally entitled to grant the above
licenses. You represent that each of Your Submissions is entirely Your original work (except as You may
have disclosed under Section 3 ). You represent that You have secured permission from Your employer to
make the Submission in cases where Your Submission is made in the course of Your work for Your
employer or Your employer has intellectual property rights in Your Submission by contract or applicable
law. If You are signing this Agreement on behalf of Your employer, You represent and warrant that You
have the necessary authority to bind the listed employer to the obligations contained in this Agreement.
You are not expected to provide support for Your Submission, unless You choose to do so. UNLESS
REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING, AND EXCEPT FOR THE WARRANTIES
EXPRESSLY STATED IN SECTIONS 3, 4, AND 6 , THE SUBMISSION PROVIDED UNDER THIS AGREEMENT IS
PROVIDED WITHOUT WARRANTY OF ANY KIND, INCLUDING, BUT NOT LIMITED TO, ANY WARRANTY OF
NONINFRINGEMENT, MERCHANTABILITY, OR FITNESS FOR A PARTICULAR PURPOSE.

7. Notice to AvaloniaUI OÜ. You agree to notify AvaloniaUI OÜ in writing of any facts or
circumstances of which You later become aware that would make Your representations in this
Agreement inaccurate in any respect.

8. Information about Submissions. You agree that contributions to Projects and information about
contributions may be maintained indefinitely and disclosed publicly, including Your name and other
information that You submit with Your Submission.

9. Governing Law/Jurisdiction. This Agreement is governed by the laws of the Republic of Estonia, and
the parties consent to exclusive jurisdiction and venue in the courts sitting in Talinn,
Estonia. The parties waive all defenses of lack of personal jurisdiction and forum non-conveniens.

10. Entire Agreement/Assignment. This Agreement is the entire agreement between the parties, and
supersedes any and all prior agreements, understandings or communications, written or oral, between
the parties relating to the subject matter hereof. This Agreement may be assigned by AvaloniaUI OÜ.

AvaloniaUI OÜ dedicates this Contribution License Agreement to the public domain according to the Creative Commons CC0 1.

3 out of 4 committers have signed the CLA.

Dan Walmsley doesn't seem to be a GitHub user.
Please add the emails used in your commits to your Github account accordingly.

@emmauss emmauss mentioned this pull request Aug 28, 2024
3 tasks
@maxkatz6
Copy link
Member

Closing this PR as feature is getting reworked in #16846

@maxkatz6 maxkatz6 closed this Sep 12, 2024
@cla-avalonia
Copy link
Collaborator

@danwalmsley,

Please read the following Contributor License Agreement (CLA). If you agree with the CLA, please reply with the following:

@cla-avalonia agree
Contributor License Agreement

Contribution License Agreement

This Contribution License Agreement ( “Agreement” ) is agreed to by the party signing below ( “You” ),
and conveys certain license rights to the AvaloniaUI OÜ ( “AvaloniaUI OÜ” ) for Your contributions to
AvaloniaUI OÜ open source projects. This Agreement is effective as of the latest signature date below.

1. Definitions.

“Code” means the computer software code, whether in human-readable or machine-executable form,
that is delivered by You to AvaloniaUI OÜ under this Agreement.

“Project” means any of the projects owned or managed by AvaloniaUI OÜ and offered under a license
approved by the Open Source Initiative (www.opensource.org).

“Submit” is the act of uploading, submitting, transmitting, or distributing code or other content to any
Project, including but not limited to communication on electronic mailing lists, source code control
systems, and issue tracking systems that are managed by, or on behalf of, the Project for the purpose of
discussing and improving that Project, but excluding communication that is conspicuously marked or
otherwise designated in writing by You as “Not a Submission.”

“Submission” means the Code and any other copyrightable material Submitted by You, including any
associated comments and documentation.

2. Your Submission. You must agree to the terms of this Agreement before making a Submission to any
Project. This Agreement covers any and all Submissions that You, now or in the future (except as
described in Section 4 below), Submit to any Project.

3. Originality of Work. You represent that each of Your Submissions is entirely Your
original work. Should You wish to Submit materials that are not Your original work,
You may Submit them separately to the Project if You (a) retain all copyright and
license information that was in the materials as you received them, (b) in the
description accompanying your Submission, include the phrase "Submission
containing materials of a third party:" followed by the names of the third party and any
licenses or other restrictions of which You are aware, and (c) follow any other
instructions in the Project's written guidelines concerning Submissions.

4. Your Employer. References to “employer” in this Agreement include Your employer or anyone else
for whom You are acting in making Your Submission, e.g. as a contractor, vendor, or agent. If Your
Submission is made in the course of Your work for an employer or Your employer has intellectual
property rights in Your Submission by contract or applicable law, You must secure permission from Your
employer to make the Submission before signing this Agreement. In that case, the term “You” in this
Agreement will refer to You and the employer collectively. If You change employers in the future and
desire to Submit additional Submissions for the new employer, then You agree to sign a new Agreement
and secure permission from the new employer before Submitting those Submissions.

5. Licenses.

a. Copyright License. You grant AvaloniaUI OÜ, and those who receive the Submission directly
or indirectly from AvaloniaUI OÜ, a perpetual, worldwide, non-exclusive, royalty-free, irrevocable
license in the Submission to reproduce, prepare derivative works of, publicly display, publicly perform,
and distribute the Submission and such derivative works, and to sublicense any or all of the foregoing
rights to third parties.

b. Patent License. You grant AvaloniaUI OÜ, and those who receive the Submission directly or
indirectly from AvaloniaUI OÜ, a perpetual, worldwide, non-exclusive, royalty-free, irrevocable license
under Your patent claims that are necessarily infringed by the Submission or the combination of the
Submission with the Project to which it was Submitted to make, have made, use, offer to sell, sell and
import or otherwise dispose of the Submission alone or with the Project.

c. Other Rights Reserved. Each party reserves all rights not expressly granted in this Agreement.
No additional licenses or rights whatsoever (including, without limitation, any implied licenses) are
granted by implication, exhaustion, estoppel or otherwise.

6. Representations and Warranties. You represent that You are legally entitled to grant the above
licenses. You represent that each of Your Submissions is entirely Your original work (except as You may
have disclosed under Section 3 ). You represent that You have secured permission from Your employer to
make the Submission in cases where Your Submission is made in the course of Your work for Your
employer or Your employer has intellectual property rights in Your Submission by contract or applicable
law. If You are signing this Agreement on behalf of Your employer, You represent and warrant that You
have the necessary authority to bind the listed employer to the obligations contained in this Agreement.
You are not expected to provide support for Your Submission, unless You choose to do so. UNLESS
REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING, AND EXCEPT FOR THE WARRANTIES
EXPRESSLY STATED IN SECTIONS 3, 4, AND 6 , THE SUBMISSION PROVIDED UNDER THIS AGREEMENT IS
PROVIDED WITHOUT WARRANTY OF ANY KIND, INCLUDING, BUT NOT LIMITED TO, ANY WARRANTY OF
NONINFRINGEMENT, MERCHANTABILITY, OR FITNESS FOR A PARTICULAR PURPOSE.

7. Notice to AvaloniaUI OÜ. You agree to notify AvaloniaUI OÜ in writing of any facts or
circumstances of which You later become aware that would make Your representations in this
Agreement inaccurate in any respect.

8. Information about Submissions. You agree that contributions to Projects and information about
contributions may be maintained indefinitely and disclosed publicly, including Your name and other
information that You submit with Your Submission.

9. Governing Law/Jurisdiction. This Agreement is governed by the laws of the Republic of Estonia, and
the parties consent to exclusive jurisdiction and venue in the courts sitting in Talinn,
Estonia. The parties waive all defenses of lack of personal jurisdiction and forum non-conveniens.

10. Entire Agreement/Assignment. This Agreement is the entire agreement between the parties, and
supersedes any and all prior agreements, understandings or communications, written or oral, between
the parties relating to the subject matter hereof. This Agreement may be assigned by AvaloniaUI OÜ.

AvaloniaUI OÜ dedicates this Contribution License Agreement to the public domain according to the Creative Commons CC0 1.

3 out of 4 committers have signed the CLA.

@maxkatz6 maxkatz6 changed the title Feature/media queries https://github.com/AvaloniaUI/Avalonia/pull/16846 Jun 14, 2025
@maxkatz6 maxkatz6 changed the title https://github.com/AvaloniaUI/Avalonia/pull/16846 Container queries Jun 14, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.