Skip to content
Snippets Groups Projects
Commit fd7d2011 authored by Dominik Hebeler's avatar Dominik Hebeler
Browse files

Merge branch '560-allgemeines-css-fur-dropdowns-ohne-javascript' into 'development'

Resolve "allgemeines css für dropdowns ohne javascript"

Closes #560

See merge request !1004
parents 3ae5c826 a3727738
No related branches found
No related tags found
1 merge request!1365Resolve "Filter Options for MetaGer"
...@@ -406,11 +406,7 @@ a { ...@@ -406,11 +406,7 @@ a {
font-size: 16px; font-size: 16px;
color: #2A2ADE; color: #2A2ADE;
} }
.option-checkbox {
visibility: hidden;
}
.option-content { .option-content {
display: none;
background-color: white; background-color: white;
z-index: 1000; z-index: 1000;
position: absolute; position: absolute;
...@@ -432,10 +428,6 @@ a { ...@@ -432,10 +428,6 @@ a {
display: block; display: block;
} }
} }
.option-opener:focus+.option-content, .option-content:hover {
display: initial;
animation-name: open-contents;
}
} }
.proxy { .proxy {
font-size: 13px; font-size: 13px;
......
/* Zweck: Inhalt der nur gezeigt werden soll wenn Javascript aktiviert ist
*/
.js-only { .js-only {
display: none !important; display: none !important;
} }
/* Zweck: Beim klick auf den .dropdown-opener soll der .dropdown-content angezeigt werden.
* Verwendung: <a class="dropdown-opener" href="javascript:void(0);">...</a>
* <div class="dropdown-content">...</div>
*/
.dropdown-content {
display: none;
background-color: white;
z-index: 1000;
position: absolute;
border: grey solid 1px;
border-radius: 5px;
}
.dropdown-opener:focus+.dropdown-content, .dropdown-content:hover {
display: initial;
animation-name: dropdown-open-contents;
animation-fill-mode: forwards;
animation-duration: 0.5s;
}
@keyframes dropdown-open-contents {
0% {
max-height: 200px;
}
100% {
max-height: 1000px;
}
}
...@@ -17,10 +17,10 @@ ...@@ -17,10 +17,10 @@
</a> </a>
</div> </div>
<div class="options"> <div class="options">
<a class="option-opener" href="javascript:void(0);"> <a class="dropdown-opener" href="javascript:void(0);">
<i class="fa fa-caret-down option-opener-icon" aria-hidden="true"></i> <i class="fa fa-caret-down option-opener-icon" aria-hidden="true"></i>
</a> </a>
<div class="option-content"> <div class="dropdown-content option-content">
<ul class="option-list list-unstyled small"> <ul class="option-list list-unstyled small">
<li class="option-title"> <li class="option-title">
<i class="fa fa-cog"></i> {!! trans('result.options.headline') !!} <i class="fa fa-cog"></i> {!! trans('result.options.headline') !!}
......
...@@ -16,6 +16,7 @@ ...@@ -16,6 +16,7 @@
<link type="text/css" rel="stylesheet" href="/css/lightslider.css" /> <link type="text/css" rel="stylesheet" href="/css/lightslider.css" />
<link type="text/css" rel="stylesheet" href="/font-awesome/css/font-awesome.min.css" /> <link type="text/css" rel="stylesheet" href="/font-awesome/css/font-awesome.min.css" />
<link id="theme" type="text/css" rel="stylesheet" href="/css/theme.css.php" /> <link id="theme" type="text/css" rel="stylesheet" href="/css/theme.css.php" />
@include('layouts.utility')
</head> </head>
<body id="resultBody"> <body id="resultBody">
@if( !isset($suspendheader) ) @if( !isset($suspendheader) )
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment