assets/css/appscms-feature.css in appscms-tools-theme-3.8.5 vs assets/css/appscms-feature.css in appscms-tools-theme-3.8.6

- old
+ new

@@ -1,19 +1,14 @@ -/* upload page css*/ - .nav-tool-bar { position: sticky; top: 0; width: 100%; z-index: 999; } - -/* uplaod section */ - .appscms-upload-section { height: 300px; - border: 2px dotted #484848; + border: 2px dashed #484848; padding: 20px; border-radius: 20px; display: flex; align-items: center; justify-content: center; @@ -48,16 +43,13 @@ .line-in-upload { height: 1.5px; width: 60px; background-color: rgb(146, 146, 146); } - -/* feature section */ .appscms-feature-image { max-width: 75px; } - .appscms-feature-title { font-size: 17px; margin-top: 15px; font-weight: 600; margin-bottom: 0.5rem; @@ -75,13 +67,16 @@ background-color: #f4f5ff; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); } .appscms-howto-heading { /* margin-top: 40px; */ - font-size: 2.5rem; + font-size: 25px; font-weight: 500; } +.how-to-video-wrapper iframe { + width: 100%; +} .appscms-howto-steps { font-size: 1rem; font-weight: normal; line-height: 200%; @@ -91,22 +86,26 @@ .faq-section { text-align: left; } .faq-item { - margin-bottom: 40px; + box-shadow: 5px 2px 8px rgba(0, 0, 0, 0.1); + margin-bottom: 15px; + background: white; + padding: 1.5rem; + border-radius: 7px; } .faq-question { - font-size: 27px; + font-size: 22px; font-weight: 500; - line-height: 194%; + margin-bottom: 10px; } .faq-answer { - font-size: 17px; + font-size: 15px; font-weight: normal; margin-bottom: 20px; } .faq-answer-list { @@ -146,10 +145,41 @@ margin-top: 50px !important; } } @media (max-width: 768px) { + .upload-btn { + width: 268px; + padding: 15px; + border-radius: 50px; + font-size: 20px; + height: auto; + } + .upload-from-drives img { + height: 40px; + width: 42px; + } + .drag-msg { + display: none; + } + .appscms-upload-section { + height: 100px; + background-color: transparent; + box-shadow: none; + border: none; + } + .appscms-upload-icon, + .or-in-upload { + display: none; + } + .rating-tool { + flex-direction: column; + display: flex; + gap: 15px; + height: auto; + padding: 15px 0px; + } .heading { padding-top: 0px; text-align: center; display: flex; align-items: center; @@ -162,60 +192,11 @@ .heading h2 { width: 80vw; font-size: 11px; text-align: center; } - .appscms-upload-section-container { - padding: 0; - position: relative; - bottom: 30px; - } - .appscms-upload-section { - height: 0; - border: none; - background-color: transparent; - justify-content: center; - align-items: center; - flex-direction: column; - box-shadow: none; - } - .appscms-upload-icon { - display: none; - } - .appscms-upload-section > *:not(form) { - display: none; - } - .upload-btn { - display: flex; - justify-content: center; - align-items: center; - text-align: center; - color: white; - border-radius: 27px; - width: 200px; - height: 78px; - font-size: 20px; - } - /* featuer section media query */ - - .appscms-feature-image { - width: 30px; - height: 30px; - } - .appscms-feature-title { - font-size: 14px; - font-weight: 600; - } - .appscms-feature-description { - font-size: 12px; - } - - /* how to section */ - .appscms-howto-image { - display: none; - } .appscms-how-to-section { border-radius: 0px; background-color: transparent; box-shadow: none; } @@ -237,126 +218,68 @@ } /* faq section */ .faq-question { font-size: 20px; - margin-bottom: 5px; + margin-bottom: 18px; } .faq-answer { font-size: 12px; margin-bottom: 2px; } .faq-answer-list { font-size: 11px; } +} - /* ratins */ - .ratings { - /* gap: 2px; */ - /* padding: 2px; */ - /* background: transparent; */ - box-shadow: none !important; - } - .appsms-user-rating-count { - /* font-size: 16px !important; */ - } - .appsms-user-total-count { - display: none; - } - .ratings span { - /* font-size: 13px; */ - padding: 4px; - } - .raing-votes { - /* font-size: 13px !important; */ - color: rgb(84, 84, 84); - /* display: none; */ - } +.upload-redirect { + padding: 13px 1.5em 14px 1.5em; + color: #fff; + background-color: #5c5ce0; + border-color: #5c5ce0; + border-radius: 27px; + font-size: 18px; + font-weight: 600; + border: none; } -@media (max-width: 478px) { - body { - background-color: rgb(248, 248, 248); - } - .ratings { - /* gap: 2px; */ - /* padding: 2px; */ - /* background: transparent; */ - box-shadow: none !important; - } - /* mobile screen feaure section media query */ - .appscms-feature-image { - width: 30px; - height: 30px; - } - .appscms-feature-title { - font-size: 12px; - font-weight: 600; - } - .appscms-feature-description { - font-size: 11px; - } - .appscms-feature-description .card-text { - display: none; - } - .appscms-feature-description .card { - text-align: center; - } - .appscms-feature-description .card-img-top { - display: block; - margin: 0 auto; - } - .appscms-feature-description .card-body { - text-align: center; - } - .appscms-feature-description .card-title { - margin-top: 10px; - margin-bottom: 0; - } - /* how to section mobile */ - .appscms-how-to-section { - border-radius: 0px; - background-color: transparent; - box-shadow: none; - } - .appscms-howto-heading { - text-align: center; - margin-top: 0px; - font-size: 20px; - font-weight: 500; - background-color: white; - width: 100vw; - } +#left-section { + display: flex; + flex-direction: column; + align-items: baseline; + justify-content: center; +} - .appscms-howto-steps { - font-size: 12px; - font-weight: normal; - line-height: 200%; - } +.right-section img { + width: 90%; +} - /* faq section media query */ - /* recent posts */ - .appscms-recentposts { - font-size: 25px; - } - /* rating section */ - - .appsms-user-rating-count { - /* font-size: 16px !important; */ - } - .appsms-user-total-count { - display: none; - } - .ratings span { - /* font-size: 13px; */ - padding: 4px; - } - .raing-votes { - /* font-size: 13px !important; */ - color: rgb(84, 84, 84); - display: none; - } +#left-section h1, +#left-section h2 { + text-align: left; + width: 100%; } -/* faq section media queries */ +.video-h1, +.audio-h1 { + font-weight: 600; + font-size: 53px; +} +.toaster { + top: 150px; + padding: 12px 20px; + color: #fff; + display: inline-block; + box-shadow: 0 3px 6px -1px rgb(0 0 0 / 12%), + 0 10px 36px -4px rgb(77 96 232 / 30%); + background: var(--primary-color); + position: fixed; + transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); + border-radius: 2px; + right: 0px; + cursor: pointer; + text-decoration: none; + max-width: calc(50% - 20px); + z-index: 2147483647; +}