Commit 0a5faf70 authored by Jakob Schmidt's avatar Jakob Schmidt
Browse files

zentrierte pagenav, verticaltabs (wip)

parent 1c2860a3
......@@ -10,38 +10,45 @@ body {
/**GRID**/
.contentbox{
top:1em;
border:1px solid transparent;
border-radius:4px 4px 0 0;
border-color:#dfd7ca;
background-color:#ffffff;
min-width:100%;
min-height:500px;
max-width:500px;
padding:1em;
}
.col-sm-11{
padding-right: 3px;
}
.nav-tabs{
max-width:500px;
max-width:450px;
}
.thumb{
max-height:100%; max-width:100%;
}
.tabs-right{
float:right;
padding-top:0;
}
.contentbox-left{
margin-top:3px;
padding:0;
}
.contentbox-right{
margin-top:-1px;
padding-right:0;
}
.pagination{
margin:0;
}
......@@ -58,8 +65,7 @@ padding:0;
}
h1{
margin-bottom:2em;
}
}
#headerDiv
......
/*!
* bootstrap-vertical-tabs - v1.2.1
* https://dbtek.github.io/bootstrap-vertical-tabs
* 2014-11-07
* Copyright (c) 2014 İsmail Demirbilek
* License: MIT
*/
.tabs-left,.tabs-right{border-bottom:none;padding-top:2px}.tabs-left{border-right:1px solid #ddd}.tabs-right{border-left:1px solid #ddd}.tabs-left>li,.tabs-right>li{float:none;margin-bottom:2px}.tabs-left>li{margin-right:-1px}.tabs-right>li{margin-left:-1px}.tabs-left>li.active>a,.tabs-left>li.active>a:focus,.tabs-left>li.active>a:hover{border-bottom-color:#ddd;border-right-color:transparent}.tabs-right>li.active>a,.tabs-right>li.active>a:focus,.tabs-right>li.active>a:hover{border-bottom:1px solid #ddd;border-left-color:transparent}.tabs-left>li>a{border-radius:4px 0 0 4px;margin-right:0;display:block}.tabs-right>li>a{border-radius:0 4px 4px 0;margin-right:0}.sideways{margin-top:50px;border:none;position:relative}.sideways>li{height:20px;width:120px;margin-bottom:100px}.sideways>li>a{border-bottom:1px solid #ddd;border-right-color:transparent;text-align:center;border-radius:4px 4px 0 0}.sideways>li.active>a,.sideways>li.active>a:focus,.sideways>li.active>a:hover{border-bottom-color:transparent;border-right-color:#ddd;border-left-color:#ddd}.sideways.tabs-left{left:-50px}.sideways.tabs-right{right:-50px}.sideways.tabs-right>li{-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.sideways.tabs-left>li{-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-ms-transform:rotate(-90deg);-o-transform:rotate(-90deg);transform:rotate(-90deg)}
......@@ -9,7 +9,9 @@
<!-- BOOTSTRAP THEME STYLESHEET-->
<link rel="stylesheet" href="http://bootswatch.com/sandstone/bootstrap.min.css">
<!-- CUSTOM CSS-->
<link rel="stylesheet" href="css/verticaltabs.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
......@@ -64,187 +66,118 @@
<!-- Titel -->
<h1>Brief von Ferrucio Busoni an Arnold Schönberg (Berlin, 19. November 1914) </h1>
<div class="container">
<div class="row">
<div class="col-md-12 text-center">
<div class="bs-component">
<ul class="pagination pagination-sm ">
<li><a href="#1" data-toggle="tab">1</a></li>
<li><a href="#2" data-toggle="tab">2</a></li>
<li><a href="#3" data-toggle="tab">3</a></li>
<li><a href="#4" data-toggle="tab">4</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="row">
<!--LINKS-->
<!--LINKS-->
<div class="col-sm-6">
<!-- Seitenanzeige -->
<div class="bs-component">
<ul class="pagination pagination-sm ">
<li><a href="#1" data-toggle="tab">1</a></li>
<li><a href="#2" data-toggle="tab">2</a></li>
<li><a href="#3" data-toggle="tab">3</a></li>
<li><a href="#4" data-toggle="tab">4</a></li>
</ul>
</div>
<div class="contentbox contentbox-left">
<div id="my-tab-content" class="tab-content">
<div class="tab-pane active" id="1">
<img src="../facs/letters/busoni-schoenberg/1903-09-10-sb_1.png" class="thumb"/>
</div>
<div class="tab-pane inactive" id="2">
<img src="../facs/letters/busoni-schoenberg/1903-09-10-sb_2.png" class="thumb"/>
</div>
<div class="tab-pane inactive" id="3">
<img src="../facs/letters/busoni-schoenberg/1903-09-10-sb_3.png" class="thumb"/>
</div>
<div class="tab-pane inactive" id="4">
<img src="../facs/letters/busoni-schoenberg/1903-09-10-sb_4.png" class="thumb"/>
</div>
<div class="tab-pane active" id="1">
<img src="../facs/letters/busoni-schoenberg/1903-09-10-sb_1.png" class="thumb" />
</div>
<div class="tab-pane inactive" id="2">
<img src="../facs/letters/busoni-schoenberg/1903-09-10-sb_2.png" class="thumb" />
</div>
<div class="tab-pane inactive" id="3">
<img src="../facs/letters/busoni-schoenberg/1903-09-10-sb_3.png" class="thumb" />
</div>
<div class="tab-pane inactive" id="4">
<img src="../facs/letters/busoni-schoenberg/1903-09-10-sb_4.png" class="thumb" />
</div>
</div>
</div>
</div>
</div>
<!--RIGHT-->
<!--RIGHT-->
<div class="col-sm-6">
<!-- Anzeigetabs -->
<ul class="nav nav-tabs">
<li class="active">
<a href="#dipl" data-toggle="tab">Diplomatische Umschrift</a>
</li>
<li><a href="#lese" data-toggle="tab">Lesefassung</a></li>
<li><a href="#" data-toggle="tab">...</a></li>
</ul>
<div class="contentbox contentbox-right">
<div id="my-tab-content" class="tab-content">
<div class="tab-pane active" id="dipl">
<p> <note xmlns="http://www.tei-c.org/ns/1.0">
<del xmlns="">Mus. ep. Orchester Abend 1903,27 (Busoni-Nachl. B II)</del><ins xmlns="">Mus. Nachl. F. Busoni B II,3551</ins>
</note>
<opener xmlns="http://www.tei-c.org/ns/1.0">
<div xmlns="" class="opener">
<span class="right">
<a class="entity-link" data-ref="l0038" href="entities/l0038.html">Payerbach</a><a class="editor-note-link" count="1"><sup>1</sup></a> 10./9.1903
</span>
<p class="inline">
<span class="unclear-choice" popup="Transkription unsicher. Alternative Lesart: Hochverehrter">Hoch verehrter</span><a class="editor-note-link" count="2"><sup>2</sup></a>
Herr Professor,
</p>
</div>
</opener>
<p xmlns="http://www.tei-c.org/ns/1.0">aus Ihrem Briefe <br xmlns="">an <a xmlns="" class="entity-link" data-ref="p0024" href="entities/p0024.html">Herrn Dr. Schenker</a>,
dessen <a xmlns="" class="entity-link" data-ref="w0016" href="entities/w0016.html">Syrische<a class="editor-note-link" count="3"><sup>3</sup></a>
Tänze</a>
<br xmlns="">ich für Orchester setze,<a xmlns="" class="editor-note-link" count="4"><sup>4</sup></a>
entnahm ich,
daß<a xmlns="" class="editor-note-link" count="5"><sup>5</sup></a>
Sie <br xmlns="">auch heuer<a xmlns="" class="editor-note-link" count="6"><sup>6</sup></a>
Ihre „Modernen<a xmlns="" class="editor-note-link" count="7"><sup>7</sup></a>
Concerte“<a xmlns="" class="editor-note-link" count="8"><sup>8</sup></a>
in <a xmlns="" class="entity-link" data-ref="l0029" href="entities/l0029.html">Berlin</a>
<br xmlns="">abhalten.<a xmlns="" class="editor-note-link" count="9"><sup>9</sup></a>
Da ich schon, als ich noch in <a xmlns="" class="entity-link" data-ref="l0029" href="entities/l0029.html">Berlin</a> war,<a xmlns="" class="editor-note-link" count="10"><sup>10</sup></a>
<br xmlns="">die Absicht
hatte
Sie aufzusuchen, darin
<br xmlns="">aber insofern
mißglückte,
als Sie verreist
<br xmlns="">waren, erlaube ich
mir
mich brieflich mit
<br xmlns="">dem an Sie zu wenden, um was ich Sie
<br xmlns="">damals angehen wollte.
</p></p>
<p>Folgendes: Ich habe eine symphonische
<br>
Dichtung:<a class="editor-note-link" count="11"><sup>11</sup></a>
<a class="entity-link" data-ref="w0012" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/w0012.html">Pelleas und Melisande</a>“ nach <a class="entity-link" data-ref="p0027" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/p0027.html">Maeterlinck</a>
<br>
componiert.<a class="editor-note-link" count="12"><sup>12</sup></a>
Da diese nun leider insofern
<br>zu den <ins></ins>selten <del></del>aufgeführten Werken“ gehört, als
<br>sie noch gar nicht aufgeführt ist und meine
<br>bisherigen
Versuche sie zu placieren
durchaus
<br>verg<del><span class="unclear-gap" popup="Transkription nicht möglich (1 Zeichen): überschrieben.">[...]</span></del><ins>e</ins>blich waren, so möchte ich mir
erlauben<span class="note-foliation-by-other" hand-id="#archive">[1]</span>
</p>
<pb xmlns="http://www.tei-c.org/ns/1.0"></pb>
<div class="editor-notes">
<h4><i class="fa fa-info-circle"></i> Kommentare
</h4>
<p><a class="editor-note" count="1">1. </a><note xmlns="http://www.tei-c.org/ns/1.0">
<a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> (316) fälschlich: „Payersbach“.
</note>
</p>
<p><a class="editor-note" count="2">2. </a><note xmlns="http://www.tei-c.org/ns/1.0">
<a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> (316):
„Hochverehrter“.
</note>
</p>
<p><a class="editor-note" count="3">3. </a><note xmlns="http://www.tei-c.org/ns/1.0">
<a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> (316) fälschlich: „syrische“.
</note>
</p>
<p><a class="editor-note" count="4">4. </a><note xmlns="http://www.tei-c.org/ns/1.0">Details der Auftragsvergabe sind u. a. dem <a xmlns="" href="http://www.schenkerdocumentsonline.org/documents/correspondence/OJ-14-15_1.html">Brief Schönbergs</a> vom 12.9.1903 an <a xmlns="" class="entity-link" data-ref="p0024" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/p0024.html">Heinrich Schenker</a> zu entnehmen.
</note>
</p>
<p><a class="editor-note" count="5">5. </a><note xmlns="http://www.tei-c.org/ns/1.0">
<a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> transkribiert hier (S. 316) und im Folgenden
die Zeichenfolge „ſs“ stets als „ss“. Da diese Kombination in
Kurrentschrift für gewöhnlich (und auch in Schönbergs Hand) nicht zuverlässig
von der ß-Ligatur unterscheidbar ist, transkribieren wir in diesen Fällen stets mit
„ß“.
</note>
</p>
<p><a class="editor-note" count="6">6. </a><note xmlns="http://www.tei-c.org/ns/1.0">
<a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> (316) fälschlich: „sicher“.
</note>
</p>
<p><a class="editor-note" count="7">7. </a><note xmlns="http://www.tei-c.org/ns/1.0">
<a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> (316) fälschlich: „modernen“.
</note>
</p>
<p><a class="editor-note" count="8">8. </a><note xmlns="http://www.tei-c.org/ns/1.0">Offenbar verwechselt Schönberg die Reihe zumindest ihrem Namen nach mit der von <a xmlns="" class="entity-link" data-ref="p0022" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/p0022.html">Richard Strauss</a> veranstalteten; gemeint sind Busonis <a xmlns="" class="entity-link" data-ref="o0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/o0003.html">Berliner Orchesterabende</a>.
</note>
</p>
<p><a class="editor-note" count="9">9. </a><note xmlns="http://www.tei-c.org/ns/1.0">
<a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> (316) im Anschluss fälschlich mit neuem
Absatz.
</note>
</p>
<p><a class="editor-note" count="10">10. </a><note xmlns="http://www.tei-c.org/ns/1.0">Schönberg war zwei Monate zuvor, im Juli 1903, von <a xmlns="" class="entity-link" data-ref="l0029" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/l0029.html">Berlin</a> zurück nach <a xmlns="" class="entity-link" data-ref="l0002" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/l0002.html">Wien</a> gezogen.
</note>
</p>
<p><a class="editor-note" count="11">11. </a><note xmlns="http://www.tei-c.org/ns/1.0">
Bei <a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> (316) fehlt der Doppelpunkt.
</note>
</p>
<p><a class="editor-note" count="12">12. </a><note xmlns="http://www.tei-c.org/ns/1.0">
<a xmlns="" class="entity-link" data-ref="b0003" href="file:///home/jakob/Dokumente/Studium%20Berlin/SHK%20Stelle/Sch%C3%B6nberg%20Busoni%20Textedition/html_new/entities/b0003.html">Weindel 2003</a> (316) fälschlich: „componirt“.
</note>
</p>
<!--content-->
<div class="col-sm-11">
<div class="contentbox contentbox-right">
<div id="my-tab-content" class="tab-content">
<div class="tab-pane active" id="dipl">
<div class="tab-pane" id="1">
Seite 1 Dipl. Umschrift
</div>
<div class="tab-pane" id="2">
Seite 2 Dipl. Umschrift
</div>
<div class="tab-pane" id="3">
Seite 3 Dipl. Umschrift
</div>
<div class="tab-pane" id="4">
Seite 4 Dipl. Umschrift
</div>
</div>
<div class="tab-pane inactive" id="text">
<div class="tab-pane" id="1">
Seite 1 Lesefassung
</div>
<div class="tab-pane" id="2">
Seite 2 Lesefassung
</div>
<div class="tab-pane" id="3">
Seite 3 Lesefassung
</div>
<div class="tab-pane" id="4">
Seite 4 Lesefassung
</div>
</div>
</div>
</div>
<div class="tab-pane" id="lese">
....
</div>
<!-- right tabs -->
<div class="col-sm-1">
<ul class="nav nav-tabs tabs-right sideways">
<li class="active">
<a href="#dipl" data-toggle="tab">Umschrift</a>
</li>
<li><a href="#text" data-toggle="tab">Lesefassung</a></li>
<li><a href="#" data-toggle="tab">...</a></li>
</ul>
</div>
<!-- right close-->
</div>
<!-- row close -->
</div>
<!-- container close-->
</div>
<!--BOOTSTRAP JAVASCRIPT-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<!--BOOTSTRAP JAVASCRIPT-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
</script>
</body>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment