Responsive by Out of the Sandbox

In order for Tracktor to look seamless with the Responsive theme, you'll need to add some CSS code to your theme's stylesheet.

1. From your Shopify admin, click  Online Store, then click Themes

2. Find the theme you want to edit, click the  ... button, then click Edit HTML/CSS

3. On the left side, click on the  Assets heading to reveal your Assets content.

4. Click to open the file called theme.scss.liquid then scroll to the bottom of the document.

5. Copy/Paste the code snippet below at the bottom of the file, then save your changes.

/* * * * * * * * * * * * * * * * * * * * * * * * * * * 
ShopPad App: Tracktor
https://apps.shopify.com/tracktor-2
* * * * * * * * * * * * * * * * * * * * * * * * * * */

#tracktorTrack {
  background: {{ settings.btn_color }};
  border: 1px solid {{ settings.btn_color }};
  padding: 8px 20px;
  text-align: center;
  font-size: 14px;
  cursor: pointer;

  font-weight: {{ settings.top_bar_weight }};
  text-transform: {{ settings.top_bar_font_style}};
  letter-spacing: {{ settings.top_bar_letter_spacing }}px;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;

  font-family: {{ settings.top_bar_font | replace: 'Google_', '' | replace: '+', ' ' }};
  text-shadow: 0 1px rgba(0, 0, 0, 0.1);
  width: auto;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  color: #fff !important;
  transition: all .2s linear;
  -o-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -webkit-transition: all .2s linear;
  margin-bottom: 0;
  -webkit-appearance: none;
  outline: none;

  &:hover {
    background: {{ settings.btn_hover_color }};
    border-color: {{ settings.btn_hover_color }};
    outline: none;
  }  
}

6. Save your changes.