Merge branch 'DevelopCkutls'

luckydiamond/src/assets/css/ComponentsStyles/payments-modal.css

@@ -195,6 +195,32 @@ input[type="checkbox"]:checked::before {
     margin-left: 26px;
 }
 
+.error-checkbox {
+    position: absolute;
+}
+
+.error-checkbox h2 {
+    font-size: 13px;
+    font-weight: 400;
+    color: #c52f2f;
+}
+
+.checkbox-styles input:disabled:hover {
+    animation: shake 0.6s cubic-bezier(.36, .07, .19, .97);
+}
+
+@keyframes shake {
+    0%, 100% {
+        transform: translateX(0);
+    }
+    10%, 30%, 50%, 70%, 90% {
+        transform: translateX(-4px);
+    }
+    20%, 40%, 60%, 80% {
+        transform: translateX(4px);
+    }
+}
+
 .number-card {
     margin-top: 15px;
 }

luckydiamond/src/assets/css/PagesStyles/adaptive-pages/profilemobile.css

@@ -107,12 +107,74 @@ body {
     font-size: 28px;
 }
 
+.payments-types__mobile {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.types-text__mobile h3 {
+    color: #ABABB4;
+    font-weight: 600;
+    font-family: Montserrat;
+    font-size: 14px;
+}
+
+.types-start__margin-mobile {
+    margin-left: 42px;
+}
+
+.types-margin__mobile h3 {
+    margin-right: 80px;
+}
+
+.types-line__mobile {
+    margin: 20px 0 0 20px;
+    background: #38383E;
+    width: 93%;
+    height: 3px;
+}
+
+.user-info {
+    margin: 0 20px;
+}
+
+.user-name {
+    margin-right: 40px;
+}
+
+.user-name__text h3 {
+    font-size: 16px !important;
+}
+
+.data-info {
+    margin-right: 50px;
+}
+
+.data-info__text h3 {
+    font-size: 14px !important;
+}
+
+.transaction-info__text h3 {
+    font-size: 15px !important;
+}
+
+.payments-card__mobile {
+    display: flex;
+}
+
+.payments-card__mobile {
+    display: flex;
+}
+
+/* Media */
+
 @media screen and (max-device-width: 415px) {
     .header-mobile {
         height: 45%;
     }
     .profile-mobile__content {
-        margin-top: -10%;
+        margin-top: -25%;
         flex-direction: column;
         text-align: center;
         align-items: center;

luckydiamond/src/assets/css/PagesStyles/games-pages/saper.css

@@ -282,6 +282,7 @@ input[type="number"]::-webkit-outer-spin-button {
 .square h2 {
     transition: .2s;
     opacity: 1;
+    user-select: none;
 }
 
 .square-text {
@@ -381,4 +382,114 @@ input[type="number"]::-webkit-outer-spin-button {
     top: 455px;
 }
 
-/* /Saper Game */
+/* /Saper Game */
+
+/* Media */
+
+@media screen and (min-device-width: 1400px) and (max-device-width: 1600px) {
+    .saper-game__content {
+        width: auto;
+    }
+    .saper-start {
+        width: 30%;
+        height: 80%;
+    }
+    .steps-btns__display {
+        justify-content: center;
+    }
+    .margin-lines .firstline {
+        margin-top: 2%;
+    }
+    .info-emeralds {
+        margin-top: 6.5%;
+    }
+    .info-crystals {
+        margin-top: 6.5%;
+    }
+    .crystals-btns__choices button, .btn-style__diamonds button {
+        padding: 4px 13px;
+    }
+    .diamond-icon {
+        top: 12px;
+        left: 35px;
+    }
+    #diamonds-input {
+        width: 60%;
+    }
+    .btns-style__steps button {
+        padding: 6px 9px;
+    }
+    .card-info img {
+        width: 100%;
+    }
+    .circles-1 {
+        top: 110px;
+    }
+    .circles-2 {
+        top: 220px;
+    }
+    .circles-3 {
+        top: 330px;
+    }
+    .circles-4 {
+        top: 440px;
+    }
+}
+
+@media screen and (min-device-width: 1200px) and (max-device-width: 1399px) {
+    .bg-two {
+        left: 300px;
+    }
+    .saper-game__content {
+        width: auto;
+    }
+    .saper-start {
+        width: 30%;
+        height: 75%;
+    }
+    .steps-btns__display {
+        justify-content: center;
+    }
+    .margin-lines .firstline {
+        margin-top: 2%;
+    }
+    .square {
+        width: 75px;
+    }
+    .info-emeralds {
+        margin-top: 6.5%;
+    }
+    .info-crystals {
+        margin-top: 6.5%;
+    }
+    .text-style__subtitle h2 {
+        font-size: 11px;
+    }
+    .text-style__comment p {
+        font-size: 11px;
+    }
+    .crystals-btns__choices button, .btn-style__diamonds button {
+        padding: 4px 7px;
+    }
+    .diamonds-btns__display {
+        margin-left: 3%;
+    }
+    .diamond-icon {
+        top: 12px;
+        left: 35px;
+    }
+    #diamonds-input {
+        width: 60%;
+    }
+    .btns-style__steps button {
+        padding: 6px 4px;
+    }
+    .card-info img {
+        width: 100%;
+    }
+    .circles__content {
+        display: none;
+    }
+}
+
+/* /Media */

luckydiamond/src/assets/css/PagesStyles/profile.css

@@ -179,4 +179,32 @@
 
 .withdraw-color h3 {
     color: #EA3D38;
-}
+}
+
+/* Media */
+
+@media screen and (min-device-width: 1400px) and (max-device-width: 1600px) {
+    .profile__card h2 {
+        width: 72%;
+    }
+    .btn-margin {
+        padding-right: 56%;
+    }
+    .withdraw {
+        padding-right: 56%;
+    }
+}
+
+@media screen and (min-device-width: 1200px) and (max-device-width: 1399px) {
+    .profile__card h2 {
+        width: 80%;
+    }
+    .btn-margin {
+        padding-right: 66%;
+    }
+    .withdraw {
+        padding-right: 66%;
+    }
+}
+
+/* /Media */

luckydiamond/src/assets/css/global.css

@@ -153,7 +153,7 @@ body, html {
 
 .saper {
     grid-area: saper;
-    height: 96.2%;
+    /*height: 96.2%;*/
 }
 
 /* /Saper */

luckydiamond/src/components/PaymentsModal.vue

@@ -67,8 +67,11 @@
         <h3>Введите номер карты</h3>
         <input class="with-input" v-model="card" type="text" />
       </div>
+      <div v-if="offAgree" class="error-checkbox">
+        <h2 v-show="errorAgree">Введите сначало карту</h2>
+      </div>
       <div class="withdraw-checkbox checkbox-styles">
-        <input :disabled="offAgree" @click="agreeUser = !agreeUser" type="checkbox"/>
+        <input :disabled="offAgree" @mouseover="errorAgree = true" @mouseleave="errorAgree = false" @click="agreeUser = !agreeUser" type="checkbox"/>
         <h3>Я согласен с пользовательским соглашением.</h3>
       </div>
       <captcha-component @captchatokendata="claimCaptchaToken" :showcaptcha="agreeUser" @captchadata="closeModal"></captcha-component>
@@ -105,6 +108,7 @@ export default {
       amountWithdraw: 1,
       amountSave: 1,
       card: '',
+      errorAgree: false,
       captchaToken: null,
       clickedBtn: "",
       url: "",

luckydiamond/src/pages/adaptive-pages/ProfilemobilePage.vue

@@ -19,6 +19,36 @@
       </div>
     </main>
 
+    <section class="payments-mobile">
+      <div class="payments-mobile__content_">
+        <div class="payments-types__mobile types-margin__mobile types-text__mobile">
+          <h3 class="types-start__margin-mobile">Вид транзакции</h3>
+          <h3>Дата</h3>
+          <h3>Сумма</h3>
+        </div>
+        <div class="types-line__mobile"></div>
+        <div class="payments-history__mobile">
+          <div class="payments-card__mobile">
+            <div class="user-info">
+              <img src="@/assets/icons-test/person-icon-profile-userinfo.png">
+              <div class="user-name user-name__text">
+                <h3>Artemka</h3>
+                <h3>test</h3>
+              </div>
+            </div>
+            <div class="payments-data">
+              <div class="data-info data-info__text">
+                <h3>5ч назад</h3>
+              </div>
+              <div class="transaction-info transaction-info__text">
+                <h3>99 АР</h3>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
     <menu-mobile-component></menu-mobile-component>
 
   </div>