Styleguide

Label Text 

<div class="label-text ">
      <dt class="text-label">Label here</dt>
      <dd class="text-value">content goes her for the label text component...</dd>
  </div>
 
{% if printable == 1 %}
  <tr class="label-text {{ class }}">
    <td class="text-label">{{ label }}</td>
    <td class="text-value">{{ value|raw }}</td>
  </tr>
{% else %}
  <div class="label-text {{ class }}">
    <dt class="text-label">{{ label }}</dt>
    <dd class="text-value">{{ value|raw }}</dd>
  </div>
{% endif %}
 
{
  "printable": 0,
  "label": "Label here",
  "value": "content goes her for the label text component...",
  "class": ""
}
  • Content: 
    .label-text {
	border-top: 2px solid white;
	border-bottom: 2px solid white;
	padding-top: 14px;
	padding-bottom: 14px;
	+ .label-text {
		border-top: none;
	}

	&:last-child {
		border-bottom: none;
	}

	.text-label {
		@extend .title-small-normal;
		margin-bottom: 0.5rem;
	}
	.text-value {
		margin-bottom: 0;

		ul {
			@include styled-list();
		}

		a {
			font-weight: 500;

			&:hover {
				text-decoration: none;
			}
		}

		table {
			margin: 1rem 0;
			th {
				font-weight: inherit;
			}
		}
	}

	a:not(.btn) {
		color: $primary;
		font-style: italic;
		text-decoration: underline;
		&:hover {
			text-decoration: none;
		}
	}
}
  • URL: /components/raw/label-text/label-text.scss
  • Filesystem Path: components/02-components/text/label-text/label-text.scss
  • Size: 640 Bytes

There are no notes for this item.