Comments (11)
HI @Fazarel
In simplesearch_item you already have this on banner {% set banner = page.media[page.header.primaryImage].loading('lazy').html(page.title,page.title)|raw ?: page.media.images|first %}
with |raw filter.
What's wrong? Can you upload a screenshot with the issue?
from grav-theme-future2021.
Maybe you mean when the first image is taken by default?
from grav-theme-future2021.
Demo content, grav and theme up to date.
With <a href="{{ page.url }}">{{ banner }}</a>
:
With <a href="{{ page.url }}">{{ banner|raw }}</a>
:
from grav-theme-future2021.
Could you test the last simplesearch_item.html.twig from the main branch ?.
This file was modified in the last month for the next version of the theme.
from grav-theme-future2021.
Sorry, test it from the develop branch.
from grav-theme-future2021.
I've also made some modifications on that file as I experienced problems initially. See #25
Not this topic, but also concerns simplesearch_item.html.twig:
if <p>{{ page.summary|truncate(200)|raw }}</p>
ends in a table the whole result layout gets messed up. Therefore I disabled the line on my page and don't show any content, but only the image and the header.
from grav-theme-future2021.
@pikim could you upload a screenshot about this issue. I'd like to see it.
from grav-theme-future2021.
Not this topic, but also concerns simplesearch_item.html.twig: if
<p>{{ page.summary|truncate(200)|raw }}</p>
ends in a table the whole result layout gets messed up. Therefore I disabled the line on my page and don't show any content, but only the image and the header.
Similar problem with <p>{{ page.summary|truncate(200)|raw }}</p>
. If cut ends in a url, layout messed up. I removed |truncate(200)
filter, so summary size is now controlled by /user/env/site.test/config/site.yaml. In this case, I don't know why, no problem if summary ends in a middle of a link (the word is cut but the link works and the layout is preserved).
from grav-theme-future2021.
Sorry, test it from the develop branch.
Works with simplesearch_item.html.twig from develop branch.
But .cropZoom(100,100)
is redundant with custom.css (maybe misc.css in the future):
/* Styles to support svg images in search results */
.search-row {
display: flex;
align-items: top;
}
.search-image img {
overflow:hidden;
width: 100px;
height: 100px;
object-fit: cover;
object-position: 0 100%;
}
@media only all and (max-width: 47.938em) {
.search-image img {display:none;}
}
.search-item {
margin-left: 30px;
margin-bottom: 50px;
}
from grav-theme-future2021.
Yes. I know. I will remove width and height from CSS.
from grav-theme-future2021.
@pikim could you upload a screenshot about this issue. I'd like to see it.
@pmoreno-rodriguez
When I use your current develop branch (from 2 minutes ago) it looks like this:
The image is too wide, there is no separation line between results and search results are cascaded due to corrupted tables.
from grav-theme-future2021.
Related Issues (20)
- Issues with login HOT 4
- HTML/CSS bugs HOT 9
- Issues with breadcrumbs and pagination in blog HOT 1
- Social Icons not visible HOT 10
- Bug with new "Show Image" functionality in default.html.twig HOT 3
- No Sidebar with demo files. HOT 5
- Faulty heading formatting HOT 6
- Width issue HOT 10
- Miniposts Template uses page object, instead of minipost object to parse date HOT 2
- Donation BuyMeACoffee HOT 3
- Sticky menu for blog posts HOT 7
- Suggestion: serve google fonts locally HOT 1
- How to properly delete the right toolbar ? HOT 5
- Cannot show any entry inside the "Featured" section HOT 4
- sort filter causes error when taxonomy is empty HOT 2
- suggestion HOT 2
- Improve Portfolio customization HOT 1
- Logo in image format to be implemented in the header HOT 2
- Demo site HOT 2
- Remove the menu 'hamburger' from the top bar HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from grav-theme-future2021.