Neculai Fântânaru
Everything Depends On The Leader
Everything Depends On The Leader
You can view the full code here:https://pastebin.com/mz8vdiM2
CSS CODE:
* { margin: 0; padding: 0; text-rendering: optimizelegibility; } .category-wrapper { background: #15202a; max-height: 100px; height: 100px; display: flex; align-items: center; font-family: "Source Sans Pro", 'Helvetica Neue', Helvetica, Arial, sans-serif; } .category-section { background: #15202a; padding: 10px; width: 230px; box-sizing: border-box; margin-top: 5px; transition: 2s; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-weight: 400; } .category-details-main { display: none; } .category-section .category-intro { font-weight: 700; font-size: 15px; color: #fff; margin: 0; text-shadow: 1px 1px 10px rgb(0 0 0 / 50%); } .category-intro+p { margin-bottom: 3px; margin-top:8px; line-height: 18px; text-shadow: 1px 1px 10px rgb(0 0 0 / 50%); } .category-section ul { margin: 0 0 20px; padding: 10px 0 0; line-height: 23px; list-style: none; font-size: 14px !important; list-style: none; font-weight: 500; text-shadow: 1px 1px 10px rgb(0 0 0 / 50%); } .category-section p, .category-section ul { text-align: left; color: RGBA(255,255,255,.75); font-size: 11px !important; } .category-section a.button, .category__home-button { background: #ffc43a; border-radius: 3px; display: block; color: #2b1d00; font-weight: 600; margin-top: 10px; font-size: 14px; padding: 3px; -webkit-box-shadow: 0 2px 2px RGBA(0, 0, 0, .95); box-shadow: 0 2px 2px RGBA(0, 0, 0, .95); text-align: center; margin: 10px; } .category-section .button { margin: 0 !important; text-align: center; } .category-section a.button, .category__home-button { padding: 10px 10px; line-height: 20px !important; } .category-wrapper a { text-decoration: none; } .category-section .icon-right { display: none; } .category-section:hover .icon-down { display: none; } .category-section:hover .icon-right { display: inline; } .category-section:hover .category-details-main { display: block; } .category-section:hover { position: relative; top: 90px } .category-section .category-intro { font-weight: 700; font-size: 14px !important; color: #fff; margin: 0; line-height: 24px; color: RGBA(255, 255, 255, 0.95); }
HTML CODE:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Button</title> </head> <body> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="style.css"> </head> <body> <div class="category-wrapper"> <div class="category-section"> <div class="category-details-main"> <div class="category-details"> <p class="category-intro">Where does it come from?</p> <p class="category-intro--mobile-hidden">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 2000s, when an unknown printer took a galley of type and scrambled.</p> <ul class="category-intro--mobile-hidden"> <li>Option 1: SU23-NUMBER</li> <li>Always Here Myself</li> </ul> </div> </div> <a href="https://YOURLINK.com" class="button">Trimite <i class="fa fa-chevron-down icon-down" aria-hidden="true"></i><i class="fa fa-chevron-right icon-right" aria-hidden="true"></i></a> </div> </div> </body> </html> </body> </html>
That's all folks.
If you like my code, then make me a favor: translate your website into Romanian, "ro".
Also, see this VERSION 2 or VERSION 3 or VERSION 4 or VERSION 5 or VERSION 6 or VERSION 7
Why read this book? Because it is critical to optimizing your performance. Because it reveals the main coordinates after that are build the character and skills of the leaders, highlighting what it is important for them to increase their influence.
The essential characteristic of this book in comparison with others on the market in the same domain is that it describes through examples the ideal competences of a leader. I never claimed that it's easy to become a good leader, but if people will...
For some leaders, "leading" resembles more to a chess game, a game of cleverness and perspicacity; for others it means a game of chance, a game they think they can win every time risking and betting everything on a single card.
I wrote this book that conjoins in a simple way personal development with leadership, just like a puzzle, where you have to match all the given pieces in order to recompose the general image.
The aim of this book is to offer you information through concrete examples and to show you how to obtain the capacity to make others see things from the same angle as you.
Without considering it a concord, the book is representing the try of an ordinary man - the author - who through simple words, facts and usual examples instills to the ordinary man courage and optimism in his own quest to be his own master and who knows... maybe even a leader.
