Version 5.1 - All the GraphQL #32
@ -5,8 +5,12 @@
|
|||||||
<?php if (empty($sections)): ?>
|
<?php if (empty($sections)): ?>
|
||||||
<h3>There's nothing here!</h3>
|
<h3>There's nothing here!</h3>
|
||||||
<?php else: ?>
|
<?php else: ?>
|
||||||
|
<div class="tabs">
|
||||||
|
<?php $i = 0; ?>
|
||||||
<?php foreach ($sections as $name => $items): ?>
|
<?php foreach ($sections as $name => $items): ?>
|
||||||
<section class="status">
|
<input <?= $i === 0 ? 'checked="checked"' : '' ?> type="radio" id="collection-tab-<?= $i ?>" name="collection-tabs" />
|
||||||
|
<label for="collection-tab-<?= $i ?>"><?= $name ?></label>
|
||||||
|
<div class="content">
|
||||||
<h2><?= $name ?></h2>
|
<h2><?= $name ?></h2>
|
||||||
<section class="media-wrap">
|
<section class="media-wrap">
|
||||||
<?php foreach ($items as $item): ?>
|
<?php foreach ($items as $item): ?>
|
||||||
@ -23,7 +27,8 @@
|
|||||||
<?php if ($auth->isAuthenticated()): ?>
|
<?php if ($auth->isAuthenticated()): ?>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<span class="edit">
|
<span class="edit">
|
||||||
<a class="bracketed" href="<?= $url->generate($collection_type . '.collection.edit.get', [
|
<a class="bracketed"
|
||||||
|
href="<?= $url->generate($collection_type . '.collection.edit.get', [
|
||||||
'id' => $item['hummingbird_id']
|
'id' => $item['hummingbird_id']
|
||||||
]) ?>">Edit</a>
|
]) ?>">Edit</a>
|
||||||
</span>
|
</span>
|
||||||
@ -38,7 +43,9 @@
|
|||||||
</article>
|
</article>
|
||||||
<?php endforeach ?>
|
<?php endforeach ?>
|
||||||
</section>
|
</section>
|
||||||
</section>
|
</div>
|
||||||
|
<?php $i++; ?>
|
||||||
<?php endforeach ?>
|
<?php endforeach ?>
|
||||||
|
</div>
|
||||||
<?php endif ?>
|
<?php endif ?>
|
||||||
</main>
|
</main>
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<title><?= $title ?></title>
|
|
||||||
<meta charset="utf-8"/>
|
<meta charset="utf-8"/>
|
||||||
|
<title><?= $title ?></title>
|
||||||
<meta http-equiv="cache-control" content="no-store" />
|
<meta http-equiv="cache-control" content="no-store" />
|
||||||
<meta http-equiv="Content-Security-Policy" content="script-src 'self'" />
|
<meta http-equiv="Content-Security-Policy" content="script-src 'self'" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=1" />
|
||||||
<link rel="stylesheet" href="<?= $urlGenerator->assetUrl('css/app.min.css') ?>" />
|
<link rel="stylesheet" href="<?= $urlGenerator->assetUrl('css/app.min.css') ?>" />
|
||||||
<link rel="icon" href="<?= $urlGenerator->assetUrl('images/icons/favicon.ico') ?>" />
|
<link rel="icon" href="<?= $urlGenerator->assetUrl('images/icons/favicon.ico') ?>" />
|
||||||
<link rel="apple-touch-icon" sizes="57x57" href="<?= $urlGenerator->assetUrl('images/icons/apple-icon-57x57.png') ?>">
|
<link rel="apple-touch-icon" sizes="57x57" href="<?= $urlGenerator->assetUrl('images/icons/apple-icon-57x57.png') ?>">
|
||||||
|
@ -47,7 +47,7 @@
|
|||||||
<tr>
|
<tr>
|
||||||
<td><label for="volumes_read">Volumes Read</label></td>
|
<td><label for="volumes_read">Volumes Read</label></td>
|
||||||
<td>
|
<td>
|
||||||
<input type="text" disabled="disabled" min="0" name="volumes_read" id="volumes_read" value="-" /> / <?= $item['volumes']['total'] ?>
|
<?php /*<input type="number" disabled="disabled" min="0" name="volumes_read" id="volumes_read" value="" /> */ ?> - / <?= $item['volumes']['total'] ?>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
|
2
public/css/app.min.css
vendored
2
public/css/app.min.css
vendored
File diff suppressed because one or more lines are too long
@ -686,3 +686,74 @@ a:hover, a:active {
|
|||||||
.loading-content .cssload-inner.cssload-three {
|
.loading-content .cssload-inner.cssload-three {
|
||||||
border-color: #fff
|
border-color: #fff
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* ----------------------------------------------------------------------------
|
||||||
|
CSS Tabs
|
||||||
|
-----------------------------------------------------------------------------*/
|
||||||
|
.tabs {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
background: #efefef;
|
||||||
|
box-shadow: 0 48px 80px -32px rgba(0,0,0,0.3);
|
||||||
|
margin-top: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs label {
|
||||||
|
border: 1px solid #e5e5e5;
|
||||||
|
width: 100%;
|
||||||
|
padding: 20px 30px;
|
||||||
|
background: #e5e5e5;
|
||||||
|
cursor: pointer;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #7f7f7f;
|
||||||
|
transition: background 0.1s, color 0.1s;
|
||||||
|
/* margin-left: 4em; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs label:hover {
|
||||||
|
background: #d8d8d8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs label:active {
|
||||||
|
background: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs [type=radio]:focus + label {
|
||||||
|
box-shadow: inset 0px 0px 0px 3px #2aa1c0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs [type=radio] {
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs [type=radio]:checked + label {
|
||||||
|
border-bottom: 1px solid #fff;
|
||||||
|
background: #fff;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs [type=radio]:checked + label + .content{
|
||||||
|
border: 1px solid #e5e5e5;
|
||||||
|
border-top: 0;
|
||||||
|
display: block;
|
||||||
|
padding: 20px 30px 30px;
|
||||||
|
background: #fff;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs .content {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 600px) {
|
||||||
|
.tabs label {
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs .content {
|
||||||
|
order: 99;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user