Remove old CSS properties (#4196)

* Remove old CSS properties

* More fixes

Author: tunetheweb

src/static/css/almanac.css

@@ -984,9 +984,8 @@ p.copyright a {
   height: 1px;
   width: 1px;
   overflow: hidden;
-  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
-  clip: rect(1px, 1px, 1px, 1px);
-  white-space: nowrap; /* added line */
+  clip-path: inset(50%);
+  white-space: nowrap;
 }
 
 .hidden {
@@ -1052,9 +1051,8 @@ p.copyright a {
     height: 1px;
     width: 1px;
     overflow: hidden;
-    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
-    clip: rect(1px, 1px, 1px, 1px);
-    white-space: nowrap; /* added line */
+    clip-path: inset(50%);
+    white-space: nowrap;
   }
 
   .title-lg {

src/static/css/ebook.css

@@ -203,7 +203,7 @@ tbody tr:nth-child(even) {
 
 .content ul li.contributor {
   list-style: none;
-  page-break-inside: avoid;
+  break-inside: avoid;
 }
 
 pre {
@@ -372,7 +372,7 @@ section.chapter {
   }
 
   .content > section {
-    page-break-after: always;
+    break-after: always;
   }
 
   #toc a::after {
@@ -413,7 +413,7 @@ section.chapter {
   figcaption {
     max-width: 100%;
     text-align: center;
-    page-break-inside: avoid;
+    break-inside: avoid;
   }
 
   figure .code-block {
@@ -440,7 +440,7 @@ section.chapter {
     display: table;
     border-spacing: 2px;
     border-color: grey;
-    page-break-inside: avoid;
+    break-inside: avoid;
   }
 
   h2 {
@@ -458,18 +458,18 @@ section.chapter {
   h4,
   h5 {
     font-weight: bold;
-    page-break-after: avoid;
-    page-break-inside: avoid;
+    break-after: avoid;
+    break-inside: avoid;
   }
 
   h1 + p,
   h2 + p,
   h3 + p {
-    page-break-before: avoid;
+    break-before: avoid;
   }
 
   .authors li {
-    page-break-inside: avoid;
+    break-inside: avoid;
   }
 
   .authors .avatar {

src/static/css/index.css

@@ -13,7 +13,6 @@ header.alt-bg {
 }
 
 #maincontent {
-  display: -ms-grid;
   display: grid;
   grid-template-areas:
     '. intro .'
@@ -54,17 +53,13 @@ p {
 .intro-container {
   color: #fff;
   grid-area: intro;
-  -ms-grid-row: 1;
-  -ms-grid-columns: 2fr 1fr;
-  display: -ms-grid;
   display: grid;
   grid-template-areas: 'intro image';
-  grid-gap: 2rem;
+  gap: 2rem;
   justify-content: space-between;
 }
 
 .intro {
-  -ms-grid-column: 1;
   grid-area: intro;
   width: 100%;
   max-width: 550px;
@@ -74,14 +69,12 @@ p {
 }
 
 .intro-year {
-  -ms-grid-row: 1;
   grid-area: year;
   display: none;
   font-family: 'Poppins', sans-serif;
 }
 
 .intro-image-wrapper {
-  -ms-grid-column: 2;
   grid-area: image;
   max-height: 485px;
   max-height: 30.3125rem;
@@ -126,7 +119,6 @@ p {
 
 /* Featured Chapter */
 .featured-chapter {
-  -ms-grid-row: 2;
   grid-area: chapter;
   padding: 120px 0;
   padding: 7.5rem 0;
@@ -183,7 +175,6 @@ p {
 .contributors-container {
   padding-left: 180px;
   padding-left: min(180px, 15vw);
-  -ms-grid-row: 3;
   grid-area: contributors;
   background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMDIiIGhlaWdodD0iMzMwIiB2aWV3Qm94PSIwIDAgMzAyIDMzMCI+CiAgPHBhdGggb3BhY2l0eT0iLjMiIGZpbGw9IiNmN2Y3NzkiIGQ9Ik0tMTcxMiAyNTdIMjI1djczaC0xOTM3eiIvPgogIDxwYXRoIG9wYWNpdHk9Ii45IiBmaWxsPSIjYThjYWJhIiBkPSJNLTE2NDAgMTM2SDI5N3Y3M2gtMTkzN3oiLz4KICA8cGF0aCBvcGFjaXR5PSIuOSIgZmlsbD0iI2Y3Zjc3OSIgZD0iTS0xNjc3IDE2NkgyNjB2NzNoLTE5Mzd6Ii8+CiAgPHBhdGggb3BhY2l0eT0iLjkiIGZpbGw9IiM0YTMyNDQiIGQ9Ik0tMTc3MiAzSDE2NXY3M2gtMTkzN3oiLz4KPC9zdmc+");
   background-position: -150px center;
@@ -238,7 +229,6 @@ p {
 
 /* Methodology */
 .methodology-container {
-  -ms-grid-row: 4;
   grid-area: methodology;
   padding: 0 min(60px, 5vw);
 }

src/static/css/page.css

@@ -1,8 +1,6 @@
 .main {
-  display: -ms-grid;
   display: grid;
   grid-template-areas: 'index content';
-  -ms-grid-columns: 300px calc(100% - 300px);
   grid-template-columns: 300px auto;
   grid-template-columns: min(18.75rem, 20vw) calc(100% - min(18.75rem, 25vw)); /* auto sometimes not set correctly on font zoom */
 }
@@ -42,7 +40,6 @@
 
 .index {
   grid-area: index;
-  -ms-grid-column: 1;
 }
 
 .index .index-box {
@@ -166,7 +163,6 @@
 
 .content {
   grid-area: content;
-  -ms-grid-column: 2;
   margin-left: 40px;
 }
 
@@ -729,7 +725,6 @@ figure .fig-desktop {
 
 @media (max-width: 56.25em) {
   .main {
-    -ms-grid-columns: 1fr;
     grid-template-areas:
       'index'
       'content';
@@ -738,13 +733,10 @@ figure .fig-desktop {
   }
 
   .main .content {
-    -ms-grid-row: 2;
-    -ms-grid-column: 1;
     margin-left: 0;
   }
 
   .index {
-    -ms-grid-row: 1;
     margin: 30px 0;
     margin: 1.875rem 0;
   }