summaryrefslogtreecommitdiff
path: root/themes
diff options
context:
space:
mode:
authorJules Laplace <jules@okfoc.us>2016-09-29 12:13:19 -0400
committerJules Laplace <jules@okfoc.us>2016-09-29 12:13:19 -0400
commitd4f9c31a1721fdea6b92ae90ca5c4bd8635fd0cb (patch)
tree4c8c73d15c77f4d79313ecb45fc650d43f65235f /themes
parent50fac2191fbf0dd101d6071242c03dfad295b3ed (diff)
v0.2.0 - new admin theme
Diffstat (limited to 'themes')
-rw-r--r--themes/okadmin/public/css/main.css591
-rw-r--r--themes/okadmin/public/js/upload.js6
-rw-r--r--themes/test/public/css/main.css (renamed from themes/okcards/public/css/main.css)0
-rw-r--r--themes/test/public/js/app.js (renamed from themes/okcards/public/js/app.js)0
-rw-r--r--themes/test/templates/404.liquid (renamed from themes/okcards/templates/404.liquid)0
-rw-r--r--themes/test/templates/5xx.liquid (renamed from themes/okcards/templates/5xx.liquid)0
-rw-r--r--themes/test/templates/index.liquid (renamed from themes/okcards/templates/index.liquid)0
-rw-r--r--themes/test/templates/partials/app.liquid (renamed from themes/okcards/templates/partials/app.liquid)0
-rw-r--r--themes/test/templates/partials/flash.liquid (renamed from themes/okcards/templates/partials/flash.liquid)0
-rw-r--r--themes/test/templates/partials/head.liquid (renamed from themes/okcards/templates/partials/head.liquid)0
-rw-r--r--themes/test/templates/partials/tail.liquid (renamed from themes/okcards/templates/partials/tail.liquid)0
-rw-r--r--themes/test/templates/resource.liquid (renamed from themes/okcards/templates/resource.liquid)0
-rw-r--r--themes/test/templates/resource_new.liquid (renamed from themes/okcards/templates/resource_new.liquid)0
13 files changed, 338 insertions, 259 deletions
diff --git a/themes/okadmin/public/css/main.css b/themes/okadmin/public/css/main.css
index 6a48e94..711a60d 100644
--- a/themes/okadmin/public/css/main.css
+++ b/themes/okadmin/public/css/main.css
@@ -1,456 +1,535 @@
* {
- box-sizing: border-box;
+ box-sizing: border-box;
}
-html, body {
- margin: 0;
- padding: 0;
- font-family: "Helvetica", sans-serif;
- font-weight: 300;
- font-size: 0.9em;
- background-image: url('http://okfoc.us/assets/images/photocopy.png');
- background-position: bottom center;
- background-repeat: repeat;
- background-attachment: scroll;
+@import 'https://fonts.googleapis.com/css?family=Roboto';
+html,
+body {
+ margin: 0;
+ padding: 0;
+ font-family: 'Roboto', sans-serif;
+ font-size: 15px;
}
-ul, ol {
- padding: 0;
- list-style: none;
+ul,
+ol {
+ padding: 0;
+ list-style: none;
}
.main.index .resource-category button,
-a {
- color: #A200FF;
- text-decoration: none;
- font-family: Monaco, monospace;
- text-transform: uppercase;
-}
+a {}
-.main.index .resource-category button:hover,
-a:hover {
- border-bottom: 1px solid #A200FF;
+.main.index .resource-category a {
+ text-decoration: none;
+ color: #000;
+ display: inline-block;
+ font-weight: 500;
+ padding: 10px 2px;
+}
+.main.index .resource-category del a {
+ text-decoration: line-through;
+ opacity: 0.5;
}
-a:visited {
- color: #A200FF;
+.main.index .resource-category li:hover {
+ background:#ccc!important;
}
+.main.index .resource-category button:hover,
+a:hover {}
+
.admin-header {
- height: 50px;
- background-color: rgba(255,255,255,0.8);
- border-bottom: 2px solid #ddd;
+ background: #000;
+ color: white;
+ padding: 5px;
+ font-size: 24px;
+ font-weight: 100;
}
-.admin-header .breadcrumb {
- margin-left: 0.5em;
- font-size: 2em;
- color: rgba(0, 0, 0, 0.25);
- line-height: 50px;
-}
-.admin-header .breadcrumb b {
- color: #333;
-}
+.admin-header .breadcrumb {}
+
+.admin-header .breadcrumb b {}
.admin-header .site-link {
- float: right;
- margin-right: 1em;
- line-height: 50px;
+ float: right;
+ color: white;
+ font-size: 11px;
}
.main.index .resource-category {
- float: left;
- min-width: 200px;
- margin: 1em;
- padding: 1em;
- background-color: #fff;
- border: 2px solid #ddd;
+ float: left;
+ min-width: 200px;
+ width: 100%;
+ padding: 0 5px;
+}
+
+.main.index .resource-category ol {
+ width: 100%;
+ columns: 4;
+ list-style-type: decimal-leading-zero;
+ list-style-position: inside;
}
.main.index .resource-category.active li:before {
- content: "፧";
- margin-right: 1em;
+ content: "::";
+ margin-right: 1em;
}
+
.resource-nav {
- background: white;
- width: 10%;
- margin: 2.5em 1em;
- padding: 1em;
- float: left;
- display: block;
+ background: white;
+ width: 12%;
+ margin: 2.5em 1em;
+ padding: 1em;
+ float: left;
+ display: block;
+}
+
+.resource-nav a {
+ color:white;
+ background: #ccc;
+ padding:5px;
+ margin-bottom: 5px;
+ text-decoration: none;
+ text-transform: lowercase;
}
h2 {
- margin-bottom: 1.5em;
- line-height: 1;
- text-transform: uppercase;
- font-size: 14px;
- letter-spacing: 6px;
- text-align: left;
- font-style: italic;
- font-family: Comic Sans MS, cursive;
- font-weight: 100;
- color: #333;
- -webkit-transform: rotate(-1deg);
- transform: rotate(-1deg);
+ font-size: 17px;
+ color: black;
+ border-bottom: 2px solid;
+ padding-bottom: 10px;
}
.main.index .resource-category nav {
- float: right;
+ margin-top: 10px;
+ width: 100%;
+ display: inline-block;
+ margin-bottom: 30px;
+}
+
+.main.index .resource-category nav a {
+ margin-right: 0px;
+ padding: 10px;
+ background: #ccc;
+ color: white;
+}
+
+.main.index .resource-category nav a:last-child {
+ background: black;
+ color: white;
}
.main.index .resource-category.active ol {
- cursor: -webkit-grab;
- cursor: grab;
+ cursor: -webkit-grab;
+ cursor: grab;
}
.main.index .resource-category.active li a {
- pointer-events: none;
+ pointer-events: none;
}
+.main.index .resource-category.active footer {
+ margin-top: -10px;
+ margin-bottom: -10px;
+}
+
+
/* Makes the button look like a link */
+
.main.index .resource-category button {
- background: none !important;
- height: 1.5em;
- border: none;
- padding: 0 !important;
- font: inherit;
- cursor: pointer;
- font-family: Monaco, monospace;
- text-transform: uppercase;
+ background: black;
+ color: white;
+ border: none;
+ padding: 10px;
+ font: inherit;
+ cursor: pointer;
+ font-family: Roboto, sans-serif;
}
.main.index .resource-category .btn {
- border-bottom: 3px solid rgba(0, 0, 0, 0);
- color: rgba(0, 0, 0, 0.25);
- line-height: 20px;
+ font-family: Roboto, sans-serif;
}
-.main.index .resource-category .btn {
- display: none;
+.main.index .resource-category .btn:hover {}
+
+.add-btn:after {
+ content: " Add Item";
}
-.main.index .resource-category .btn.active {
- display: inline;
+.main.index .resource-category .btn {
+ display: none;
}
-.main.index .resource-category .btn:hover {
- border-bottom: 1px solid rgba(0, 0, 0, 0.25);
+.main.index .resource-category .btn.active {
+ display: inline;
}
.main.index .resource-category .btn {
- margin-right: 1em;
+ margin-right: 10px;
+ font-size: 17px;
}
.main.index .resource-category .btn:last-child {
- margin-right: 0;
-}
-.main.index .resource-category .add-btn {
- font-size: 20px;
+ margin-right: 0;
}
-.main.index .resource-category li {
- margin: 1em 0;
-}
+.main.index .resource-category .add-btn {}
+.main.index .resource-category li:nth-child(2n+2) {
+ background:#f9f9f9;
+}
.main.resource {
- float: left;
- margin-top: 2em;
- width: 85%;
+ float: left;
+ margin-top: 2em;
+ width: 85%;
}
.main.resource > * {
- margin: 1em 1em;
+ margin: 1em 1em;
}
-.main.resource form {
- border-top: 1px solid #ddd;
- font-size: 1.25em;
-}
+.main.resource form {}
label {
- clear: left;
- display: block;
- float: left;
- font-weight: normal;
- background: white;
- margin-top: 0.5em;
- margin-right: 0.5em;
- margin-bottom: 1em;
- width: 10em;
- line-height: 1.5em;
- color: rgba(0, 0, 0, 0.75);
+ clear: left;
+ display: block;
+ float: left;
+ background: white;
+ margin-bottom: 1em;
+ width: 10em;
+ line-height: 17px;
+ font-weight: 500;
+ font-size: 13px;
}
+
.property label {
- border-bottom: 1px solid #000;
+ border-bottom: 1px solid #000;
}
.main.resource form .property {
- margin: 1em 0;
+ margin: 1em 0;
}
.main.resource form input,
.main.resource form textarea,
.main.resource form select,
.main.resource form img {
- display: block;
- float: left;
- width: 25em;
- font-size: 1.0em;
- color: #000;
- border: 1px solid #333;
- min-height: 2em;
- padding: 0 0.5em;
- margin-bottom: 1em;
+ display: block;
+ float: left;
+ width: 25em;
+ font-size: 1.0em;
+ color: #000;
+ border: 1px solid #333;
+ min-height: 2em;
+ padding: 0 0.5em;
+ margin-bottom: 1em;
}
+
.main.resource form input[name=id] {
- width: 15em;
+ width: 15em;
}
-button, input[type=submit] {
- cursor: pointer;
+
+button,
+input[type=submit] {
+ cursor: pointer;
}
+
.main.resource .date input {
- /* date inputs need font family override */
- font-family: "Helvetica", sans-serif;
+ /* date inputs need font family override */
+ font-family: "Helvetica", sans-serif;
}
+
.main.resource form .group {
- position: relative;
- display: block;
- float: left;
- width: 31em;
- margin-bottom: 1em;
+ position: relative;
+ display: block;
+ float: left;
+ width: 31em;
+ margin-bottom: 1em;
}
+
.main.resource form .group label {
- width: 5em;
- color: #777;
- font-size: 0.9em;
- line-height: 1.4em;
- margin-bottom: 0;
- margin-left: -5.8em;
- text-align: right;
- border: 0;
- display: none;
+ width: 5em;
+ color: #777;
+ font-size: 0.9em;
+ line-height: 1.4em;
+ margin-bottom: 0;
+ margin-left: -5.8em;
+ text-align: right;
+ border: 0;
+ display: none;
}
+
.main.resource form .group.image input,
.main.resource form .group.video input[type=text]:first-child,
.main.resource form .group.loaded.video input[type=text],
.main.resource form .group input:first-child {
- display: block;
- width: 25em;
+ display: block;
+ width: 25em;
}
+
.main.resource form .group .checkboxes,
.main.resource form .group.loaded .checkboxes {
- clear: left;
- display: block;
- max-width: 250px;
- padding-top: 5px;
+ clear: left;
+ display: block;
+ max-width: 250px;
+ padding-top: 5px;
}
+
.main.resource form .group .checkboxes input.flag,
.main.resource form .group.loaded .checkboxes input.flag {
- display: inline-block;
- max-width: 20px;
- float: none;
+ display: inline-block;
+ max-width: 20px;
+ float: none;
}
+
.main.resource form .group .checkboxes label,
.main.resource form .group.loaded .checkboxes label {
- display: inline-block;
- float: none;
- width: 70px;
- margin: 0;
- text-align: left;
+ display: inline-block;
+ float: none;
+ width: 70px;
+ margin: 0;
+ text-align: left;
}
+
.main.resource form .group.loaded label {
- display: block;
+ display: block;
}
+
.main.resource form .group.loaded input {
- display: block;
+ display: block;
}
+
.main.resource form .group input[type=text] {
- width: 20.05em;
- margin-bottom: 0.1em;
+ width: 20.05em;
+ margin-bottom: 0.1em;
}
+
.main.resource form .group.image .image-element,
.main.resource form .group.video input[type=text],
.main.resource form .group.loaded input[hidden],
.main.resource form .group.image.loaded .fields,
.main.resource form input[hidden] {
- display: none;
+ display: none;
}
+
.main.resource form .group.image.loaded .image-element {
- display: block;
+ display: block;
}
+
.main.resource form .fields {
- height: 3em;
+ height: 3em;
}
+
.main.resource form textarea {
- padding: 0.5em;
- height: 15em;
+ padding: 0.5em;
+ height: 15em;
}
+
.main.resource form select {
- margin-top: 0.5em;
+ margin-top: 0.5em;
}
+
.main.resource form button {
- float: left;
- padding: 0.5em;
- font-size: 1.0em;
- margin-top: 1.0em;
+ float: left;
+ padding: 0.5em;
+ font-size: 1.0em;
+ color: white;
+ border: 0;
+ font-weight: 500;
}
+
.main.resource form#delete_form button {
- float: right;
+ float: right;
+ background:red;
+ margin-bottom: 50px
}
+
+.main.resource form#delete_form button:hover {
+ background:black;
+}
+.main.resource form button[type="submit"]{
+ background: black;
+ font-size: 17px;
+ padding:10px;
+}
.main.resource form ol {
- margin: 0;
- padding: 0;
+ margin: 0;
+ padding: 0;
}
+
.main.resource form li {
- list-style-type: none;
- display: block;
- clear: both;
- height: 7em;
+ list-style-type: none;
+ display: block;
+ clear: both;
+ height: 7em;
}
+
.main.resource form img {
- width: auto;
- height: auto;
- max-width: 10em;
- max-height: 6em;
- border: 0;
+ width: auto;
+ height: auto;
+ max-width: 10em;
+ max-height: 6em;
+ border: 0;
}
+
.main.resource form .images img {
- cursor: -webkit-grab;
- cursor: grab;
+ cursor: -webkit-grab;
+ cursor: grab;
}
+
.main.resource form textarea.caption {
- width: 15em;
- height: 6em;
+ width: 15em;
+ height: 6em;
}
+
.main.resource form .audio-element input[type=text],
.main.resource form .video-element input[type=text] {
- width: 15em;
+ width: 15em;
}
+
.main.resource form .group input[type=text].link-input,
.main.resource form .group input[type=text].link-input-new {
- width: 13.05em;
- padding: 0 0 0 0.5em;
+ width: 13.05em;
+ padding: 0 0 0 0.5em;
}
+
.handle {
- display: block;
- width: 1em;
- height: 2em;
- background: #ddd;
- float: left;
+ display: block;
+ width: 1em;
+ height: 2em;
+ background: #ddd;
+ float: left;
}
+
.main.resource form .links li {
- height: 2em;
+ height: 2em;
}
+
.main .link-list .add-link-btn,
.main .link-list .remove-link-btn {
- margin: 0;
- height: 2em;
- line-height: 1em;
+ margin: 0;
+ height: 2em;
+ line-height: 1em;
}
+
.add-image-button {
- background: #ddd;
- clear: left;
- text-align: left;
- float: left;
- margin-right: 1em;
- position: relative;
- overflow: hidden;
- cursor: pointer;
-}
-.add-image-button:hover {
- background: #def;
+ background: #ddd;
+ clear: left;
+ text-align: left;
+ float: left;
+ margin-right: 1em;
+ position: relative;
+ overflow: hidden;
+ cursor: pointer;
}
+
+
.main.resource form .add-image-button button {
- margin: 0;
- pointer-events: none;
- width: 100%; height: 100%;
+ margin: 0;
+ pointer-events: none;
+ width: 100%;
+ height: 100%;
}
+
.add-image-button input[type=file] {
- opacity: 0;
- position: absolute;
- top: 0; left: 0;
- width: 100%; height: 100%;
- margin: 0; padding: 0;
- cursor: pointer;
+ opacity: 0;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+ cursor: pointer;
}
+
.audio-element:hover .remove,
.video-element:hover .remove,
.image-element:hover .remove {
- display: block;
+ display: block;
}
+
.audio-element .remove:hover,
.video-element .remove:hover,
.image-element .remove:hover {
- color: red;
+ color: red;
}
.progress {
- position: absolute;
- top: 0; right: -100px;
- padding: 10px 10px 0 10px;
- margin: 0px;
- width: 100px;
- pointer-events: none;
- background: #eee;
- opacity: 0;
- transition: opacity 0.3s;
+ position: absolute;
+ top: 0;
+ right: -100px;
+ padding: 10px 10px 0 10px;
+ margin: 0px;
+ width: 100px;
+ pointer-events: none;
+ background: #eee;
+ opacity: 0;
+ transition: opacity 0.3s;
}
+
.progress .xhr {
- height: 10px;
- background: black;
- margin-bottom: 10px;
- transition: all 0.2s;
+ height: 10px;
+ background: black;
+ margin-bottom: 10px;
+ transition: all 0.2s;
}
+
.progress .xhr div {
- background: white;
- transition: all 0.2s;
- height: 100%;
+ background: white;
+ transition: all 0.2s;
+ height: 100%;
}
+
.progress.loading {
- opacity: 1;
+ opacity: 1;
}
+
/*
.remove {
display: none;
}
*/
-#delete_form button:hover { color: red }
+#delete_form button:hover {
+ color: red
+}
.template {
- display: none;
+ display: none;
}
+
.disabled {
- display: none;
+ display: none;
}
+.success,
+.errors {
+ background: white;
+ padding: 10px;
+ width: 50%;
+ border: 1px solid;
+ margin: 10px 5px 0 5px;
-.success, .errors {
- background: white;
- padding: 9px 8px 7px;
- width: 50%;
- line-height: 1.4em;
- border: 1px solid;
- margin: 1em;
- border-radius: 2px;
}
.success {
- color: green;
+ color: green;
}
-.errors {
- color: red;
+
+.errors {
+ color: red;
}
.clear {
- clear: both;
+ clear: both;
}
.hidden {
- display: none;
-}
+ display: none;
+} \ No newline at end of file
diff --git a/themes/okadmin/public/js/upload.js b/themes/okadmin/public/js/upload.js
index 18fad26..0871b43 100644
--- a/themes/okadmin/public/js/upload.js
+++ b/themes/okadmin/public/js/upload.js
@@ -8,13 +8,13 @@ var OKUpload = function(){
this.imageAction = "/_services/s3/image"
this.videoAction = "/_services/s3/video"
this.audioAction = "/_services/s3/audio"
+ this.$progress = $("<div class='progress'>")
+ this.xhrCount = 0
+ this.loadCount = 0
}
OKUpload.prototype.bind = function(rapper){
var uploader = this
this.rapper = rapper
- this.$progress = $("<div class='progress'>")
- this.xhrCount = 0
- this.loadCount = 0
$(this.rapper).append(this.$progress)
$(".add-image-button input", rapper).change( uploader.handleFileSelect.bind(uploader) )
diff --git a/themes/okcards/public/css/main.css b/themes/test/public/css/main.css
index e69de29..e69de29 100644
--- a/themes/okcards/public/css/main.css
+++ b/themes/test/public/css/main.css
diff --git a/themes/okcards/public/js/app.js b/themes/test/public/js/app.js
index 1e710e9..1e710e9 100644
--- a/themes/okcards/public/js/app.js
+++ b/themes/test/public/js/app.js
diff --git a/themes/okcards/templates/404.liquid b/themes/test/templates/404.liquid
index 87f5342..87f5342 100644
--- a/themes/okcards/templates/404.liquid
+++ b/themes/test/templates/404.liquid
diff --git a/themes/okcards/templates/5xx.liquid b/themes/test/templates/5xx.liquid
index f245545..f245545 100644
--- a/themes/okcards/templates/5xx.liquid
+++ b/themes/test/templates/5xx.liquid
diff --git a/themes/okcards/templates/index.liquid b/themes/test/templates/index.liquid
index 7dee4be..7dee4be 100644
--- a/themes/okcards/templates/index.liquid
+++ b/themes/test/templates/index.liquid
diff --git a/themes/okcards/templates/partials/app.liquid b/themes/test/templates/partials/app.liquid
index 46c19e4..46c19e4 100644
--- a/themes/okcards/templates/partials/app.liquid
+++ b/themes/test/templates/partials/app.liquid
diff --git a/themes/okcards/templates/partials/flash.liquid b/themes/test/templates/partials/flash.liquid
index e51a86b..e51a86b 100644
--- a/themes/okcards/templates/partials/flash.liquid
+++ b/themes/test/templates/partials/flash.liquid
diff --git a/themes/okcards/templates/partials/head.liquid b/themes/test/templates/partials/head.liquid
index e9c27dc..e9c27dc 100644
--- a/themes/okcards/templates/partials/head.liquid
+++ b/themes/test/templates/partials/head.liquid
diff --git a/themes/okcards/templates/partials/tail.liquid b/themes/test/templates/partials/tail.liquid
index 7727d69..7727d69 100644
--- a/themes/okcards/templates/partials/tail.liquid
+++ b/themes/test/templates/partials/tail.liquid
diff --git a/themes/okcards/templates/resource.liquid b/themes/test/templates/resource.liquid
index 7dee4be..7dee4be 100644
--- a/themes/okcards/templates/resource.liquid
+++ b/themes/test/templates/resource.liquid
diff --git a/themes/okcards/templates/resource_new.liquid b/themes/test/templates/resource_new.liquid
index 7dee4be..7dee4be 100644
--- a/themes/okcards/templates/resource_new.liquid
+++ b/themes/test/templates/resource_new.liquid