mirror of
https://github.com/getgrav/grav-plugin-admin.git
synced 2025-11-14 17:26:10 +01:00
Merge branch 'feature/mobile' into develop
This commit is contained in:
unknown
@@ -277,7 +277,7 @@ hr {
|
||||
* CSS TOGGLE SWITCHES
|
||||
* Unlicense
|
||||
*
|
||||
* Ionuț Colceriu - ghinda.net
|
||||
* Ionuț Colceriu - ghinda.net
|
||||
* https://github.com/ghinda/css-toggle-switch
|
||||
*
|
||||
*/
|
||||
@@ -448,7 +448,7 @@ hr {
|
||||
*/
|
||||
.switch-grav {
|
||||
background-color: #fff;
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
border-radius: 4px;
|
||||
/* Selected ON switch-light
|
||||
*/ }
|
||||
@@ -579,7 +579,7 @@ form .selectize-control.multi .selectize-input {
|
||||
border-radius: 2px;
|
||||
line-height: 1.5; }
|
||||
form .selectize-control.multi .selectize-input > div.active {
|
||||
background: #d5d5d5; }
|
||||
background: #d4d4d4; }
|
||||
form .selectize-control.single .selectize-input:after {
|
||||
right: 27px; }
|
||||
form .selectize-control.single .selectize-input.dropdown-active:after {
|
||||
@@ -598,7 +598,7 @@ form .large {
|
||||
height: 10rem; }
|
||||
form select {
|
||||
width: 100%;
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
background: #fff;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
@@ -608,17 +608,17 @@ form select {
|
||||
margin: 0; }
|
||||
form input[type=text], form input[type=password], form input[type=email] {
|
||||
width: 100%;
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
background: #fff; }
|
||||
form input[readonly=readonly] {
|
||||
background: #f2f2f2;
|
||||
font-weight: bold; }
|
||||
form textarea {
|
||||
width: 100%;
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
background: #fff; }
|
||||
form .form-frontmatter-wrapper {
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
border-radius: 4px; }
|
||||
form .switch-toggle label {
|
||||
cursor: pointer; }
|
||||
@@ -664,7 +664,7 @@ form .checkboxes {
|
||||
margin-right: 10px;
|
||||
position: absolute;
|
||||
background: #fff;
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
border-radius: 4px; }
|
||||
form .checkboxes input[type=checkbox] {
|
||||
display: none; }
|
||||
@@ -681,7 +681,7 @@ form .checkboxes {
|
||||
margin-bottom: 3rem; }
|
||||
.form-frontmatter-wrapper .dragbar {
|
||||
height: 4px;
|
||||
background: #d5d5d5;
|
||||
background: #d4d4d4;
|
||||
cursor: row-resize; }
|
||||
|
||||
#frontmatter + .CodeMirror {
|
||||
@@ -696,7 +696,7 @@ form .checkboxes {
|
||||
.form-order-wrapper ul#ordering li {
|
||||
padding: 0.2rem 1rem;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
background: #f8f8f8;
|
||||
color: #8d959a;
|
||||
margin: 3px 0;
|
||||
@@ -720,7 +720,7 @@ form .checkboxes {
|
||||
cursor: move;
|
||||
padding: 1rem;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
background: #f8f8f8;
|
||||
color: #8d959a;
|
||||
margin: 3px 0;
|
||||
@@ -812,6 +812,11 @@ tr {
|
||||
flex: 2; }
|
||||
tr td:first-child {
|
||||
padding-left: 3rem; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
tr td:first-child {
|
||||
padding-left: .5rem; }
|
||||
tr td:first-child .plugin-update-button {
|
||||
float: left; } }
|
||||
tr td:last-child, tr td.gpm-actions {
|
||||
padding-right: 3rem; }
|
||||
tr td.gpm-actions {
|
||||
@@ -826,6 +831,9 @@ tr {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #f7f7f7; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
tr td.gpm-details {
|
||||
word-wrap: break-word; } }
|
||||
tr td.gpm-details > .table-wrapper {
|
||||
display: none; }
|
||||
tr td.gpm-details > .table-wrapper td {
|
||||
@@ -846,21 +854,21 @@ tr {
|
||||
color: #fff; }
|
||||
.button.dropdown-toggle {
|
||||
background: #54c5b0;
|
||||
border-left: 1px solid #3bab97; }
|
||||
border-left: 1px solid #3aab97; }
|
||||
.button.dropdown-toggle {
|
||||
border-left: 1px solid #3bab97; }
|
||||
border-left: 1px solid #3aab97; }
|
||||
.button.secondary {
|
||||
background: #2a7a6b;
|
||||
background: #29796b;
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
border-radius: 4px; }
|
||||
.button.secondary:hover {
|
||||
background: #318d7c;
|
||||
background: #2f8c7c;
|
||||
color: #fff; }
|
||||
.button.secondary.dropdown-toggle {
|
||||
background: #318d7c;
|
||||
border-left: 1px solid #23675a; }
|
||||
background: #2f8c7c;
|
||||
border-left: 1px solid #23665a; }
|
||||
.button.secondary.dropdown-toggle {
|
||||
border-left: 1px solid #318d7c; }
|
||||
border-left: 1px solid #2f8c7c; }
|
||||
|
||||
.button-group {
|
||||
position: relative;
|
||||
@@ -902,7 +910,7 @@ tr {
|
||||
background-color: #41bea8;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid #3bab97;
|
||||
border: 1px solid #3aab97;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
border-radius: 4px;
|
||||
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
@@ -969,7 +977,7 @@ tr {
|
||||
#admin-login .form-data {
|
||||
padding-right: 0; }
|
||||
#admin-login h1 {
|
||||
background: #21333e url(../images/logo.png) 50% 50% no-repeat;
|
||||
background: #20333e url(../images/logo.png) 50% 50% no-repeat;
|
||||
font-size: 0;
|
||||
color: transparent;
|
||||
height: 216px;
|
||||
@@ -985,15 +993,15 @@ tr {
|
||||
text-align: center;
|
||||
font-weight: 300;
|
||||
-webkit-font-smoothing: auto;
|
||||
border: 1px solid #1e2e39; }
|
||||
border: 1px solid #1d2e38; }
|
||||
#admin-login form input::-webkit-input-placeholder {
|
||||
color: #83949d; }
|
||||
color: #83949c; }
|
||||
#admin-login form input::-moz-placeholder {
|
||||
color: #83949d; }
|
||||
color: #83949c; }
|
||||
#admin-login form input:-moz-placeholder {
|
||||
color: #83949d; }
|
||||
color: #83949c; }
|
||||
#admin-login form input:-ms-input-placeholder {
|
||||
color: #83949d; }
|
||||
color: #83949c; }
|
||||
#admin-login form .form-actions {
|
||||
text-align: center;
|
||||
margin: 0 -3rem -3rem -3rem;
|
||||
@@ -1011,13 +1019,18 @@ tr {
|
||||
bottom: 0;
|
||||
width: 20%;
|
||||
background: #253A47; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-sidebar {
|
||||
display: none;
|
||||
width: 75%;
|
||||
z-index: 999999; } }
|
||||
#admin-sidebar a {
|
||||
color: #cccccc; }
|
||||
#admin-sidebar a:hover {
|
||||
color: #fff; }
|
||||
|
||||
#admin-logo {
|
||||
background: #21333e;
|
||||
background: #20333e;
|
||||
height: 4.2rem; }
|
||||
#admin-logo h3 {
|
||||
text-transform: uppercase;
|
||||
@@ -1031,7 +1044,7 @@ tr {
|
||||
|
||||
#admin-user-details {
|
||||
padding: 2rem;
|
||||
border-bottom: 1px solid #21333e;
|
||||
border-bottom: 1px solid #20333e;
|
||||
overflow: hidden; }
|
||||
#admin-user-details img {
|
||||
-webkit-transition: all 0.5s ease;
|
||||
@@ -1039,10 +1052,16 @@ tr {
|
||||
transition: all 0.5s ease;
|
||||
border-radius: 100%;
|
||||
float: left; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
#admin-user-details img {
|
||||
float: none; } }
|
||||
#admin-user-details:hover img {
|
||||
box-shadow: 0px 0px 0 50px #2a4251; }
|
||||
#admin-user-details .admin-user-names {
|
||||
margin-left: 45px; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
#admin-user-details .admin-user-names {
|
||||
margin-left: 0; } }
|
||||
#admin-user-details .admin-user-names h4, #admin-user-details .admin-user-names h5 {
|
||||
color: #e6e6e6;
|
||||
margin: 0;
|
||||
@@ -1066,7 +1085,7 @@ tr {
|
||||
#admin-menu li .badges .badge {
|
||||
display: inline-block;
|
||||
margin-right: -5px;
|
||||
color: #e6e6e6; }
|
||||
color: #e5e5e5; }
|
||||
#admin-menu li .badges .count {
|
||||
background-color: #365569; }
|
||||
#admin-menu li .badges .updates {
|
||||
@@ -1088,14 +1107,20 @@ tr {
|
||||
padding-top: 0.7rem;
|
||||
padding-bottom: 0.7rem;
|
||||
color: #d1dee7; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
#admin-menu li a {
|
||||
padding-left: 20px; } }
|
||||
#admin-menu li a i {
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
color: #afc7d5;
|
||||
margin-right: 8px; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
#admin-menu li a i {
|
||||
display: none; } }
|
||||
#admin-menu li a:hover {
|
||||
background: #21333e;
|
||||
background: #20333e;
|
||||
color: #fff; }
|
||||
#admin-menu li a:hover i {
|
||||
font-size: 1.2rem; }
|
||||
@@ -1104,11 +1129,18 @@ tr {
|
||||
color: #fff;
|
||||
padding-left: 16px;
|
||||
border-left: 9px solid #349886; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
#admin-menu li.selected a {
|
||||
padding-left: 11px; } }
|
||||
#admin-menu li.selected a i {
|
||||
color: #e1eaf0; }
|
||||
|
||||
#admin-main {
|
||||
margin-left: 20%; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main {
|
||||
width: 100%;
|
||||
margin-left: 0; } }
|
||||
#admin-main .hint:after, #admin-main [data-hint]:after {
|
||||
font-size: 0.9rem;
|
||||
width: 400px;
|
||||
@@ -1123,8 +1155,14 @@ tr {
|
||||
position: relative;
|
||||
height: 4.2rem;
|
||||
padding: 0 3rem; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main .titlebar h1 i:before {
|
||||
content: "\f0c9"; } }
|
||||
#admin-main .titlebar .button-bar {
|
||||
padding: 0; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main .titlebar .button-bar {
|
||||
display: none; } }
|
||||
#admin-main .titlebar .preview {
|
||||
color: #fff;
|
||||
font-size: 90%; }
|
||||
@@ -1172,11 +1210,35 @@ tr {
|
||||
-webkit-transition: margin-top 0.15s ease-out;
|
||||
-moz-transition: margin-top 0.15s ease-out;
|
||||
transition: margin-top 0.15s ease-out; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main .grav-update.grav {
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
bottom: 0;
|
||||
width: 100%; }
|
||||
#admin-main .grav-update.grav p * {
|
||||
display: none; }
|
||||
#admin-main .grav-update.grav p {
|
||||
font-size: 0; }
|
||||
#admin-main .grav-update.grav p button {
|
||||
width: 95%;
|
||||
display: inherit;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
margin-left: 2.5%;
|
||||
margin-right: 2.5%;
|
||||
padding-left: 0; } }
|
||||
#admin-main .grav-update.grav + .content-padding {
|
||||
top: 7.2rem;
|
||||
-webkit-transition: top 0.15s ease-out;
|
||||
-moz-transition: top 0.15s ease-out;
|
||||
transition: top 0.15s ease-out; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main .grav-update.grav + .content-padding {
|
||||
top: 5.2rem;
|
||||
padding-bottom: 8rem;
|
||||
padding-top: 0rem; } }
|
||||
#admin-main .content-padding {
|
||||
position: absolute;
|
||||
top: 4.2rem;
|
||||
@@ -1185,6 +1247,9 @@ tr {
|
||||
right: 0;
|
||||
overflow-y: auto;
|
||||
padding: 2.5rem; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main .content-padding {
|
||||
left: 0; } }
|
||||
#admin-main .admin-block {
|
||||
background: #EEEEEE;
|
||||
color: #737C81;
|
||||
@@ -1198,11 +1263,27 @@ tr {
|
||||
border-bottom: 0; }
|
||||
#admin-main .admin-block .button-bar {
|
||||
margin-right: 3rem; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main .admin-block .button-bar {
|
||||
width: 100%;
|
||||
margin: -.5rem 0 1rem 0;
|
||||
text-align: center; }
|
||||
#admin-main .admin-block .button-bar .button {
|
||||
width: 100%; } }
|
||||
#admin-main .flush-bottom.button-bar {
|
||||
margin: 1rem -2rem -1rem;
|
||||
height: 70px;
|
||||
padding: 0 1rem;
|
||||
float: none; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main .flush-bottom.button-bar {
|
||||
height: auto;
|
||||
padding: 2rem 1rem 0rem 1rem; } }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-main .flush-bottom.button-bar .button {
|
||||
margin-left: 0 !important;
|
||||
margin-bottom: .5rem;
|
||||
width: 100%; } }
|
||||
#admin-main .danger, #admin-main .success {
|
||||
position: relative; }
|
||||
#admin-main .danger.button-bar, #admin-main .success.button-bar {
|
||||
@@ -1230,12 +1311,21 @@ tr {
|
||||
float: left;
|
||||
width: 50%;
|
||||
margin-bottom: 2.5rem; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-dashboard .dashboard-item {
|
||||
width: 100%; } }
|
||||
#admin-dashboard .dashboard-item > div {
|
||||
padding: 1rem 2rem; }
|
||||
#admin-dashboard .dashboard-left {
|
||||
padding-right: 1.25rem; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-dashboard .dashboard-left {
|
||||
padding-right: 0rem; } }
|
||||
#admin-dashboard .dashboard-right {
|
||||
padding-left: 1.25rem; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#admin-dashboard .dashboard-right {
|
||||
padding-left: 0rem; } }
|
||||
#admin-dashboard #updates p {
|
||||
text-align: center;
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
@@ -1269,6 +1359,11 @@ tr {
|
||||
clear: both; }
|
||||
#admin-dashboard #updates .button {
|
||||
margin-left: 0.5rem; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
#admin-dashboard #updates .button {
|
||||
width: 49%;
|
||||
padding: .3rem 0rem;
|
||||
margin-left: 0; } }
|
||||
#admin-dashboard #popularity p {
|
||||
text-align: center;
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
@@ -1445,6 +1540,9 @@ tr {
|
||||
#page-filtering .page-filters {
|
||||
width: 60%;
|
||||
float: left; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#page-filtering .page-filters {
|
||||
width: 100%; } }
|
||||
#page-filtering .page-search {
|
||||
position: relative;
|
||||
width: 40%;
|
||||
@@ -1457,6 +1555,13 @@ tr {
|
||||
top: 10px;
|
||||
content: '\f002';
|
||||
font-family: 'FontAwesome'; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
#page-filtering .page-search {
|
||||
width: 100%;
|
||||
padding-top: 1rem;
|
||||
padding-left: 0rem; }
|
||||
#page-filtering .page-search:after {
|
||||
top: 1.5rem; } }
|
||||
#page-filtering .page-shortcuts {
|
||||
clear: both;
|
||||
padding-top: 5px; }
|
||||
@@ -1722,6 +1827,12 @@ body.remodal_active .remodal {
|
||||
.tab-bar li.active span, .tab-bar li.active a {
|
||||
background: #EEEEEE;
|
||||
color: #737C81; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
.tab-bar li {
|
||||
width: 100%; }
|
||||
.tab-bar li span, .tab-bar li a {
|
||||
width: 100%;
|
||||
text-align: center; } }
|
||||
.tab-bar span, .tab-bar a {
|
||||
display: inline-block;
|
||||
padding: 0 4rem;
|
||||
@@ -1811,7 +1922,7 @@ body.remodal_active .remodal {
|
||||
border-radius: 0; }
|
||||
|
||||
.grav-mdeditor-navbar {
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
border-top-right-radius: 4px;
|
||||
border-top-left-radius: 4px;
|
||||
background: #fbfbfb; }
|
||||
@@ -1830,8 +1941,8 @@ body.remodal_active .remodal {
|
||||
.grav-mdeditor-navbar ul .mdeditor-active a {
|
||||
background: white;
|
||||
cursor: auto;
|
||||
border-left: 1px solid #d5d5d5;
|
||||
border-right: 1px solid #d5d5d5; }
|
||||
border-left: 1px solid #d4d4d4;
|
||||
border-right: 1px solid #d4d4d4; }
|
||||
.grav-mdeditor-navbar ul .mdeditor-active a:hover {
|
||||
background: #fff; }
|
||||
.grav-mdeditor-navbar ul a {
|
||||
@@ -1854,7 +1965,7 @@ body.remodal_active .remodal {
|
||||
border-top-right-radius: 4px; }
|
||||
|
||||
.grav-mdeditor-content {
|
||||
border: 1px solid #d5d5d5;
|
||||
border: 1px solid #d4d4d4;
|
||||
border-top: 0;
|
||||
border-bottom-right-radius: 4px;
|
||||
border-bottom-left-radius: 4px; }
|
||||
@@ -1898,7 +2009,7 @@ body.remodal_active .remodal {
|
||||
[data-mode=split] .grav-mdeditor-button-code, [data-mode=split] .grav-mdeditor-button-preview {
|
||||
display: none; }
|
||||
[data-mode=split] .grav-mdeditor-code {
|
||||
border-right: 1px solid #d5d5d5; }
|
||||
border-right: 1px solid #d4d4d4; }
|
||||
[data-mode=split] .grav-mdeditor-code, [data-mode=split] .grav-mdeditor-code .grav-mdeditor-preview {
|
||||
float: left;
|
||||
width: 50%; }
|
||||
@@ -1994,7 +2105,7 @@ body.remodal_active .remodal {
|
||||
|
||||
.dropzone {
|
||||
position: relative;
|
||||
border: 1px #d5d5d5 solid;
|
||||
border: 1px #d4d4d4 solid;
|
||||
border-radius: 4px;
|
||||
min-height: 4rem;
|
||||
background: #fff; }
|
||||
@@ -2331,6 +2442,9 @@ button.toast-close-button {
|
||||
padding-bottom: 1rem;
|
||||
margin-bottom: 3rem;
|
||||
overflow: hidden; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
.gpm .gpm-item-info {
|
||||
word-wrap: break-word; } }
|
||||
.gpm .gpm-item-info .gpm-item-icon {
|
||||
color: #e6e6e6;
|
||||
position: absolute;
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -349,7 +349,7 @@ $(function () {
|
||||
plugin = $('[data-gpm-plugin="' + key + '"] .gpm-name');
|
||||
url = plugin.find('a');
|
||||
if (!plugin.find('.badge.update').length) {
|
||||
plugin.append('<a href="' + url.attr('href') + '"><span class="badge update">' + translations.PLUGIN_ADMIN.UPDATE_AVAILABLE + '!</span></a>');
|
||||
plugin.append('<a class="plugin-update-button" href="' + url.attr('href') + '"><span class="badge update">' + translations.PLUGIN_ADMIN.UPDATE_AVAILABLE + '!</span></a>');
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
59
themes/grav/js/mobile.js
Normal file
59
themes/grav/js/mobile.js
Normal file
@@ -0,0 +1,59 @@
|
||||
$(document).ready(function(){
|
||||
var large_desktop_container = 75.000;
|
||||
var desktop_container= 60.000;
|
||||
var tablet_container= 48.000;
|
||||
var large_mobile_container= 30.000;
|
||||
|
||||
var mobile_only= large_desktop_container - 0.062;
|
||||
var no_mobile= tablet_container;
|
||||
var small_mobile_range= large_mobile_container;
|
||||
|
||||
var menu_state = "closed";
|
||||
|
||||
var admin_sidebar = document.getElementById("admin-sidebar");
|
||||
var overlay = document.createElement("div");
|
||||
overlay.id = "overlay";
|
||||
overlay.style.position = 'fixed';
|
||||
overlay.style.width = '25%';
|
||||
overlay.style.height = '100%';
|
||||
overlay.style.zIndex = 999999;
|
||||
overlay.style.left = '75%';
|
||||
document.body.getElementsByClassName('remodal-bg')[0].appendChild(overlay);
|
||||
document.getElementById('overlay').style.display = 'none';
|
||||
var selected = admin_sidebar.getElementsByClassName("selected")[0].getElementsByTagName("a");
|
||||
//add listener to titlebar to acivate sidebar
|
||||
document.getElementById("titlebar").addEventListener("click",function(){
|
||||
if($(window).width() / parseFloat($("body").css("font-size"))<mobile_only && menu_state=="closed") {
|
||||
//open sidebar
|
||||
console.log(menu_state);
|
||||
$(admin_sidebar).toggle("slide");
|
||||
document.getElementById('overlay').style.display = 'inherit';
|
||||
selected[0].href="javascript:void(0)";
|
||||
menu_state = "open";
|
||||
console.log(menu_state);
|
||||
}
|
||||
});
|
||||
|
||||
//enable sidebar closing;
|
||||
admin_sidebar.addEventListener("click", function(event){
|
||||
if($(window).width() / parseFloat($("body").css("font-size"))<mobile_only && menu_state == "open") {
|
||||
if(event.target == admin_sidebar || event.target == selected[0]){
|
||||
console.log(menu_state);
|
||||
$(admin_sidebar).toggle("slide");
|
||||
document.getElementById('overlay').style.display = 'none';
|
||||
menu_state = "closed";
|
||||
console.log(menu_state);
|
||||
}
|
||||
}
|
||||
});
|
||||
document.getElementById('overlay').addEventListener("click", function(event){
|
||||
if($(window).width() / parseFloat($("body").css("font-size"))<mobile_only && menu_state == "open") {
|
||||
console.log(menu_state);
|
||||
$(admin_sidebar).toggle("slide");
|
||||
document.getElementById('overlay').style.display = 'none';
|
||||
menu_state = "closed";
|
||||
console.log(menu_state);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@@ -12,6 +12,12 @@ $update-height: 3rem;
|
||||
|
||||
background: $accent-bg;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
display: none;
|
||||
width: 75%;
|
||||
z-index: 999999;
|
||||
}
|
||||
|
||||
a {
|
||||
color: shade($accent-fg,20%);
|
||||
&:hover {
|
||||
@@ -49,6 +55,10 @@ $update-height: 3rem;
|
||||
@include transition(all 0.5s ease);
|
||||
border-radius: 100%;
|
||||
float: left;
|
||||
|
||||
@include breakpoint(tablet-range){
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover img {
|
||||
@@ -58,6 +68,10 @@ $update-height: 3rem;
|
||||
.admin-user-names {
|
||||
margin-left: 45px;
|
||||
|
||||
@include breakpoint(tablet-range){
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
h4, h5 {
|
||||
color: darken($accent-fg,10%);
|
||||
margin: 0;
|
||||
@@ -129,10 +143,18 @@ $update-height: 3rem;
|
||||
|
||||
color: lighten($accent-bg,65%);
|
||||
|
||||
@include breakpoint(tablet-range){
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
i {
|
||||
@include transition(all 0.2s ease);
|
||||
color: lighten($accent-bg,55%);
|
||||
margin-right: 8px;
|
||||
|
||||
@include breakpoint(tablet-range){
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@@ -153,6 +175,10 @@ $update-height: 3rem;
|
||||
padding-left: 16px;
|
||||
border-left: 9px solid $secondary-accent-bg;
|
||||
|
||||
@include breakpoint(tablet-range){
|
||||
padding-left: 11px;
|
||||
}
|
||||
|
||||
i {
|
||||
color: lighten($accent-bg,70%);
|
||||
}
|
||||
@@ -168,6 +194,11 @@ $update-height: 3rem;
|
||||
#admin-main {
|
||||
margin-left: $sidebar-width;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.hint:after, [data-hint]:after {
|
||||
font-size: 0.9rem;
|
||||
width: 400px;
|
||||
@@ -190,11 +221,21 @@ $update-height: 3rem;
|
||||
|
||||
h1 {
|
||||
@extend %vertical-align;
|
||||
|
||||
@include breakpoint(mobile-only){
|
||||
i:before {
|
||||
content: "\f0c9";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.button-bar {
|
||||
@extend %vertical-align;
|
||||
padding: 0;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.preview {
|
||||
@@ -250,12 +291,41 @@ $update-height: 3rem;
|
||||
&.grav {
|
||||
margin-top: 0;
|
||||
@include transition (margin-top 0.15s ease-out);
|
||||
|
||||
@include breakpoint(mobile-only){
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
p * {
|
||||
display: none;
|
||||
}
|
||||
p {
|
||||
font-size: 0;
|
||||
button {
|
||||
width: 95%;
|
||||
display: inherit;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
margin-left: 2.5%;
|
||||
margin-right: 2.5%;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.grav-update.grav + .content-padding {
|
||||
top: $topbar-height + $update-height;
|
||||
@include transition (top 0.15s ease-out);
|
||||
|
||||
@include breakpoint(mobile-only){
|
||||
top: 5.2rem;
|
||||
padding-bottom: 8rem;
|
||||
padding-top: 0rem;
|
||||
}
|
||||
}
|
||||
|
||||
.content-padding {
|
||||
@@ -266,6 +336,10 @@ $update-height: 3rem;
|
||||
right: 0;
|
||||
overflow-y: auto;
|
||||
padding: 2.5rem;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.admin-block {
|
||||
@@ -286,6 +360,16 @@ $update-height: 3rem;
|
||||
|
||||
.button-bar {
|
||||
margin-right: $padding-default;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
width: 100%;
|
||||
margin: -.5rem 0 1rem 0;
|
||||
text-align: center;
|
||||
|
||||
.button {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -295,8 +379,19 @@ $update-height: 3rem;
|
||||
height: 70px;
|
||||
padding: 0 1rem;
|
||||
float: none;
|
||||
|
||||
@include breakpoint(mobile-only){
|
||||
height: auto;
|
||||
padding: 2rem 1rem 0rem 1rem;
|
||||
}
|
||||
.button {
|
||||
@extend %vertical-align;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
margin-left: 0 !important;
|
||||
margin-bottom: .5rem;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -336,6 +431,10 @@ $update-height: 3rem;
|
||||
width: 50%;
|
||||
margin-bottom: 2.5rem;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
> div {
|
||||
padding: 1rem 2rem;
|
||||
}
|
||||
@@ -345,11 +444,19 @@ $update-height: 3rem;
|
||||
|
||||
.dashboard-left {
|
||||
padding-right: 1.25rem;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
padding-right: 0rem;
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-right {
|
||||
padding-left: 1.25rem;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
padding-left: 0rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#updates {
|
||||
@@ -403,6 +510,11 @@ $update-height: 3rem;
|
||||
|
||||
.button {
|
||||
margin-left: 0.5rem;
|
||||
@include breakpoint(tablet-range){
|
||||
width: 49%;
|
||||
padding: .3rem 0rem;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -46,6 +46,10 @@
|
||||
margin-bottom: 3rem;
|
||||
overflow: hidden;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.gpm-item-icon {
|
||||
color: darken($content-bg, 3%);
|
||||
position: absolute;
|
||||
|
||||
@@ -115,6 +115,11 @@
|
||||
.page-filters {
|
||||
width: 60%;
|
||||
float: left;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.page-search {
|
||||
@@ -130,6 +135,16 @@
|
||||
content: '\f002';
|
||||
font-family: 'FontAwesome';
|
||||
}
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
width: 100%;
|
||||
padding-top: 1rem;
|
||||
padding-left: 0rem;
|
||||
|
||||
&:after {
|
||||
top: 1.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page-shortcuts {
|
||||
|
||||
@@ -45,6 +45,15 @@ tr {
|
||||
|
||||
&:first-child {
|
||||
padding-left: $padding-default;
|
||||
|
||||
@include breakpoint(mobile-only) {
|
||||
padding-left: .5rem;
|
||||
|
||||
.plugin-update-button {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&:last-child, &.gpm-actions {
|
||||
@@ -68,6 +77,10 @@ tr {
|
||||
padding: 0;
|
||||
background-color: #f7f7f7;
|
||||
|
||||
@include breakpoint(mobile-only){
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
> .table-wrapper {
|
||||
display: none;
|
||||
|
||||
|
||||
@@ -23,6 +23,13 @@ $tab-label-height:3.5em;
|
||||
color: $content-fg;
|
||||
}
|
||||
}
|
||||
@include breakpoint(mobile-only) {
|
||||
width: 100%;
|
||||
span, a {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
span, a {
|
||||
|
||||
@@ -45,6 +45,7 @@
|
||||
|
||||
{% do assets.addJs(theme_url~'/js/admin-all.js') %}
|
||||
{% do assets.addJs(theme_url~'/js/dropdown.js') %}
|
||||
{% do assets.addJs(theme_url~'/js/mobile.js') %}
|
||||
|
||||
{% do assets.addJs(theme_url~'/js/datepicker/kendo.custom.min.js') %}
|
||||
{% do assets.addJs(theme_url~'/js/datepicker/init.js') %}
|
||||
@@ -74,7 +75,7 @@
|
||||
{% endblock %}
|
||||
|
||||
<section id="admin-main" >
|
||||
<div class="titlebar secondary-accent">
|
||||
<div id="titlebar" class="titlebar secondary-accent">
|
||||
{% block titlebar %}{% endblock %}
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user