Using CSS and Other Tools for Digital Wellbeing

Prelude: Web vs Mobile

Hiding Inboxes

div[aria-label="Conversations"] {
display: none;
}

Removing Distracting Elements in Publications

.grid-layout__aside,
.persistent-aside,
.persistent-bottom,
.persistent-top,
.headline-block__headline{
display: none;
}

More Focused Email

.AO {
position: absolute;
top: 0px;
left: 0px;
width: 80vw;
height: 90vh;
padding: 5vh 10vw;
}
.aiw, .aeN, .aeH, .aKh, .aeG {
display: none;
}
div[aria-label="Side panel"] {
display: none;
}

Bonus: Take Advantage of Settings!

Conclusions

Footnotes

  1. A friend noted that a browser extension exists that does this and more!
  2. To see all keyboard shortcuts in Gmail, just type: ⇧ + ? (shift and question mark).

--

--

--

kasra.io

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

PLASMA BANK APPLICATION

Collector Comparison: Telegraf vs Collectd vs DD-agent

Offline App Development- A Whole New Area Of Mobile App Development Explored

Offline App Development

Understanding the scaling behaviour of DynamoDB OnDemand tables

What exactly is Apache Maven?

ElasticSearch integrates with Google PubSub

Summer’18: A deeper dive

DroidCon Berlin 2018

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Kasra

Kasra

kasra.io

More from Medium

Flexbox: keeping it simple

How Browsers Work: The main flow

Figure: Webkit main flow

What the glitch

Chrome Extension: Remove unwanted Elements