20manas

@keyframes rotateAndClip {
  0% {
    clip-path: polygon(50% 50%, 50% 0, 100% 0, 100% 0, 100% 0, 100% 0);
  }
  17% {
    clip-path: polygon(50% 50%, 50% 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);
  }
  33% {
    clip-path: polygon(50% 50%, 50% 0, 100% 0, 100% 100%, 0 100%, 0 100%);
  }

20manas

Namespace-Element-Variant (NEV) naming scheme

Component.module.scss

.Namespace {
  &._firstElement {
    display: flex;

    &.__firstVariant {

20manas

The aim of the project was to implement tools in Firefox's DevTools which can help web developers debug unwanted scrollbars which appear in HTML elements because of its descendant elements' size/position.

As the project progressed and our understanding of

1. what features will be useful for developers and
2. how the features will fit into the existing toolset of DevTools

improved, we updated our goals for the project. We started with implementing a feature in Gecko (Firefox's browser/layout engine) which would allow us to get a scrollable element's overflow causing elements. The criteria that the descendants of a scrollable element should satisfy to be an overflow causing element were:

• It should lie outside the scrollable element.
• It should either

20manas

{"lastUpload":"2020-01-14T07:35:20.811Z","extensionVersion":"v3.4.3"}