appscms-tools-theme 2.3.5 → 2.3.8

data/assets/css/feature-1.css

@@ -1,5 +1,5 @@
-body {
-    font-family: Inter, sans-serif
+:root {
+    --maincolor: #e55c5c;
 }
 
 #dropfile {
@@ -9,27 +9,6 @@ body {
     color: white;
 }
 
-#upper-loader {
-    width: 0%;
-    height: 13px;
-    background: white;
-}
-
-#loader-box {
-    background: url('../spinner.gif');
-    height: 70px;
-    width: 70px;
-    background-repeat: no-repeat;
-    background-size: cover;
-    margin: auto;
-}
-
-#errorMessage {
-    color: yellow;
-    font-size: 25px;
-    text-align: center;
-}
-
 .boxes {
     background: #fff;
     border-radius: 0;
@@ -41,8 +20,8 @@ body {
     border-top-left-radius: 4px;
     border-bottom-left-radius: 4px;
     justify-content: center;
-    font-size: 17px;
-    font-weight: 800;
+    font-size: 15px;
+    font-weight: 400;
     margin-top: -14px;
 }
 
@@ -71,7 +50,7 @@ body {
 }
 
 .file-picker-dropdown {
-    width: 250px;
+    width: 235px;
     position: absolute;
     background: #fff;
     top: 111%;
@@ -114,313 +93,154 @@ body {
     padding-bottom: 60px;
 }
 
-.feature1-h1 {
-    line-height: 70px;
-    font-size: 52px;
-    font-weight: 700;
-    color: rgb(33, 33, 33);
-    text-align: center;
-    margin: 0px;
-}
-
-.feature1-h2 {
-    text-align: center;
-    font-weight: 300;
-    line-height: 30px;
-    font-size: 20px;
-    max-width: 380px;
-    margin: 0 auto;
-}
-
 #filepicker,
 #dropbox {
     font-size: 13px;
 }
 
-.feature1-how-to-heading {
-    font-weight: 900;
-    font-size: 35px;
-}
-
-.feature1-howto-steps {
-    font-size: 12px;
-    text-transform: uppercase;
-    display: block;
-    padding-bottom: 8px;
-}
-
-.feature1-how-to-title {
-    line-height: 20px;
-    font-weight: 500;
-    margin: 0px;
-    /* padding-bottom: 12px; */
-    font-size: 18px;
-}
-
-.feature1-card-desc {
-    font-size: 14px;
-    color: #5c5e60;
-    max-width: 250px;
-    margin: 0 auto
+/* feature css */
+canvas {
+    height: auto !important;
+    position: relative !important;
 }
 
-.feature-card-title {
-    font-size: 17px;
-    font-weight: 500;
-}
-
-.feature1-how-to-list-item {
-    line-height: 24px;
-    font-size: 14px;
-    /* font-weight: 400; */
+#canvas-panel {
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    padding: 25px;
+    border-radius: 4px;
+    min-height: auto;
+    height: auto;
     display: flex;
-    padding: 6px 0px;
-    max-width: 240px;
-    color: #5c5e60;
-    margin: 0 auto;
-}
-
-.feature1-how-to-right,
-.feature1-how-to-list-item {
-    text-align: left;
-}
-
-
-
-/* ra */
-
-
-.faq_heading {
-    font-size: clamp(20px, 4vw, 30px);
-    line-height: 1.2;
-    margin-bottom: 40px;
-    text-align: center;
-    margin-top: 100px;
-    color: #000;
-}
-
-.faq_ans {
-    font-size: 15px;
-    width: 100%;
-    text-align: center;
-    color: #000;
+    justify-content: center;
+    align-items: center;
 }
 
-main {
-    max-width: fit-content;
-    margin: 0px auto;
-    margin-bottom: 100px;
-    text-align: left;
+#canvas-panel #canvas-img {
+    max-width: 100%;
 }
 
-
-details {
-    margin: 20px 0px;
-    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-}
-
-summary {
-    list-style: none;
+.select-format-title {
+    position: relative;
+    display: inline-block;
+    font-size: 16px;
+    padding: 0px 24px 0px 0px;
+    color: #066;
+    border-right: 1px solid #eee;
+    text-decoration: none;
+    filter: grayscale(100%);
+    display: flex;
+    justify-content: left;
+    text-transform: capitalize;
     font-size: 16px;
     font-weight: 600;
-    color: #000;
-    padding: 0;
-    margin-bottom: 1rem;
-    outline: none;
-    border-radius: 0.25rem;
-    text-align: left;
-    cursor: pointer;
-    position: relative;
-    border-radius: 0;
 }
 
-details[open] summary~* {
-    animation: sweep 0.5s ease-in-out;
+.download-format {
+    display: flex;
+    align-items: center;
+    padding: 0px 24px;
 }
 
-.faq__content {
+#image-format {
+    background: rgb(238 238 238);
+    padding: 6px 33px 6px 16px;
+    border-radius: 4px;
+    width: 123px;
+    border: 1px solid rgb(238 238 238);
+    outline: none;
+    margin-left: 7px;
+    /* border: none; */
+    font-weight: bold;
     font-size: 15px;
-    color: #000;
-}
-
-
-@keyframes sweep {
-    0% {
-        opacity: 0;
-        margin-top: -10px;
-    }
-
-    100% {
-        opacity: 1;
-        margin-top: 0px;
-    }
-}
-
-details>summary::after {
-    font-family: "Font Awesome 5 Free";
-    position: absolute;
-    content: '\f107';
-    right: 20px;
-    top: 0;
-}
-
-details[open]>summary::after {
-    font-family: "Font Awesome 5 Free";
-    top: 0;
-    position: absolute;
-    content: '\f106';
-    right: 20px;
-}
-
-details>summary::-webkit-details-marker {
-    display: none;
-}
-
-.privacy-links-item:nth-child(4) {
-    border-left: 1px solid rgba(0, 0, 0, 0.1);
-}
-
-.privacy-links-item:nth-child(4),
-.drop-down-btn {
-    padding-left: 15px;
-}
-
-.language-drop-down-item {
-    font-size: 13px;
-    font-weight: 400;
-}
-
-.feature1-in8 {
-    overflow-y: auto;
-    height: 800px;
-}
-
-.modal-open .modal {
-    overflow-y: hidden;
-}
-
-.language-drop-down-item a {
-    padding: 10px 0px;
-}
-
-.active-lang {
-    padding: 10px 5px !important;
-}
-
-/* download page css */
-
-.download-section {
-    box-shadow: 0 10px 35px 0 rgb(0 0 0 / 9%);
-    margin-top: 25px;
-    max-width: 800px;
-    margin: 25px auto;
-}
-
-.success-greeting {
-    width: 380px;
-    gap: 5px;
-    background:
-        #57bd91;
-    color: #fff;
-    margin: 0 auto;
-    padding: 15px;
-    border-radius: 40px;
-    margin-bottom: 1rem;
+    color: #555;
+    text-transform: uppercase;
+    margin-left: 6px;
 }
 
-.success-msg {
+#download-button {
+    cursor: pointer;
+    display: inline-block;
+    width: 140px;
+    padding: 10px 0;
+    margin-bottom: 20px;
+    text-align: center;
+    border-radius: 4px;
+    background: var(--maincolor);
+    font-size: 16px;
     color: #fff;
-    font-size: 15px;
-    font-weight: 900;
-}
-
-.try-more-features {
+    font-weight: 700;
+    text-decoration: none;
+    transition: all 0.3s;
     border: none;
 }
 
-.msg_headings {
-    background: #6c6c6c;
-    border-radius: 4px;
-    font-size: 15px;
-    color: #fff;
-    padding: 15px;
-    font-weight: 600;
+#download-button svg {
+    fill: #fff;
+    margin-right: 4px;
+    height: 20px;
 }
 
-.feature-showcase-div {
-    margin: 0px;
-    padding: 0px;
-    overflow: visible;
-    text-decoration: inherit;
-    display: flex;
-    position: relative;
-    border: none;
+.options-panel {
+    border: 1px solid rgb(0, 0, 0, 0.1);
     border-radius: 4px;
+    padding: 30px;
     width: 100%;
-    cursor: pointer;
-    font-weight: 400;
-    font-size: 15px;
-    line-height: 24px;
-    color: rgb(26, 26, 26);
-    user-select: none;
-    outline: none;
-    -webkit-box-align: center;
-    align-items: center;
-    height: auto;
-    background: white;
-    box-shadow: 0 10px 35px 0 rgb(0 0 0 / 9%);
-    padding: 5px;
-}
-
-.feature-showcase-div i {
-    padding-top: 1rem;
+    text-align: left;
 }
 
-.website-img {
-    width: 30px;
+.options-panel .title {
+    width: 100%;
+    margin-bottom: 20px;
+    font-size: 22px;
+    line-height: 36px;
+    color: #000;
+    font-weight: 700;
+    text-align: left;
 }
 
-.website-wrap {
-    text-align: left;
-    font-size: 15px;
+.options-panel .description {
+    width: 100%;
+    font-size: 17px;
+    color: #666;
     font-weight: 400;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
+    text-align: left;
 }
 
-.share-heading {
-    font-size: 15px;
+
+.options-title {
+    width: 100%;
+    font-size: 17px;
+    color: #666;
     font-weight: 400;
-    max-width: 600px;
+    text-align: left;
 }
 
-@media (max-width:768px) {
-
-    .order-1,
-    .order-2,
-    .order-3 {
-        margin: 1rem 0;
+@media (max-width: 768px) {
+    .options-panel {
+        margin-top: 15px;
     }
 
-    .feature1-how-to-right {
-        text-align: center;
+    .boxes {
+        font-size: 14px;
     }
 
-    .feature1-how-to-list-item {
-        max-width: 100%;
-        text-align: center;
+    .select-format-title {
+        font-size: 12px;
+        line-height: 20px;
     }
 
-    .privacy-links-item:nth-child(4) {
-        border: none
+    #image-format,
+    #download-button {
+        font-size: 12px;
+        width: 110px;
     }
 
-    .privacy-links-item:nth-child(4),
-    .drop-down-btn {
-        padding-left: 0;
+    .download-button-container {
+        justify-content: flex-end;
     }
 
+    .file-picker-dropdown {
+        width: 230px;
+    }
 
 }