Progress

app/javascript/styles/global.css

@@ -207,6 +207,10 @@ body {
   border-radius: 8px;
 }
 
+.borderColorSecondary3 {
+  border-color: #F6F6F9;
+}
+
 .borderColorSecondary2 {
   border-color: #e5e9ed;
 }
@@ -251,6 +255,10 @@ body {
   border-width: 2px;
 }
 
+.border6PX {
+  border-width: 6px;
+}
+
 .borderBottom2PX {
   border-bottom-width: 2px;
 }
@@ -307,12 +315,36 @@ body {
   pointer-events: none !important;
 }
 
+.backgroundCandy {
+  background-image: linear-gradient(-45deg, 
+    rgba(255, 255, 255, 0.15) 10%, 
+    rgba(255, 255, 255, 0) 10%,
+    rgba(255, 255, 255, 0) 20%,
+    rgba(255, 255, 255, 0.15) 20%,
+    rgba(255, 255, 255, 0.15) 30%,
+    rgba(255, 255, 255, 0) 30%,
+    rgba(255, 255, 255, 0) 40%,
+    rgba(255, 255, 255, 0.15) 40%,
+    rgba(255, 255, 255, 0.15) 50%,
+    rgba(255, 255, 255, 0) 50%,
+    rgba(255, 255, 255, 0) 60%,
+    rgba(255, 255, 255, 0.15) 60%,
+    rgba(255, 255, 255, 0.15) 70%,
+    rgba(255, 255, 255, 0) 70%,
+    rgba(255, 255, 255, 0) 80%,
+    rgba(255, 255, 255, 0.15) 80%,
+    rgba(255, 255, 255, 0.15) 90%,
+    rgba(255, 255, 255, 0) 90%,
+    rgba(255, 255, 255, 0)
+  );
+}
+
 .backgroundTransparent {
   background-color: transparent;
 }
 
 .backgroundPanel {
-  background-color: #aaa;
+  background-color: #ccc;
 }
 
 .backgroundSubtle {
@@ -827,8 +859,8 @@ body {
   object-fit: cover;
 }
 
-.shadow {
-  /* todo */
+.textShadow {
+  text-shadow: 0 0 5px #000;
 }
 
 .z1 {
@@ -897,11 +929,11 @@ body {
   margin-left: 10px;
 }
 
-.marginLeftAuto {
+.mlAuto {
   margin-left: auto;
 }
 
-.marginRightAuto {
+.mrAuto {
   margin-right: auto;
 }
 
@@ -929,8 +961,8 @@ body {
   margin-top: auto;
 }
 
-.mtNeg30PX {
-  margin-top: -30px;
+.mtNeg32PX {
+  margin-top: -32px;
 }
 
 .mtNeg75PX {
@@ -982,6 +1014,10 @@ body {
   padding-left: 0;
 }
 
+.pl25 {
+  padding-left: 25px;
+}
+
 .pr0 {
   padding-right: 0;
 }
@@ -1049,6 +1085,22 @@ body {
   box-shadow: 0 0 15px -5px rgba(0,0,0,0.15);
 }
 
+.boxShadowBlock {
+  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
+}
+
+.boxShadowNone .boxShadowBlock {
+  box-shadow: none !important;
+}
+
+.boxShadowAvatarPro {
+  box-shadow: 0 0 0 2px #F7D230;
+}
+
+.boxShadowProfileAvatar {
+  box-shadow: 0 0 0 6px #F6F6F9;
+}
+
 .listStyleNone {
   list-style: none;
 }