ilyakooo0/urbit
1
0
Fork 0
mirror of https://github.com/ilyakooo0/urbit.git synced 2024-09-20 15:08:34 +03:00
Code Issues Packages Projects Releases Wiki Activity

about and settings page

Browse Source
This commit is contained in:
Jimmy 2020-01-30 16:00:40 -08:00 committed by Isaac Visintainer
parent 5b1999347a
commit fe44b25f92
4 changed files with 120 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
pkg/interface/publish/src/js/components/lib/all.js Normal file
View File

@ -0,0 +1,19 @@
import React, { Component } from 'react';
export class All extends Component {
render() {
return (
<div className="mv6">
<div className="mb1">Title</div>
<p className="mb1">I dreamt of urbit hardware - stars and galaxies and planets had differing...</p>
<div className="flex">
<div className="mono gray2 mr3">~fabled-faster</div>
<div className="gray2 mr3">1m ago</div>
<div className="gray2">No Comments</div>
</div>
</div>
)
}
}
export default All

55
pkg/interface/publish/src/js/components/lib/notebook.js
View File

@ -1,6 +1,7 @@
import React, { Component } from 'react';
import { Link, Switch, Route } from 'react-router-dom';
import { NoteList } from './note-list';
import { All } from './all';
import { About } from './about';
import { Subscribers } from './subscribers';
import { Settings } from './settings';
@ -35,8 +36,9 @@ export class Notebook extends Component {
tabStyles[this.props.view] = "bb b--black black NotebookTab";
return (
<div className="center mw7 f9 h-100"
<div className="center mw6 f9 h-100"
style={{paddingLeft:16, paddingRight:16}}>
<div className="h-100 overflow-container">
<div className="flex justify-between"
style={{marginTop: 56, marginBottom: 32}}>
<div className="flex-col">
@ -70,55 +72,8 @@ export class Notebook extends Component {
</div>
<div style={{height:"calc(100% - 170px)"}} className="f9 lh-solid">
<div className="mv6">
<div className="mb1">Title</div>
<p className="mb1">I dreamt of urbit hardware - stars and galaxies and planets had differing...</p>
<div className="flex">
<div className="mono gray3 mr3">~fabled-faster</div>
<div className="gray3 mr3">1m ago</div>
<div className="gray3">No Comments</div>
</div>
<div className="flex flex-column">
<div className="f9 gray2 mt6">Host</div>
<div className="flex justify-between mt3">
<div className="flex">
<div className="f9 mono mr2">~fabled-faster</div>
<div className="f9 gray2">Last active</div>
</div>
<div className="f9">Options ⌃</div>
</div>
</div>
<div className="flex flex-column">
<div className="f9 gray2 mt6">Participants (read and write access)</div>
<div className="f9 mt3">There are no paticipants in this notebook.</div>
<div className="flex justify-between mt3">
<div className="flex">
<div className="f9 mono mr2">~fabled-faster</div>
<div className="f9 gray2">Last active</div>
</div>
<div className="f9">Options ⌃</div>
</div>
</div>
<div className="flex flex-column">
<div className="f9 gray2 mt6 mb3">Subscribers (read access only)</div>
<div className="flex justify-between">
<div className="flex">
<div className="f9 mono mr2">~fabled-faster</div>
<div className="f9 gray2">Last active</div>
</div>
<div className="f9">Options ⌃</div>
</div>
</div>
<div className="flex flex-column">
<div className="f9 gray2 mt6 mb3">Banned</div>
<div className="flex justify-between">
<div className="flex">
<div className="f9 mono mr2">~fabled-faster</div>
<div className="f9 gray2">Last active</div>
</div>
<div className="f9">Options ⌃</div>
</div>
</div>
<Settings />
</div>
</div>
</div>

28
pkg/interface/publish/src/js/components/lib/settings.js
View File

@ -5,8 +5,36 @@ export class Settings extends Component {
render() {
return (
<div>
<div className="flex flex-column mb8">
<label for="name" className="f9">Share</label>
<small id="name-desc" className="f9 mb2 gray3">Share a link to this notebook</small>
<div className="flex">
<input style={{flex: "1"}} id="name" placeholder="dopzod.arvo.network/4f5hsS" className="input-reset bt bl bb pa3 gray4" type="text" aria-describedby="name-desc"/>
<button className="bt br bb pa3 b--gray4">Copy</button>
</div>
</div>
<div className="flex flex-column mb8">
<label for="name" className="f9">Rename</label>
<small id="name-desc" className="f9 mb2 gray3">Change the name of this notebook</small>
<div className="flex">
<input style={{flex: "1"}} id="name" placeholder="Notebook Name" className="input-reset ba pa3 gray4" type="text" aria-describedby="name-desc"/>
</div>
</div>
<div className="flex flex-column">
<label for="name" className="f9">Export</label>
<small id="name-desc" className="f9 mb2 gray3">Change the name of this notebook</small>
<button className="bg-black white pa3">
<div className="flex justify-between">
<div>Export Notebook</div>
<div>↓</div>
</div>
</button>
</div>
</div>
)
}
}

42
pkg/interface/publish/src/js/components/lib/subscribers.js
View File

@ -7,7 +7,47 @@ export class Subscribers extends Component {
render() {
return (
<div>
test
<div className="flex flex-column">
<div className="f9 gray2">Host</div>
<div className="flex justify-between mt3">
<div className="flex">
<div className="f9 mono mr2">~fabled-faster</div>
<div className="f9 gray2">Last active</div>
</div>
<div className="f9">Options ⌃</div>
</div>
</div>
<div className="flex flex-column">
<div className="f9 gray2 mt6">Participants (read and write access)</div>
<div className="f9 mt3">There are no paticipants in this notebook.</div>
<div className="flex justify-between mt3">
<div className="flex">
<div className="f9 mono mr2">~fabled-faster</div>
<div className="f9 gray2">Last active</div>
</div>
<div className="f9">Options ⌃</div>
</div>
</div>
<div className="flex flex-column">
<div className="f9 gray2 mt6 mb3">Subscribers (read access only)</div>
<div className="flex justify-between">
<div className="flex">
<div className="f9 mono mr2">~fabled-faster</div>
<div className="f9 gray2">Last active</div>
</div>
<div className="f9">Options ⌃</div>
</div>
</div>
<div className="flex flex-column">
<div className="f9 gray2 mt6 mb3">Banned</div>
<div className="flex justify-between">
<div className="flex">
<div className="f9 mono mr2">~fabled-faster</div>
<div className="f9 gray2">Last active</div>
</div>
<div className="f9">Options ⌃</div>
</div>
</div>
</div>
)
}