/home/smartbloks/.trash/eazydocs/assets/scss/frontend/_doclist.scss
.single-docs {
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
font-weight: 700;
}
.meta {
color: var(--black_500);
font-size: 14px;
font-weight: 400;
display: flex;
flex-wrap: wrap;
gap: 2px;
@media (max-width: 767px) {
gap: 10px;
}
}
}
.doc_documentation_area {
z-index: 0;
margin-top: 0;
margin-bottom: 0;
@media (max-width: 1440px) {
min-height: 1000px;
}
.overlay_bg {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: var(--black_700);
opacity: 0;
z-index: 1;
visibility: hidden;
transition: all 0.4s linear;
}
&.overlay {
.overlay_bg {
opacity: 0.5;
visibility: visible;
}
}
}
/*============ doc_left_sidebarlist css =========*/
.doc_documentation_area.body_fixed {
.doc_rightsidebar,
.doc_left_sidebarlist {
&.one-page-docs-sidebar-wrap {
padding-top: 70px
}
}
}
.ezd-body-docs{
> .modal-backdrop {
position: unset;
}
}
.doc_left_sidebarlist {
padding-top: 60px;
padding-bottom: 30px;
z-index: 1;
height: 100vh;
position: relative;
a {
text-decoration: none;
}
&:before {
content: "";
width: 200%;
right: 0;
height: 100%;
background: rgba(245,247,249,1.00);
position: absolute;
border-right: 1px solid var(--border_on_white);
top: 0;
z-index: -1;
}
&.one-page-docs-sidebar-wrap{
&:before {
background: transparent;
border-right: none;
}
img {
max-width: 150px;
}
}
.scroll:not(.op-docs-sidebar) {
max-height: 650px;
overflow-y: auto;
padding-right: 15px;
margin-left: -10px;
@media (max-height: 630px) {
padding-bottom: 0;
max-height: 450px;
}
}
h2 {
margin-bottom: 25px;
}
}
/** === Left Sidebar / Docs Tree === **/
.nav-sidebar {
margin: 0;
> .nav-item {
> .doc-link {
padding: 10px;
border-radius: 5px;
&:hover {
background: rgba(208, 215, 222, 0.32);
a {
color: var(--black_900);
}
}
}
}
.nav-item {
padding-right: 0;
margin: 0 0 5px;
position: relative;
cursor: pointer;
&.current_page_item {
> .doc-link {
color: var(--ezd_brand_color);
background: var(--bs-white);
border: 1px solid var(--black_50);
a {
color: var(--black_900);
}
}
}
&.active {
> .doc-link .icon {
transform: rotate(-180deg);
i.icon_minus-06 {
display: inline-block;
}
i.icon_plus {
display: none;
}
}
}
mark {
background-color: #e5e800;
}
> a {
display: flex;
}
&.has_child .doc-link {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 5px;
}
.docs-progress-bar{
position: absolute;
background: #ebf0f1;
bottom: 0;
left: 0;
top: 0;
max-height: 48px;
}
.nav-link {
padding: 0;
display: flex;
font-size: 14px;
line-height: 20px;
font-weight: 500;
color: var(--black_500);
align-items: start;
flex: 1;
text-decoration: none;
img{
margin-right: 15px;
padding-right: 0;
max-width: 18px !important;
height: auto;
}
svg {
margin-right: 15px;
position: relative;
top: -1px;
path {
@include transition;
}
}
& + .icon {
font-size: 20px;
color: var(--p_color);
display: flex;
transition: all 0.3s linear;
}
}
&:hover, &.active {
> .nav-link {
color: var(--black_900);
}
svg {
path {
fill: #5cbbe5;
}
}
}
.icon i.icon_minus-06{
display: none;
}
i.icon_plus{
display: inline-block;
}
.dropdown_nav {
margin: 0;
padding: 0 0 0 34px;
width: 100% !important;
display: none;
list-style: none;
li:not(.has_child) {
line-height: 1.5;
padding: 6px 10px;
margin: 0 0 3px;
border-radius: 5px;
&.current_page_item {
color: var(--ezd_brand_color);
background: var(--bs-white);
border: 1px solid var(--black_50);
}
&.current_page_item.has_child .doc-link a {
color: var(--black_800);
}
a {
font-size: 14px;
font-weight: 400;
color: var(--black_500);
padding: 0;
text-decoration: none;
&.active {
color: var(--black_900);
i {
color: var(--ezd_brand_color);
}
}
}
.dropdown_nav li {
margin-right: 0;
margin-left: -10px;
}
}
li.has_child {
.doc-link {
line-height: 1.5;
padding: 6px 10px;
margin: 0 0 5px;
border-radius: 5px;
&:hover {
background: rgba(208, 215, 222, 0.32);
a {
color: var(--black_900);
}
}
}
}
}
span.icon {
transform: rotate(0deg);
}
}
& + .nav-sidebar {
border-top: 1px solid #e5e9eb;
padding-top: 20px;
}
&.one-page-doc-nav-wrap{
.nav-item{
background: #f8fafb;
margin: 3px 0 0;
list-style: none;
@media screen and ( max-width: 991px ) {
margin-top: 0;
}
a {
padding: 13px 20px;
align-items: center;
z-index: 2;
position: relative;
}
.dropdown_nav {
padding-left: 32px !important;
position: relative;
padding-top: 10px;
padding-bottom: 10px;
background: #fff;
&.doc-last-depth{
padding-bottom: 0;
}
&:before{
content: "";
width: 2px;
bottom: 15px;
background: #edf1f3;
position: absolute;
top: 15px;
left: 20px;
}
.nav-item{
background: transparent;
padding: 0 22px;
margin-bottom: 8px;
&:before{
content: "5";
font-family: 'ElegantIcons';
color: var(--ezd_brand_color);
position: absolute;
left: 0;
}
a{
display: inline-block;
font-size: 14px;
font-weight: 400;
&.active{
color: var(--ezd_brand_color);
}
}
}
}
}
.active {
.dropdown_nav {
display: block;
overflow-y: auto;
max-height: 450px;
&::-webkit-scrollbar {
width: 8px;
}
&::-webkit-scrollbar-track {
background: transparent;
}
&::-webkit-scrollbar-thumb {
background: var(--black_200);
border-radius: 30px;
}
}
.icon {
transform: none;
}
}
}
}
.single-docs .nav-sidebar .nav-item .dropdown_nav li:not(.has_child):hover {
background: rgba(208, 215, 222, 0.32);
a {
color: var(--black_800)
}
}
#content_elements {
margin-top: 50px;
}
// Scrollbar
.scroll {
&::-webkit-scrollbar {
width: 8px;
}
&::-webkit-scrollbar-track {
background: transparent;
}
&::-webkit-scrollbar-thumb {
background: var(--black_200);
border-radius: 30px;
}
}
.bottom_nav {
.nav-item .nav-link {
i {
position: relative;
color: var(--black_700);
padding-left: 4px;
transition: all 0.2s linear;
}
&:hover {
i {
transform: translateX(5px);
}
}
}
}
/*============ doc_left_sidebarlist css =========*/
.documentation_info {
.c_head {
font-weight: 500;
margin-bottom: 12px;
.anchorjs-link {
font-size: 22px !important;
text-decoration: none;
}
}
.slideshow {
width: auto;
height: 600px;
.slide {
width: inherit;
height: inherit;
.item--horse {
top: 124px;
left: 78px;
}
}
.nav {
display: none;
}
.title {
color: var(--ezd_brand_color);
}
}
}
.anchorjs-link {
text-decoration: none !important;
}
.sticky-nav-doc #documentation {
padding-top: 174px;
}
.shortcode_title {
.btn {
display: inline-block;
padding: 0 9.5px;
background: brand_color_rgba(0.5);
color: #fff;
text-transform: uppercase;
line-height: 20px;
font-size: 14px;
font-weight: 400;
margin-bottom: 10px;
border-radius: 3px;
outline: none;
box-shadow: none;
letter-spacing: .5px;
padding-top: 1px;
}
}
.single-docs .shortcode_title {
margin-bottom: 40px;
h1 {
margin-bottom: 10px;
font-size: 2.5em;
color: var(--black_900);
line-height: 1.3;
}
p {
span {
font-weight: 500;
}
}
& + ul {
margin-top: -0.8rem;
}
}
.doc_documentation_area{
&.onepage_doc_area{
@media ( min-width: 992px ) {
padding-top: 120px;
}
.doc_left_sidebarlist{
&:after{
display: none;
}
}
}
.doc_left_sidebarlist {
&.one-page-docs-sidebar-wrap{
padding-top: 0;
}
}
}
.link {
background: #f1fdf3;
padding: 14px 10px 14px 30px;
border-radius: 4px;
p {
position: relative;
margin-bottom: 0;
padding-left: 40px;
&:before {
content: "\52";
position: absolute;
font-family: eleganticons;
left: 0;
top: 4px;
font-size: 24px;
color: #10d631;
}
}
}
.help_text {
padding: 0 0 0;
.border_bottom {
margin-top: 25px;
}
.help_info {
display: flex;
flex-wrap: wrap;
padding-top: 16px;
margin-left: -30px;
margin-right: -30px;
.help_item {
width: 33.33%;
margin-bottom: 15px;
padding: 0 30px;
h4 {
font-size: 16px;
margin-bottom: 15px;
transition: color 0.2s linear;
i {
font-size: 18px;
top: 2px;
position: relative;
}
&:hover {
color: var(--ezd_brand_color);
}
}
}
}
}
.feedback_link {
align-items: center;
padding-top: 30px;
.eazydocs-feedback-wrap {
justify-content: end;
display: flex;
}
p.left, p.right {
font-weight: 500;
font-size: 14px !important;
color: var(--p_color);
margin-bottom: 0 !important;
@media ( max-width: 767px ) {
text-align: center;
}
i {
padding-right: 5px;
}
}
p.left {
a {
color: var(--ezd_brand_color);
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
p.right {
margin-bottom: 0;
text-align: right;
}
.vote-link-wrap {
margin-left: 10px;
}
.h_btn {
font-size: 14px;
font-weight: 500;
color: #fff;
display: inline-block;
padding: 3px 15px;
background-color: var(--green_color);
transition: all 0.2s linear;
margin-left: 5px;
border-radius: 15px;
text-decoration: none !important;
&:hover {
background: #1f9852;
}
&.red {
background: #e74c3c;
&:hover {
background: #d84334;
}
}
span {
height: 15px;
display: inline-block;
border-radius: 50%;
text-align: center;
line-height: 16px;
font-size: 10px;
background: rgb(255 255 255 / 0.7);
font-weight: 400;
color: #101010;
margin-left: 6px;
position: relative;
top: -1px;
padding: 0 5px;
}
&:hover {
color: #fff;
}
}
}
.eazydocs-alert {
font-size: 14px;
padding: 6px 10px;
border-radius: 2px;
}
/** === Help Contact Form === **/
#eazydocs_feedback {
background: rgb(0 0 0 / 60%);
.action_btn {
border: 0;
padding: 15px 40px;
box-shadow: none;
font-weight: 500;
background: brand_color_rgba(0.9);
color: #fff;
&:hover {
background: var(--ezd_brand_color);
color: #fff;
}
}
.close {
font-size: 30px;
opacity: 1;
color: #fff;
position: absolute;
right: -40px;
top: -40px;
padding: 5px 8px 7px;
z-index: 3;
display: flex;
justify-content: center;
align-items: center;
background: var(--black_350);
border-radius: 3px;
transition: all .3s;
border: none;
@media ( max-width: 991px ) {
right: -10px;
top: -25px;
}
&:hover {
background: #cd2653;
border: none;
box-shadow: none;
text-decoration: none;
}
}
}
.help_form {
max-width: 730px;
display: flex;
align-items: center;
margin-top: 0;
margin-bottom: 0;
padding: 60px;
background: var(--black_50);
top: 50%;
transform: translateY(-50%) !important;
border-radius: 10px;
@media ( max-width: 991px ) {
max-width: 600px;
padding: 40px 30px;
}
.modal-content {
border: 0;
background: transparent;
h3 {
margin-top: 0;
padding-top: 0;
}
}
}
.contact_form {
.form-group {
margin-bottom: 30px;
&:last-child, &.submit-area {
margin-bottom: 0;
}
.form-control, textarea {
border: 1px solid rgb(244, 248, 248);
height: 58px;
border-radius: 4px;
background-color: rgb(255, 255, 255);
box-shadow: 0 4px 10px 0 rgba(4, 73, 89, 0.08);
color: #878b99;
font-weight: 400;
padding-left: 30px;
@include placeholder {
color: #878b99;
}
&:focus {
box-shadow: 0 20px 30px 0 rgba(4, 73, 89, 0.1);
}
}
textarea {
width: 100%;
height: 160px;
padding-top: 20px;
display: block;
}
}
}
/*========== doc right sidebar css ============*/
.ezd-widgets {
margin-top: 30px;
.widget .title {
font-size: 22px;
font-weight: 500;
}
}
.open_icon {
width: 40px;
height: 40px;
background: #e8eeff;
line-height: 40px;
font-size: 32px;
text-align: center;
position: absolute;
left: -40px;
color: var(--ezd_brand_color);
display: none;
top: 0;
&:hover {
background: var(--ezd_brand_color);
color: #fff;
}
&#right {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
&#left {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
@media (max-width: 767px) {
display: block;
}
i {
display: inline-block;
& + i {
display: none;
}
}
&.overlay {
i {
display: none;
& + i {
display: inline-block;
}
}
}
}
.full-width-doc {
.doc_rightsidebar {
padding-right: 15px;
}
}
.single-docs {
.doc_rightsidebar {
max-height: 800px;
overflow-y: auto;
width: calc(100% + 35px);
padding-right: 10px;
}
}
.doc_rightsidebar {
padding-top: 70px;
height: 100%;
position: relative;
@media ( max-width: 767px ) {
padding-top: 0;
}
.pageSideSection {
padding-left: 20px;
position: relative;
.dropdown.bootstrap-select {
width: 100% !important;
}
&::before {
content: "";
position: absolute;
top: 0;
width: 1px;
height: 100%;
background: var(--border_on_white);
left: 0;
}
}
&.scroll {
.mCSB_inside > .mCSB_container {
margin-right: 0;
}
}
h6 {
font-size: 12px;
font-weight: 600;
color: #9DAAB6;
margin-bottom: 15px;
i {
margin-right: 6px;
font-size: 16px;
position: relative;
top: 3px;
}
}
.doc_right_link {
li {
margin-bottom: 10px;
padding-left: 25px;
position: relative;
a {
font-size: 14px;
font-weight: 500;
color: var(--p_color);
i {
padding-right: 12px;
position: absolute;
left: 0;
font-size: 12px;
top: 5px;
}
}
}
}
.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
font-size: 16px;
font-weight: 400;
}
.dropdown-toggle {
background: #fafcfd;
border: 1px solid #e1e4e5;
border-radius: 5px;
font-size: 16px;
color: #6b707f;
padding: 5px 20px 3px;
box-shadow: none;
&:after {
content: "\33";
border: 0;
font-family: "ElegantIcons";
top: -2px;
position: relative;
color: #6b707f;
}
i {
padding-right: 8px;
}
&:focus {
outline: none !important;
box-shadow: none !important;
}
}
.bootstrap-select {
margin-bottom: 20px;
> .dropdown-menu {
box-shadow: 0 0 0 1px rgba(68, 68, 68, 0.11);
background: #fff;
border: 0;
.inner {
.dropdown-menu {
border: 0;
li {
a {
color: var(--p_color);
position: relative;
font-size: 14px;
&:before {
content: "";
width: 2px;
height: 0;
position: absolute;
left: 0;
top: 0;
background: var(--ezd_brand_color);
transition: all 0.2s linear;
}
i {
padding-right: 8px;
}
&.active,
&:hover {
background: #f6f6f6;
color: var(--ezd_brand_color);
&:before {
height: 100%;
}
}
}
}
}
}
}
}
#font-switcher {
margin-bottom: 30px;
}
}
.toc_right {
ul {
padding: 0;
margin: 0;
li {
margin: 0;
}
ul {
padding-left: 20px;
}
}
.nav-link {
font-size: 14px;
font-weight: 400;
line-height: 1.4;
padding: 0;
position: relative;
margin-bottom: 10px;
&:not(.active) {
color: var(--black_500);
}
&.active {
font-weight: 500;
color: var(--ezd_brand_color);
+ .nav .active::before {
display: none;
}
&::before {
left: -20px;
height: 100%;
content: " ";
position: absolute;
border-left: 2px solid;
color: var(--ezd_brand_color);
}
}
}
}
.mobile_menu {
width: 300px;
position: fixed;
height: 100vh;
max-height: 100vh !important;
top: 0;
background: #fff;
right: -300px;
z-index: 1050;
transition: all 0.4s linear;
.doc_left_sidebarlist {
padding-left: 20px;
&:before {
display: none;
}
}
&.open {
right: 0;
}
.close_nav {
padding-top: 20px;
padding-left: 30px;
font-size: 28px;
}
}
/*=============== doc_documentation_full_area css =========*/
.full-width-doc {
.doc_left_sidebarlist {
margin-right: 0;
padding-left: 0;
}
&.body_fixed {
.doc_left_sidebarlist {
width: 287px;
}
}
.doc_rightsidebar {
margin-left: 0;
}
}
body.doc-no-banner {
.doc_left_sidebarlist {
padding-top: 0;
margin-top: 70px;
&::before {
background: transparent;
}
}
}
body:not(.onepage-doc) .sticky_menu {
.doc_documentation_area {
&.body_fixed {
.doc_left_sidebarlist,
.doc_rightsidebar {
top: 60px;
}
}
}
}
.resource {
.c_head {
margin-bottom: 5px;
}
.tag_list {
padding-top: 0;
li {
margin-top: 4px;
a {
display: inline-block;
font-weight: 500;
}
}
}
}
/*========== typography_content css ========*/
.doc {
.code-preview {
border: 1px solid #e5ebef;
padding: 20px;
box-shadow: 0 3px 6px 0 rgba(4, 73, 89, 0.02);
position: relative;
#header-name {
margin-bottom: 0;
}
img {
max-width: 100%;
}
&.video_img {
display: inline-block;
}
}
.code-toolbar {
.snippets {
margin-bottom: 0;
code {
margin-bottom: 20px;
}
}
}
.code_item {
padding-top: 15px;
p {
a {
color: var(--ezd_brand_color);
}
}
}
}
.vjs-iframe-blocker {
display: none;
}
.video-js {
margin: 0 auto;
width: 100%;
max-width: 640px;
height: 360px;
.mfp-close {
right: -55px;
top: -10px;
}
}
/*============ Sticky Nav doc css ================*/
.sticky-nav-doc {
&:not(.onepage-doc) .body_fixed .doc_rightsidebar,
&:not(.onepage-doc) .body_fixed .doc_left_sidebarlist {
padding-top: 100px;
}
}
.fontsize-controllers{
.btn-group{
border: 1px solid var(--black_50);
background-color: var(--bs-white);
box-shadow: 0 1px 0 0 rgba(3, 13, 37, 0.2),inset 0 -8px 14px 0 rgba(3, 13, 37, 0.1);
border-radius: 4px;
button {
font-size: 16px;
font-weight: 400;
color: var(--black_700);
line-height: 1.2;
border: 0;
display: inline-block;
text-align: center;
text-decoration: none;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
background-color: transparent;
padding: .375rem .75rem;
border-radius: .25rem;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
&:focus, &:hover {
outline: none;
box-shadow: none;
background: #eff0f1;
}
&.rvfs-reset {
border-left: 1px solid var(--black_50);
border-right: 1px solid var(--black_50);
}
}
}
}
.print {
color: var(--p_color);
font-size: 18px;
text-decoration: none;
z-index: 1;
}
/* Collaps Tabs Area css
============================================================================================ */
.collaps_tabs {
margin-bottom: 70px;
.collaps_tab_inner {
.shortcode_title {
margin-bottom: 25px;
h4 {
a {
color: var(--black_700);
}
}
}
}
}
.doc-btm {
margin-top: 70px;
ul.card_tagged {
padding-left: 0;
margin: 0;
li {
font-size: 14px;
font-weight: 500;
color: var(--black_500);
margin: 0 5px 5px 0;
a {
background: rgba(175, 184, 193, 0.2);
color: var(--black_700);
line-height: 25px;
padding: 0 14px;
display: inline-block;
border-radius: 12.5px;
font-size: 14px;
font-weight: 400;
text-decoration: none;
&:hover {
color: var(--ezd_brand_color);
background: brand_color_rgba(0.15);
}
}
}
}
}
/** === Dark Mode Switcher === **/
.doc_switch {
margin-bottom: 30px;
.tab-btn {
font-size: 16px;
margin-bottom: 0;
cursor: pointer;
transition: color 0.2s linear;
&.active svg {
color: var(--ezd_brand_color);
}
&:hover {
color: var(--ezd_brand_color);
}
&.dark-mode{
&.active{
svg{
path{
fill: #fff;
}
}
}
}
}
svg {
color: var(--black_700)
}
input[type=checkbox] {
width: 50px;
height: 22px;
border: 1px solid brand_color_rgba(0.3);
background: brand_color_rgba(0.25);
display: block;
border-radius: 25px;
margin: 0 10px 0 12px;
position: relative;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
box-sizing: content-box;
padding: 0;
+ .tab-btn {
color: var(--black_500);
}
&::before {
content: "";
width: 16px;
height: 16px;
background: var(--ezd_brand_color);
position: absolute;
border-radius: 50%;
top: 50%;
transform: translateY(-50%);
transition: all 0.2s linear;
left: 3px;
}
&:checked::before {
left: calc(100% - 19px);
}
&:checked + .tab-btn {
color: var(--ezd_brand_color);
}
}
}
.doc-middle-content .topic_item_tabs {
margin-top: 60px;
overflow: hidden;
.topic_list_item {
background: transparent;
border: 1px solid var(--black_50);
border-radius: 5px;
padding: 37px 35px 35px;
box-shadow: none !important;
@media (max-width: 1440px) {
padding: 30px 30px 20px;
}
h4 {
font-weight: 500;
font-size: 16px;
margin: 0 0 20px;
}
.navbar-nav {
padding: 0;
margin: 0;
li {
margin: 0 0 10px;
a {
color: var(--p_color);
font-size: 16px;
transition: all 300ms linear 0s;
text-decoration: none;
i {
color: var(--ezd_brand_color);
padding-right: 12px;
}
}
&:hover {
a {
color: var(--ezd_brand_color);
i {
color: var(--ezd_brand_color);
}
}
}
}
}
&:hover {
border-color:#e6edf0;
}
}
}
.search {
.searchbar-tabs {
border-bottom: 1px solid var(--black_50);
padding-bottom: 5px;
}
.search-post-item {
margin-bottom: 25px;
.title {
margin-bottom: 10px;
font-weight: 500;
}
.breadcrumb {
margin-bottom: 3px;
.breadcrumb-item {
&:last-child {
display: none;
}
}
}
.b_top_post_content {
p {
margin-bottom: 5px;
line-height: 1.6;
font-size: 15px;
}
}
}
}
.documentation_item {
padding-right: 40px;
margin-bottom: 58px;
display: flex;
.icon {
border-radius: 50%;
background-color: var(--bs-white);
box-shadow: 0 10px 30px 0 rgba(76, 76, 241, 0.12);
width: 75px;
height: 75px;
text-align: center;
margin-right: 30px;
display: flex;
justify-content: center;
align-items: center;
box-sizing: content-box;
line-height: 1.4;
@media (max-width: 1440px) {
margin-right: 20px;
}
img {
max-width: 40px !important;
height: auto !important;
}
}
.media-body {
flex: 1;
.title {
font-weight: 500;
margin: 0 0 8px;
transition: color 0.2s linear;
display: block;
color: var(--black_900);
text-decoration: none;
font-size: 18px;
line-height: 1.5;
&:hover {
text-decoration: underline;
text-decoration-color: rgba(76,122,241,.25);
text-decoration-thickness: 2px;
text-underline-offset: 3px;
color: var(--ezd_brand_color)
}
}
p {
margin-bottom: 0;
font-size: 16px;
}
}
}
/*============== End doc_categories_guide_area css =============*/
.eazydocs-footer {
overflow-x: hidden;
padding-top: 30px;
margin-top: 0;
padding-bottom: 10px;
}
.doc-middle-content {
padding: 60px 30px 0;
position: relative;
@media (max-width: 768px) {
padding-right: 15px;
padding-left: 15px;
}
}
.full-width-doc .doc-middle-content {
padding-left: 50px;
padding-right: 50px;
}
.dot-sep span:nth-child(2) {
position: relative;
}
.dot-sep span.sep::before {
content: "•";
margin: 0 5px;
}
.credit-text-container::after {
display: block;
clear: both;
content: "";
width: 200%;
right: 0;
background: #f5f7f9;
position: absolute;
border-right: 1px solid #E6EDF0;
bottom: -75px;
z-index: -1;
height: 75px;
}
.eazydocs-comments-wrap {
.comments-area{
max-width: 100%;
margin-left: unset;
margin-right: unset;
}
}
.doc-post-content {
.doc-scrollable {
section {
padding: 0;
}
.page-links{
display: block;
width:100%;
margin:20px 0;
span, a{
background: var(--ezd_brand_color);
color: white;
padding: 4px 13px;
text-decoration: none;
border-radius: 3px;
margin: 0 2px;
text-align: center;
min-height: unset;
min-width: unset;
}
}
}
}
.doc-post-content {
.doc-scrollable {
figure{
max-width:100%
}
}
}
.one-page-docs-tag-list {
li {
a {
&:before{
content: none !important;
}
}
}
}
.onepage_doc_area {
.documentation_body {
footer {
.border_bottom {
margin-top: 100px;
}
}
}
.middle-content {
padding: 0 25px 0 40px;
}
@media ( min-width: 1441px ) {
.doc_left_sidebarlist {
padding-right: 40px;
}
.middle-content {
padding-left: 0;
}
}
}
// Eazydocs password protected form
.ezd-password-wrap {
border: 1px solid #0c213a;
border-radius: 5px;
padding-bottom: 10px;
margin-bottom: 40px;
.ezd-password-head {
background-color: #0c213a;
flex: 1 1 auto;
border-radius: 5px 5px 0 0;
.logo img {
display: block;
margin: 0 auto;
}
p.ezd-password-title{
font-size: 18px;
color: #fff;
font-weight: 500;
}
p.ezd-password-subtitle{
color: #a4abc5;
line-height: 1.6;
font-size: 14px;
font-weight: 400;
}
}
.ezd-password-body{
form{
label{
margin-bottom: 0.5rem;
color: #656d9a;
font-weight: 500;
font-size: 13px;
}
input{
border: 1px solid #e3ebf6;
box-shadow: none;
outline: none;
padding: 10px;
font-size: 12px;
font-weight: 400;
line-height: 1.5;
border-radius: 3px;
&:focus{
color: #303e67;
background-color: #fff;
border-color: #8bb0fe;
}
}
button{
font-size: 14px;
border: none;
background-color: brand_color_rgba(0.8);
color: #fff;
&:hover {
background-color: var(--ezd_brand_color);
}
&:focus{
box-shadow: none;
}
}
}
}
@media (max-width: 1199px) {
max-width: 100%;
}
@media (max-width: 991px) {
max-width: 515px;
}
@media (max-width: 580px) {
max-width: 100%;
}
}
.nav-sidebar{
&.default-layout-onepage-sidebar{
.nav-item {
.dropdown_nav {
.nav-item{
.dropdown_nav{
&.doc-last-depth{
display: block !important;
padding-left: 4px !important;
&::before {
content: none !important;
}
.nav-item::before {
left: 0 !important;
}
}
}
}
}
}
}
}
/** === Share Button === **/
.ezd-share-btn {
color: var(--black_600);
margin: 00px 0 20px;
align-items: baseline;
display: flex;
gap: 8px;
text-decoration: none !important;
cursor: pointer;
&:hover {
color: var(--ezd_brand_color);
}
}
div#eazydocs_share {
background: #00000066;
> .modal-dialog{
max-width: 500px;
position: fixed;
bottom: 0;
top: 0;
left: 0;
right: 0;
margin: auto;
display: block;
height: fit-content;
> .modal-content{
padding: 30px 30px 35px;
background-color: var(--bs-white);
> .close{
position: absolute;
right: 10px;
top: 10px;
font-size: 34px;
line-height: 0;
cursor: pointer;
color: var(--black_600);
text-decoration: none;
&:hover{
color: #cd2653;
}
}
> .eazydocs-share-wrap{
> h2{
font-size: 24px;
font-weight: 700;
line-height: 1.3;
margin: 0 10px 20px 0;
}
> .social-links {
a {
width: 56px;
height: 56px;
background-color: rgba(208, 215, 222, 0.55);
display: inline-block;
border-radius: 30px;
text-align: center;
padding-top: 15px;
font-size: 20px;
line-height: 0;
color: var(--black_600);
margin-right: 10px;
text-decoration: none;
&:hover{
background-color: rgba(208, 215, 222, 0.4);
}
i{
font-size: 24px;
line-height: 24px;
}
&:nth-child(2){
> i{
color:rgb(66, 103, 178);
}
}
&:nth-child(3){
> i{
color:rgb(0, 114, 177);
}
}
&:nth-child(4){
> i{
color:rgb(29, 161, 242);
}
}
}
}
> p {
font-size: 14px;
margin: 20px 0 2px;
color: var(--black_600);
}
> .copy-url-wrap {
position: relative;
input{
width: 100%;
background-color: #f5f5f9;
opacity: 1;
height: 37px;
padding: 16px 48px 16px 10px;
font-size: 15px;
font-weight: 400;
line-height: 1.5;
color: #1b1b1b;
border: 1px solid #b9b9b9;
border-radius: 4px;
&:focus{
outline: 2px solid #0044c0;
outline-offset: -1px;
}
}
> .share-this-doc {
width: 20px;
position: absolute;
right: 11px;
top: 0;
font-size: 20px;
bottom: 0;
margin: auto;
display: block;
line-height: 0;
height: 23px;
&:hover{
cursor: pointer;
}
> img{
vertical-align: text-top;
max-height: 23px;
max-width: 25px;
}
}
}
}
}
}
}
.ezd-link-copied-wrap{
display: none;
font-size: 16px;
&.copied{
display: block;
cursor: pointer;
position: fixed;
right: 10px;
top: 10px;
background: var(--ezd_brand_color);
width: 300px;
padding: 12px 30px 12px 47px;
color: white;
border-radius: 5px;
z-index: 9999;
&::before{
content: "\e052";
font-family: 'ElegantIcons';
position: absolute;
left: 15px;
color: white;
font-size: 23px;
line-height: 28px;
}
&::after{
content: "M";
font-family: "ElegantIcons";
position: absolute;
right: 15px;
color: white;
font-size: 30px;
line-height: 25px;
font-weight: normal;
}
}
&.copied-hide{
display: none;
}
}
body.admin-bar{
.ezd-link-copied-wrap{
top: 42px
}
}
/** === Sidebar === **/
.ezd-widgets {
h2 {
font-size: 2rem;
margin-bottom: 15px;
}
}
/** === Next/Prev Button === **/
.eazydocs-next-prev-wrap {
column-count: 2;
display: flex;
gap: 20px;
margin-top: 20px;
@media (max-width: 580px) {
flex-direction: column;
}
a {
display: block;
box-shadow: 0 1px 2px rgb(0 0 0 / 12%);
border: 1px solid var(--black_50);
padding: 15px 20px;
border-radius: 5px;
text-decoration: none !important;
}
.next-prev-pager {
color: var(--black_800);
font-size: 17px;
text-decoration: none;
font-weight: 500;
background: var(--black_25);
flex: 1;
span {
display: block;
font-size: 12px;
line-height: 18px;
color: var(--black_500);
font-weight: 400;
margin-bottom: 4px;
}
&:hover {
&::before {
border-color: var(--ezd_brand_color);
color: var(--ezd_brand_color);
}
border-color: var(--ezd_brand_color);
color: var(--ezd_brand_color);
}
}
.next-prev-pager.first {
text-align: right;
padding-left: 40px;
position: relative;
line-height: 1.6;
&::before {
content: "\23";
display: block;
clear: both;
position: absolute;
left: 20px;
top: 0;
bottom: 0;
height: 0;
line-height: 0;
margin: auto;
font-family: 'ElegantIcons';
font-size: 26px;
color: rgba(136, 153, 168, 1.00);
}
}
.next-prev-pager.second {
padding-right: 40px;
position: relative;
&::before {
display: block;
clear: both;
position: absolute;
top: 0;
bottom: 0;
height: 0;
line-height: 0;
margin: auto;
font-family: 'ElegantIcons';
font-size: 26px;
color: rgba(136, 153, 168, 1.00);
content: "\24";
left: unset;
right: 20px;
}
}
}
// RTL
body.rtl{
.contact_form .form-group textarea {
padding-top: 10px;
padding-right: 14px;
}
.doc_left_sidebarlist .scroll:not(.op-docs-sidebar) {
margin-left: 27px;
}
.ezd-link-copied-wrap.copied{
padding: 12px 45px 12px 47px;
}
}