ARCHIVE/xrpl-dev-portal
1
0
Fork 0
mirror of https://github.com/XRPLF/xrpl-dev-portal.git synced 2025-11-20 11:45:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

add feedback widget

Browse Source
This commit is contained in:
Phu Pham
2023-04-26 14:06:10 -04:00
parent fba08a582a
commit 80b1e25bb6
3 changed files with 103 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
styles/_feedback.scss
View File

@@ -1,24 +1,73 @@
// TEMPORARY: overriding the feedback widget styles here
#feedback-content {
.docked-widget {
border: none !important;
}
.widget-form-wrapper {
position: static !important;
box-shadow: none !important;
display: block;
background-color: $body-bg !important;
background-color: $gray-800 !important;
border-width: 0 !important;
padding: 2rem;
border-radius: 8px !important;
.widget-header {
background: none !important;
.widget-header-title {
flex-grow: 0 !important;
padding-right: 1rem !important;
}
div {
background-color: $gray-800 !important;
}
#closeFeedback {
display: none;
textarea {
background-color: $white !important;
opacity: 1 !important;
border: none !important;
border-radius: 4px !important;
}
.widget-header-title {
background: none !important;
flex-grow: 0 !important;
padding-right: 1rem !important;
}
.widget-header-footer {
background: none !important;
}
.submit {
background-color: $blue-purple-500 !important;
font-weight: bold !important;
color: $white !important;
border: none !important;
border-color: transparent !important;
border-radius: 4px !important;
&:hover {
background: $blue-purple-600 !important;
}
&.disabled,
&[disabled="disabled"] {
background-color: $blue-purple-700 !important;
&:hover {
background-color: $blue-purple-700 !important;
}
}
}
.cancel {
color: $blue-purple-300 !important;
font-weight: 600 !important;
}
}
#closeFeedback {
display: none;
}
.widget-helpful {
.widget-header {
background-color: $gray-800 !important;
}
.widget-header-title {
color: $white !important;
}
}
}

31
styles/light/_light-theme.scss
View File

@@ -763,15 +763,40 @@ pre code {
// feedback widget
#feedback-content {
.docked-widget {
// .docked-widget {
// .widget-header {
// background-color: $light-bg !important;
// color: $light-fg !important;
// }
// }
.widget-form-wrapper {
background-color: $white !important;
div {
background-color: $white !important;
}
textarea {
background-color: $gray-200 !important;
}
.widget-header-title {
color: $gray-900 !important;
}
.cancel {
color: $blue-purple-500 !important;
}
}
.widget-helpful {
.widget-header {
background-color: $light-bg !important;
color: $light-fg !important;
background-color: $white !important;
}
.widget-header-title {
color: $gray-900 !important;
}
.widget-header-icon {
filter: invert(100%);
}
}
}
// Docs landing page

32
template/component-feedback-widget.html.jinja
View File

@@ -1,19 +1,19 @@
<!-- Feedback Widget -->
<!-- <script src="{{currentpage.prefix}}assets/vendor/feedback-widget.js"></script> -->
<!-- <div id="feedback-content"></div> -->
<script src="{{currentpage.prefix}}assets/vendor/feedback-widget.js"></script>
<div id="feedback-content"></div>
<script>
// // Options
// const options = {
// analyticsConfig: [
// // { name: 'ga', id: 'UA-45576805-2' },
// // { name: 'gtm', id: 'GTM-THHW334' },
// ],
// analyticsName: 'Feedback Widget Tracker',
// theme: 'xrpl',
// currentPath: window.location.pathname,
// parentElement: '#feedback-content',
// };
//
// // Init WidgetClass
// const r = new WidgetClass(options);
// Options
const options = {
analyticsConfig: [
// { name: 'ga', id: 'UA-45576805-2' },
// { name: 'gtm', id: 'GTM-THHW334' },
],
analyticsName: 'Feedback Widget Tracker',
theme: 'xrpl',
currentPath: window.location.pathname,
parentElement: '#feedback-content',
};
// Init WidgetClass
const r = new WidgetClass(options);
</script>