mirror of
https://github.com/getgrav/grav-plugin-admin.git
synced 2025-12-17 05:50:32 +01:00
More pages progress
This commit is contained in:
Andy Miller
@@ -32,9 +32,9 @@ body {
|
||||
-moz-osx-font-smoothing: grayscale; }
|
||||
|
||||
a {
|
||||
color: #1bb3e9; }
|
||||
color: #0082ba; }
|
||||
a:hover {
|
||||
color: #0e6e90; }
|
||||
color: #003b54; }
|
||||
|
||||
b, strong {
|
||||
font-weight: 600; }
|
||||
@@ -218,7 +218,7 @@ hr {
|
||||
|
||||
.label {
|
||||
vertical-align: middle;
|
||||
background: #1bb3e9;
|
||||
background: #0082ba;
|
||||
border-radius: 100%;
|
||||
color: white;
|
||||
height: 1rem;
|
||||
@@ -745,6 +745,8 @@ tr {
|
||||
|
||||
#admin-main {
|
||||
margin-left: 20%; }
|
||||
#admin-main .hint:after, #admin-main [data-hint]:after {
|
||||
font-size: 1rem; }
|
||||
#admin-main h1 {
|
||||
margin: 0;
|
||||
font-size: 1.5rem;
|
||||
@@ -932,6 +934,17 @@ tr {
|
||||
padding-right: 3rem; }
|
||||
.pages-list .row:hover {
|
||||
background: #f3f3f3; }
|
||||
.pages-list .row p.page-route {
|
||||
display: block;
|
||||
margin: -10px 0 5px 25px;
|
||||
line-height: 1;
|
||||
font-size: 0.9rem;
|
||||
color: #a2a2a2;
|
||||
text-shadow: 1px 1px 0 white; }
|
||||
.pages-list .row .hint--bottom:before, .pages-list .row .hint--bottom:after {
|
||||
left: 4px; }
|
||||
.pages-list .row .hint:after, .pages-list .row [data-hint]:after {
|
||||
border-radius: 2px; }
|
||||
.pages-list .page-tools {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
@@ -943,14 +956,56 @@ tr {
|
||||
margin-left: 10px;
|
||||
color: #bbbbbb;
|
||||
vertical-align: middle; }
|
||||
.pages-list .page-icon {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 100%;
|
||||
background: #0082BA;
|
||||
margin-right: 10px;
|
||||
.pages-list .page-info {
|
||||
font-size: 1.1rem;
|
||||
margin-left: 10px;
|
||||
color: #bbbbbb;
|
||||
vertical-align: middle; }
|
||||
.pages-list .page-icon {
|
||||
color: #0082BA;
|
||||
font-weight: 700; }
|
||||
.pages-list .page-icon.children-open:before {
|
||||
content: '\f056'; }
|
||||
.pages-list .page-icon.children-closed:before {
|
||||
content: '\f055'; }
|
||||
.pages-list .page-icon.not-routable {
|
||||
color: #CE431D; }
|
||||
.pages-list .page-icon.not-visible {
|
||||
color: #999; }
|
||||
.pages-list .page-icon.modular {
|
||||
color: #9055AF; }
|
||||
|
||||
#page-filtering {
|
||||
margin: -2rem 3rem 1rem; }
|
||||
#page-filtering:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both; }
|
||||
#page-filtering .page-filters {
|
||||
width: 60%;
|
||||
float: left; }
|
||||
#page-filtering .page-search {
|
||||
position: relative;
|
||||
width: 40%;
|
||||
float: left;
|
||||
padding-left: 2rem;
|
||||
text-indent: 2.5rem; }
|
||||
#page-filtering .page-search:after {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
content: '\f002';
|
||||
font-family: 'FontAwesome'; }
|
||||
|
||||
form .selectize-control.multi .selectize-input > div, form .selectize-control.multi .selectize-input > div.active {
|
||||
color: white;
|
||||
padding: 2px 10px; }
|
||||
form .selectize-control.multi .selectize-input > div[data-value='Routable'], form .selectize-control.multi .selectize-input > div.active[data-value='Routable'] {
|
||||
background: #CE431D; }
|
||||
form .selectize-control.multi .selectize-input > div[data-value='Visible'], form .selectize-control.multi .selectize-input > div.active[data-value='Visible'] {
|
||||
background: #999; }
|
||||
form .selectize-control.multi .selectize-input > div[data-value='Modular'], form .selectize-control.multi .selectize-input > div.active[data-value='Modular'] {
|
||||
background: #9055AF; }
|
||||
|
||||
.depth-0 .row {
|
||||
padding-left: 3rem; }
|
||||
|
||||
File diff suppressed because one or more lines are too long
5
themes/grav/css/hint.base.min.css
vendored
Normal file
5
themes/grav/css/hint.base.min.css
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
/*! Hint.css (base version) - v1.3.3 - 2014-07-06
|
||||
* http://kushagragour.in/lab/hint/
|
||||
* Copyright (c) 2014 Kushagra Gour; Licensed MIT */
|
||||
|
||||
.hint,[data-hint]{position:relative;display:inline-block}.hint:before,.hint:after,[data-hint]:before,[data-hint]:after{position:absolute;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);transform:translate3d(0,0,0);visibility:hidden;opacity:0;z-index:1000000;pointer-events:none;-webkit-transition:.3s ease;-moz-transition:.3s ease;transition:.3s ease;-webkit-transition-delay:0ms;-moz-transition-delay:0ms;transition-delay:0ms}.hint:hover:before,.hint:hover:after,.hint:focus:before,.hint:focus:after,[data-hint]:hover:before,[data-hint]:hover:after,[data-hint]:focus:before,[data-hint]:focus:after{visibility:visible;opacity:1}.hint:hover:before,.hint:hover:after,[data-hint]:hover:before,[data-hint]:hover:after{-webkit-transition-delay:100ms;-moz-transition-delay:100ms;transition-delay:100ms}.hint:before,[data-hint]:before{content:'';position:absolute;background:transparent;border:6px solid transparent;z-index:1000001}.hint:after,[data-hint]:after{content:attr(data-hint);background:#383838;color:#fff;padding:8px 10px;font-size:12px;line-height:12px;white-space:nowrap}.hint--top:before{border-top-color:#383838}.hint--bottom:before{border-bottom-color:#383838}.hint--left:before{border-left-color:#383838}.hint--right:before{border-right-color:#383838}.hint--top:before{margin-bottom:-12px}.hint--top:after{margin-left:-18px}.hint--top:before,.hint--top:after{bottom:100%;left:50%}.hint--top:hover:after,.hint--top:hover:before,.hint--top:focus:after,.hint--top:focus:before{-webkit-transform:translateY(-8px);-moz-transform:translateY(-8px);transform:translateY(-8px)}.hint--bottom:before{margin-top:-12px}.hint--bottom:after{margin-left:-18px}.hint--bottom:before,.hint--bottom:after{top:100%;left:50%}.hint--bottom:hover:after,.hint--bottom:hover:before,.hint--bottom:focus:after,.hint--bottom:focus:before{-webkit-transform:translateY(8px);-moz-transform:translateY(8px);transform:translateY(8px)}.hint--right:before{margin-left:-12px;margin-bottom:-6px}.hint--right:after{margin-bottom:-14px}.hint--right:before,.hint--right:after{left:100%;bottom:50%}.hint--right:hover:after,.hint--right:hover:before,.hint--right:focus:after,.hint--right:focus:before{-webkit-transform:translateX(8px);-moz-transform:translateX(8px);transform:translateX(8px)}.hint--left:before{margin-right:-12px;margin-bottom:-6px}.hint--left:after{margin-bottom:-14px}.hint--left:before,.hint--left:after{right:100%;bottom:50%}.hint--left:hover:after,.hint--left:hover:before,.hint--left:focus:after,.hint--left:focus:before{-webkit-transform:translateX(-8px);-moz-transform:translateX(-8px);transform:translateX(-8px)}.hint--always:after,.hint--always:before{opacity:1;visibility:visible}.hint--always.hint--top:after,.hint--always.hint--top:before{-webkit-transform:translateY(-8px);-moz-transform:translateY(-8px);transform:translateY(-8px)}.hint--always.hint--bottom:after,.hint--always.hint--bottom:before{-webkit-transform:translateY(8px);-moz-transform:translateY(8px);transform:translateY(8px)}.hint--always.hint--left:after,.hint--always.hint--left:before{-webkit-transform:translateX(-8px);-moz-transform:translateX(-8px);transform:translateX(-8px)}.hint--always.hint--right:after,.hint--always.hint--right:before{-webkit-transform:translateX(8px);-moz-transform:translateX(8px);transform:translateX(8px)}
|
||||
@@ -1,6 +1,6 @@
|
||||
// Core
|
||||
$core-text: #fff;
|
||||
$core-accent: #1BB3E9;
|
||||
$core-accent: #0082BA;
|
||||
$secondary-link: #F6635E;
|
||||
$white: #fff;
|
||||
$black: #000;
|
||||
|
||||
@@ -54,6 +54,9 @@
|
||||
// Pages
|
||||
@import "template/pages";
|
||||
|
||||
// Tooltips
|
||||
// @import "template/tips";
|
||||
|
||||
// Custom
|
||||
@import "template/custom";
|
||||
|
||||
|
||||
@@ -120,6 +120,10 @@ $update-height: 3rem;
|
||||
#admin-main {
|
||||
margin-left: $sidebar-width;
|
||||
|
||||
.hint:after, [data-hint]:after {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 1.5rem;
|
||||
|
||||
@@ -26,6 +26,23 @@
|
||||
&:hover {
|
||||
background: lighten($content-bg,2%);
|
||||
}
|
||||
|
||||
p.page-route {
|
||||
display: block;
|
||||
margin: -10px 0 5px 25px;
|
||||
line-height: 1;
|
||||
font-size: 0.9rem;
|
||||
color: darken($content-bg,30%);
|
||||
text-shadow: 1px 1px 0 $white;
|
||||
}
|
||||
|
||||
// fix for hint alignment
|
||||
.hint--bottom:before, .hint--bottom:after {
|
||||
left: 4px;
|
||||
}
|
||||
.hint:after, [data-hint]:after {
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.page-tools {
|
||||
@@ -44,15 +61,81 @@
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.page-icon {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 100%;
|
||||
background: #0082BA;
|
||||
margin-right: 10px;
|
||||
.page-info {
|
||||
font-size: 1.1rem;
|
||||
margin-left: 10px;
|
||||
color: darken($content-bg, 20%);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.page-icon {
|
||||
|
||||
color: #0082BA;
|
||||
font-weight: 700;
|
||||
|
||||
&.children-open:before {
|
||||
content: '\f056';
|
||||
}
|
||||
|
||||
&.children-closed:before{
|
||||
content: '\f055';
|
||||
}
|
||||
|
||||
&.not-routable {
|
||||
color: #CE431D;
|
||||
}
|
||||
|
||||
&.not-visible {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
&.modular {
|
||||
color: #9055AF;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
#page-filtering {
|
||||
margin: -2rem $padding-default 1rem;
|
||||
@include clearfix;
|
||||
|
||||
.page-filters {
|
||||
width: 60%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.page-search {
|
||||
position: relative;
|
||||
width: 40%;
|
||||
float: left;
|
||||
padding-left: 2rem;
|
||||
text-indent: 2.5rem;
|
||||
&:after {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
content: '\f002';
|
||||
font-family: 'FontAwesome';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
form .selectize-control.multi .selectize-input > {
|
||||
div, div.active {
|
||||
color: $white;
|
||||
padding: 2px 10px;
|
||||
&[data-value='Routable'] {
|
||||
background: #CE431D;
|
||||
}
|
||||
&[data-value='Visible'] {
|
||||
background: #999;
|
||||
}
|
||||
&[data-value='Modular'] {
|
||||
background: #9055AF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@for $i from 0 to 10 {
|
||||
|
||||
@@ -2,15 +2,24 @@
|
||||
|
||||
{% macro loop(page, base_url, depth) %}
|
||||
{% for p in page.children %}
|
||||
|
||||
{% set description = (not p.page ? 'Folder • ' : 'Page • ') ~
|
||||
(p.modular ? 'Modular • ' : '') ~
|
||||
(p.routable ? 'Routable • ' : 'Not Routable • ') ~
|
||||
(p.visible ? 'Visible • ' : 'Not Visible • ') %}
|
||||
|
||||
|
||||
<li class="page-item">
|
||||
<div class="row">
|
||||
<span class="page-icon {{ p.visible ? 'visible' : (not p.page ? 'folder' : (p.routable ? 'page' : 'not-routable')) }}"></span>
|
||||
{{ p.menu }} {{ p.modular() ? '(Modular)' }}
|
||||
<span data-hint="{{ description|trim(' • ') }}" class="hint--bottom">
|
||||
<i class="page-icon fa fa-fw fa-circle-o {{ p.children.count > 0 ? 'children-open' : ''}} {{ p.modular ? 'modular' : (not p.routable ? 'not-routable' : (not p.visible ? 'not-visible' : (not p.page ? 'folder' : ''))) }}"></i>
|
||||
</span>
|
||||
<a href="{{ base_url }}/pages/{{ p.route|trim('/') }}" class="page-edit">{{ p.menu }}</a>
|
||||
<span class="page-home">{{ p.home ? '<i class="fa fa-home"></i>' }}</span>
|
||||
<span class="page-tools">
|
||||
<a href="{{ base_url }}/pages/{{ p.route|trim('/') }}" class="page-edit"><i class="fa fa-pencil"></i></a>
|
||||
<a href="{{ base_url }}/pages/{{ p.route|trim('/') }}/task:delete" class="page-delete"><i class="fa fa-close"></i></a>
|
||||
</span>
|
||||
<p class="page-route">{{ p.route }}</p>
|
||||
</div>
|
||||
{% if p.children.count > 0 and not p.modular() %}
|
||||
|
||||
@@ -28,9 +37,6 @@
|
||||
{% endif %}
|
||||
|
||||
|
||||
{% block javascript %}
|
||||
{% endblock %}
|
||||
|
||||
{% block titlebar %}
|
||||
<div class="button-bar">
|
||||
{% if not uri.param('new') %}
|
||||
@@ -60,8 +66,8 @@
|
||||
{% include 'partials/messages.html.twig' %}
|
||||
|
||||
<div class="admin-block clear">
|
||||
{% if uri.param('new') %}
|
||||
{% include 'partials/messages.html.twig' %}
|
||||
{% if uri.param('new') %}
|
||||
{% include 'partials/blueprints-new.html.twig' with { blueprints: admin.blueprints('page'), data: context } %}
|
||||
{% elseif context %}
|
||||
{% if not uri.param('expert') %}
|
||||
@@ -70,11 +76,17 @@
|
||||
{% include 'partials/blueprints-raw.html.twig' with { blueprints: admin.blueprints('page'), data: context } %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
|
||||
<form id="page-filtering">
|
||||
<div class="page-filters">
|
||||
<input type="text" placeholder="Add Filters" class="fancy" value="Routable,Visible,Modular" name="page-filter" />
|
||||
</div>
|
||||
<div class="page-search">
|
||||
<input type="text" placeholder="Search Pages" name="page-search" />
|
||||
</div>
|
||||
</form>
|
||||
<ul class="pages-list depth-0">
|
||||
{{ _self.loop(pages, base_url_relative, 0) }}
|
||||
</ul>
|
||||
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
@@ -20,6 +20,7 @@
|
||||
<link rel="stylesheet" href="{{ theme_url }}/css/font-awesome.min.css" type="text/css" />
|
||||
<link rel="stylesheet" href="{{ theme_url }}/css/chartist.min.css" type="text/css" />
|
||||
<link rel="stylesheet" href="{{ theme_url }}/css/selectize.min.css" type="text/css" />
|
||||
<link rel="stylesheet" href="{{ theme_url }}/css/hint.base.min.css" type="text/css" />
|
||||
<!--[if IE 9]>
|
||||
<link rel="stylesheet" href="{{ theme_url }}/css/nucleus-ie9.css" type="text/css" />
|
||||
<link rel="stylesheet" href="{{ theme_url }}/css/pure-0.5.0/grids-min.css" type="text/css" />
|
||||
|
||||
Reference in New Issue
Block a user