Skip to content

Instantly share code, notes, and snippets.

/index.html
Created Mar 14, 2018

Embed
What would you like to do?
Tribute Page: Viktor Frankl
<html lang="en">
<head>
<meta charset="utf-8">
<title>Tribute Page: Viktor Frankl</title>
<link href="https://fonts.googleapis.com/css?family=Lato:400,400i,900" rel="stylesheet">
</head>
<body>
<wrapper>
<!-- header -->
<header class="container-full">
<div class="row theme-bright">
<h1 class="col-sm-4" id="header">Viktor E. Frankl</h1>
<nav class="col-sm-8 text-right">
<a class="btn btn-primary" href="#timeline">Timeline</a>
<a class="btn btn-primary" href="#awards">Decorations & Awards</a>
<a class="btn btn-primary" href="#bibliography">Bibliography</a>
</nav>
</div>
</header>
<!-- end header -->
<!-- quote 1 -->
<div class="container-full">
<div class="row theme-dark">
<div class="row">
<div class="col-sm-6">
<img src="https://i.imgur.com/EUA9XHb.png">
</div>
<div class="col-sm-6">
<section class="container">
<h2 class="slogan">“Everything can be taken from a man but one thing: the last of the human freedoms – to choose one’s attitude in any given set of circumstances, to choose one’s own way.”<br>
<br><em>- Viktor E. Frankl</em></h2>
</section>
</div>
</div>
</div>
</div>
<!-- end quote 1 -->
<!-- timeline -->
<section class="container-full theme-bright">
<div class="row text-center">
<h3 class="col-sm-12" id="timeline"><strong>Here's a time line of Viktor Frankl's life</strong></h3>
</div>
<section class="container">
<div class="row">
<ul>
<h4><em><strong>Life before 1945</strong></em></h4>
<li><strong>1905</strong> - Born in 26 March, Leopoldstadt, Vienna, Austria</li>
<li><strong>1923</strong> - Graduates from Gymnasium, continues studying medicine at the University of Vienna and later specialized in neurology and psychiatry.</li>
<hr>
<h4><em><strong>Physician, therapist</strong></em></h4>
<li><strong>1924</strong> - He became the president of the 'Sozialistische Mittelschüler Österreich', a Social Democratic youth movement for high school students throughout Austria.</li>
<li><strong>1928 - 1930</strong> - While still a medical student, he organized and offered a special program to counsel high school students free of charge.</li>
<li><strong>1931</strong> - not a single Viennese student committed suicide.</li>
<li><strong>1933 - 1937</strong> - Frankl completed his residency in neurology and psychiatry at the Steinhof Psychiatric Hospital in Vienna.</li>
<li><strong>1937</strong> - He established an independent private practice in neurology and psychiatry at Alser Strasse 32/12 in Vienna.</li>
<li><strong>1940</strong> - He started working at the Rothschild Hospital, where he headed its neurological department. This hospital was the only one in Vienna to which Jews were still admitted.</li>
<li><strong>1941</strong> - December, he married Tilly Grosser.</li>
<hr>
<h4><em><strong>Prisoner, therapist</strong></em>em></h4>
<li><strong>1942</strong> - September, Frankl, his wife, and his parents were deported to the Nazi Theresienstadt Ghetto. There Frankl worked as a general practitioner in a clinic.</li>
<li><strong>1943</strong> - 29 July, Frankl organized a closed event for the Scientific Society at Theresienstadt.</li>
<li><strong>1944</strong> - 19 October, Frankl and his wife Tilly were transported to the Auschwitz concentration camp, where he was processed.</li>
<li><strong>1945</strong> - March, he was offered a move to the so-called rest camp, Türkheim, also affiliated with Dachau, where he worked as a physician.</li>
<li><strong>1945</strong> - 27 April, when the camp was liberated by American soldiers.</li>
<hr>
<h4><em><strong>Life after 1945</strong></em></h4>
<li><strong>1946</strong> - He was appointed to run the Vienna Polyclinic of Neurology. He remained there until 1971.</li>
<li><strong>1947</strong> - He married his second wife Eleonore Katharina Schwindt.</li>
<li><strong>1948</strong> - Frankl earned a Ph.D. in philosophy. His dissertation, The Unconscious God, is an examination of the relation of psychology and religion.</li>
<li><strong>1955</strong> - He was awarded a professorship of neurology and psychiatry at the University of Vienna.</li>
<li class="last"><strong>1997</strong> - 2 September, Dies of heart failure.</li>
</ul>
</div>
</section>
</section>
<!-- end time line -->
<!-- quote 2 -->
<section class="container-full">
<div class="row text-center theme-dark">
<h2 class="col-sm-12 quote">"Challenging the meaning of life is the truest expression of the state of being human."<br>
<br><em>- Viktor E. Frankl</em></h2>
</div>
</section>
<!-- end quote 2 -->
<!-- decorations & awards -->
<section class="container-full theme-bright">
<div class="row text-center">
<h3 class="col-sm-12" id="awards"><strong>Decorations and awards</strong></h3>
</div>
<section class="container">
<div class="row">
<ul>
<li><strong>1956</strong>: Promotion Award for Public Education of the Federal Ministry of Education, Arts and Culture, Austria</li>
<li><strong>1962</strong>: Cardinal Innitzer Prize, Austria</li>
<li><strong>1969</strong>: Austrian Cross of Honour for Science and Art, 1st class</li>
<li><strong>1976</strong>: Prize of the Danubia Foundation</li>
<li><strong>1980</strong>: Honorary Ring of Vienna, Austria</li>
<li><strong>1981</strong>: Austrian Decoration for Science and Art</li>
<li><strong>1985</strong>: Oskar Pfister Award, USA</li>
<li><strong>1986</strong>: Honorary doctorate from the University of Vienna, Austria</li>
<li><strong>1988</strong>: Great Silver Medal with Star for Services to the Republic of Austria</li>
<li><strong>1995</strong>: Hans Prinzhorn Medal</li>
<li><strong>1995</strong>: Honorary Citizen of the City of Vienna</li>
<li><strong>1995</strong>: Great Gold Medal with Star for Services to the Republic of Austria</li>
<li><strong>1995</strong>: Grand Decoration of the Austrian Chamber of Physicians</li>
<li class="last">Grand Merit Cross with Star of the Federal Republic of Germany (Großes Verdienstkreuz mit Stern)</li>
</ul>
</div>
</section>
</section>
<!-- end decorations & awards -->
<!-- quote 3 -->
<section class="container-full">
<div class="row text-center theme-dark">
<h2 class="col-sm-12 quote">"When we are no longer able to change a situation - we are challenged to change ourselves"<br>
<br><em>- Viktor E. Frankl</em></h2>
</div>
</section>
<!-- end quote 3 -->
<!-- bibliography -->
<section class="container-full theme-bright">
<div class="row text-center">
<h3 class="col-sm-12" id="bibliography"><strong>Bibliography</strong></h3>
</div>
<section class="container">
<div class="row">
<ul>
<h4>His books in English are:</h4>
<li><strong>Man's Search for Meaning</strong>. An Introduction to Logotherapy, Beacon Press, Boston, MA, 2006. (Originally published in 1946).</li>
<li><strong>The Doctor and the Soul</strong>, (originally titled Ärztliche Seelsorge), Random House, 1955.</li>
<li><strong>On the Theory and Therapy of Mental Disorders</strong>. An Introduction to Logotherapy and Existential Analysis, Translated by James M. DuBois. Brunner-Routledge, London-New York, 2004.</li>
<li><strong>Psychotherapy and Existentialism</strong>. Selected Papers on Logotherapy, Simon & Schuster,New York, 1967.</li>
<li><strong>The Will to Meaning</strong>. Foundations and Applications of Logotherapy, New American Library, New York, 1988</li>
<li><strong>The Unheard Cry for Meaning</strong>. Psychotherapy and Humanism, Simon & Schuster, New York, 2011</li>
<li><strong>Viktor Frankl Recollections: An Autobiography</strong>.; Basic Books, Cambridge, MA 2000.</li>
<li><strong>Man's Search for Ultimate Meaning</strong>. (A revised and extended edition of The Unconscious God; with a Foreword by Swanee Hunt). </li>
</ul>
</div>
</section>
</section>
<!-- end bibliography -->
<!-- wikipedia -->
<section class="container-full">
<div class="row text-center theme-bright">
<div class="col-sm-12">
<hr>
<h3>If you have time, you should read more about his incredible autobioghraphy on his <a href="https://en.wikipedia.org/wiki/Viktor_Frankl" target="_blank">Wikipedia entry</a>.</h3>
</div>
</div>
</section>
<!-- end wikipedia -->
<!-- back to top / written by -->
<section class="container-full">
<div class="row text-center theme-bright">
<div class="col-sm-12">
<a class="btn btn-primary back-up border2" href="#header">Back up</a>
</div>
</div>
<div class="row text-center theme-dark">
<div class="col-sm-12">
<h6>Written and coded by <a href="#">Oliver Janhunen</a>.</h6>
</div>
</div>
</section>
<!-- end back to top / written by -->
</wrapper>
</body>
</html>
body {
font-family: 'Lato', sans-serif;
overflow: hide;
background-color: #DFE2DB;
}
.theme-bright {
background-color: #DFE2DB;
}
img {
}
.theme-dark {
background-color: #191919;
color: #DFE2DB;
}
.btn-primary {
background-color: #191919;
border: #191919;
color: white !important;
}
.btn-primary:hover {
background-color: grey;
border: grey;
}
header .btn {
margin: 1%;
}
.header {
height: 100vh;
}
.quote {
padding: 10%;
}
.slogan {
padding-top: 20%;
padding-bottom: 20%;
}
#header {
padding-left: 2%;
padding-top: 0.25%;
}
h3 {
padding-top: 1%;
padding-left: 2%;
padding-right: 2%;
}
.blocker {
display: inline-block;
}
ul {
padding-bottom: 2%;
padding-left: 2%;
padding-right: 2%;
line-height: 1.6;
}
li {
font-size: 20px;
}
h4 {
padding-left: 2%;
padding-right: 2%;
padding-top: 1.5%;
}
h6 {
padding: 1%;
}
.back-up {
margin: 2%;
}
hr {
color: white;
}
#timeline {
padding-top: 5%;
}
#awards {
padding-top:5%;
}
#bibliography {
padding-top: 5%;
}
.last {
padding-bottom: 5% !important;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.