urbit/shrub
1
1
Fork 0
mirror of https://github.com/urbit/shrub.git synced 2025-01-01 17:16:47 +03:00
Code Issues Packages Projects Releases Wiki Activity

basic responsive drawer stuff

Browse Source
This commit is contained in:
Matilde Park 2019-12-05 02:54:59 -05:00 committed by Logan Allen
parent 92e1970651
commit c59f222443
5 changed files with 22 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pkg/arvo/app/contacts/css/index.css
View File

File diff suppressed because one or more lines are too long

20
pkg/arvo/app/contacts/js/index.js
View File

@ -62755,17 +62755,20 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\
)
});
let activeClasses = (this.props.activeDrawer === "groups") ? "" : "dn-s";
return (
react.createElement('div', { className: "br b--gray4 h-100 flex-basis-100-s flex-basis-300-ns flex-shrink-0 relative" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 51}}
, react.createElement('h2', { className: "f9 pa4 gray2 c-default" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 52}}, "Your Root Identity" )
react.createElement('div', { className: `br b--gray4 h-100 flex-basis-100-s flex-basis-300-ns
flex-shrink-0 relative ` + activeClasses, __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 53}}
, react.createElement('h2', { className: "f9 pa4 gray2 c-default" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 55}}, "Your Root Identity" )
, rootIdentity
, react.createElement('h2', { className: "f9 pt3 pr4 pb4 pl4 gray2 c-default" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 54}}, "Your Groups" )
, react.createElement('h2', { className: "f9 pt3 pr4 pb4 pl4 gray2 c-default" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 57}}, "Your Groups" )
, groupItems
, react.createElement('div', {
className: "dt bt b--gray4 absolute w-100" ,
style: { bottom: 0, height: 48 }, __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 56}}
, react.createElement(Link, { to: "/~contacts/new", className: "dtc v-mid" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 59}}
, react.createElement('p', { className: "f9 pl4 black bn" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 60}}, "Create New Group" )
style: { bottom: 0, height: 48 }, __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 59}}
, react.createElement(Link, { to: "/~contacts/new", className: "dtc v-mid" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 62}}
, react.createElement('p', { className: "f9 pl4 black bn" , __self: this, __source: {fileName: _jsxFileName$5, lineNumber: 63}}, "Create New Group" )
)
)
)
@ -62787,12 +62790,13 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\
style: {
height: "calc(100% - 48px)"
}, __self: this, __source: {fileName: _jsxFileName$6, lineNumber: 15}}
, react.createElement(Groups, { contacts: this.props.contacts, __self: this, __source: {fileName: _jsxFileName$6, lineNumber: 20}})
, react.createElement(Groups, { contacts: this.props.contacts,
activeDrawer: this.props.activeDrawer, __self: this, __source: {fileName: _jsxFileName$6, lineNumber: 20}})
, react.createElement('div', {
className: "h-100 w-100 flex " + rightPanelClasses,
style: {
flexGrow: 1
}, __self: this, __source: {fileName: _jsxFileName$6, lineNumber: 21}}
}, __self: this, __source: {fileName: _jsxFileName$6, lineNumber: 22}}
, this.props.children
)
)

3
pkg/interface/contacts/src/css/custom.css
View File

@ -65,6 +65,9 @@ a {
/* responsive */
@media all and (max-width: 34.375em) {
.dn-s {
display: none;
}
.flex-basis-100-s {
flex-basis: 100%;
}

5
pkg/interface/contacts/src/js/components/groups.js
View File

@ -47,8 +47,11 @@ export class Groups extends Component {
)
});
let activeClasses = (this.props.activeDrawer === "groups") ? "" : "dn-s";
return (
<div className="br b--gray4 h-100 flex-basis-100-s flex-basis-300-ns flex-shrink-0 relative">
<div className={`br b--gray4 h-100 flex-basis-100-s flex-basis-300-ns
flex-shrink-0 relative ` + activeClasses}>
<h2 className="f9 pa4 gray2 c-default">Your Root Identity</h2>
{rootIdentity}
<h2 className="f9 pt3 pr4 pb4 pl4 gray2 c-default">Your Groups</h2>

3
pkg/interface/contacts/src/js/components/skeleton.js
View File

@ -17,7 +17,8 @@ export class Skeleton extends Component {
style={{
height: "calc(100% - 48px)"
}}>
<Groups contacts={this.props.contacts}/>
<Groups contacts={this.props.contacts}
activeDrawer={this.props.activeDrawer}/>
<div
className={"h-100 w-100 flex " + rightPanelClasses}
style={{