Skip to content
Snippets Groups Projects
Commit 278e5fda authored by Robert Lange's avatar Robert Lange Committed by Dorian Merz
Browse files

refs #19300 [fid_adlr] restore search form design 

* use float left for inputs, which was removed in finc 17720
* unset body padding top for xs
* fix modal on sm: re-add margin to show closing button (cross) for sm screens
* center refresh buttons vertically
* prevent overlapping shard checkboxes on alpha

* basic syntax refactoring
parent b41c176c
No related merge requests found
Hide whitespace changes
Inline Side-by-side
themes/fid_adlr/scss/_lightbox.scss
+ 6
− 2
View file @ 278e5fda
......@@ -21,8 +21,12 @@
}
}
@media screen and (max-width: $screen-sm-max) {
.modal-dialog {
.modal-dialog {
@media screen and (max-width: $screen-sm-max) {
max-width: 100%;
}
@media screen and (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
margin: $grid-gutter-width;
}
}
\ No newline at end of file
themes/fid_adlr/scss/compiled.scss
+ 59
− 19
View file @ 278e5fda
......@@ -86,6 +86,11 @@ body {
:hover {
outline: none;
}
// override finc 17720
@media (max-width: $screen-xs-max) {
padding-top: unset;
}
}
// HEADINGS
......@@ -357,6 +362,7 @@ a.exclude {
.large-text {
font-size: em(24px);
line-height: em(45px);
&.light {
color: $asphalt;
}
......@@ -400,19 +406,24 @@ a.exclude {
background: $amber;
border: $amber;
color: $black;
&:hover {
color: $black;
}
}
.alert-info, .savedLists.alert.alert-info, .alert-success {
.alert-info,
.savedLists.alert.alert-info,
.alert-success {
border: 3px solid $asphalt-dark;
border-radius: 0;
color: $state-info-text;
&:hover,
&:focus {
color: $state-info-text;
}
a {
color: $state-info-text;
}
......@@ -521,6 +532,7 @@ a.exclude {
@media screen and (max-width: $screen-xs-max) {
width: 100%;
// FIXME; Pruefen, ob form-control einfach aus dem phtml-Template entfernt werden könnte
.searchForm,
.searchForm .form-control {
......@@ -595,6 +607,11 @@ header,
#searchForm input[type='text'] {
@include default-border($white);
}
// overwrite finc changes of #17720
#searchForm input{
float: left;
}
}
// #17913 adjust BARF to adlr design
......@@ -609,7 +626,10 @@ input[type='password']:hover {
outline-offset: 0;
}
.close:hover, .adv-term-remove:hover, .close:focus, .adv-term-remove:focus {
.adv-term-remove:focus,
.adv-term-remove:hover,
.close:focus,
.close:hover {
outline: none;
}
......@@ -756,7 +776,7 @@ input[type='checkbox']:hover,
}
}
.menubar #register-menu .navbar-header-link {
#register-menu .navbar-header-link {
@media (max-width: $mobile-navigation-menu-breakpoint) {
@include shift-main-menu-entries-to-navigation-overlay;
}
......@@ -1668,6 +1688,7 @@ input.searchForm_lookfor {
form {
min-width: 100%;
}
select {
font-size: calc(#{$font-size-base} * .9);
font-weight: 600;
......@@ -1704,31 +1725,38 @@ input.searchForm_lookfor {
.sort {
select {
max-width: unset;
@media screen and (max-width: $screen-lg-min) {
max-width: 180px;
}
}
}
.limit, .sort {
.limit,
.sort {
label {
padding-top: 6px;
}
}
.limit-inner .btn,
.sort-inner .btn {
vertical-align: middle;
}
}
.mailsave {
span {
margin-left: 0.8em;
margin-left: .8em;
@media screen and (min-width: $screen-sm-min) {
margin-left: 0.3em;
margin-left: .3em;
position: relative;
top: 15px;
}
@media screen and (min-width: $screen-lg-min) {
margin-left: 0.5em;
margin-left: .5em;
}
}
}
......@@ -1775,9 +1803,11 @@ input.searchForm_lookfor {
.result-body {
color: $asphalt;
@media screen and (min-width: $screen-xl-min) {
width: 80%;
}
.result-formats {
padding-top: 1rem;
}
......@@ -1818,7 +1848,7 @@ input.searchForm_lookfor {
text-align: right;
@media screen and (min-width: $screen-xl-min) {
width: 20%;
width: 20%;
}
}
......@@ -2000,9 +2030,9 @@ input.searchForm_lookfor {
.offcanvas-right .sidebar {
background: $white;
height: 100%;
padding: 1rem;
position: fixed;
overflow-y: auto;
padding: 1rem;
right: -80vw;
top: 0;
transition: left .5s, right .5s;
......@@ -2072,8 +2102,8 @@ input.searchForm_lookfor {
.container,
.footer {
background: transparent;
max-width: 1284px;
border: 0;
max-width: 1284px;
}
&.collapsing {
......@@ -2117,6 +2147,7 @@ input.searchForm_lookfor {
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
&:active,
&:focus,
&:hover {
......@@ -2150,8 +2181,8 @@ input.searchForm_lookfor {
}
@media screen and (min-width: $screen-md-min) and (max-width: $screen-lg-min) {
position: absolute;
padding-top: em(20px);
position: absolute;
}
@media screen and (min-width: $screen-lg-min) {
......@@ -2180,6 +2211,7 @@ input.searchForm_lookfor {
.record div[id^="side-panel-"] {
margin-left: 15px;
margin-right: 15px;
@media screen and (min-width: $screen-lg-min) {
width: 68%;
}
......@@ -2207,7 +2239,7 @@ input.searchForm_lookfor {
ul > li {
list-style: none;
span {
padding-right: 0.5em;
padding-right: .5em;
}
}
......@@ -2241,6 +2273,7 @@ input.searchForm_lookfor {
text-align: inherit;
text-transform: uppercase;
width: 100%;
&::after {
float: right;
}
......@@ -2252,6 +2285,7 @@ input.searchForm_lookfor {
@media screen and (min-width: $screen-lg-min) {
min-width: $main-content-container-min-width-lg;
.mainbody {
padding-right: 80px;
}
......@@ -2275,6 +2309,7 @@ input.searchForm_lookfor {
// FIXME: Table definitions bitte in den ganz allgemeinen Teil, wo auf Forms usw. definiert werden, Schachtelung weitgehend unnötig
.table {
border: 0;
& tr {
border-bottom: 3px solid $midnight-medium;
@media screen and (min-width: $screen-lg-min) {
......@@ -2298,6 +2333,7 @@ input.searchForm_lookfor {
}
}
}
.tab-content {
border: 0;
......@@ -2324,7 +2360,9 @@ input.searchForm_lookfor {
}
}
color: $black;
& > th, & > td {
& > th,
& > td {
padding: 4px;
}
}
......@@ -2753,6 +2791,7 @@ div[class$="-tab"] {
.offcanvas .close-offcanvas {
width: auto;
margin: 0;
@media (min-width:$screen-sm-min) and (max-width:$screen-sm-max) {
display: block;
}
......@@ -2763,9 +2802,9 @@ div[class$="-tab"] {
footer {
// general footer styles
all: inherit;
background-image: url('../images/footer-dummy-background.png');
background-repeat: no-repeat;
background-size: cover;
background-image: url('../images/footer-dummy-background.png');
color: $white;
a:hover,
......@@ -2953,6 +2992,7 @@ footer {
label[data-required="true"][for]::after {
content: ' *';
}
textarea {
min-height: em(200px);
}
......@@ -2961,20 +3001,20 @@ footer {
@import 'customForms';
#hierarchyTree .jstree-clicked {
background-color: lighten($brand-primary,30%);
padding-left: .5em;
background-color: lighten($brand-primary, 30%);
margin-left: -.5em;
padding-left: .5em;
}
.switchtab-info {
@media (max-width: $screen-xs-max) {
display:none;
display: none;
}
padding-left: 1em;
padding-right: 1em;
.switchtab-text, .switchtab-heading, .switchtab-links {
padding-top: .75em;
padding-bottom: .75em;
padding-top: .75em;
}
.switchtab-text {
hyphens: none;
......@@ -2998,8 +3038,8 @@ footer {
}
.export-favorites a {
text-decoration: none;
color: $white;
text-decoration: none;
}
// #17031 user tracking opt-out (iframe) - RL
......
themes/fid_adlr/templates/search/searchbox.phtml
+ 5
− 3
View file @ 278e5fda
......@@ -98,9 +98,11 @@ $hiddenFilterParams = $this->searchTabs()->getCurrentHiddenFilterParams($this->s
?>
<?php foreach ($shards as $shard => $val): ?>
<?php $isSelected = empty($selectedShards) || in_array($shard, $selectedShards); ?>
<label for="checkbox_<?=$this->escapeHtmlAttr($shard)?>"><?=$this->transEsc($shard)?>
<input type="checkbox" <?=$isSelected ? 'checked="checked" ' : ''?>name="shard[]" value='<?=$this->escapeHtmlAttr($shard)?>' id='checkbox_<?=$this->escapeHtmlAttr($shard)?>'/>
</label>
<div>
<label for="checkbox_<?=$this->escapeHtmlAttr($shard)?>"><?=$this->transEsc($shard)?>
<input type="checkbox" <?=$isSelected ? 'checked="checked" ' : ''?>name="shard[]" value='<?=$this->escapeHtmlAttr($shard)?>' id='checkbox_<?=$this->escapeHtmlAttr($shard)?>'/>
</label>
</div>
<?php endforeach; ?>
<?php endif; ?>
</div>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment