Issue 5534 - Create Contact Section for help.eyeo.com

static/scss/base/_utilities.scss

 // This file is part of help.eyeo.com.
 // Copyright (C) 2017 Eyeo GmbH
 //
 // help.eyeo.com is free software: you can redistribute it and/or modify
 // it under the terms of the GNU General Public License as published by
 // the Free Software Foundation, either version 3 of the License, or
 // (at your option) any later version.
 //
 // help.eyeo.com is distributed in the hope that it will be useful,
 // but WITHOUT ANY WARRANTY; without even the implied warranty of
@@ skipping 89 matching lines @@
 {
   color: $gray-medium;
 }
 
 a.muted,
 .muted a
 {
   color: $gray-medium !important;
   text-decoration: underline;
 }
+
+// Underlined ///////////////////////////////////////////////////////////////
+
+.underlined

[juliandoucette, 2017/09/26 15:37:55]

NIT/Suggest:

.underlined
{
   border-bottom: 1px dotted $gray;
}

header.underlined
{
  margin-bottom: ...
  ...
}

"underlined" doesn't say anything about spacing.

[ire, 2017/09/28 09:43:44]

You made this comment here:
https://codereview.adblockplus.org/29519587/diff/29519588/static/scss/base/_u...
but I don't think you saw my response.

What I will do is leave this class as an underline only, then modify the
.underline class for the #contact section alone. 

I don't think doing `header.underlined` in general is as extensible because we
would have to add the modifier to several tags.

[juliandoucette, 2017/10/09 22:00:38]

Agreed.

+{
+  margin-bottom: $md;
+  padding-bottom: $md;
+  border-bottom: 1px dotted $gray;
+
+  @media (min-width: $phablet-breakpoint)
+  {
+    margin-bottom: $lg;
+    padding-bottom: $lg;
+  }
+}