From 19aea560db1225b795fa1ae18bd8485e7d629974 Mon Sep 17 00:00:00 2001
From: evazion <noizave@gmail.com>
Date: Tue, 16 Feb 2021 08:51:12 -0600
Subject: [PATCH] css: add `box-sizing: border-box` to base css.

This makes it so that an element's width includes borders and padding,
so that borders or padding don't cause an element to exceed its
specified width. This is a standard part of most CSS resets.

https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing
---
 app/javascript/src/styles/base/020_base.scss            | 4 ++++
 app/javascript/src/styles/common/simple_form.scss       | 1 -
 app/javascript/src/styles/specific/common_tooltips.scss | 2 --
 3 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/app/javascript/src/styles/base/020_base.scss b/app/javascript/src/styles/base/020_base.scss
index f582d7399..31a4dd7d4 100644
--- a/app/javascript/src/styles/base/020_base.scss
+++ b/app/javascript/src/styles/base/020_base.scss
@@ -1,3 +1,7 @@
+*, ::before, ::after {
+  box-sizing: border-box;
+}
+
 body {
   color: var(--text-color);
   background-color: var(--body-background-color);
diff --git a/app/javascript/src/styles/common/simple_form.scss b/app/javascript/src/styles/common/simple_form.scss
index 6f2ed942c..c9acbfc36 100644
--- a/app/javascript/src/styles/common/simple_form.scss
+++ b/app/javascript/src/styles/common/simple_form.scss
@@ -138,7 +138,6 @@ div.ui-dialog {
   textarea, input[type="text"] {
     width: 100%;
     max-width: 100%;
-    box-sizing: border-box;
   }
 
   form.simple_form {
diff --git a/app/javascript/src/styles/specific/common_tooltips.scss b/app/javascript/src/styles/specific/common_tooltips.scss
index f4a9dca65..e86da725b 100644
--- a/app/javascript/src/styles/specific/common_tooltips.scss
+++ b/app/javascript/src/styles/specific/common_tooltips.scss
@@ -3,8 +3,6 @@ div[data-tippy-root].tooltip-loading {
 }
 
 .tippy-box[data-theme~="common-tooltip"] {
-  box-sizing: border-box;
-
   border: 1px solid var(--post-tooltip-border-color);
   border-radius: 4px;