Issue Summary

When the resolution email is sent out after resolving a ticket, it seems to be very specific on where you need to click to be redirected to the satisfaction page when using Outlook.

It appears that the start size has shrunk and the text below these starts is no longer aligned with them.

Steps to Reproduce

1. In a Service Desk Project, create an issue as a customer.  
2. Make sure the Satisfaction Setting in the Jira Service Desk is configured and turned on. 
3. Resolve that issue as an agent, this will generate the customer satisfaction survey
4. As a customer, open the mail and access the notification with the satisfaction survey and notices the starts are small and the text below it is also not aligned properly under the starts.
5. The issue is been observed in different languages (English, German, etc).

Expected Results

The Customer should get the email with the Survey in it with normal size starts and proper text under the starts to point the ratings.

Actual Results

The Survey email is received but the content of the survey email is not correct as it used to be in earlier versions.

Workaround

The following workaround would need to be applied separately in every JSM project and every language supported.

1. Go to the relevant project settings
2. Go to "Customer notifications" project setting
3. Click on "Edit templates"
4. Click on CSS
5. Scroll down to the bottom of the text input below the "CSS" heading
6. Paste the following CSS:

   .srf-star {
       text-decoration: none;
       font-size: 40px;
       border: none;
       display: inline-block;
       vertical-align: top;
       color: #666666;
   }
   
   .srf-star img {
       width: 20px;
       border: none;
   }
   
   .srf-star-table {
       width: 200px;
   }
   
   .srf-line-break {
       min-height: 10px;
       max-height: 10px;
       font-size: 8px;
       line-height: 10px;
       display: block;
       width: 100%;
       overflow: hidden;
   }
   
   .srf-star-table .srf-star-row {
       vertical-align: top;
   }
   
   .srf-star-table.srf-star-table-with-text {
       width: 400px;
   }
   
   .srf-star-table .srf-star-row.srf-star-with-text {
       text-align: center;
       width: 75px;
       border: none;
       display: table-cell;
   }
   
   .srf-star-table .srf-star-row .srf-text {
       margin: 0;
       padding: 0;
       font-size: 13px;
       font-weight: normal;
       line-height: 20px;
       text-align: center;
   }