UI style guide

Lorem ipsum dolor sit amet, consectetur adipiscing elit

  • consectetur adipiscing elit
  • consectetur adipiscing elit
  • consectetur adipiscing elit
  • consectetur adipiscing elit

Lorem ipsum dolor sit amet, consectetur adipiscing
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Icon with text

Elements


Colors

Headings

Buttons

Buttonite datas peavad olema järgmised parameetrid:

  • title: Click me!
  • url: https://neti.ee

Ainult nende kahe olemasolul tekib default stiiliga button, mis näeb välja selline:

Click me!

Teised kasulikud parameetrid

  • size: lg
  • color: light
  • target: _blank (avab lehe uues aknas)
  • onclick: function()
  • disabled: true

Näited:

color: 'dark' (default)color: 'light'disabled: true
default suurusLogi sisseLogi sisseLogi sisse
size: 'sm'Logi sisseLogi sisseLogi sisse
size: 'md'Logi sisseLogi sisseLogi sisse
size: 'lg'Logi sisseLogi sisseLogi sisse

Tooltips

Alerts

Steps

Statuses

Components


Pills

Accordion

Pellentesque sed velit ex.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In nec mauris nec diam ornare consequat quis pretium neque. Nulla purus elit, commodo a diam ac, sodales cursus odio. Suspen disse potenti. Cras at metus id eros malesuada venenatis quis imperdiet dui. Duis fringilla, odio cursus tempor iaculis, enim tortor finibus ligula, sit amet cursus urna nisi ac mauris.

Donec nec est libero.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In nec mauris nec diam ornare consequat quis pretium neque. Nulla purus elit, commodo a diam ac, sodales cursus odio. Suspen disse potenti. Cras at metus id eros malesuada venenatis quis imperdiet dui. Duis fringilla, odio cursus tempor iaculis, enim tortor finibus ligula, sit amet cursus urna nisi ac mauris.

Donec nec est libero.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In nec mauris nec diam ornare consequat quis pretium neque. Nulla purus elit, commodo a diam ac, sodales cursus odio. Suspen disse potenti. Cras at metus id eros malesuada venenatis quis imperdiet dui. Duis fringilla, odio cursus tempor iaculis, enim tortor finibus ligula, sit amet cursus urna nisi ac mauris.

Youtube

Layouts


textBlockInOneColumn

Textblocki columnite arv sõltub sellest, kui mitu kirjet on dataga kaasa antud. Kui üks, siis näeb välja selline. All on näha ka kui kirjeid on rohkem. Teine parameeter on teksti keskele joondamiseks. Praegu toetab kuni 4 kirjet.

textBlockInTwoColumns

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Sed do eiusmod tempor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

textBlock many columns

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Sed do eiusmod tempor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Sed do eiusmod tempor

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

textBlockWithTitle

Pealkiri

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Article

Kasutame koduturu investeerimisvõimalusi
Andres Viisemann, LHV pensionifondide juht

LHV valikus nüüd ka passiivsed pensionifondid
Oktoober oli väärtpaberiturgudel küllaltki huvitav kuu. Riskivabade võlakirjade intressimäärad pöörasid pärast pikaajalist peaaegu ühtlast langust tõusule ning ka aktsiaturgudel vahetusid investorite lemmikud: tehnoloogiasektorilt võttis teatepulga üle pangandussektor. Euroopa pangandussektori aktsiate väärtus tõusis oktoobris 8,7% ja USA pangandussektori indeks 4,5%.

Disclaimer

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

IconText

Default: iconText(data)

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Kahes tulbas: iconText(data, true)

Kui teine parameeter on true, siis blokid paigutatakse kahte tulpa võrdselt.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Kahes tulbas, tulpades erinev arv blokke: iconText(data, true, 3)

Kolmas parameeter paigutab valitud arvu blokke esimesse tulpa. Kui parameeter jätta false või seda üldse mitte anda, siis jaotatakse tulbad võrdselt.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ikoonid elements kaustast: iconText(data, true, false, true)

Neljas parameeter true võtab ikoonid elements kaustast ning väiksematel ekraanidel need ikoonid ei muuda suurust.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

What is Lorem Ipsum?

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Muudatused, mis tulevad data failist

Datas võib olla defineeritud lisaks textile, tiitlile ja ikoonile veel teisigi väärtusi:

secondColumnText

Kui data failis on secondColumnText defineeritud, siis tekib tavalise teksti kõrvale veel teine tulp.

Text teises tulbas pole üldsegi lühike.

links

Kui data failis on links defineeritud, siis tekivad teksti alla lingid. Linke võib ka lihtsalt teksti lõppi panna.

Loe edasi
Loe lisa

processList

  • What is Lorem Ipsum?
    Lorem ipsum dolor sit amet.

  • What is Lorem Ipsum?
    Lorem ipsum dolor email@email.ee,

    • Lorem ipsum dolor sit amet, consectetur adipiscing elit
    • Lorem ipsum dolor sit amet, consectetur adipiscing elit
  • What is Lorem Ipsum?
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  • What is Lorem Ipsum?
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  • What is Lorem Ipsum?
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  • Väljamakse
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lists

  • Viipemakse võimalusega krediitkaart
  • Reisikindlustus kogu perele
  • Estravel Platinum Clubi liikmelisus
  • Priority Pass – piiramatu külastusega
  • Ostukindlustus
  • Intress 14%
  • Intressivaba periood kuni 40 päeva

News

contactThumbnail

Meelis Liivak

korporatiivpanganduse kliendihaldur

680 2761

680 2761

meelis.liivak@lhv.ee

Urmas Tsahkna

korporatiivpanganduse juht

680 2752

680 2752

urmas.tsahkna@lhv.ee

Raine Remmelg

ärilaenu projektijuht

684 6118

684 6118

raine.remmelg@lhv.ee

Raine Remmelg

ärilaenu projektijuht

684 6118

684 6118

raine.remmelg@lhv.ee

singleContact

LHV klienditugi
E–R 9–19, L 10–17 *
6 800 400
Skype
Vestlus klienditoega
info@lhv.ee

cardContacts

Andres Viisemann

nõukogu liige

aktiivsete fondide fondijuht

andres.viisemann@lhv.eeclose icon

Joel Kukemelk

juhatuse liige / passiivsete fondide fondijuht

joel.kukemelk@lhv.eeclose icon

featuredProducts

Tables


conditionsTable

Võimalus expandable rida teha

Tavaline tekst siin ning kui lisada [. . .] ilma tühikuteta punktide vahel teksti sisse ning (. . .) ilma tühikuteta punktide vahel teksti lõppu siis nende kahe vaheline osa läheb expandi. Näiteks niimoodi:

See tekst siin on alguses peidus.

Laenusumma

Alates 20 000 eurost, kuni 85% tagatise turuväärtusest. Laenu- ja liisingumaksete kogusumma võib olla kuni 50% netosissetulekust. Tegelik maksimaalne laenumaksete määr sõltub sissetuleku suurusest ja pereliikmete arvust

Laenuperiood

Kuni 30 aastat

Intress

Alates 2,1% + Euribor

Lepingu muutmine

Lepingu muutmine 100 eurot

Lepingu lõpetamine

Tasuta

Lepingutasu

0,5–0,9% laenusummast

Maksepuhkus

Kuni 12 kuud

Omafinantseering

Minimaalselt 15% või lisatagatis

Tagatis

Heas seisukorras ja likviidne kinnisvara Tallinnas, Tartus või nende lähiümbruses. Finantseerime kuni 85% tagatise turuväärtusest. Täpne tagatise aktsepteerimise määr sõltub tagatise asukohast ja seisukorrast

Nõuded taotlejale

Enne laenuotsuse langetamist analüüsime sinu krediidivõimekust, maksekäitumise ajalugu ja tagatise sobivust.

  • Täisealine Eesti kodanik või pikaajalise elamisloaga isik
  • Viimase kolme aasta jooksul ei ole olnud maksehäireid
  • Saada aadressile eralaen@lhv.ee ostetava vara hindamisakt või müügikuulutuse link ja viimase 6 kuu digitaalselt allkirjastatud konto väljavõte (kui sa ei ole LHV klient).
  • Laenu saamiseks tuleb sõlmida tagatisvara kindlustusleping ja saata kindlustuspoliis aadressile eralaen@lhv.ee

Kinnisvara hindajad

1Partner Kinnisvara OÜ, Arco Vara, Colliers International Advisors, Domus Kinnisvara, DTZ Kinnisvaraekspert, Eri Kinnisvara, Kaanon Kinnisvara, LVM Kinnisvara, Newsec Valuation EE OÜ, Ober Haus, Pindi Kinnisvara, RE Kinnisvara, Seven Kinnisvarakonsultandid, Tõnisson Kinnisvara, Ühinenud kinnisvarakonsultandid, UusMaa Kinnisvarabüroo

Võimalus lisada rohkem tuplasid

Laenuperiood

Kuni 30 aastat

Kuni 30 aastat

Intress

Alates 2,1% + Euribor

Alates 2,1% + Euribor

Lepingu muutmine

Lepingu muutmine 100 eurot

Lepingu muutmine 100 eurot

tableInCurtain

Forms


Graphs


Bar chart (Võrdle tootluseid)

Widgets


Calculators

Leia sobiv fond

Modals

Iconography


Icons

0-eur.svg0-eur.svg
1-place.svg1-place.svg
2-place.svg2-place.svg
3-place.svg3-place.svg
1999.svg1999.svg
2002.svg2002.svg
2005.svg2005.svg
2009.svg2009.svg
2010.svg2010.svg
2011.svg2011.svg
2013.svg2013.svg
2014.svg2014.svg
2015.svg2015.svg
2016.svg2016.svg
2017.svg2017.svg
2018.svg2018.svg
abc.svgabc.svg
aid.svgaid.svg
amount.svgamount.svg
atm.svgatm.svg
ball.svgball.svg
balloon.svgballoon.svg
bars.svgbars.svg
board-abc.svgboard-abc.svg
board-graph.svgboard-graph.svg
bonus.svgbonus.svg
book.svgbook.svg
books.svgbooks.svg
box-move.svgbox-move.svg
box-transparent.svgbox-transparent.svg
box.svgbox.svg
boxes.svgboxes.svg
business-case-euro.svgbusiness-case-euro.svg
business.svgbusiness.svg
cancel.svgcancel.svg
candy.svgcandy.svg
car.svgcar.svg
card-b-side.svgcard-b-side.svg
card-by-mail.svgcard-by-mail.svg
charge.svgcharge.svg
check.svgcheck.svg
checklist.svgchecklist.svg
clothingandaccessories.svgclothingandaccessories.svg
club-card.svgclub-card.svg
coffee.svgcoffee.svg
construction.svgconstruction.svg
cosmetics.svgcosmetics.svg
currency-dollar.svgcurrency-dollar.svg
currency-euro.svgcurrency-euro.svg
currency-pound.svgcurrency-pound.svg
document-done.svgdocument-done.svg
document.svgdocument.svg
documents-4.svgdocuments-4.svg
documents-done.svgdocuments-done.svg
documents.svgdocuments.svg
electronics.svgelectronics.svg
envelope-open-idea.svgenvelope-open-idea.svg
envelope-open.svgenvelope-open.svg
envelope.svgenvelope.svg
europa.svgeuropa.svg
fingers-1.svgfingers-1.svg
fingers-2.svgfingers-2.svg
fingers-3.svgfingers-3.svg
flag.svgflag.svg
flexible-2.svgflexible-2.svg
flexible.svgflexible.svg
football.svgfootball.svg
forward.svgforward.svg
furnitureandinterior.svgfurnitureandinterior.svg
gardenandforest.svggardenandforest.svg
gift.svggift.svg
hammer.svghammer.svg
hand.svghand.svg
healthandbeauty.svghealthandbeauty.svg
heating.svgheating.svg
home.svghome.svg
hometechnology.svghometechnology.svg
ii.svgii.svg
iii.svgiii.svg
infinity.svginfinity.svg
invoice.svginvoice.svg
keys.svgkeys.svg
kids.svgkids.svg
l.svgl.svg
laptop-left.svglaptop-left.svg
legal.svglegal.svg
lhv.svglhv.svg
link.svglink.svg
lock.svglock.svg
m.svgm.svg
measure.svgmeasure.svg
medicine.svgmedicine.svg
mixer.svgmixer.svg
more.svgmore.svg
moto.svgmoto.svg
nfc.svgnfc.svg
offer-charlot.svgoffer-charlot.svg
offer-compucash.svgoffer-compucash.svg
offer-elitec.svgoffer-elitec.svg
offer-erply-books.svgoffer-erply-books.svg
offer-erply.svgoffer-erply.svg
offer-folder.svgoffer-folder.svg
offer-silptree.svgoffer-silptree.svg
paint-roller.svgpaint-roller.svg
palm.svgpalm.svg
paper-plane.svgpaper-plane.svg
paw.svgpaw.svg
payment.svgpayment.svg
pension-ii.svgpension-ii.svg
pension-iii.svgpension-iii.svg
pension-indeks-pluss.svgpension-indeks-pluss.svg
pension-taiendav.svgpension-taiendav.svg
pensionifond-25.svgpensionifond-25.svg
pensionifond-50.svgpensionifond-50.svg
pensionifond-indeks-pluss.svgpensionifond-indeks-pluss.svg
pensionifond-indeks.svgpensionifond-indeks.svg
pensionifond-intress.svgpensionifond-intress.svg
pensionifond-l.svgpensionifond-l.svg
pensionifond-m.svgpensionifond-m.svg
pensionifond-pension-25.svgpensionifond-pension-25.svg
pensionifond-pension-50.svgpensionifond-pension-50.svg
pensionifond-pension-intress.svgpensionifond-pension-intress.svg
pensionifond-s.svgpensionifond-s.svg
pensionifond-taiendav.svgpensionifond-taiendav.svg
pensionifond-xl.svgpensionifond-xl.svg
pensionifond-xs-s.svgpensionifond-xs-s.svg
pensionifond-xs.svgpensionifond-xs.svg
pets.svgpets.svg
pie.svgpie.svg
pin.svgpin.svg
play.svgplay.svg
pluss1.svgpluss1.svg
prize.svgprize.svg
procent.svgprocent.svg
question.svgquestion.svg
realestate.svgrealestate.svg
rocket.svgrocket.svg
s.svgs.svg
service.svgservice.svg
settings-wheel.svgsettings-wheel.svg
settings.svgsettings.svg
share.svgshare.svg
sigma.svgsigma.svg
skateboard.svgskateboard.svg
sofa.svgsofa.svg
sportandhobby.svgsportandhobby.svg
star.svgstar.svg
stock-portfolio.svgstock-portfolio.svg
stocks-up.svgstocks-up.svg
strawberry.svgstrawberry.svg
sync-2.svgsync-2.svg
sync-3.svgsync-3.svg
sync.svgsync.svg
t-shirt.svgt-shirt.svg
target-board.svgtarget-board.svg
target.svgtarget.svg
teddy.svgteddy.svg
temperature.svgtemperature.svg
think.svgthink.svg
tools.svgtools.svg
transfer-cloud-done.svgtransfer-cloud-done.svg
transfer-coud.svgtransfer-coud.svg
transfer-frw.svgtransfer-frw.svg
transfer-money.svgtransfer-money.svg
transfer-up.svgtransfer-up.svg
transferwise.svgtransferwise.svg
travelandvacation.svgtravelandvacation.svg
trophy.svgtrophy.svg
tv.svgtv.svg
umbrella.svgumbrella.svg
unlocked.svgunlocked.svg
user-find.svguser-find.svg
user.svguser.svg
value-up.svgvalue-up.svg
value.svgvalue.svg
winner.svgwinner.svg
world-atlantic.svgworld-atlantic.svg
world-europe.svgworld-europe.svg
world-map.svgworld-map.svg
world-middle-east.svgworld-middle-east.svg
world-pacific.svgworld-pacific.svg
world.svgworld.svg
check.svgcheck.svg
play.svgplay.svg
i.svgi.svg
q.svgq.svg
switch.svgswitch.svg

Elements

arrow_circle_hover_back.svgarrow_circle_hover_back.svg
arrow_circle_hover.svgarrow_circle_hover.svg
arrow_circle_still_back.svgarrow_circle_still_back.svg
arrow_circle_still.svgarrow_circle_still.svg
check.svgcheck.svg
close.svgclose.svg
lens.svglens.svg
icon-android.svgicon-android.svg
icon-browser-play.svgicon-browser-play.svg
icon-browser.svgicon-browser.svg
icon-ios.svgicon-ios.svg
icon-laptop-play.svgicon-laptop-play.svg
icon-laptop.svgicon-laptop.svg
icon-mobile-play.svgicon-mobile-play.svg
icon-mobile.svgicon-mobile.svg
m-arrow-down.svgm-arrow-down.svg
m-arrow-up.svgm-arrow-up.svg
m-close.svgm-close.svg
m-footer-minus.svgm-footer-minus.svg
m-footer-pluss.svgm-footer-pluss.svg
m-menu-minus.svgm-menu-minus.svg
m-menu-pluss.svgm-menu-pluss.svg
m-open.svgm-open.svg
map-marker-euronics.svgmap-marker-euronics.svg
map-marker-lhv.svgmap-marker-lhv.svg
map-marker-mobile.svgmap-marker-mobile.svg
map-marker-selver.svgmap-marker-selver.svg
map-marker.svgmap-marker.svg
play-video-light.svgplay-video-light.svg
play-video.svgplay-video.svg

Infographics