From 73d941c42c5d6ce083b60b105f005e445210f6de Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Sun, 11 Feb 2024 14:44:44 +0100
Subject: [PATCH] update css for vyper

---
 apps/vyper/src/app/app.css | 109 +++++++++++++++++++++++++++++++++++++
 1 file changed, 109 insertions(+)

diff --git a/apps/vyper/src/app/app.css b/apps/vyper/src/app/app.css
index 7e4107ba67..f299c4d37a 100644
--- a/apps/vyper/src/app/app.css
+++ b/apps/vyper/src/app/app.css
@@ -113,3 +113,112 @@ html, body, #root, main {
   height: 100%;
   width: 100%;
 }
+
+
+
+.remixui_copyButton {
+  padding: 6px;
+  font-weight: bold;
+  font-size: 11px;
+  line-height: 15px;
+}
+
+.remixui_contractHelperButtons {
+  margin-top: 6px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  float: right;
+}
+.remixui_copyToClipboard {
+  font-size: 1rem;
+}
+.remixui_copyIcon {
+  margin-right: 5px;
+}
+.remixui_log {
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 0.5rem;
+  overflow: visible;
+}
+.remixui_key {
+  margin-right: 5px;
+  text-transform: uppercase;
+  width: 100%;
+}
+.remixui_value {
+  display: flex;
+  width: 100%;
+  margin-top: 1.5%;
+}
+.remixui_questionMark {
+  margin-left: 2%;
+  cursor: pointer;
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+@-webkit-keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+@-moz-keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+@-o-keyframes spin {
+    0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+@-ms-keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+
+.remixui_bouncingIcon {
+  display: inline-block;
+  position: relative;
+  -moz-animation: bounce 2s infinite linear;
+  -o-animation: bounce 2s infinite linear;
+  -webkit-animation: bounce 2s infinite linear;
+  animation: bounce 2s infinite linear;
+}
+
+@-webkit-keyframes bounce {
+    0% { top: 0; }
+    50% { top: -0.2em; }
+    70% { top: -0.3em; }
+    100% { top: 0; }
+}
+@-moz-keyframes bounce {
+    0% { top: 0; }
+    50% { top: -0.2em; }
+    70% { top: -0.3em; }
+    100% { top: 0; }
+}
+@-o-keyframes bounce {
+    0% { top: 0; }
+    50% { top: -0.2em; }
+    70% { top: -0.3em; }
+    100% { top: 0; }
+}
+@-ms-keyframes bounce {
+    0% { top: 0; }
+    50% { top: -0.2em; }
+    70% { top: -0.3em; }
+    100% { top: 0; }
+}
+@keyframes bounce {
+    0% { top: 0; }
+    50% { top: -0.2em; }
+    70% { top: -0.3em; }
+    100% { top: 0; }
+}
+
+#compileDetails {
+  margin: 15px;
+  padding: 15px;
+}