<header class="o-header">
<div class="wrapper">
<div class="row justify-content-between align-items-center flex-nowrap">
<div class="grid-auto">
<a href="/" class="o-header__logo-link">
<span class="o-header__logo"><svg class="logotype">
<use xlink:href="#logotype-default"></use>
</svg>
</span>
<span class="u-visuallyhidden">Till startsidan</span>
</a>
</div>
<div class="grid">
<nav class="a-main-menu" aria-label="Huvudmeny">
<ul class="a-main-menu__list">
<li class="u-hidden-mobile">
<a href="#" class="a-main-menu__list__link">
<span class="a-main-menu__list__text">Kunskap</span>
</a>
</li>
<li class="u-hidden-mobile">
<a href="#" class="a-main-menu__list__link">
<span class="a-main-menu__list__text">Innovation</span>
</a>
</li>
<li class="u-hidden-mobile">
<a href="#" class="a-main-menu__list__link is-current">
<span class="a-main-menu__list__text">Domäner</span>
</a>
</li>
<li class="u-hidden-mobile">
<button type="button" class="a-main-menu__list__link" aria-expanded="false" data-a11y-toggle="dropdown">
<span class="a-main-menu__list__text">Ämnen</span>
<div class="icon-arrow-down"></div>
</button>
<ul id="dropdown" class="a-main-menu__subnav u-box-shadow-card">
<li class="a-main-menu__subnav__item">
<a href="#">Desinformation</a>
</li>
<li class="a-main-menu__subnav__item">
<a href="#">Föräldraskap</a>
</li>
<li class="a-main-menu__subnav__item">
<a href="#">Integritet</a>
</li>
<li class="a-main-menu__subnav__item">
<a href="#">Källkritik</a>
</li>
<li class="a-main-menu__subnav__item">
<a href="#">Ordlista</a>
</li>
<li class="a-main-menu__subnav__item">
<a href="#">Så funkar internet</a>
</li>
<li class="a-main-menu__subnav__item">
<a href="#">Sökkritik</a>
</li>
<li class="a-main-menu__subnav__item">
<a href="#">Vanliga IT-brott</a>
</li>
<li class="a-main-menu__subnav__item">
<a href="#">Yttrandefrihet</a>
</li>
</ul>
</li>
<li>
<span class="a-main-menu__list__button">
<a href="#" class="a-button a-button--small a-button--lemon">
<span class="a-button__text">Bli medlem</span>
</a>
</span>
<span class="a-main-menu__list__button">
<a href="/medlem/rhedman" class="a-button a-button--icon a-button--icon-left a-button--transparent">
<span class="a-button__text u-nowrap">Min sida</span>
<svg class="icon a-button__icon">
<use xlink:href="#icon-user"></use>
</svg>
</a>
</span>
</li>
<li>
<div id="readspeaker_button1" class="rs_skip rsbtn rs_preserve">
<a rel="nofollow" accesskey="L" class="rsbtn_play a-main-menu__list__link is-top-level" aria-describedby="readspeaker-info" href="//app-eu.readspeaker.com/cgi-bin/rsent?customerid=10645&lang=<?php echo iis_set_language( 'sv_SE' ); ?>&voice=Maja&readclass=site__main&url=<?php the_permalink(); ?>">
<span class="a-main-menu__list__text rsbtn_left rsimg rspart"><span class="rsbtn_text"><span class="u-nowrap">Lyssna</span></span></span>
<span class="rsbtn_right rsimg rsplay rspart"></span>
<div class="a-button a-button--standalone-icon a-button--icon u-p-0">
<svg class="icon a-button__icon ">
<use xlink:href="#icon-speaker"></use>
</svg>
</div>
<span class="u-visuallyhidden" id="readspeaker-info">Lyssna på sidans text med ReadSpeaker</span>
</a>
</div>
</li>
<li class="u-hidden-mobile">
<button type="button" class="a-main-menu__list__link js-toggle-domain-search" aria-expanded="false" data-a11y-toggle="domain-search">
<span class="a-main-menu__list__text">Sök ledig domän</span>
<div class="icon-arrow-down"></div>
</button>
</li>
<li>
<button type="button" data-toggle-target="mega-menu-text" data-toggle-text="Meny|Stäng" class="a-main-menu__list__link js-toggle-mega-menu" aria-expanded="false" data-a11y-toggle="mega-menu">
<span class="a-main-menu__list__text" id="mega-menu-text">Meny</span>
<div class="icon-hamburger"></div>
</button>
</li>
</ul>
</nav>
</div>
</div>
</div>
</header>
<header class="o-header">
<div class="wrapper">
<div class="row justify-content-between align-items-center flex-nowrap">
<div class="grid-auto">
<a href="{{logo_link_href}}" class="o-header__logo-link">
<span class="o-header__logo">{{> @logotype id="default"}}</span>
<span class="u-visuallyhidden">{{logo_link_text}}</span>
</a>
</div>
<div class="grid">
{{ render '@main-menu'}}
</div>
</div>
</div>
</header>
{
"logo_link_text": "Till startsidan",
"logo_link_href": "/",
"label": "sök en .se- eller .nu-domän",
"controls": ""
}
@charset "UTF-8";
@use '../../configurations/mixins' as mixin;
@use '../../configurations/bem' as bem;
@use '../../configurations/config' as config;
@use '../../configurations/variables' as var;
@use '../../configurations/functions' as func;
@use '../../configurations/colors/colors' as colors;
@use '../../configurations/colors/colors-functions' as colorFunc;
@use '../../vendor/grid/breakpoints' as breakpoint;
@use '../../vendor/grid/grid' as grid;
@include mixin.organism(header) {
position: relative;
z-index: func.z_index(foregroundMinus);
border-bottom: 1px solid colors.$color-ash;
background-color: var(--snow-color);
@include bem.e(logo-link) {
display: flex;
align-items: center;
height: 100%;
padding: 0;
@include breakpoint.bp-up(md) {
padding: func.rhythm(2) 0;
}
}
@include bem.b(logotype) {
width: 100%;
max-width: func.rhythm(10);
height: func.rhythm(2.96);
overflow: visible;
}
@include breakpoint.bp-up(md) {
@include bem.b(logotype) {
max-width: func.rhythm(20);
height: func.rhythm(5.92);
}
}
}
No notes defined.