Skip to content

Horizontal Ruler Helper#40

Open
Creativenauts wants to merge 7 commits into
foundation:masterfrom
Creativenauts:horizontal-ruler
Open

Horizontal Ruler Helper#40
Creativenauts wants to merge 7 commits into
foundation:masterfrom
Creativenauts:horizontal-ruler

Conversation

@Creativenauts

@Creativenauts Creativenauts commented Feb 22, 2017

Copy link
Copy Markdown

Custom helper that adds a horizontal ruler to your email templates.

Usage

{{ruler align="center" color="#ec6225" width="60px" height="3px" spacing="15px"}}

Options

  • align: Can be aligned left, right or center. If Undefined alignment defaults to center.
  • color: This is the color of the ruler. Must be hex value (#000000)
  • width: This is the width of the ruler. Can be percentage (50%) or pixel (50px) unit
  • height: This is the height of the ruler. Defaults to pixel unit
  • spacing: This is the spacing above and below the ruler. Defaults to pixel unit

Example

ruler

Custom helper that adds a horizontal ruler to your email templates.

@Creativenauts Creativenauts left a comment

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If anyone has suggestions on how to optimize the code, please let me know. Thanks!

Comment thread src/helpers/ruler.js Outdated
// Trim Non-Numberic Chracters
String.prototype.trimUnit = function() { return this.replace(/\D/g, ''); }

// Variables & Options

@IamManchanda IamManchanda Feb 22, 2017

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please Indent properly .... Indentation should have 2 line spaces only instead of a tab.

If you are using editor like sublime text or atom , you can make your line space from 4 to 2 by customizing it like this below example of sublime!

"tab_size": 2,

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@IamManchanda thanks, I just checked preferences and tab_size is already set to 2 and translate tabs to spaces is set to true as well.

{
  // The number of spaces a tab is considered equal to
  "tab_size": 2,
  // Set to true to insert spaces when tab is pressed
  "translate_tabs_to_spaces": true,
  // Set to false to disable detection of tabs vs. spaces on load
  "detect_indentation": false,
}

Changed spacing from tab to spaces and size from 4 to 2.

@IamManchanda IamManchanda left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cool now @canterberrie for review,

@Creativenauts

Copy link
Copy Markdown
Author

@IamManchanda :/ guess I need to create new fork / branch for 716. Sorry, still trying to get the hang of this.

@IamManchanda

Copy link
Copy Markdown

and why is that @DerekBess ?

@Creativenauts

Creativenauts commented Feb 22, 2017

Copy link
Copy Markdown
Author

@IamManchanda I assume since this has both of my files for both pull requests it could be an issue?

#41

@IamManchanda

Copy link
Copy Markdown

oh yes an issue then!

@Creativenauts

Copy link
Copy Markdown
Author

@IamManchanda I will remove that pull request here shortly, have to pick my truck up from the body shop and then I'll work on it a bit more. Thanks for the help!

@Creativenauts

Copy link
Copy Markdown
Author

@IamManchanda Okay, I closed the other PR.

I added the option to align the ruler left, right and center.

I also updated the spacer variable and ruler output code block. I'm looking for a way to eliminate the use of a spacer.gif image in order for the email to render pixel perfect in outlook.

Any suggestions on how to achieve perfect pixel height with empty cells in outlook?
@Creativenauts

Copy link
Copy Markdown
Author

I just added the option of aligning the ruler left, right and center. Currently investigating a way to eliminate the use of a spacer.gif image for outlook.

I managed to find a way to eliminate the need for the spacer.gif image that works in Outlook.
@Creativenauts

Copy link
Copy Markdown
Author

Updated PR as I have found a way to eliminate the need for a spacer.gif image.

@bufordtaylor

Copy link
Copy Markdown

💯

@Creativenauts

Copy link
Copy Markdown
Author

@bufordtaylor thanks brother. Take a look at the code, let me know how shitty it is from your heart ;)

@kball

kball commented Apr 27, 2017

Copy link
Copy Markdown
Contributor

@DerekBess Any reason not to make this an inky tag?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants