Skip to content

Total Theme: Toggle and FAQ Buttons with Show more/ Show less Text and Icons

[vc_row gap="20"][vc_column width="1/3"][vcex_image image_id="28"][vcex_spacing class="responsive-spacer-default-half"][vc_column_text css=""]Wir gewährleisten einen reibungslosen Betrieb der Immobilien, regeln alle finanziellen Abläufe und sind die Schnitt- stelle zwischen unseren Kunden und den gewerblichen Mietern.[/vc_column_text][vcex_icon_box heading="Mehr Details" style="seven" align_center="true" heading_type="span" icon_type="enym" image="824" url_wrap="true" onclick="toggle_element" onclick_url="#kaufmaennische" image_width="60px" heading_color="palette-266" classes="arrow-link more-1" icon_color="palette-266" icon_size="40px" icon_enym="enymicon-plus"][/vcex_icon_box][vc_column_text css="" el_class="arrowlist mt-default-half details" el_id="kaufmaennische" visibility="hidden-toggle-element-persist"]<strong>Zu unseren kaufmännischen Aufgaben gehören:</strong>
<ul>
 	<li>Betreuung unserer Auftraggeber</li>
 	<li>Betreuung der Mieter</li>
 	<li>Allgemeine kaufmännische Objektbetreuung</li>
 	<li>Objektbuchhaltung: Debitorische Geschäftsvorfälle und</li>
 	<li>Forderungsmanagement</li>
 	<li>Objektbuchhaltung: Kreditorische Geschäftsvorfälle</li>
 	<li>Unterstützung Abschlussarbeiten</li>
 	<li>Nebenkostenabrechnung</li>
</ul>[/vc_column_text][vcex_toggle heading="Mehr Details" faq_microdata="true" icon_position="right" el_class="arrowlist mt-default-half details" heading_color="palette-266" heading_color_hover="palette-266"]<strong>Zu unseren kaufmännischen Aufgaben gehören:</strong>
<ul>
 	<li>Betreuung unserer Auftraggeber</li>
 	<li>Betreuung der Mieter</li>
 	<li>Allgemeine kaufmännische Objektbetreuung</li>
 	<li>Objektbuchhaltung: Debitorische Geschäftsvorfälle und</li>
 	<li>Forderungsmanagement</li>
 	<li>Objektbuchhaltung: Kreditorische Geschäftsvorfälle</li>
 	<li>Unterstützung Abschlussarbeiten</li>
 	<li>Nebenkostenabrechnung</li>
</ul>[/vcex_toggle][/vc_column][vc_column width="1/3"][vcex_image image_id="29"][vcex_spacing class="responsive-spacer-default-half"][vc_column_text css=""]Wir setzen unser technisches Knowhow ein zum Erhalt, zur Verbesserung und Sicherung Ihrer Immobilienanlage und sorgen für einen ungestörten Abläufe.[/vc_column_text][vcex_spacing responsive="true" size_responsive="d:36px|tl:36px|tp:0px|pl:0px|pp:0px"][vcex_icon_box heading="Mehr Details" style="seven" align_center="true" heading_type="span" icon_type="enym" image="824" url_wrap="true" onclick="toggle_element" onclick_url="#technische" image_width="60px" heading_color="palette-266" classes="arrow-link more-2" icon_color="palette-266" icon_size="40px" icon_enym="enymicon-plus"][/vcex_icon_box][vc_column_text css="" el_class="arrowlist mt-default-half details" el_id="technische" visibility="hidden-toggle-element-persist"]<strong>Zu unseren technischen Aufgaben gehören:</strong>
<ul>
 	<li>Objektbetreuung</li>
 	<li>Wartung und Prüfung (Serviceverträge)</li>
 	<li>Durchführung technischer Maßnahmen</li>
 	<li>Kaufmännische Begleitung technischer Maßnahmen Dritter</li>
 	<li>Management von Versicherungsschäden</li>
 	<li>Gewährleistungsmanagement für nicht durch den Auftragnehmer
durchgeführte Maßnahmen</li>
 	<li>Gewährleistungsverfolgung für nicht durch den Auftragnehmer durchgeführte Maßnahmen</li>
 	<li>Projektsteuerung</li>
 	<li>Steuerung Facility Management Ausschreibung</li>
 	<li>Inhouse Facility Management</li>
</ul>[/vc_column_text][vcex_toggle heading="Mehr Details" faq_microdata="true" icon_position="right" el_class="arrowlist mt-default-half details" heading_color="palette-266" heading_color_hover="palette-266"]<strong>Zu unseren technischen Aufgaben gehören:</strong>
<ul>
 	<li>Objektbetreuung</li>
 	<li>Wartung und Prüfung (Serviceverträge)</li>
 	<li>Durchführung technischer Maßnahmen</li>
 	<li>Kaufmännische Begleitung technischer Maßnahmen Dritter</li>
 	<li>Management von Versicherungsschäden</li>
 	<li>Gewährleistungsmanagement für nicht durch den Auftragnehmer
durchgeführte Maßnahmen</li>
 	<li>Gewährleistungsverfolgung für nicht durch den Auftragnehmer durchgeführte Maßnahmen</li>
 	<li>Projektsteuerung</li>
 	<li>Steuerung Facility Management Ausschreibung</li>
 	<li>Inhouse Facility Management</li>
</ul>[/vcex_toggle][/vc_column][vc_column width="1/3"][vcex_image image_id="27"][vcex_spacing class="responsive-spacer-default-half"][vc_column_text css=""]Unser Reporting-Service bietet präzise und anschauliche Berichte. Übersichtlich und attraktiv aufbereitet erhalten Sie wertvolle Einblicke in Ihre Geschäftsdaten als Basis fundierter Entscheidungen.[/vc_column_text][vcex_icon_box heading="Mehr Details" style="seven" align_center="true" heading_type="span" icon_type="enym" image="824" url_wrap="true" onclick="toggle_element" onclick_url="#dokumentarisch" image_width="60px" heading_color="palette-266" classes="arrow-link more-3" icon_color="palette-266" icon_size="40px" icon_enym="enymicon-plus" unique_id="dokumentarische"][/vcex_icon_box][vc_column_text css="" el_class="arrowlist mt-default-half details" el_id="dokumentarisch" visibility="hidden-toggle-element-persist"]<strong>Zu unseren dokumentarischen Aufgaben gehören:</strong>
<ul>
 	<li>Hochqualitatives Datenmanagement</li>
 	<li>Ständige Datenaktualisierung</li>
 	<li>Dokumentenmanagement mit digitalen Systemen</li>
 	<li>Detaillierte Reportings automatisiert an unsere Kunden</li>
 	<li>Gewähr der Softwarekompatibilität</li>
</ul>[/vc_column_text][vcex_toggle heading="Mehr Details" faq_microdata="true" icon_position="right" el_class="arrowlist mt-default-half details" heading_color="palette-266" heading_color_hover="palette-266"]<strong>Zu unseren dokumentarischen Aufgaben gehören:</strong>
<ul>
 	<li>Hochqualitatives Datenmanagement</li>
 	<li>Ständige Datenaktualisierung</li>
 	<li>Dokumentenmanagement mit digitalen Systemen</li>
 	<li>Detaillierte Reportings automatisiert an unsere Kunden</li>
 	<li>Gewähr der Softwarekompatibilität</li>
</ul>[/vcex_toggle][/vc_column][/vc_row]

This is the according CSS


.more-1 .vcex-icon-box-heading,
.more-2 .vcex-icon-box-heading,
.more-3 .vcex-icon-box-heading,
.more-me .vcex-icon-box-heading,
.vcex-toggle.vcex-module .vcex-toggle__title,
svg.vcex-toggle__icon-close, 
svg.vcex-toggle__icon-open {
  display: none;
}
.more-1 .vcex-icon-box-text::after,
.more-2 .vcex-icon-box-text::after,
.more-3 .vcex-icon-box-text::after, 
.more-me .vcex-icon-box-text::after {
  color: var(--wpex-palette-266-color);
  font-style: var(--wpex-heading-font-style);
  font-weight: var(--wpex-heading-font-weight);
  font-family: var(--wpex-heading-font-family);
  line-height: var(--wpex-heading-line-height);
  letter-spacing: var(--wpex-heading-letter-spacing);
  text-transform: var(--wpex-heading-text-transform);
  font-weight: 300;
  font-size: var(--wpex-body-font-size, 24px);
}
.more-1[aria-expanded="false"] .vcex-icon-box-text::after,
.more-2[aria-expanded="false"] .vcex-icon-box-text::after,
.more-3[aria-expanded="false"] .vcex-icon-box-text::after,
.vcex-toggle.vcex-module .vcex-toggle__trigger::after {
	content: "Mehr Details";
	padding-right: 20px;
	/*  display: inline-block;  margin-left:5px;*/
}
.more-me[aria-expanded="false"] .vcex-icon-box-text::after {
	content: "Über mich";
}
.more-1[aria-expanded="true"] .vcex-icon-box-text::after,
.more-2[aria-expanded="true"] .vcex-icon-box-text::after,
.more-3[aria-expanded="true"] .vcex-icon-box-text::after,
.vcex-toggle.vcex-module.vcex-toggle--active .vcex-toggle__trigger::after {
	content: "Weniger Details";
	padding-right: 20px;
}
.more-me[aria-expanded="true"] .vcex-icon-box-text::after {
  content: "Ausblenden";
/*  display: inline-block;  margin-left:5px;*/
}

.more-1[aria-expanded=true] img,
.more-2[aria-expanded=true] img,
.more-3[aria-expanded=true] img,
.more-me[aria-expanded=true] img,
.vcex-toggle.vcex-module.vcex-toggle--active .vcex-toggle__icon-close::after {
  content: url('/wp-content/uploads/2024/06/DBK-plus-rot-weniger-details.svg');
}
.vcex-toggle.vcex-module .vcex-toggle__icon-open::after {
  content: url('/wp-content/uploads/2024/06/DBK-plus-rot-mehr-details.svg');
}
.vcex-toggle.vcex-module.vcex-toggle--active .vcex-toggle__icon-close::after,
.vcex-toggle.vcex-module .vcex-toggle__icon-open::after {
    width: 60px;
	height: 60px;
}

Dieser Beitrag hat 0 Kommentare

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

An den Anfang scrollen