search
This commit is contained in:
Julie Blanc
parent
1b76727eff
commit
3c10e88b18
14 changed files with 272 additions and 139 deletions
|
|
@ -1,3 +1,4 @@
|
|||
@use "abstracts/mixins.scss" as *;
|
||||
|
||||
.page-header{
|
||||
// margin-top: calc(var(--spacing)*1);
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@use "abstracts/mixins.scss" as *;
|
||||
|
||||
#site-header{
|
||||
height: var(--header-h);
|
||||
width: 100vw;
|
||||
|
|
@ -38,52 +40,6 @@
|
|||
list-style: none;
|
||||
}
|
||||
|
||||
/*----------------*/
|
||||
/* search bar */
|
||||
/*----------------*/
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
height: calc(var(--unit)*1.5);
|
||||
flex-grow: 2;
|
||||
}
|
||||
|
||||
.search__toggle {
|
||||
display: none;
|
||||
}
|
||||
.search__label {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
width: calc(var(--unit)*1.5);
|
||||
height: calc(var(--unit)*1.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.search__input {
|
||||
display: none;
|
||||
}
|
||||
.search__icon{
|
||||
width: var(--unit);
|
||||
}
|
||||
|
||||
.search__icon--open {
|
||||
display: block;
|
||||
}
|
||||
.search__icon--close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search__toggle:checked ~ .search__input {
|
||||
display: block;
|
||||
}
|
||||
.search__toggle:checked ~ .search__label .search__icon--open {
|
||||
display: none;
|
||||
}
|
||||
.search__toggle:checked ~ .search__label .search__icon--close {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#btn__connexion{
|
||||
font-weight: 500;
|
||||
|
|
|
|||
|
|
@ -56,6 +56,7 @@
|
|||
--color-green-black: #016042;
|
||||
|
||||
--color-txt: rgb(41, 41, 41);
|
||||
--color-txt: #0D2846;
|
||||
--color-txt-light: #a5a9a9;
|
||||
--color-light: #DCDDDD;
|
||||
--color-x-light: #eaebeb;
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
height: calc(var(--unit)*1.5);
|
||||
|
||||
min-width: calc(var(--unit)*1.5);
|
||||
border-radius: var(--radius-btn);
|
||||
cursor: pointer;
|
||||
|
||||
|
|
|
|||
110
assets/css/components/_search.scss
Normal file
110
assets/css/components/_search.scss
Normal file
|
|
@ -0,0 +1,110 @@
|
|||
@use "../abstracts/mixins.scss" as *;
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
height: calc(var(--unit)*1.5);
|
||||
flex-grow: 2;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
gap: calc(var(--padding-inner)*0.5);
|
||||
|
||||
svg {
|
||||
@include icon(18px);
|
||||
stroke-width: 1px;
|
||||
stroke: var(--color-txt);
|
||||
}
|
||||
|
||||
|
||||
|
||||
.search__input-group {
|
||||
display: grid;
|
||||
grid-template-columns: var(--unit) 1fr;
|
||||
width: 100%;
|
||||
height: calc(var(--unit)*1.5);
|
||||
|
||||
|
||||
input {
|
||||
grid-column: 1/end;
|
||||
grid-row: 1;
|
||||
padding-left: calc(var(--padding-inner)*2.5);
|
||||
font-family: sans-serif;
|
||||
font-family: var(--font);
|
||||
font-size: var(--fs-normal);
|
||||
font-weight: 500;
|
||||
border-radius: var(--radius-small);
|
||||
border: 1px solid var(--color-txt-light);
|
||||
outline: none;
|
||||
|
||||
&::placeholder {
|
||||
font-family: var(--font);
|
||||
font-size: var(--fs-normal);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: 1px solid var(--color-violet);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
button {
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
z-index: 10;
|
||||
align-self: center;
|
||||
position: relative;
|
||||
left: 10px;
|
||||
top: 2px;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.search__icon {
|
||||
width: calc(var(--unit)*1.25);
|
||||
height: calc(var(--unit)*1.25);
|
||||
// background-color: red;
|
||||
border-radius: var(--radius-btn);
|
||||
border: 1px solid var(--color-txt);
|
||||
// background-color: var(--color-x-light);
|
||||
cursor: pointer;
|
||||
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-x-light);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
#search-toggle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
#search-toggle~[for="search-toggle"] .search__icon--open {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#search-toggle~[for="search-toggle"] .search__icon--close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#search-toggle~.search__input-group {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#search-toggle:checked~[for="search-toggle"] .search__icon--open {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#search-toggle:checked~[for="search-toggle"] .search__icon--close {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#search-toggle:checked~.search__input-group {
|
||||
display: grid;
|
||||
}
|
||||
|
|
@ -31,10 +31,7 @@
|
|||
}
|
||||
&:first-of-type::before{ border-color: var(--color-green-light);}
|
||||
|
||||
.chart-edit {
|
||||
display: block;
|
||||
margin-right: var(--padding-inner);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -96,4 +93,8 @@
|
|||
display: block!important;
|
||||
z-index: 30;
|
||||
}
|
||||
.taxon .chart-edit {
|
||||
display: block;
|
||||
margin-right: var(--padding-inner);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,6 +13,8 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
text-decoration: none;
|
||||
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
|
|
|
|||
|
|
@ -55,6 +55,11 @@
|
|||
|
||||
.species-list{
|
||||
margin-bottom: calc(var(--spacing)*3);
|
||||
|
||||
.taxon:hover{
|
||||
border-color: red!important;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.species-list .title{
|
||||
|
|
|
|||
174
assets/style.css
174
assets/style.css
|
|
@ -38,6 +38,7 @@
|
|||
--color-green-x-light: #eef7f4;
|
||||
--color-green-black: #016042;
|
||||
--color-txt: rgb(41, 41, 41);
|
||||
--color-txt: #0D2846;
|
||||
--color-txt-light: #a5a9a9;
|
||||
--color-light: #DCDDDD;
|
||||
--color-x-light: #eaebeb;
|
||||
|
|
@ -150,60 +151,6 @@ figure, picture, img {
|
|||
list-style: none;
|
||||
}
|
||||
|
||||
/*----------------*/
|
||||
/* search bar */
|
||||
/*----------------*/
|
||||
.search {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
height: calc(var(--unit) * 1.5);
|
||||
flex-grow: 2;
|
||||
}
|
||||
|
||||
.search__toggle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search__label {
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
user-select: none;
|
||||
width: calc(var(--unit) * 1.5);
|
||||
height: calc(var(--unit) * 1.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.search__input {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search__icon {
|
||||
width: var(--unit);
|
||||
}
|
||||
|
||||
.search__icon--open {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.search__icon--close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search__toggle:checked ~ .search__input {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.search__toggle:checked ~ .search__label .search__icon--open {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search__toggle:checked ~ .search__label .search__icon--close {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#btn__connexion {
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
|
|
@ -309,6 +256,108 @@ figure, picture, img {
|
|||
padding: var(--padding-body);
|
||||
}
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
height: calc(var(--unit) * 1.5);
|
||||
flex-grow: 2;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
gap: calc(var(--padding-inner) * 0.5);
|
||||
}
|
||||
.search svg {
|
||||
display: inline-block;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
.search svg svg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.search svg {
|
||||
stroke-width: 1px;
|
||||
stroke: var(--color-txt);
|
||||
}
|
||||
.search .search__input-group {
|
||||
display: grid;
|
||||
grid-template-columns: var(--unit) 1fr;
|
||||
width: 100%;
|
||||
height: calc(var(--unit) * 1.5);
|
||||
}
|
||||
.search .search__input-group input {
|
||||
grid-column: 1/end;
|
||||
grid-row: 1;
|
||||
padding-left: calc(var(--padding-inner) * 2.5);
|
||||
font-family: sans-serif;
|
||||
font-family: var(--font);
|
||||
font-size: var(--fs-normal);
|
||||
font-weight: 500;
|
||||
border-radius: var(--radius-small);
|
||||
border: 1px solid var(--color-txt-light);
|
||||
outline: none;
|
||||
}
|
||||
.search .search__input-group input::-moz-placeholder {
|
||||
font-family: var(--font);
|
||||
font-size: var(--fs-normal);
|
||||
}
|
||||
.search .search__input-group input::placeholder {
|
||||
font-family: var(--font);
|
||||
font-size: var(--fs-normal);
|
||||
}
|
||||
.search .search__input-group input:focus {
|
||||
outline: 1px solid var(--color-violet);
|
||||
}
|
||||
.search .search__input-group button {
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
z-index: 10;
|
||||
align-self: center;
|
||||
position: relative;
|
||||
left: 10px;
|
||||
top: 2px;
|
||||
}
|
||||
.search .search__icon {
|
||||
width: calc(var(--unit) * 1.25);
|
||||
height: calc(var(--unit) * 1.25);
|
||||
border-radius: var(--radius-btn);
|
||||
border: 1px solid var(--color-txt);
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.search .search__icon:hover {
|
||||
background-color: var(--color-x-light);
|
||||
}
|
||||
|
||||
#search-toggle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#search-toggle ~ [for=search-toggle] .search__icon--open {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#search-toggle ~ [for=search-toggle] .search__icon--close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#search-toggle ~ .search__input-group {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#search-toggle:checked ~ [for=search-toggle] .search__icon--open {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#search-toggle:checked ~ [for=search-toggle] .search__icon--close {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#search-toggle:checked ~ .search__input-group {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.btn--solid {
|
||||
font-weight: 600;
|
||||
font-size: 1.2rem;
|
||||
|
|
@ -318,6 +367,7 @@ figure, picture, img {
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
height: calc(var(--unit) * 1.5);
|
||||
min-width: calc(var(--unit) * 1.5);
|
||||
border-radius: var(--radius-btn);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -1546,13 +1596,6 @@ input#view-grid:checked ~ .view-toggle label[for=view-grid] svg {
|
|||
#view-list:checked ~ .page-species-list .species-list .taxon:first-of-type::before {
|
||||
border-color: var(--color-green-light);
|
||||
}
|
||||
#view-edit:checked ~ .page-species-list .family .species-list .taxon .chart-edit,
|
||||
#view-edit:checked ~ .page-species-list .species-list .taxon .chart-edit,
|
||||
#view-list:checked ~ .page-species-list .family .species-list .taxon .chart-edit,
|
||||
#view-list:checked ~ .page-species-list .species-list .taxon .chart-edit {
|
||||
display: block;
|
||||
margin-right: var(--padding-inner);
|
||||
}
|
||||
#view-edit:checked ~ .page-species-list .family .species-list .taxon figure,
|
||||
#view-edit:checked ~ .page-species-list .species-list .taxon figure,
|
||||
#view-list:checked ~ .page-species-list .family .species-list .taxon figure,
|
||||
|
|
@ -1644,6 +1687,11 @@ input#view-grid:checked ~ .view-toggle label[for=view-grid] svg {
|
|||
display: block !important;
|
||||
z-index: 30;
|
||||
}
|
||||
#view-edit:checked ~ .page-species-list .family .species-list .taxon .chart-edit,
|
||||
#view-edit:checked ~ .page-species-list .species-list .taxon .chart-edit {
|
||||
display: block;
|
||||
margin-right: var(--padding-inner);
|
||||
}
|
||||
|
||||
.item-nav {
|
||||
border: 1.5px solid var(--color-txt);
|
||||
|
|
@ -1655,6 +1703,7 @@ input#view-grid:checked ~ .view-toggle label[for=view-grid] svg {
|
|||
min-height: calc(var(--unit) * 5);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.item-nav .title {
|
||||
|
|
@ -1731,6 +1780,9 @@ input#view-grid:checked ~ .view-toggle label[for=view-grid] svg {
|
|||
#main_home .species-list {
|
||||
margin-bottom: calc(var(--spacing) * 3);
|
||||
}
|
||||
#main_home .species-list .taxon:hover {
|
||||
border-color: red !important;
|
||||
}
|
||||
#main_home .species-list .title {
|
||||
grid-column: 1/end;
|
||||
font-size: var(--fs-medium);
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -6,6 +6,7 @@
|
|||
@use "css/site-header";
|
||||
@use "css/site-nav";
|
||||
@use "css/site-footer";
|
||||
@use "css/components/search";
|
||||
@use "css/components/buttons";
|
||||
@use "css/components/slideshow";
|
||||
@use "css/components/logos-container";
|
||||
|
|
|
|||
|
|
@ -1,3 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
|
||||
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0"/>
|
||||
</svg>
|
||||
<svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="m15.97 17.031c-1.479 1.238-3.384 1.985-5.461 1.985-4.697 0-8.509-3.812-8.509-8.508s3.812-8.508 8.509-8.508c4.695 0 8.508 3.812 8.508 8.508 0 2.078-.747 3.984-1.985 5.461l4.749 4.75c.146.146.219.338.219.531 0 .587-.537.75-.75.75-.192 0-.384-.073-.531-.22zm-5.461-13.53c-3.868 0-7.007 3.14-7.007 7.007s3.139 7.007 7.007 7.007c3.866 0 7.007-3.14 7.007-7.007s-3.141-7.007-7.007-7.007z" fill-rule="nonzero"/></svg>
|
||||
|
Before Width: | Height: | Size: 315 B After Width: | Height: | Size: 564 B |
|
|
@ -1,8 +1,14 @@
|
|||
<div class="search">
|
||||
<input type="checkbox" id="search-toggle" class="search__toggle">
|
||||
<label for="search-toggle" class="search__label">
|
||||
|
||||
|
||||
<label for="search-toggle">
|
||||
<span class="search__icon search__icon--open"><include src="/components/icons/search.svg"></include></span>
|
||||
<span class="search__icon search__icon--close"><include src="/components/icons/x-lg.svg"></include></span>
|
||||
</label>
|
||||
<input type="text" class="search__input" placeholder="Recherchez une plante ou un livret">
|
||||
</label>
|
||||
|
||||
<div class="search__input-group">
|
||||
<button><include src="/components/icons/search.svg"></include></button>
|
||||
<input type="text" id="search__input" placeholder="Recherchez une plante ou un livret">
|
||||
</div>
|
||||
</div>
|
||||
40
index.html
40
index.html
|
|
@ -71,18 +71,18 @@
|
|||
|
||||
|
||||
<div class="item-nav__group">
|
||||
<div class="item-nav">
|
||||
<a href="#" class="item-nav">
|
||||
<h3 class="title">Consulter des livrets</h3>
|
||||
<p class="description">Consultez et téléchargez librement les livrets existants.</p>
|
||||
<button class="btn--go-to">→</button>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="item-nav">
|
||||
<a href="#" class="item-nav">
|
||||
<h3 class="title">Créer un livret</h3>
|
||||
<p class="description">À partir d’une liste d’espèces, générez un livret avec
|
||||
sa clé de détermination.</p>
|
||||
<button class="btn--go-to">→</button>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -132,19 +132,19 @@
|
|||
|
||||
<div class="item-nav__group">
|
||||
|
||||
<div class="item-nav">
|
||||
<a href="#" class="item-nav">
|
||||
<h3 class="title">Organiser une animation</h3>
|
||||
<p class="description">Trouvez des exemples d’activités mobilisant un livret et explorer les
|
||||
kits pédagogiques.</p>
|
||||
<button class="btn--go-to">→</button>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="item-nav">
|
||||
<a href="#"class="item-nav">
|
||||
<h3 class="title">Organiser un atelier supervisé</h3>
|
||||
<p class="description">Appuyez vos enseignements en faisant contribuer vos apprenants à la
|
||||
base de connaissance.</p>
|
||||
<button class="btn--go-to">→</button>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
||||
|
|
@ -204,18 +204,18 @@
|
|||
|
||||
<div class="item-nav__group">
|
||||
|
||||
<div class="item-nav">
|
||||
<a href="/species-list.html" class="item-nav">
|
||||
<h3 class="title">Explorer les espèces</h3>
|
||||
<p class="description">Accédez à l'ensemble de la base ou consultez et téléchargez les
|
||||
fiches des espèces vérifiées.</p>
|
||||
<button class="btn--go-to">→</button>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="item-nav">
|
||||
<a href="#" class="item-nav">
|
||||
<h3 class="title">Contribuer à la base de connaissance</h3>
|
||||
<p class="description">Enrichir ou relire, botanistes avertis, contactez-nous ! </p>
|
||||
<button class="btn--go-to">→</button>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
@ -230,7 +230,7 @@
|
|||
<img src="/images/Acorus_calamus_morphology_outlook_illustration_photo.png">
|
||||
</figure>
|
||||
<div class="name">
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Acore odorant</a></h3>
|
||||
<h3 class="vernacular"><a href="/species-single.html" target="_blank">Acore odorant</a></h3>
|
||||
<p class="latin">Acorus calamus L.</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -239,7 +239,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
<a class="link-block" href="/species-single.html" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
|
||||
|
|
@ -249,7 +249,7 @@
|
|||
<img src="/images/Alnus_glutinosa_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<div class="name">
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Aulne glutineux</a></h3>
|
||||
<h3 class="vernacular"><a href="/species-single.html" target="_blank">Aulne glutineux</a></h3>
|
||||
<p class="latin">Alnus glutinosa</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -260,7 +260,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
<a class="link-block" href="/species-single.html" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
|
|
@ -268,7 +268,7 @@
|
|||
<img src="/images/Alnus_glutinosa_morphology_outlook_illustration_photo.jpeg">
|
||||
</figure>
|
||||
<div class="name">
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Aulne glutineux</a></h3>
|
||||
<h3 class="vernacular"><a href="/species-single.html" target="_blank">Aulne glutineux</a></h3>
|
||||
<p class="latin">Alnus glutinosa</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -279,7 +279,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
<a class="link-block" href="/species-single.html" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
<article class="taxon">
|
||||
|
|
@ -287,7 +287,7 @@
|
|||
<img src="/images/Arum_italicum_morphology_outlook_illustration_photo.png">
|
||||
</figure>
|
||||
<div class="name">
|
||||
<h3 class="vernacular"><a href="#" target="_blank">Gouet d'Italie</a></h3>
|
||||
<h3 class="vernacular"><a href="/species-single.html" target="_blank">Gouet d'Italie</a></h3>
|
||||
<p class="latin">Arum Italicum Mill.</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -298,7 +298,7 @@
|
|||
<button class="btn-edit">
|
||||
<include src="/components/icons/edit.svg"></include>
|
||||
</button>
|
||||
<a class="link-block" href="#" target="_blank"></a>
|
||||
<a class="link-block" href="/species-single.html" target="_blank"></a>
|
||||
</article>
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue