assets/css/appscms-theme.css in appscms-tools-theme-4.6.9 vs assets/css/appscms-theme.css in appscms-tools-theme-4.7.0
- old
+ new
@@ -22,25 +22,26 @@
.appscms-navbar {
background-color: var(--white-color);
height: 45px;
position: sticky;
top: 0;
- z-index: 999;
+ z-index: 1000;
+ height: 60px;
}
.appscms-navbar-nav {
display: flex;
width: 100%;
height: 100%;
justify-content: space-between;
+ align-items: center;
}
.appscms-navbar-nav a {
display: flex;
align-items: center;
}
.appscms-navbar-nav-links {
- width: 100%;
height: 100%;
display: flex;
justify-content: flex-end;
gap: 45px;
align-items: center;
@@ -62,11 +63,11 @@
.appscms-toolbar {
background-color: var(--primary-color);
box-shadow: 1px 4px 10 #00000026;
position: sticky;
z-index: 999;
- top: 45px;
+ top: 60px;
}
.appscms-toolbar .appscms-toolbar-list {
list-style: none;
display: flex;
@@ -132,11 +133,11 @@
.appscms-toolbar .list-item-dropdown {
border: 5px solid #fff;
left: 0px;
position: fixed;
- top: 85px;
+ top: 100px;
min-width: 500px;
max-height: 500px;
overflow-y: auto;
width: 90vw;
box-shadow: 3px 10px 40px rgba(24, 29, 32, 0.05);
@@ -197,120 +198,10 @@
.appscms-faq-section {
max-width: 1140px;
}
-@media (max-width: 768px) {
- .category-tools__item {
- padding: 0 !important;
- }
- .category-tools__item h4 {
- color: #fff !important ;
- }
- .category-tools__descr {
- color: #fff !important;
- }
- .expand_menu .mega_menu li a {
- color: #fff !important;
- }
- .mega_menu li a {
- color: #fff !important;
- }
- .list-item-dropdown .toolbar-link {
- color: #fff !important;
- }
- .close-nav-ham {
- display: flex !important;
- justify-content: end;
- }
- .hamburger {
- display: block;
- cursor: pointer;
- position: absolute;
- right: -20px;
- /* top: 5px; */
- z-index: 9999;
- }
- .appscms-toolbar {
- background-color: var(--black-color);
- box-shadow: 1px 4px 10 #00000026;
- overflow-x: hidden;
- }
- .appscms-navbar-nav-links {
- display: none;
- }
- .appscms-toolbar {
- top: 0px;
- position: fixed;
- transition: all 0.3s ease;
- width: 272px;
- right: -272px;
- display: none;
- z-index: 1000;
- }
- .appscms-toolbar .appscms-toolbar-list {
- height: 100vh;
- flex-direction: column;
- gap: 0px;
- overflow-y: scroll;
- overflow-x: hidden;
- }
- .appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item {
- align-items: flex-start;
- flex-direction: column;
- }
- .appscms-toolbar
- .appscms-toolbar-list
- .appscms-toolbar-list-item:first-child {
- padding-left: 10px;
- }
- .appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:hover {
- border-bottom: none;
- padding-bottom: 10px;
- }
-
- .appscms-toolbar
- .appscms-toolbar-list
- .appscms-toolbar-list-item:first-child {
- padding-right: 10px;
- }
- .list-item-dropdown li .toolbar-link {
- color: var(--white-color);
- font-size: 15px;
- }
- .appscms-toolbar-list-item-span {
- font-size: 17px;
- font-weight: 600;
- }
- .list-item-dropdown-heading {
- display: none;
- }
- .appscms-toolbar .list-item-dropdown {
- padding: 0px;
- width: 100%;
- border: none;
- position: static;
- display: block;
- overflow: hidden;
- transition: all 0.3s ease;
- background-color: transparent;
- opacity: 0;
- height: 0px;
- max-height: 0px;
- }
- .appscms-toolbar
- .appscms-toolbar-list-item:nth-child(1)
- > .list-item-dropdown {
- opacity: 1;
- height: auto;
- max-height: 200px;
- }
-
- .arrow-svg {
- display: block;
- }
-}
.bg-primary {
background-color: #1b2fe7;
}
/* headings section */
.appscms-h1,
@@ -530,11 +421,10 @@
.card-footer {
border: none !important;
border-radius: 10px !important;
background: white;
}
-
.post-read-more {
font-size: 13px;
display: flex;
align-items: center;
}
@@ -662,228 +552,10 @@
color: #1e1e1e;
font-size: 13px;
border-bottom: 1px solid rgb(224, 224, 224);
}
-@media (max-width: 575.98px) {
- body {
- background: var(--secondary-color);
- }
- .appscms-h1,
- .success-msg {
- font-size: 30px;
- font-weight: 799;
- }
- .appscms-h2 {
- font-size: 12px;
- font-weight: 400;
- color: var(--mid-gray);
- }
- #appscms-tools-section {
- padding-top: 10px;
- }
- /* category section */
-
- .toolfilters {
- font-size: 10px;
- height: 30px;
- padding: 3px;
- }
- .toolfilter {
- margin: auto;
- padding: 0px 15px;
- }
- /* search bar */
- #appscms-searchbar {
- border-radius: 50px;
- padding: 0px;
- font-size: 8px;
- }
- #searchbar-placeholder {
- font-size: 12px;
- }
- .text-primary {
- font-size: 20px;
- font-weight: 600;
- }
-
- .description {
- font-size: 12px;
- line-height: 0.2;
- }
- .footer-product-link {
- font-size: 12px;
- }
-
- /* recent post and blog section phone */
- /* blog section */
- .appscms-blogs {
- border-radius: 10px;
- padding-top: 20px;
- background-color: rgba(255, 255, 255, 0.494);
- }
-
- .appscms-blog-cards {
- box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.06);
- margin-bottom: 20px;
- border-radius: 10px;
- /* max-width: 340px; */
- /* min-width: 300px; */
- }
-
- .appscms-blog-cards .extrapaddingforimg img {
- height: auto;
- border-radius: 10px 10px 0px 0px;
- }
- .card-body {
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- }
-
- /* recent post blog heading */
-
- /* author in blog */
- .wrapfooter {
- display: flex;
- margin-top: 50px;
- margin-bottom: -0px;
- }
- .wrapfooter img {
- width: 42px;
- height: 42px;
- border-radius: 50%;
- }
- .wrapfooter .author-meta {
- padding: 0px 15px 0px 10px;
- }
- .wrapfooter .author-meta a {
- font-size: 15px;
- font-weight: 500;
- color: #3e3e3e;
- text-transform: capitalize;
- text-decoration: none;
- }
-
- .post-date {
- color: #000;
- font-size: 14px;
- font-weight: 500;
- display: block;
- text-align: left;
- }
-}
-/* Small devices (tablets) */
-@media (min-width: 576px) and (max-width: 767.98px) {
- .toolfilters {
- font-size: 10px;
- height: 40px;
- padding: 1px;
- }
- #searchbar-placeholder {
- font-size: 13px;
- }
- #appscms-searchbar {
- padding: 3px;
- }
- /*
- toolfilter {
- margin: auto;
- padding: 0px 20px;
- } */
-}
-
-/* Medium devices (desktops) */
-@media (max-width: 768px) {
- #appscms-tools-section-row {
- gap: 15px;
- justify-content: center;
- margin-top: 35px;
- }
- .appscms-tool .tool-top .tool-img img {
- border-radius: 0;
- }
-
- .appscms-tool .tool-top .tool-img {
- justify-content: center;
- background: unset;
- border: 5px solid #ffffff08;
- }
- .appscms-tool {
- box-shadow: none;
- margin-bottom: 25px;
- height: auto;
- background-color: transparent;
- display: flex;
- flex-direction: column;
- align-items: center;
- }
-
- .appscms-tool:hover {
- box-shadow: unset;
- }
-
- .appscms-tool .tool-top {
- background-color: transparent;
- flex-direction: column;
- justify-content: center;
- border-radius: 10px;
- height: 64px;
- width: 64px;
- border-radius: 21px;
- }
- .appscms-tool .tool-img {
- padding: 0px !important;
- }
-
- .appscms-tool .tool-img img {
- height: 38px !important;
- width: 38px !important;
- }
-
- .appscms-tool .tool-text {
- display: none;
- }
-
- .appscms-tool .tool-heading {
- font-size: 12px;
- line-height: 14.52px;
- margin-top: 14px;
- padding: 0px;
- height: 15px;
- font-weight: 400;
- }
-
- .appscms-tool-container {
- /* margin: 0 auto; */
- width: auto !important;
- }
- .appscms-tool-container:nth-child(even) .appscms-tool .tool-top {
- background-color: transparent;
- }
-}
-@media (min-width: 768px) and (max-width: 991.98px) {
- .toolfilters {
- font-size: 12px;
- }
-}
-
-/* Large devices (desktops) */
-@media (min-width: 992px) and (max-width: 1199.98px) {
- /* Insert CSS code here */
-}
-
-/* Extra Large devices (large desktops) */
-@media (min-width: 1200px) and (max-width: 1399.98px) {
- /* Insert CSS code here */
-}
-
-/* Extra Extra Large devices (larger desktops) */
-@media (min-width: 1400px) {
- /* Insert CSS code here */
-}
-
/* animations */
.appscms-product-footer li {
list-style: none;
}
@@ -1192,19 +864,10 @@
.featurePageAuthor .author_bio {
font-size: 16px;
}
-@media (max-width: 768px) {
- .authors-list {
- padding: 25px;
- }
-
- .featurePageAuthor .author-meta {
- width: 100%;
- }
-}
.contributor {
width: 100px;
}
.contributor .contributor-name {
font-size: 13px;
@@ -1850,16 +1513,11 @@
.download-icon {
display: none;
}
}
-@media (max-width: 992px) {
- .appscms-sidebar-right,
- .appscms-sidebar-left {
- display: none;
- }
-}
+
.appscms-sidebar-right,
.appscms-sidebar-left {
min-width: 220px;
max-width: fit-content;
height: 100vh;
@@ -1872,26 +1530,10 @@
left: 80px;
}
.appscms-sidebar-right {
right: 80px;
}
-@media screen and (min-width: 1450px) {
- .appscms-sidebar-left {
- left: 200px !important;
- }
- .appscms-sidebar-right {
- right: 200px !important;
- }
-}
-@media screen and (min-width: 1920px) {
- .appscms-sidebar-left {
- left: 300px !important;
- }
- .appscms-sidebar-right {
- right: 300px !important;
- }
-}
.appscms-loader {
display: none;
}
/* CSS for the table design */
@@ -1952,19 +1594,10 @@
.usp-section .table-light {
background-color: #ffffff;
}
/* Responsive design */
-@media (max-width: 768px) {
- .usp-section .table-responsive {
- display: block;
- width: 100%;
- overflow-x: auto;
- -webkit-overflow-scrolling: touch;
- -ms-overflow-style: -ms-autohiding-scrollbar;
- }
-}
.scroll-left svg,
.scroll-right svg {
cursor: pointer;
position: absolute;
@@ -2092,6 +1725,427 @@
color: #181d20;
padding-top: 8px;
padding-bottom: 8px;
font-size: 17px;
overflow: hidden;
+}
+
+.appscms-featured-tools {
+ border-right: 1px solid #e3e3e4;
+}
+
+.appscms-toolbar-list-item-span::after {
+ content: "";
+ width: 10px;
+ height: 10px;
+ position: absolute;
+ margin-left: 7px;
+ right: -16px;
+ top: 16px;
+ margin-top: -4px;
+ border-right: 2px solid #fff;
+ border-bottom: 2px solid #fff;
+ -webkit-transform: rotate(45deg);
+ transform: rotate(46deg);
+}
+
+.appscms-toolbar-list-item:hover .appscms-toolbar-list-item-span::after {
+ transform: rotate(220deg); /* Rotation on hover */
+ top: 20px;
+}
+
+@media (max-width: 768px) {
+ .expand_menu-name-categiry {
+ color: #fff;
+ margin: 20px 0px;
+ }
+ .appscms-toolbar-list-item-span::after {
+ right: 0px !important;
+ }
+ .appscms-toolbar-list-item:hover .appscms-toolbar-list-item-span::after {
+ transform: none;
+ }
+ .usp-section .table-responsive {
+ display: block;
+ width: 100%;
+ overflow-x: auto;
+ -webkit-overflow-scrolling: touch;
+ -ms-overflow-style: -ms-autohiding-scrollbar;
+ }
+}
+
+@media (max-width: 768px) {
+ .appscms-toolbar-list-item-span::after {
+ right: 0;
+ }
+ .scroll-left,
+ .scroll-right {
+ display: none !important;
+ }
+ .category-tools__item {
+ padding: 0 !important;
+ }
+ .category-tools__item h4 {
+ color: #fff !important ;
+ }
+ .category-tools__descr {
+ color: #fff !important;
+ }
+ .expand_menu .mega_menu li a {
+ color: #fff !important;
+ }
+ .mega_menu li a {
+ color: #fff !important;
+ }
+ .list-item-dropdown .toolbar-link {
+ color: #fff !important;
+ }
+ .close-nav-ham {
+ display: flex !important;
+ justify-content: end;
+ }
+ .hamburger {
+ display: block;
+ cursor: pointer;
+ position: absolute;
+ right: -20px;
+ /* top: 5px; */
+ z-index: 9999;
+ }
+ .appscms-toolbar {
+ background-color: var(--black-color);
+ box-shadow: 1px 4px 10 #00000026;
+ overflow-x: hidden;
+ }
+ .appscms-navbar-nav-links {
+ display: none;
+ }
+ .appscms-toolbar {
+ top: 0px;
+ position: fixed;
+ transition: all 0.3s ease;
+ width: 272px;
+ right: -272px;
+ display: none;
+ z-index: 1000;
+ }
+ .appscms-toolbar .appscms-toolbar-list {
+ height: 100vh;
+ flex-direction: column;
+ gap: 0px;
+ overflow-y: scroll;
+ overflow-x: hidden;
+ }
+ .appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item {
+ align-items: flex-start;
+ flex-direction: column;
+ }
+ .appscms-toolbar
+ .appscms-toolbar-list
+ .appscms-toolbar-list-item:first-child {
+ padding-left: 10px;
+ }
+ .appscms-toolbar .appscms-toolbar-list .appscms-toolbar-list-item:hover {
+ border-bottom: none;
+ padding-bottom: 10px;
+ }
+
+ .appscms-toolbar
+ .appscms-toolbar-list
+ .appscms-toolbar-list-item:first-child {
+ padding-right: 10px;
+ }
+ .list-item-dropdown li .toolbar-link {
+ color: var(--white-color);
+ font-size: 15px;
+ }
+ .appscms-toolbar-list-item-span {
+ font-size: 17px;
+ font-weight: 600;
+ }
+ .list-item-dropdown-heading {
+ display: none;
+ }
+ .appscms-toolbar .list-item-dropdown {
+ padding: 0px;
+ width: 100%;
+ border: none;
+ position: static;
+ display: block;
+ overflow: hidden;
+ transition: all 0.3s ease;
+ background-color: transparent;
+ opacity: 0;
+ height: 0px;
+ max-height: 0px;
+ }
+ .appscms-toolbar
+ .appscms-toolbar-list-item:nth-child(1)
+ > .list-item-dropdown {
+ opacity: 1;
+ height: auto;
+ max-height: 200px;
+ }
+
+ .arrow-svg {
+ display: block;
+ }
+}
+@media screen and (min-width: 1450px) {
+ .appscms-sidebar-left {
+ left: 200px !important;
+ }
+ .appscms-sidebar-right {
+ right: 200px !important;
+ }
+}
+@media screen and (min-width: 1920px) {
+ .appscms-sidebar-left {
+ left: 300px !important;
+ }
+ .appscms-sidebar-right {
+ right: 300px !important;
+ }
+}
+@media (max-width: 992px) {
+ .appscms-sidebar-right,
+ .appscms-sidebar-left {
+ display: none;
+ }
+}
+@media (max-width: 768px) {
+ .authors-list {
+ padding: 25px;
+ }
+
+ .featurePageAuthor .author-meta {
+ width: 100%;
+ }
+}
+
+@media (max-width: 575.98px) {
+ body {
+ background: var(--secondary-color);
+ }
+ .appscms-h1,
+ .success-msg {
+ font-size: 30px;
+ font-weight: 799;
+ }
+ .appscms-h2 {
+ font-size: 12px;
+ font-weight: 400;
+ color: var(--mid-gray);
+ }
+ #appscms-tools-section {
+ padding-top: 10px;
+ }
+ /* category section */
+
+ .toolfilters {
+ font-size: 10px;
+ height: 30px;
+ padding: 3px;
+ }
+ .toolfilter {
+ margin: auto;
+ padding: 0px 15px;
+ }
+ /* search bar */
+ #appscms-searchbar {
+ border-radius: 50px;
+ padding: 0px;
+ font-size: 8px;
+ }
+ #searchbar-placeholder {
+ font-size: 12px;
+ }
+ .text-primary {
+ font-size: 20px;
+ font-weight: 600;
+ }
+
+ .description {
+ font-size: 12px;
+ line-height: 0.2;
+ }
+ .footer-product-link {
+ font-size: 12px;
+ }
+
+ /* recent post and blog section phone */
+ /* blog section */
+ .appscms-blogs {
+ border-radius: 10px;
+ padding-top: 20px;
+ background-color: rgba(255, 255, 255, 0.494);
+ }
+
+ .appscms-blog-cards {
+ box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.06);
+ margin-bottom: 20px;
+ border-radius: 10px;
+ /* max-width: 340px; */
+ /* min-width: 300px; */
+ }
+
+ .appscms-blog-cards .extrapaddingforimg img {
+ height: auto;
+ border-radius: 10px 10px 0px 0px;
+ }
+ .card-body {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ }
+
+ /* recent post blog heading */
+
+ /* author in blog */
+ .wrapfooter {
+ display: flex;
+ margin-top: 50px;
+ margin-bottom: -0px;
+ }
+ .wrapfooter img {
+ width: 42px;
+ height: 42px;
+ border-radius: 50%;
+ }
+ .wrapfooter .author-meta {
+ padding: 0px 15px 0px 10px;
+ }
+ .wrapfooter .author-meta a {
+ font-size: 15px;
+ font-weight: 500;
+ color: #3e3e3e;
+ text-transform: capitalize;
+ text-decoration: none;
+ }
+
+ .post-date {
+ color: #000;
+ font-size: 14px;
+ font-weight: 500;
+ display: block;
+ text-align: left;
+ }
+}
+/* Small devices (tablets) */
+@media (min-width: 576px) and (max-width: 767.98px) {
+ .toolfilters {
+ font-size: 10px;
+ height: 40px;
+ padding: 1px;
+ }
+ #searchbar-placeholder {
+ font-size: 13px;
+ }
+ #appscms-searchbar {
+ padding: 3px;
+ }
+ /*
+ toolfilter {
+ margin: auto;
+ padding: 0px 20px;
+ } */
+}
+
+/* Medium devices (desktops) */
+@media (max-width: 768px) {
+ .mobile-search-bar {
+ display: block !important;
+ }
+ .nav-search {
+ display: none;
+ }
+ .icon_box img {
+ height: 35px;
+ width: 35px;
+ }
+ #appscms-tools-section-row {
+ gap: 15px;
+ justify-content: center;
+ margin-top: 35px;
+ }
+ .appscms-tool .tool-top .tool-img img {
+ border-radius: 0;
+ }
+
+ .appscms-tool .tool-top .tool-img {
+ justify-content: center;
+ background: unset;
+ border: 5px solid #ffffff08;
+ }
+ .appscms-tool {
+ box-shadow: none;
+ margin-bottom: 25px;
+ height: auto;
+ background-color: transparent;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ }
+
+ .appscms-tool:hover {
+ box-shadow: unset;
+ }
+
+ .appscms-tool .tool-top {
+ background-color: transparent;
+ flex-direction: column;
+ justify-content: center;
+ border-radius: 10px;
+ height: 64px;
+ width: 64px;
+ border-radius: 21px;
+ }
+ .appscms-tool .tool-img {
+ padding: 0px !important;
+ }
+
+ .appscms-tool .tool-img img {
+ height: 38px !important;
+ width: 38px !important;
+ }
+
+ .appscms-tool .tool-text {
+ display: none;
+ }
+
+ .appscms-tool .tool-heading {
+ font-size: 12px;
+ line-height: 14.52px;
+ margin-top: 14px;
+ padding: 0px;
+ height: 15px;
+ font-weight: 400;
+ }
+
+ .appscms-tool-container {
+ /* margin: 0 auto; */
+ width: auto !important;
+ }
+ .appscms-tool-container:nth-child(even) .appscms-tool .tool-top {
+ background-color: transparent;
+ }
+}
+@media (min-width: 768px) and (max-width: 991.98px) {
+ .toolfilters {
+ font-size: 12px;
+ }
+}
+
+/* Large devices (desktops) */
+@media (min-width: 992px) and (max-width: 1199.98px) {
+ /* Insert CSS code here */
+}
+
+/* Extra Large devices (large desktops) */
+@media (min-width: 1200px) and (max-width: 1399.98px) {
+ /* Insert CSS code here */
+}
+
+/* Extra Extra Large devices (larger desktops) */
+@media (min-width: 1400px) {
+ /* Insert CSS code here */
}