having one solution for different components of app

2022-01-27 20:17:00 -08:00
parent 0d23d1dfd7
commit 0f7e5a831b
256 changed files with 7997 additions and 0 deletions
@@ -0,0 +1,185 @@
+html,
+body {
+  padding: 0;
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
+    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+/* my personal css */
+body {
+  @apply bg-slate-100 !important;
+}
+
+main {
+  font-family: "Poppins", sans-serif;
+  overflow: hidden;
+}
+
+#bg {
+  background: url("/wallpapers/dark-mountains.jpg") no-repeat center center
+    fixed;
+  -webkit-background-size: cover;
+  -moz-background-size: cover;
+  -o-background-size: cover;
+  background-size: cover;
+}
+
+section {
+  @apply backdrop-blur-md;
+}
+
+.font-satisfy {
+  font-family: "Satisfy", cursive;
+}
+.font-poppins {
+  font-family: "Poppins", sans-serif;
+}
+
+.text-teal {
+  color: teal;
+}
+
+#main-title {
+  font-family: "Satisfy", cursive;
+  @apply text-teal-600;
+}
+#side-note {
+  font-size: 1.5em;
+}
+
+p {
+  font-size: 2em;
+}
+
+#marquee-text {
+  font-style: italic;
+  font-size: 1.5em;
+}
+
+/* Mobile :320px. */
+@media (max-width: 767px) {
+  main {
+    padding: 0em;
+  }
+  #main-title {
+    font-size: 2em;
+    color: teal;
+  }
+  #side-note {
+    font-size: 1em;
+  }
+
+  p {
+    font-size: 1.5em;
+  }
+
+  #marquee-text {
+    font-size: 1em;
+  }
+}
+
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+.ant-tabs-nav {
+  @apply m-0 !important;
+}
+.ant-tabs-tab {
+  @apply text-gray-300 pb-3 pt-1 !important;
+}
+.ant-tabs-tab-btn {
+  @apply text-gray-300 !important;
+}
+.ant-tabs-tab-active {
+  @apply text-gray-300 !important;
+}
+.ant-tabs-ink-bar {
+  @apply text-white bg-white !important;
+}
+
+.ant-radio-button-wrapper {
+  @apply bg-transparent text-gray-200  !important;
+}
+.ant-radio-button-checked {
+  @apply bg-white text-black  !important;
+}
+.ant-radio-button-wrapper-checked {
+  @apply bg-white text-black rounded  !important;
+}
+
+.slick-dots > li {
+  @apply bg-teal-600 !important;
+}
+li.slick-active button {
+  @apply bg-orange-500 !important;
+}
+
+/* scrollbar customization */
+::-webkit-scrollbar {
+  height: 5px;
+  width: 5px;
+  @apply rounded;
+}
+
+/* Track */
+::-webkit-scrollbar-track {
+  @apply bg-gray-400 rounded;
+}
+
+/* Handle */
+::-webkit-scrollbar-thumb {
+  background: #888;
+}
+
+/* Handle on hover */
+::-webkit-scrollbar-thumb:hover {
+  background: #555;
+}
+
+.landing-page-bg {
+  background-image: url("/wallpapers/glassmorphic.jpg");
+  /* background-size: 150% 150%;
+  background-repeat: no-repeat; */
+}
+
+.flippingWords {
+  animation: spin_words 6s infinite;
+}
+
+@keyframes spin_words {
+  10% {
+    transform: translateY(-95%);
+  }
+  25% {
+    transform: translateY(-85%);
+  }
+  35% {
+    transform: translateY(-195%);
+  }
+  50% {
+    transform: translateY(-185%);
+  }
+  60% {
+    transform: translateY(-295%);
+  }
+  75% {
+    transform: translateY(-285%);
+  }
+  85% {
+    transform: translateY(-395%);
+  }
+  100% {
+    transform: translateY(-385%);
+  }
+}