geolba/tethys
6
0
Fork 0
Code Issues 2 Pull Requests Packages Projects 1 Releases Wiki Activity

- better search page

Browse Source 
- white header on starting page else green
This commit is contained in:
Arno Kaimbacher 2020-04-20 23:29:10 +02:00
parent 578021e07e
commit 7622c93473
11 changed files with 171 additions and 186 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
composer.lock generated
View File

@ -128,6 +128,7 @@
"keywords": [ "keywords": [
"laravel" "laravel"
], ],
"abandoned": true,
"time": "2019-12-30T22:50:51+00:00" "time": "2019-12-30T22:50:51+00:00"
}, },
{ {
@ -5210,16 +5211,16 @@
}, },
{ {
"name": "webmozart/assert", "name": "webmozart/assert",
"version": "1.7.0", "version": "1.8.0",
"source": { "source": {
"type": "git", "type": "git",
"url": "https://github.com/webmozart/assert.git", "url": "https://github.com/webmozart/assert.git",
"reference": "aed98a490f9a8f78468232db345ab9cf606cf598" "reference": "ab2cb0b3b559010b75981b1bdce728da3ee90ad6"
}, },
"dist": { "dist": {
"type": "zip", "type": "zip",
"url": "https://api.github.com/repos/webmozart/assert/zipball/aed98a490f9a8f78468232db345ab9cf606cf598", "url": "https://api.github.com/repos/webmozart/assert/zipball/ab2cb0b3b559010b75981b1bdce728da3ee90ad6",
"reference": "aed98a490f9a8f78468232db345ab9cf606cf598", "reference": "ab2cb0b3b559010b75981b1bdce728da3ee90ad6",
"shasum": "" "shasum": ""
}, },
"require": { "require": {
@ -5227,7 +5228,7 @@
"symfony/polyfill-ctype": "^1.8" "symfony/polyfill-ctype": "^1.8"
}, },
"conflict": { "conflict": {
"vimeo/psalm": "<3.6.0" "vimeo/psalm": "<3.9.1"
}, },
"require-dev": { "require-dev": {
"phpunit/phpunit": "^4.8.36 || ^7.5.13" "phpunit/phpunit": "^4.8.36 || ^7.5.13"
@ -5254,7 +5255,7 @@
"check", "check",
"validate" "validate"
], ],
"time": "2020-02-14T12:15:55+00:00" "time": "2020-04-18T12:12:48+00:00"
} }
], ],
"aliases": [], "aliases": [],

192
public/css/search_style.css vendored
View File

@ -5,9 +5,7 @@
color: rgb(66, 66, 66); color: rgb(66, 66, 66);
box-sizing: border-box; box-sizing: border-box;
} }
.results {
padding-left: 4%;
}
.columns.right-bar { .columns.right-bar {
margin-left: 0% !important; margin-left: 0% !important;
} }
@ -45,9 +43,7 @@ section.search {
/* .record-elem h4 a { /* .record-elem h4 a {
color: #000; color: #000;
} */ } */
a.ng-binding {
cursor: pointer;
}
.record-elem h4 a { .record-elem h4 a {
cursor: pointer; cursor: pointer;
color: #000; color: #000;
@ -94,49 +90,52 @@ a.ng-binding {
} }
/* zenodo left side: */
.panel {
margin-bottom: 20px;
background-color: #fff;
border: 1px solid;
border-radius: 4px;
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
box-shadow: 0 1px 1px rgba(0,0,0,.05);
}
.panel-default {
border-color: #ddd;
}
.panel-default > .panel-heading {
/* Search items */ color: #333;
/* .search-items { background-color: #f5f5f5;
list-style: none; border-color: #ddd;
width: 100%; padding: 10px 15px;
display: inline-block; border-bottom: 1px solid transparent;
} border-top-right-radius: 3px;
.search-items li { border-top-left-radius: 3px;
position: relative; }
overflow: hidden; .panel-title {
height: 360px; margin-top: 0;
margin: 0!important;
width: 50%;
border: 10px solid white;
position: relative;
padding-left: 15px;
padding-right: 15px;
}
.search-items li:nth-child(3n) {
margin-left: 0;
}
.search-items li img{
width: auto;
height: 100%;
display: block;
} */
/* Work detail */
/* .search-detail {
position: absolute;
top: 0; bottom: 0; left: 0; right: 0;
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
align-items: center;
box-shadow: inset rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
opacity: 1;
border: 1px solid rgb(238, 238, 238);
box-sizing: border-box;
min-height: 300px;
font-size: 16px; font-size: 16px;
padding:20px; margin-bottom: 0;
} */ color: inherit;
}
.panel-body {
padding: 15px;
font-size: 14px;
line-height: 1.42857;
color: #333;
}
.list-inline, .list-unstyled {
padding-left: 0;
list-style: none;
margin-bottom: 10px;
margin-top: 0;
}
#left-bar .titlecase {
text-transform: capitalize;
}
@ -150,17 +149,6 @@ a.ng-binding {
/* filter items in the left bar */
/*-------------------------------------------------- */
.left-bar .panel-title {
text-transform: capitalize;
margin-top: 8px;
margin-bottom: 2px;
color: white;
display: block;
font-weight: bold;
}
.overflowing { .overflowing {
color: #444444; color: #444444;
list-style: none; list-style: none;
@ -174,44 +162,27 @@ a.ng-binding {
cursor: pointer; cursor: pointer;
} }
ul.filter-items li { /* ul.filter-items li {
min-height: 15px; min-height: 15px;
color: #444; color: #444;
font-size: 12px; font-size: 12px;
list-style-type: none; list-style-type: none;
/*list-style-position:inside;*/
/*
* We want the bullets outside of the list,
* so the text is aligned. Now the actual bullet
* is outside of the list’s container
*/
list-style-position: outside; list-style-position: outside;
/*
* Because the bullet is outside of the list’s
* container, indent the list entirely
*/
margin-left: 1em; margin-left: 1em;
} } */
.filter-items.limited li:nth-of-type(1n+3) { .filter-items.limited li:nth-of-type(1n+3) {
display: none; display: none;
} }
/* ul.filter-items .active { ul.filter-items li span {
background-color: lightgray;
} */
ul.filter-items li a {
cursor: pointer; cursor: pointer;
color:#ffffff; /* color:#ffffff;
text-decoration: none; text-decoration: none;
font-weight: bold; font-weight: bold;
font-size: 16px; font-size: 16px; */
} }
/* ul.filter-items li a:hover {
color: #0099cc;
cursor: pointer;
} */
/* Relativer Tooltip */ /* Relativer Tooltip */
.tooltip { .tooltip {
@ -237,19 +208,16 @@ font-size: 16px;
.sidebar.left-bar { .sidebar.left-bar {
float: left; float: left;
border-left: none; border-left: none;
/* width: 250px; */
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 1rem; padding: 25px;
/* height: 100vh; */
overflow-y: auto; overflow-y: auto;
background-color: #3abac4; /* background-color: #3abac4; */
opacity: .9; /* opacity: .9; */
color: white; /* color: white; */
position: relative; position: relative;
} }
/*
.left-bar .sidebar-image { .left-bar .sidebar-image {
background: url("../images/csm_kabel.png") no-repeat; background: url("../images/csm_kabel.png") no-repeat;
background-size: cover; background-size: cover;
@ -273,25 +241,24 @@ font-size: 16px;
.card { .card {
z-index: 1; z-index: 1;
position: relative; position: relative;
} */
}
.sidebar.right-bar { .sidebar.right-bar {
border: none; border: none;
padding: 25px;
/* margin-left: 250px; */ /* margin-left: 250px; */
/* background-color: lightblue; */ /* background-color: lightblue; */
} }
.left-bar .indexheader { /* .left-bar .indexheader {
font-weight: bold; font-weight: bold;
display: block; display: block;
color: white; color: white;
font-family: Monoton, cursive; font-family: Monoton, cursive;
/* font-size: 2rem; */
text-align: center; text-align: center;
} } */
@ -304,23 +271,26 @@ font-size: 16px;
white-space: nowrap; white-space: nowrap;
} }
.search-input { .search-input {
height: 50px !important; height: 50px !important;
border-color: currentcolor currentcolor rgb(204, 204, 204) !important; /* border-color: currentcolor currentcolor rgb(204, 204, 204) !important; */
border-style: none none solid !important; /* border-style: none none solid !important; */
border-width: medium medium 1px !important; /* border-width: medium medium 1px !important; */
border-image: none 100% / 1 / 0 stretch !important; /* border-image: none 100% / 1 / 0 stretch !important; */
/* background: rgb(250, 250, 250) none repeat scroll 0% 0%; */ /* background: rgb(250, 250, 250) none repeat scroll 0% 0%; */
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; /* transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s; */
background-color: rgb(250, 250, 250) !important; background-color: rgb(250, 250, 250) !important;
width: 100%; width: 100%;
outline: currentcolor none medium; /* outline: currentcolor none medium; */
border-radius: 0px !important; /* border-radius: 0px !important; */
border: 1px solid;
border-radius: 4px;
} }
.css-1gklxk5 { .search-button {
position: absolute; position: absolute;
top: 8px; top: 8px;
cursor: pointer; cursor: pointer;
@ -329,7 +299,7 @@ font-size: 16px;
left: 0.25em; left: 0.25em;
border: none; border: none;
} }
.css-1gklxk5 svg.search-icon { .search-button svg.search-icon {
fill: rgb(0, 128, 0); fill: rgb(0, 128, 0);
} }
.sidebar-simplesearch input[type=text] { .sidebar-simplesearch input[type=text] {
@ -389,22 +359,6 @@ font-size: 16px;
.filter-items {
list-style: outside none none;
padding: 0px 0px 12px;
margin: 0px;
/* max-height: 240px; */
position: relative;
overflow-y: auto;
}
.filter-items li {
min-height: 30px;
display: flex;
flex-direction: row;
-moz-box-align: center;
align-items: center;
padding-left: 2px;
}
.css-w1gpbi { .css-w1gpbi {
border: 0px none; border: 0px none;
clip: rect(1px, 1px, 1px, 1px); clip: rect(1px, 1px, 1px, 1px);

57
public/css/style.css vendored
View File

@ -274,6 +274,11 @@ section.normal {
color: #222; color: #222;
background-color: transparent; background-color: transparent;
} }
.navigation.transparent {
background-color: #fff;
border-bottom: 1px solid #dcdcdc;
}
.navigation.active { .navigation.active {
/* make visible visible */ /* make visible visible */
@ -303,18 +308,18 @@ section.normal {
-ms-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out; transition: all .5s ease-in-out;
background-color: #fff; background:#3ad29f;
border-bottom: 1px solid #dcdcdc; /* border-bottom: 1px solid #dcdcdc; */
} }
.navigation ul { .navigation ul {
list-style: none; /* display:none; */
/* position: absolute; width:100%;
top: 0; list-style:none;
left: 0;
right: 0; */
margin: 0; margin: 0;
background-color: #fff; padding:0;
/* background-color: #fff; */
} }
.header ul li { .header ul li {
display: block; display: block;
@ -322,23 +327,39 @@ section.normal {
text-align: center; text-align: center;
margin: 0; margin: 0;
} }
.navigation ul li a {
display: inline-block; .navigation.transparent ul li a {
padding: 14px 16px;
height: 100%;
text-transform: uppercase;
color: #757575; color: #757575;
font-size: 1.7rem; background-color: white;
text-decoration: none;
transition: 0.2s;
} }
.navigation ul li a.current, .navigation ul li a {
.navigation ul li a:hover { display: block;
padding:1em;
background:#3ad29f; /* green */
color: white;
/* font-size: 1.7rem; */
text-decoration: none;
/* border-right: 1px solid #28b183; */
}
#nav.transparent ul li a.current,
#nav.transparent ul li a:hover {
background-color: #eee; background-color: #eee;
color: #757575; color: #757575;
} }
#nav ul li a.current,
#nav ul li a:hover {
background: #2dc592;
}
.navigation ul li a.current,
/* .navigation ul li a:hover {
background-color: #eee;
color: #757575;
} */
/* Float right the list item that should be right aligned */ /* Float right the list item that should be right aligned */
.navigation ul li.right { float: right; } .navigation ul li.right { float: right; }

2
public/js/scripts.js
View File

File diff suppressed because one or more lines are too long

2
public/js/search/main.js
View File

File diff suppressed because one or more lines are too long

5
resources/js/scripts.js
View File

@ -45,11 +45,14 @@ $(document).ready(function () {
$navigationLink = $('.menu a'); $navigationLink = $('.menu a');
if (location.pathname == "/") { if (location.pathname == "/") {
$navigation.addClass('transparent');
$(window).scroll(function () { $(window).scroll(function () {
if (window.scrollY > window.outerHeight) { if (window.scrollY >= (window.innerHeight + $navigation.height())) {
$menuIcon.addClass('active'); $menuIcon.addClass('active');
$navigation.removeClass('transparent');
} else { } else {
$menuIcon.removeClass('active'); $menuIcon.removeClass('active');
$navigation.addClass('transparent');
} }
}); });
} }

7
resources/js/search/App.vue
View File

@ -2,7 +2,7 @@
<div class="search-container row"> <div class="search-container row">
<div class="four columns left-bar"> <div class="four columns left-bar">
<div id="left-bar" class="sidebar left-bar"> <div id="left-bar" class="sidebar left-bar">
<div class="sidebar-image"></div> <!-- <div class="sidebar-image"></div> -->
<!-- <h2 class="indexheader">DataXplore</h2> --> <!-- <h2 class="indexheader">DataXplore</h2> -->
<!-- <div class="card" v-for="item in facets.language" :key="item.id"> <!-- <div class="card" v-for="item in facets.language" :key="item.id">
@ -21,7 +21,7 @@
<div id="right-bar" class="sidebar right-bar"> <div id="right-bar" class="sidebar right-bar">
<!-- Search input section --> <!-- Search input section -->
<div class="row"> <div class="row">
<div class="twelve columns"> <div class="ten columns">
<vs-input @search="onSearch" title="searching solr datasets" placeholder="Enter your search term..."></vs-input> <vs-input @search="onSearch" title="searching solr datasets" placeholder="Enter your search term..."></vs-input>
</div> </div>
</div> </div>
@ -84,9 +84,6 @@ export default App;
</script> </script>
<style lang="scss"> <style lang="scss">
.resultheader {
padding-left: 4%;
}
#app { #app {
color: #56b983; color: #56b983;
} }

59
resources/js/search/search-results/facet-category.vue
View File

@ -1,13 +1,18 @@
<template> <template>
<!-- <span>property: {{ filterName }}</span> <!-- <span>property: {{ filterName }}</span>-->
<span>value: {{ myLanguageFilters }}</span>-->
<div class="panel panel-primary"> <div class="panel panel-default">
<h3 class="panel-title filterViewModelName">{{ filterName }}</h3> <!-- <h3 class="panel-title filterViewModelName">{{ filterName }}</h3> -->
<!-- e.g.language --> <div class="panel-heading">
<ul class="filter-items" v-bind:class="{'limited':filterItems.length > 1 && collapsed }"> <h3 class="panel-title titlecase filterViewModelName">{{ filterName }}</h3>
<li v-for="(item, index) in filterItems" :key="index" class="list-group-item"> </div>
<!-- <input <div class="panel-body">
<!-- e.g.language -->
<ul class="filter-items list-unstyled" v-bind:class="{'limited':filterItems.length > 1 && collapsed }">
<li v-for="(item, index) in filterItems" :key="index" class="list-group-item titlecase">
<!-- <input
class="css-w1gpbi" class="css-w1gpbi"
name="language" name="language"
v-bind:id="item.value" v-bind:id="item.value"
@ -17,28 +22,32 @@
<label :for="item.value"> <label :for="item.value">
<span click: @click="activateItem(item)">{{ item.value }} ({{ item.count }})</span> <span click: @click="activateItem(item)">{{ item.value }} ({{ item.count }})</span>
</label>--> </label>-->
<a :class="item.Active ? 'disabled' : ''" @click.prevent="activateItem(item)">{{ item.value }} ({{ item.count }})</a> <span :class="item.Active ? 'disabled' : ''" @click.prevent="activateItem(item)">{{ item.value }}
</li> ({{ item.count }})
</ul> </span>
<ul class="overflowing" v-if="overflowing == true"> </li>
<li> </ul>
<span @click="toggle()">{{ uncollapseLabelText }}</span> <ul class="overflowing" v-if="overflowing == true">
</li> <li>
</ul> <span @click="toggle()">{{ uncollapseLabelText }}</span>
</li>
</ul>
</div>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import FacetCategory from "./facet-category-class"; import FacetCategory from "./facet-category-class";
export default FacetCategory; export default FacetCategory;
</script> </script>
<style scoped> <style scoped>
/* local styles */ /* local styles */
.disabled { .disabled {
/* color: #EBEBE4; */ /* color: #EBEBE4; */
color:lightgray; color: lightgray;
pointer-events: none; pointer-events: none;
text-decoration:line-through; text-decoration: line-through;
} }
</style> </style>

8
resources/js/search/search-results/vs-results.vue
View File

@ -35,11 +35,11 @@
</a> </a>
</h4> </h4>
<p>
<span v-if="document.author && document.author.length > 0" v-for="author in document.author"> <p v-if="document.author && document.author.length > 0">
<!-- <span>Author: {{ document.author.join(', ') }}</span> --> <!-- <span>Author: {{ document.author.join(', ') }}</span> -->
<span>{{ author }}; </span> <span v-for="(author,index) in document.author" :key="index">{{ author }}; </span>
</span> </p>
<!-- <p v-if="document.title_additional && document.title_additional.length > 0"> <!-- <p v-if="document.title_additional && document.title_additional.length > 0">

2
resources/js/search/text-search/vs-input.vue
View File

@ -16,7 +16,7 @@
/> />
<!-- <button @click="search()" class="css-1gklxk5 ekqohx90"> --> <!-- <button @click="search()" class="css-1gklxk5 ekqohx90"> -->
<button class="css-1gklxk5 ekqohx90"> <button class="search-button ekqohx90">
<svg <svg
alt="Search" alt="Search"
@click="search()" @click="search()"

2
resources/views/layouts/app.blade.php
View File

@ -57,7 +57,7 @@
<!-- Menu --> <!-- Menu -->
<header class="header"> <header class="header">
<nav class="navigation"> <nav class="navigation" id="nav">
<a href="#" class="menu-icon {{ Route::currentRouteName() != 'frontend.home.index' ? 'active' : '' }}""> <a href="#" class="menu-icon {{ Route::currentRouteName() != 'frontend.home.index' ? 'active' : '' }}"">
<i class=" fa fa-bars"></i> <i class=" fa fa-bars"></i>
</a> </a>