style: adds styling for zammad form

* style: adds styling for zammad form
config: added config var for enable/disable form
 (#158)

invenio_theme_tugraz/assets/semantic-ui/js/invenio_theme_tugraz/theme.js

@@ -8,8 +8,9 @@ $(function() {
   
   $.getScript("https://ub-support.tugraz.at/assets/form/form.js", () => {
     $('#feedback-form').ZammadForm({
-      messageTitle: 'Feedback Form',
-      messageSubmit: 'Send',
+      messageTitle: 'Contact us',
+      showTitle: true,
+      messageSubmit: 'Submit',
       messageThankYou: 'Thank you for your message, (#%s). We will get back to you as quickly as possible!',
       modal: true
     });

invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/frontpage.less

@@ -44,3 +44,46 @@ h2 {
 .badges {
   float: right;
 }
+
+/*Zammad form**/
+.zammad-form{
+  h2{
+    text-align: center;
+  }
+  .form-group{
+    label{
+      color: @tugrazBlack;
+    }
+    input.form-control{
+      height: 30px;
+      // width: auto;
+      border-radius: 0;
+      font-family: "Source Sans Pro";
+      background: @primaryLinkBackgroundInverted;
+      border: 1px solid rgba(34, 36, 38, 0.15);
+    }
+    textarea{
+      border: 1px solid rgba(34, 36, 38, 0.15);
+    }
+  }
+  .btn{
+    width: 100% !important;
+    cursor: pointer;
+    font-family: "Source Sans Pro";
+    min-height: 1em;
+    line-height: 1em;
+    padding: 0.78571429em 1.5em 0.78571429em;
+    background: @greyLight none;
+    border: 0;
+  }
+  .btn:hover{
+    background: @primaryLinkHoverBackground;
+    color: @primaryButton;
+    font-size: 1rem;
+    font-weight: bold;
+  }
+}:focus{
+  outline: thin;
+  outline-style: solid;
+  outline-color: @outlineColor;
+}

invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/variables.less

@@ -65,3 +65,6 @@
 // record specific
 @recordVersionBackground : #f2f2f2;
 @randomRecordsFrontpageArticle: rgba(34, 36, 38, .15);
+
+// input
+@outlineColor: #85B7D9;

invenio_theme_tugraz/config.py

@@ -26,6 +26,9 @@ INVENIO_THEME_TUGRAZ_ICON = "images/icon_use.png"
 INVENIO_THEME_TUGRAZ_LOGIN_IMG = "images/login_logo.png"
 """TU Logo for forms"""
 
+INVENIO_THEME_TUGRAZ_CONTACT_FORM = False
+"""Enable/Disable Contact form."""
+
 # Invenio-theme
 # ============
 # See https://invenio-theme.readthedocs.io/en/latest/configuration.html

invenio_theme_tugraz/templates/invenio_theme_tugraz/index.html

@@ -127,12 +127,13 @@
       <!--contact us-->
       <div class="ui segment" style="padding-bottom: 10px;">
         <h4>{{_ ("Need help?")}}</h4>
-
+        {%- if config.INVENIO_THEME_TUGRAZ_CONTACT_FORM %}
         <div style="padding-bottom: 10px;">
           <a id="feedback-form" class="fluid ui button">
             {{_ ("Contact us")}} 
           </a>
         </div>
+        {%- endif %}
         <p>
           {{config.THEME_SITENAME}} {{_ ("prioritizes all Recent uploads.")}}
         </p>