mirror of
https://gitlab.winehq.org/wine/wine-gecko.git
synced 2024-09-13 09:24:08 -07:00
Bug 1243403 - Implement the general design of the responsive design mode r=jryans
This commit is contained in:
parent
7a8b8f2092
commit
b008e80ef8
@ -29,8 +29,11 @@ module.exports = createClass({
|
||||
// handles, etc.
|
||||
return dom.div(
|
||||
{
|
||||
className: "viewport",
|
||||
className: "viewport"
|
||||
},
|
||||
dom.div({
|
||||
className: "viewport-header",
|
||||
}),
|
||||
Browser({
|
||||
location,
|
||||
width: viewport.width,
|
||||
|
@ -1,6 +1,33 @@
|
||||
/* TODO: May break up into component local CSS. Pending future discussions by
|
||||
* React component group on how to best handle CSS. */
|
||||
|
||||
iframe {
|
||||
html, body, #app, #viewports {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#viewports {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/**
|
||||
* Viewport Container
|
||||
*/
|
||||
|
||||
.viewport {
|
||||
border: 1px solid var(--theme-splitter-color);
|
||||
box-shadow: 0 4px 4px 0 rgba(155, 155, 155, 0.26);
|
||||
}
|
||||
|
||||
.viewport-header {
|
||||
background-color: var(--theme-toolbar-background);
|
||||
border-bottom: 1px solid var(--theme-splitter-color);
|
||||
color: var(--theme-body-color-alt);
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.browser {
|
||||
display: block;
|
||||
border: 0;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user