forked from Botanical/BotanJS
HomeEntry Responsive style
This commit is contained in:
parent
0f2bf150a7
commit
5e48868fa8
@ -10,12 +10,22 @@
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
[data-narrow] .h_info {
|
||||
position: relative;
|
||||
width: auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.h_body {
|
||||
margin-left: 7em;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
[data-narrow] .h_body
|
||||
, [data-narrow] .h_bodyWrapper {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.h_bodyWrapper {
|
||||
border: 1px solid #D4D7C9;
|
||||
background-color: #FAFAFA;
|
||||
@ -47,6 +57,7 @@
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
[data-narrow] .h_avatarWrapper { display: inline; }
|
||||
|
||||
.h_avatar, .a_avatarWrapper {
|
||||
width: 80px;
|
||||
|
@ -14,12 +14,16 @@
|
||||
BotanJS.addEventListener( "Responsive"
|
||||
/** e @type {Astro.Starfall.Events.Responsive} */
|
||||
, function( e ) {
|
||||
rspd.foreach(
|
||||
document.ELEMENT_NODE
|
||||
, e.data.ratio < 1.2
|
||||
? function( elem ) { elem.style.width = "100%"; }
|
||||
: function( elem ) { elem.style.width = ""; }
|
||||
);
|
||||
if( e.data.ratio < 1.2 )
|
||||
{
|
||||
document.body.setAttribute( "data-narrow", 1 );
|
||||
rspd.foreach( document.ELEMENT_NODE, function( elem ) { elem.style.width = "100%"; } );
|
||||
}
|
||||
else
|
||||
{
|
||||
document.body.removeAttribute( "data-narrow" );
|
||||
rspd.foreach( document.ELEMENT_NODE, function( elem ) { elem.style.width = ""; } );
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user