- Integrate combined profile events at home

-Added another button to change profile
2026-04-19 21:06:06 +00:00 · 2020-11-20 10:55:51 +01:00
parent 5ef476f8a1
commit b3d709037a
24 changed files with 464 additions and 89 deletions
@@ -265,3 +265,65 @@ ion-toolbar{
      padding: 15px;
      color:red;
    }
+
+    /* NEW CSS FOR TOGGLE BUTTON */
+    input[type="checkbox"]{
+      position: relative;
+      width: 100px;
+      height: 40px;
+      background: #ffffff;
+      -webkit-appearance: none;
+      border-radius: 20px;
+      outline: none;
+      transition: .4s;
+      /* box-shadow: inset 0 0 5px rgba(0,0,0,0.2); */
+      cursor: pointer;
+      border:1px solid red;
+    }
+    input:checked[type="checkbox"]{
+      background: #e16817;
+    }
+    input[type="checkbox"]::before{
+      z-index: 2;
+      position: absolute;
+      content: "";
+      left: 0;
+      width: 38px;
+      height: 38px;
+      background: #fff;
+      border-radius: 50%;
+      /* transform: scale(1.1); */
+      box-shadow: inset 0 2px 5px rgba(0,0,0,0.2);
+      border:1px solid red;
+    }
+    input:checked[type="checkbox"]::before{
+      left: 60px;
+
+    }
+    .toggle{
+      position: relative;
+      display: inline;
+      font-family: 'Montserrat', sans-serif;
+      display: grid;
+      text-align: center;
+    }
+    label{
+      position: absolute;
+      color: #fff;
+      font-weight: 600;
+      font-size: 16px;
+      pointer-events: none;
+    }
+    .onbtn{
+      top:10px;
+      bottom: 15px;
+      left: 15px;
+      /* padding-top: 10px;
+      border: 1px solid red; */
+    }
+    .ofbtn{
+      top:10px;
+      bottom: 15px;
+      right: 14px;
+      color:  #e16817;
+    }