Job posts
Na ovoj stranici možete pogledati spisak i opise aktivnih poslova i poslati ponudu direktno na stranici
Kreiranje login ikone u mobilnom meniju
- Backend Development
- PHP
U postojeći mobilni meni je potrebno dodati login ikonicu koja će voditi na login stranicu.
Login ikonica treba da se nalazi između logotipa (sa leve strane) i mobilnog menija – hamburger ikonice (sa desne strane). Desktop i mobilni meni kreirani su u OceanWP temi. Tačan PHP fajl u kojem je potrebno izmeniti kod kao i testno okruženje (staging) su obezbeđeni.
Na fotografiji ispod ilustrovano je rešenje.
U kontakt formi pored je moguće navesti deadline i cenu usluge da se ovo uradi. Takođe, ukoliko imate dodatnih pitanja ili ako smo mi zaboravili da nešto navedemo u opisu, slovodno napišite u delu “poruka”.
Hvala unapred na izdvojenom vremenu.
CSS tranzicija na hover preko dugmeta
- Frontend Development
- CSS
- CSS-Transitions
Potrebno je implementirati CSS hover animaciju na Contact Form 7 submit dugme i na Elementor form subscribe dugme.
Ovo je animacija koju je potrebno napraviti:
Na linku ispod je moguće pogledati stranicu sa elementima na koje je potrebno primeniti animaciju.
https://biocodis.com/test-page/
Na sajtu se koristi Elementor builder, ukoliko Vam je ova informacija bitna.
Prvi problem koji je bilo potrebno rešiti je da se zameni dugme submit sa < button > elementom, kako bi u njega mogao da se ubaci još jedan < span > element kako bi tekst mogao da ima veći z-index od pozadine dugmeta. Ovo je postignuto sa prostim ubacivanjem < button id=’submit’>< span>Send</span></button> umesto [submit] elementa, jer id trigeruje slanje forme.
Kod animacije na dugmetu koje koristimo na celom sajtu i koja treba da se primeni i na ova tri dugmeta (da malo olakšamo stvari):
.oew-btn-effect-8 a {
border: 1px solid rgba(0,0,0,0.2);
position: relative;
}
.oew-btn-effect-8 a span {
position: relative;
z-index: 2;
}
.oew-btn-effect-8 a::before {
content: ”;
position: absolute;
top: 0;
left: 0;
width: 0%;
height: 100%;
z-index: 1;
opacity: 0;
background-color: rgba(0,0,0,0.2);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.oew-btn-effect-8 a:hover::before {
opacity: 1;
width: 100%;
}
Ovo je kod koji smo napisali. Ostalo nam je da rešimo problem sa z-index-om teksta koji ne ide preko animirane pozadine dugmeta, već ispod, kao i blaža ease-in tranzicija sa plave na narandžastu tokom animacije. (selektor je neophodan zbog Elementora, ne morate obraćati pažnju na njega, jer se ne prikazuje na stranici)
selector button {
position: relative;
font-family: “Open Sans”, Sans-serif;
font-size: 18px;
font-weight: 600;
line-height: 18px;
color: #FFFFFF;
border-radius: 3px 3px 3px 3px;
padding: 10px 20px 10px 20px;
border: none;
background-color: #0D9FEC;
}
selector button span {
z-index: 2;
}
selector button::before {
content: ”;
position: absolute;
top: 0;
left: 0;
width: 0%;
height: 100%;
z-index: 1;
background-color: rgba(242,157,23,1);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
border-radius: 3px;
}
selector button:hover::before {
opacity: 1;
width: 100%;
}
Potrebno je popuniti kontakt formu pored kako biste nam poslali ponudu.
Hvala unapred na izdvojenom vremenu.
Izmena LearnDash Focus mode-a
- LearnDash
- Backend Development
- PHP
- Naziv kursa potrebno je pozicionirati u gornjem levom uglu iznad navigacionog sidebar-a. Klikom na naziv vraćamo se na glavnu stranicu kursa.
- "Previous" i "Next" dugme koje vodi na prethodnu i sledeću lekciju, potrebno je pozicionirati u deo sadržaja (koji je rađen u elementor builder-u) i to sa desne strane naziva lekcije. Trenutno je zamišljeno da se u delu sadržaja svake lekcije na vrhu nalazi video, zatim sledi naziv lekcije (sa leve strane) i next i previous dugmići (sa desne strane), a ispod toga dalji sadržaj u vidu teksta.
Na sledećem linku možete videti trenutni izgled focus mode-a: https://biocodis.com/modules/module-1-defining-balance-what-balance-is-and-is-not/
U kontakt formi pored je moguće navesti deadline i cenu usluge da se ovo uradi.
Hvala unapred na izdvojenom vremenu.
