autoprefix for modern browsers

eboye · Jan 20, 2022 · 7fecc77 · 7fecc77
1 parent 24896af
commit 7fecc77
Showing 1 changed file with 9 additions and 62 deletions.
diff --git a/css/main.css b/css/main.css
@@ -1,14 +1,16 @@
+/*
+* Prefixed by https://autoprefixer.github.io
+* PostCSS: v8.3.6,
+* Autoprefixer: v10.3.1
+* Browsers: last 2 versions > 2% not IE > 0 not dead not op_mini all not op_mob > 0 not Baidu > 0 not Opera > 0 not and_qq > 0 not UCAndroid > 0 not kaios > 0
+*/
+
 /*
  * Remove text-shadow in selection highlight: h5bp.com/i
  * These selection declarations have to be separate.
  * Customize the background color to match your design.
  */
 
-::-moz-selection {
- background: #61B039;
- text-shadow: none;
-}
-
 ::selection {
  background: #61B039;
  text-shadow: none;
@@ -36,11 +38,6 @@
 
 body{
  background: rgb(125,126,125);
- background: -moz-radial-gradient(center, ellipse cover, rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%);
- background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(14,14,14,1)));
- background: -webkit-radial-gradient(center, ellipse cover, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%);
- background: -o-radial-gradient(center, ellipse cover, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%);
- background: -ms-radial-gradient(center, ellipse cover, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%);
  background: radial-gradient(ellipse at center, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%);
  background-size: 100% 100%;
 }
@@ -53,8 +50,6 @@ body{
  left: 50%;
  top: 50%;
  background-color: #fbfbfb;
- -webkit-box-shadow: inset 0 0 0.1em rgba(16,16,16,.04), inset 0 0 2px rgba(16,16,16,.1);
- -moz-box-shadow: inset 0 0 0.1em rgba(16,16,16,.04), inset 0 0 2px rgba(16,16,16,.1);
  box-shadow: inset 0 0 0.1em rgba(16,16,16,.04), inset 0 0 2px rgba(16,16,16,.1);
  border-top-left-radius: 6em 5em;
  border-top-right-radius: 6em 5em;
@@ -68,10 +63,6 @@ body{
  height: 72em;
  margin-top: 0.6em;
  background-color: #fbfbfb;
- background-image: -webkit-linear-gradient(left, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
- background-image: -moz-linear-gradient(left, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
- background-image: -o-linear-gradient(left, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
- background-image: -ms-linear-gradient(left, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
  background-image: linear-gradient(to right, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
  border-top-left-radius: 6em 5em;
  border-top-right-radius: 6em 5em;
@@ -93,13 +84,7 @@ body{
 
 .shadow{
  background-color: #fbfbfb;
- -webkit-box-shadow: inset 0 0 0.1em rgba(16,16,16,.08);
- -moz-box-shadow: inset 0 0 0.1em rgba(16,16,16,.08);
  box-shadow: inset 0 0 0.1em rgba(16,16,16,.08);
- background-image: -webkit-linear-gradient(left, #c1c1c1, #9b9b9b 51%, #b6b6b6);
- background-image: -moz-linear-gradient(left, #c1c1c1, #9b9b9b 51%, #b6b6b6);
- background-image: -o-linear-gradient(left, #c1c1c1, #9b9b9b 51%, #b6b6b6);
- background-image: -ms-linear-gradient(left, #c1c1c1, #9b9b9b 51%, #b6b6b6);
  background-image: linear-gradient(to right, #c1c1c1, #9b9b9b 51%, #b6b6b6);
  padding-bottom: 0.5em;
  border-top-left-radius: 6em 5em;
@@ -110,10 +95,6 @@ body{
 
 .shadow_inner{
  background-color: #fbfbfb;
- background-image: -webkit-linear-gradient(left, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
- background-image: -moz-linear-gradient(left, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
- background-image: -o-linear-gradient(left, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
- background-image: -ms-linear-gradient(left, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
  background-image: linear-gradient(to right, #fbfbfb, #eaeaea 20%, #ececec 76%, #e5e5e5 89%, #a9a9a9);
  border-top-left-radius: 6em 5em;
  border-top-right-radius: 6em 5em;
@@ -125,14 +106,8 @@ body{
 .volume_rocker{
  width: 0.2em;
  height: 8.6em;
- -webkit-border-radius: 0.1em 0 0/0.5em 0 0;
- -moz-border-radius: 0.1em 0 0/0.5em 0 0;
  border-radius: 0.1em 0 0/0.5em 0 0;
  background-color: #959595;
- background-image: -webkit-linear-gradient(left, rgba(16,16,16,.13), rgba(255,255,255,.13));
- background-image: -moz-linear-gradient(left, rgba(16,16,16,.13), rgba(255,255,255,.13));
- background-image: -o-linear-gradient(left, rgba(16,16,16,.13), rgba(255,255,255,.13));
- background-image: -ms-linear-gradient(left, rgba(16,16,16,.13), rgba(255,255,255,.13));
  background-image: linear-gradient(to right, rgba(16,16,16,.13), rgba(255,255,255,.13));
  position: absolute;
  right: -0.1em;
@@ -154,27 +129,16 @@ body{
  height: 0.8em;
  margin: 0 auto;
  background: rgb(0,0,0);
- background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,1) 20%, rgba(255,255,255,0) 21%);
- background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(20%,rgba(0,0,0,1)), color-stop(21%,rgba(255,255,255,0)));
- background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,1) 20%,rgba(255,255,255,0) 21%);
- background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,1) 20%,rgba(255,255,255,0) 21%);
- background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,1) 20%,rgba(255,255,255,0) 21%);
  background: radial-gradient(ellipse at center, rgba(0,0,0,1) 20%,rgba(255,255,255,0) 21%);
  background-size: 0.6em;
 }
 
 .camera_back{
  width: 1.6em;
  height: 1.6em;
- -webkit-border-radius: 1.6em;
- -moz-border-radius: 1.6em;
  border-radius: 1.6em;
  background-color: #0e0e0e;
  border: solid 0.1em #060606;
- background-image: -webkit-linear-gradient(top, rgba(16,16,16,.04), rgba(255,255,255,.04));
- background-image: -moz-linear-gradient(top, rgba(16,16,16,.04), rgba(255,255,255,.04));
- background-image: -o-linear-gradient(top, rgba(16,16,16,.04), rgba(255,255,255,.04));
- background-image: -ms-linear-gradient(top, rgba(16,16,16,.04), rgba(255,255,255,.04));
  background-image: linear-gradient(to bottom, rgba(16,16,16,.04), rgba(255,255,255,.04));
  float: right;
  position: relative;
@@ -185,12 +149,8 @@ body{
 .camera_inner{
  width: 0.6em;
  height: 0.6em;
- -webkit-border-radius: 0.6em;
- -moz-border-radius: 0.6em;
  border-radius: 0.6em;
  background-color: #151515;
- -webkit-box-shadow: inset 0 0 #101010;
- -moz-box-shadow: inset 0 0 #101010;
  box-shadow: inset 0 0 #101010;
  border: solid 0.1em rgba(255,255,255,.05);
  margin: 0.4em auto 0;
@@ -202,14 +162,8 @@ body{
  margin-top: 1em;
  margin-left: 0.6em;
  background-color:#313131;
- -webkit-box-shadow: inset 0 0 #101010;
- -moz-box-shadow: inset 0 0 #101010;
  box-shadow: inset 0 0 #101010;
  border: solid 0.1em rgba(255,255,255,.26);
- background-image: -webkit-linear-gradient(left, #050505, #323232 2%, #050505 2%, #4d4d4d 5%, #000 96%, #565656 98%, #000);
- background-image: -moz-linear-gradient(left, #050505, #323232 2%, #050505 2%, #4d4d4d 5%, #000 96%, #565656 98%, #000);
- background-image: -o-linear-gradient(left, #050505, #323232 2%, #050505 2%, #4d4d4d 5%, #000 96%, #565656 98%, #000);
- background-image: -ms-linear-gradient(left, #050505, #323232 2%, #050505 2%, #4d4d4d 5%, #000 96%, #565656 98%, #000);
  background-image: linear-gradient(to right, #050505, #323232 2%, #050505 2%, #4d4d4d 5%, #000 96%, #565656 98%, #000);
  border-top-left-radius: 5em 5em;
  border-top-right-radius: 5em 5em;
@@ -224,10 +178,6 @@ body{
  margin-left: 0.5em;
  background-color: #505050;
  border: solid 0.1em #121212;
- background-image: -webkit-linear-gradient(left, #262626, #585858 1%, #0f0f0f 1%, #090909 4%, #090909 95%, #111 99%, #2c2c2c 99%, #111, #2c2c2c);
- background-image: -moz-linear-gradient(left, #262626, #585858 1%, #0f0f0f 1%, #090909 4%, #090909 95%, #111 99%, #2c2c2c 99%, #111, #2c2c2c);
- background-image: -o-linear-gradient(left, #262626, #585858 1%, #0f0f0f 1%, #090909 4%, #090909 95%, #111 99%, #2c2c2c 99%, #111, #2c2c2c);
- background-image: -ms-linear-gradient(left, #262626, #585858 1%, #0f0f0f 1%, #090909 4%, #090909 95%, #111 99%, #2c2c2c 99%, #111, #2c2c2c);
  background-image: linear-gradient(to right, #262626, #585858 1%, #0f0f0f 1%, #090909 4%, #090909 95%, #111 99%, #2c2c2c 99%, #111, #2c2c2c);
  border-top-left-radius: 5em 5em;
  border-top-right-radius: 5em 5em;
@@ -357,14 +307,11 @@ html{
  padding-left: 1em;
  text-shadow: 0 -0.05em 0 rgba(0,0,0,0.6);
  border-radius: 1em;
- background-image: -webkit-linear-gradient(bottom, #5fae37, #8fd058 95%, #d4eebe 95%, #8fd058, #d4eebe);
- background-image: -moz-linear-gradient(bottom, #5fae37, #8fd058 95%, #d4eebe 95%, #8fd058, #d4eebe);
- background-image: -o-linear-gradient(bottom, #5fae37, #8fd058 95%, #d4eebe 95%, #8fd058, #d4eebe);
- background-image: -ms-linear-gradient(bottom, #5fae37, #8fd058 95%, #d4eebe 95%, #8fd058, #d4eebe);
  background-image: linear-gradient(to top, #5fae37, #8fd058 95%, #d4eebe 95%, #8fd058, #d4eebe);
  box-shadow: 0 0.3em 0.5em rgba(0,0,0,0.4);
 }
 
 .buy:hover{
  box-shadow: 0 0.5em 0.5em rgba(0,0,0,0.4);
- margin-top: -0.2em;
+ margin-top: -0.2em;
+}