wikimedia/mediawiki-extensions-VisualEditor
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor synced 2024-11-15 18:39:52 +00:00
Code Issues Packages Projects Releases Wiki Activity
mediawiki-extensions-Visual.../modules/ve-mw/ui/styles/dialogs/ve.ui.MWMediaDialog.css

83 lines
1.7 KiB
CSS
Raw Normal View History

Split out omnibus CSS files Change-Id: I195a0e4091cf2d003c325e9c653dd634e7096779
2014-03-18 20:52:39 +00:00
/*!
* VisualEditor MediaWiki UserInterface MWMediaDialog styles.
*
doc: Bump copyright year for 2020 Change-Id: I30539877543dc2a57bd1428a00d10ac46d8fc294
2020-01-08 17:13:04 +00:00
* @copyright 2011-2020 VisualEditor Team and others; see AUTHORS.txt
Split out omnibus CSS files Change-Id: I195a0e4091cf2d003c325e9c653dd634e7096779
2014-03-18 20:52:39 +00:00
* @license The MIT License (MIT); see LICENSE.txt
*/
Lazy load the media search results * Set the src attribute only when the image is actually visible in the search results. * Display the thumbnail image we have from the search results and then update with a larger one from the API. * Request for more media results on a higher threshhold, when the user views 2 rows above the last available result. * Correct the resizeToBoundingBox and simplify it to work properly for a non-square bounding box regardless of constraints. Change-Id: If024b0335ce6a5d2d0eafdbfdfe1030dcaac3a75
2015-01-15 18:50:30 +00:00
.ve-ui-mwMediaDialog-panel-imageinfo {
padding-top: 2em;
padding-left: 2em;
padding-right: 2em;
}
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
.ve-ui-mwMediaDialog-panel-imageinfo-thumb {
text-align: center;
}
Lazy load the media search results * Set the src attribute only when the image is actually visible in the search results. * Display the thumbnail image we have from the search results and then update with a larger one from the API. * Request for more media results on a higher threshhold, when the user views 2 rows above the last available result. * Correct the resizeToBoundingBox and simplify it to work properly for a non-square bounding box regardless of constraints. Change-Id: If024b0335ce6a5d2d0eafdbfdfe1030dcaac3a75
2015-01-15 18:50:30 +00:00
.ve-ui-mwMediaDialog-panel-imageinfo-loadingthumb img {
opacity: 0.8;
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
}
.ve-ui-mwMediaDialog-panel-imageinfo-info {
padding: 1em 2em;
}
Enable the media dialog on mobile visual editor Also make improvements to the layout, so that the dialog works in desktop and mobile - most importantly, change from booklet to index layout. Bug: T190885 Bug: T118710 Change-Id: I1915d06c9b0e4b7907136e645f60be96e30cc287
2018-09-17 16:50:28 +00:00
@media ( max-width: 400px ) {
.ve-ui-mwMediaDialog-panel-imageinfo-info {
padding: 1em 0;
}
}
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
.ve-ui-mwMediaDialog-panel-imageinfo-main {
Tweak margins on media info page Change-Id: I5434c3ade332de22f6b6cf058dc2f1e402524959
2015-01-16 13:34:25 +00:00
margin-bottom: 1em;
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
}
.ve-ui-mwMediaDialog-panel-imageinfo-portrait .ve-ui-mwMediaDialog-panel-imageinfo-thumb img {
Tweak margins on media info page Change-Id: I5434c3ade332de22f6b6cf058dc2f1e402524959
2015-01-16 13:34:25 +00:00
margin-bottom: 1em;
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
max-height: none;
}
.ve-ui-mwMediaDialog-panel-imageinfo-portrait .ve-ui-mwMediaDialog-panel-imageinfo-thumb,
.ve-ui-mwMediaDialog-panel-imageinfo-portrait .ve-ui-mwMediaDialog-panel-imageinfo-info {
float: left;
}
.ve-ui-mwMediaDialog-panel-imageinfo-portrait .ve-ui-mwMediaDialog-panel-imageinfo-info {
Lazy load the media search results * Set the src attribute only when the image is actually visible in the search results. * Display the thumbnail image we have from the search results and then update with a larger one from the API. * Request for more media results on a higher threshhold, when the user views 2 rows above the last available result. * Correct the resizeToBoundingBox and simplify it to work properly for a non-square bounding box regardless of constraints. Change-Id: If024b0335ce6a5d2d0eafdbfdfe1030dcaac3a75
2015-01-15 18:50:30 +00:00
padding-left: 2em;
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
box-sizing: border-box;
Split out omnibus CSS files Change-Id: I195a0e4091cf2d003c325e9c653dd634e7096779
2014-03-18 20:52:39 +00:00
}
Merge Media Edit and Media Insert dialogs Merge the media edit and media insert dialogs. Allow editing of media properties when inserting a new image, and also allow the user to replace the image on edit. Bug: 67170 Change-Id: I35bd95503565dbf95090ee8110284db5a8fbba83
2014-06-19 15:44:05 +00:00
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
.ve-ui-mwMediaDialog-panel-imageinfo-title {
font-size: 1.5em;
line-height: 1.5em;
margin-top: -0.2em;
Increase the space between the title and text in media dialog Make the spacing between the image title and the description the same as the space between the description and the metadata. Bug: T87451 Change-Id: I0d0051cd66072861019b904980c405fa05145b2b
2015-01-23 20:19:51 +00:00
margin-bottom: 0.5em;
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
}
.ve-ui-mwMediaDialog-panel-imageinfo-details {
Replace remaining greys/reds with WikimediaUI color palette colors Replacing remaining greys and reds apart Monobook/Apex specific stylesheets with WikimediaUI palette colors. Bug: T173459 Change-Id: I9b5b1c379bf76e8da57eeff28c7dd000f148a8fc
2017-08-16 20:42:24 +00:00
color: #54595d;
Transform the search widget to show image details Add an info panel to the MediaDialog to show the user information about the chosen file from the new extmetadata API. Also, change the way results are viewed: * Present the search results with their proper ratio. * Use masonry fit for the search results. * Change the resizeToBoundingBox method in ve.dm.MWImageNode to accept a specific side constraint, either 'width' or 'height'. This is also going to be useful for adding and calculating 'scale' considerations that affects the image height. * Add info panel with details from extmetadata including author, license, date of upload and creation, etc. * Get descriptions and data according to wiki language. Bug: T78161 Bug: T74061 Change-Id: I7b4d019825aa89dd178665bd9492a07af15954ac
2014-09-18 19:49:22 +00:00
}
.ve-ui-mwMediaDialog-panel-imageinfo-separator {
margin: 0 0.5em;
display: inline-block;
}
.ve-ui-mwMediaDialog-altText {
width: auto;
Merge Media Edit and Media Insert dialogs Merge the media edit and media insert dialogs. Allow editing of media properties when inserting a new image, and also allow the user to replace the image on edit. Bug: 67170 Change-Id: I35bd95503565dbf95090ee8110284db5a8fbba83
2014-06-19 15:44:05 +00:00
}
Use upstream media search widget from core Bug: T140166 Depends-On: If53ef7f4b62c7a5d4da565c14dd2a353778694e5 Change-Id: I28845e9c143e78d3a377f067606c62da212e3bf1
2016-11-16 18:21:22 +00:00
.mw-widget-mediaSearchWidget .oo-ui-searchWidget-results {
Merge Media Edit and Media Insert dialogs Merge the media edit and media insert dialogs. Allow editing of media properties when inserting a new image, and also allow the user to replace the image on edit. Bug: 67170 Change-Id: I35bd95503565dbf95090ee8110284db5a8fbba83
2014-06-19 15:44:05 +00:00
padding-right: 0;
}
Add filename to the media dialog Show the currently used filename at the top of the media dialog so it can be copied and used in other pages if needed. Bug: T54459 Change-Id: Ib1844c997189f7ead0656c5a811d3cab70030f89
2015-01-08 23:40:12 +00:00
/* HACK: Override ooui specific 2em top margin */
Fix typos Add some common ones to typos.json Change-Id: I3830be4949ab6a5fd998d6937ed83e9f18091c2b
2015-12-09 16:47:13 +00:00
.ve-ui-mwMediaDialog-caption-fieldset.oo-ui-labelElement.oo-ui-fieldsetLayout {
Add filename to the media dialog Show the currently used filename at the top of the media dialog so it can be copied and used in other pages if needed. Bug: T54459 Change-Id: Ib1844c997189f7ead0656c5a811d3cab70030f89
2015-01-08 23:40:12 +00:00
margin-top: 0;
}
MWMediaDialog: Add a margin back to the border checkbox This was removed upstream in OOUI as unecessary in general, but clearly this was the place for which the rule had been designed. :-) Bug: T119547 Change-Id: I46a1df1141c337b436e66872f1a8cdae026816cd
2015-12-03 02:28:14 +00:00
stylelint: Enforce class name pattern Change-Id: Ia41a08424f840d353eb7fc213815f7992da4a2ef
2019-01-13 00:21:33 +00:00
.ve-ui-mwMediaDialog-description-link {
Link to file description pages in media dialog Bug: T125227 Change-Id: I243f5479ab27ab098d41db08ff4a53195d382577
2016-02-21 02:56:25 +00:00
font-size: 75%;
build: Replace csslint with stylelint For now just use the rules file in lib/ve, but eventually this will be a preset. Change-Id: I7fd79d3e1dce37aef066d416cd969e5fff1e962f Depends-On: I17e0d23ddfedf64985495ab35d113ea08c03b1df
2016-05-16 14:38:57 +00:00
}
Reference in a new issue Copy permalink