app/assets/stylesheets/components/message.scss

.message {

  &-name {
    @include bold-24;
    margin: 0;

    a {
      display: block;
      margin-bottom: -$gutter;
      padding-bottom: $gutter;
    }

  }

  &-type {
    color: $secondary-text-colour;
    margin: 0 0 $gutter-two-thirds 0;
    pointer-events: none;
  }

}

#template-list {
  margin-top: $gutter;
}
Move parameters out of the `…_message` components This commit refactors the `email_message` and `sms_message` UI components to take fewer parameters. `name`, `edit_link` and anything to do with versions are identical for both text and email messages so I’ve moved them to the pages where you choose a template or see the versions. This commit also tidies up the wording and styling of the template history stuff. 2016-05-26 17:05:16 +01:00			`.message {`

			`&-name {`
			`@include bold-24;`
Make spacing tighter on templates page The prototype for folders tightens up the templates page to fit more templates on the screen. Partly because it looks better, and partly because the sticky bottom toolbar means that there’s less available space. So reducing the spacing means that roughly the same number of templates fit on the screen. For those who won’t see the checkboxes (people who don’t have the send permission) or use folders, this just means that they’ll have slightly less scrolling to do if they have a lot of templates. Doing this before adding the folders so that: - we roll out changes more gradually - once we add the folders we can see if the spacing has stayed consistent - changing where the margins are applied to resolve the inconsistent spacing when there is/isn’t tabbed navigation or a search box shown 2018-10-29 14:24:44 +00:00			`margin: 0;`
Make click areas bigger on template picker Generally, bigger click areas are better[1], as long as they don’t cause ambiguity. This commit expands the clickable area of links to templates to include hint text underneath which states the type of template. 1. https://en.wikipedia.org/wiki/Fitts%27s_law 2017-06-20 10:03:39 +01:00
			`a {`
			`display: block;`
			`margin-bottom: -$gutter;`
			`padding-bottom: $gutter;`
			`}`

			`}`

			`&-type {`
			`color: $secondary-text-colour;`
Make spacing tighter on templates page The prototype for folders tightens up the templates page to fit more templates on the screen. Partly because it looks better, and partly because the sticky bottom toolbar means that there’s less available space. So reducing the spacing means that roughly the same number of templates fit on the screen. For those who won’t see the checkboxes (people who don’t have the send permission) or use folders, this just means that they’ll have slightly less scrolling to do if they have a lot of templates. Doing this before adding the folders so that: - we roll out changes more gradually - once we add the folders we can see if the spacing has stayed consistent - changing where the margins are applied to resolve the inconsistent spacing when there is/isn’t tabbed navigation or a search box shown 2018-10-29 14:24:44 +00:00			`margin: 0 0 $gutter-two-thirds 0;`
Make click areas bigger on template picker Generally, bigger click areas are better[1], as long as they don’t cause ambiguity. This commit expands the clickable area of links to templates to include hint text underneath which states the type of template. 1. https://en.wikipedia.org/wiki/Fitts%27s_law 2017-06-20 10:03:39 +01:00			`pointer-events: none;`
Move parameters out of the `…_message` components This commit refactors the `email_message` and `sms_message` UI components to take fewer parameters. `name`, `edit_link` and anything to do with versions are identical for both text and email messages so I’ve moved them to the pages where you choose a template or see the versions. This commit also tidies up the wording and styling of the template history stuff. 2016-05-26 17:05:16 +01:00			`}`

			`}`
Make spacing tighter on templates page The prototype for folders tightens up the templates page to fit more templates on the screen. Partly because it looks better, and partly because the sticky bottom toolbar means that there’s less available space. So reducing the spacing means that roughly the same number of templates fit on the screen. For those who won’t see the checkboxes (people who don’t have the send permission) or use folders, this just means that they’ll have slightly less scrolling to do if they have a lot of templates. Doing this before adding the folders so that: - we roll out changes more gradually - once we add the folders we can see if the spacing has stayed consistent - changing where the margins are applied to resolve the inconsistent spacing when there is/isn’t tabbed navigation or a search box shown 2018-10-29 14:24:44 +00:00
			`#template-list {`
			`margin-top: $gutter;`
			`}`