tutorcruncher / socket-frontend

Javascript frontend for TutorCruncher Socket

Home Page:https://tutorcruncher.com/features/tutorcruncher-socket/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

CSS injected into WordPress requires more specification.

admjacqus opened this issue · comments

After adding a Tutorcruncher Enquiry Form onto a page, using a shortcode like so...

<script src="https://cdn.tutorcruncher.com/socket/latest/socket.js"></script>
<div id="socket-enquiry"></div>
<script>
  socket('*****************', {
    mode: 'enquiry',
    element: '#socket-enquiry'
  })
</script>

The API adds a block of styles to the , which contain a number of h3 type selector styles.

h3 { margin-top: 12px; margin-bottom: 4px; font-size: 24px; font-weight: 400; }

Due to the position of these styles in the head, they are overwriting my h3 styles. Which means I now have to amend my theme or additional CSS in order to keep consistent typography where this form is called.

Simply wrapping the h3 styles in a parent selector or using classes will fix this issue.