return compose suggestion display to below shelves

This commit is contained in:
Mouse Reeve 2020-04-06 09:28:56 -07:00
parent 030233fb1a
commit 4f5b81c6ba
2 changed files with 19 additions and 19 deletions

View file

@ -489,6 +489,9 @@ dd {
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
.all-shelves h2 {
white-space: nowrap;
}
.all-shelves > div { .all-shelves > div {
flex-grow: 0; flex-grow: 0;
} }
@ -538,19 +541,14 @@ dd {
.all-shelves input[type='radio'] { .all-shelves input[type='radio'] {
display: none; display: none;
} }
.compose-popout input[type="radio"] {
display: none;
}
.compose-suggestion { .compose-suggestion {
display: none; display: none;
background-color: white;
z-index: 1;
width: -webkit-fill-available;
width: -moz-available;
box-shadow: 0 5px 10px rgba(0,0,0,0.45);
} }
input:checked ~ .compose-suggestion { input:checked ~ .compose-suggestion {
display: block; display: block;
position: absolute;
top: 5em;
left: 0;
} }
.compose-suggestion .book-preview { .compose-suggestion .book-preview {
background-color: #EEE; background-color: #EEE;

View file

@ -16,16 +16,6 @@
<label for="book-{{ book.id }}-radio"> <label for="book-{{ book.id }}-radio">
{% include 'snippets/book_cover.html' with book=book %} {% include 'snippets/book_cover.html' with book=book %}
</label> </label>
<input name="book-{{ book.id }}" type="radio" id="book-{{ book.id }}-radio"></input>
<div class="compose-suggestion" id="compose-book-{{ book.id }}">
<label class="close icon icon-close" for="book-{{ book.id }}-radio-close" onclick="hide_element(this)">
<span class="hidden-text">Close</span>
</label>
<input name="book-{{ book.id }}" type="radio" id="book-{{ book.id }}-radio-close"></input>
<div class="content-container">
{% include 'snippets/create_status.html' with book=book user=request.user %}
</div>
</div>
</div> </div>
{% include 'snippets/shelve_button.html' with book=book %} {% include 'snippets/shelve_button.html' with book=book %}
</div> </div>
@ -38,5 +28,17 @@
{% for shelf in shelves %} {% for shelf in shelves %}
{% for book in shelf.books %} {% for book in shelf.books %}
{% endfor %} <div class="content-container compose-popout">
<input name="book-popout" type="radio" id="book-{{ book.id }}-radio"></input>
<div class="compose-suggestion" id="compose-book-{{ book.id }}">
<label class="close icon icon-close" for="book-{{ book.id }}-radio-close" onclick="hide_element(this)">
<span class="hidden-text">Close</span>
</label>
<input name="book-popout" type="radio" id="book-{{ book.id }}-radio-close"></input>
<div class="content-container">
{% include 'snippets/create_status.html' with book=book user=request.user %}
</div>
</div>
</div>
{% endfor %}
{% endfor %} {% endfor %}