Styleguide

Sidebar Courses 

<div class="courses-links">
    <h3 class="title-small">Vorgestellte Bildungsgänge</h3>
    <ul>
        <li>
            <a href="#lorem" target="_blank">Bildungsgang 1</a>
            Beschreibung
        </li>
        <li>
            <a href="#lorem" target="_blank">Bildungsgang 2</a>
            Beschreibung
        </li>
        <li>
            <a href="#lorem" target="_blank">Bildungsgang 3</a>
            Beschreibung
        </li>
        <li>
            <a href="#lorem" target="_blank">Bildungsgang 4</a>
            Beschreibung
        </li>
        <li>
            <a href="#lorem" target="_blank">Bildungsgang 5</a>
            Beschreibung
        </li>
        <li>
            <a href="#lorem" target="_blank">Bildungsgang 6</a>
            Beschreibung
        </li>

    </ul>
</div>
 
<div class="courses-links">
    <h3 class="title-small">{{ title }}</h3>
    <ul>
        {% for item in items%}
        <li>
            <a href="{{ item.link_href }}" target="_blank">{{ item.link_text}}</a>
            {{ item.description }}
        </li>
        {% endfor %}    
    </ul>
</div>
 
{
  "title": "Vorgestellte Bildungsgänge",
  "items": [
    {
      "item": null,
      "link_text": "Bildungsgang 1",
      "link_href": "#lorem",
      "description": "Beschreibung"
    },
    {
      "item": null,
      "link_text": "Bildungsgang 2",
      "link_href": "#lorem",
      "description": "Beschreibung"
    },
    {
      "item": null,
      "link_text": "Bildungsgang 3",
      "link_href": "#lorem",
      "description": "Beschreibung"
    },
    {
      "item": null,
      "link_text": "Bildungsgang 4",
      "link_href": "#lorem",
      "description": "Beschreibung"
    },
    {
      "item": null,
      "link_text": "Bildungsgang 5",
      "link_href": "#lorem",
      "description": "Beschreibung"
    },
    {
      "item": null,
      "link_text": "Bildungsgang 6",
      "link_href": "#lorem",
      "description": "Beschreibung"
    }
  ]
}
  • Content: 
    .courses-links {
	.label-title {
		color: $primary;
		margin-bottom: 0.5rem;
	}
	.title-small {
		font-style: normal;
		margin-bottom: 1.5rem !important;

		@include media-breakpoint-up(lg) {
			margin-bottom: 0.5rem !important;
		}
	}
	ul {
		list-style: none;
		margin: 0;
		padding: 0;

		li {
			margin-bottom: 1rem;
			a {
				position: relative;
				display: block;
				color: $primary;
				font-size: 2rem;
			}
		}
	}
}
  • URL: /components/raw/courses/courses.scss
  • Filesystem Path: components/02-components/sidebar/courses/courses.scss
  • Size: 428 Bytes

There are no notes for this item.