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

Publish: pubs/subs enforce alignment w/ title wrap

Browse Source 
If your screen wasn't wide enough, the flex rules would destroy the gap
between columns, which destroyed the look of a table altogether.
By removing the 'one-line' class, and moving the margin-left from
the span element to the parent paragraph (for rows that aren't
the header rows), titles wrap onto another line, which enables
a responsive table and firm table margins.
This commit is contained in:
Matilde Park 2019-08-22 13:09:10 -04:00
parent 768c07a3f6
commit 62a81dec84
4 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pkg/arvo/app/publish/js/index.js
View File

File diff suppressed because one or more lines are too long

2
pkg/arvo/app/publish/js/tile.js
View File

File diff suppressed because one or more lines are too long

6
pkg/interface/publish/src/js/components/pubs.js
View File

@ -60,8 +60,8 @@ export class Pubs extends Component {
<div className={cls} key={i}>
<div className="fl body-regular-400 mw-336 w-336 pr3">
<Link to={data.url}>
<p className="one-line mw-336">
<span className="ml3">{data.title}</span>
<p className="ml3 mw-336">
<span>{data.title}</span>
</p>
</Link>
</div>
@ -82,7 +82,7 @@ export class Pubs extends Component {
<div>
<HM invites={invites} unread={unread}/>
<div className="absolute w-100" style={{top:124}}>
<div className="flex-col">
<div className="flex-column">
<div className="w-100">
<h2 className="gray-50"
style={{marginLeft: 16, marginTop:32, marginBottom: 16}}>

8
pkg/interface/publish/src/js/components/subs.js
View File

@ -110,8 +110,8 @@ export class Subs extends Component {
<div className={cls} key={i}>
<div className="fl mw-336" style={{flexBasis: 336}}>
<Link to={data.url}>
<p className="body-regular-400 one-line pr3">
<span className="ml3">{data.title}</span>
<p className="body-regular-400 pr3 ml3">
<span>{data.title}</span>
</p>
</Link>
</div>
@ -133,7 +133,7 @@ export class Subs extends Component {
<div className={cls} key={i}>
<div className="fl body-regular-400" style={{flexBasis: 336}}>
<Link to={data.url}>
<div className="mw-336 one-line pr3">
<div className="mw-336 pr3">
<span className="body-large green-medium"> • </span>
<span className="body-regular-400">Invite to </span>
<span className="body-regular">
@ -170,7 +170,7 @@ export class Subs extends Component {
<div>
<HM invites={invites} unread={unread}/>
<div className="absolute w-100" style={{top:124}}>
<div className="flex-col">
<div className="flex-column">
<div className="w-100">
<h2 className="gray-50"
style={{marginLeft: 16, marginTop: 32, marginBottom: 16}}>