diff --git a/media/css/style.css b/media/css/style.css index 4ee898e..3ce132d 100644 --- a/media/css/style.css +++ b/media/css/style.css @@ -912,7 +912,7 @@ body.editing header.fixed-save div.inner .cancel, body.editing header.fixed-save margin-left: 10px; } body.editing header.fixed-save div.inner .save { - margin-right: 99px; + margin-right: 242px; } body.editing section.main div.inner section.snipts article.editing { margin-top: 50px; @@ -955,9 +955,57 @@ body.editing section.main div.inner section.snipts article.editing aside { margin-top: 0; width: 243px; } -body.editing section.main div.inner section.snipts article.editing aside div.inner { +body.editing section.main div.inner section.snipts article.editing aside div.in { padding-left: 10px; } -body.editing section.main div.inner section.snipts article.editing aside div.inner label { - margin: 10px 0; +body.editing section.main div.inner section.snipts article.editing aside div.in label { + margin: 20px 0; +} +body.editing section.main div.inner section.snipts article.editing aside div.in label > span { + color: #32A8F6; + display: block; + font: bold 12px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif; + margin-bottom: 5px; + text-transform: uppercase; +} +body.editing section.main div.inner section.snipts article.editing aside div.in > label { + margin-top: 6px; +} +body.editing section.main div.inner section.snipts article.editing aside div.in textarea { + height: 100px; + padding: 7px 9px; + width: 202px; +} +body.editing section.main div.inner section.snipts article.editing aside div.in label.public { + background: #EFEEEF; + border: 1px solid #DDDDDD; + cursor: pointer; + margin-right: 11px; + padding: 3px 5px; + -webkit-background-clip: padding-box; + -webkit-border-radius: 5px; + -moz-background-clip: padding-box; + -moz-border-radius: 5px; + border-radius: 5px; + background-clip: padding-box; +} +body.editing section.main div.inner section.snipts article.editing aside div.in label.public input { + display: inline-block; + margin: 4px 4px 0 4px; +} +body.editing section.main div.inner section.snipts article.editing aside div.in label.public span { + color: #7B7B79; + display: inline-block; + text-transform: none; + vertical-align: -3px; +} +body.editing section.main div.inner section.snipts article.editing aside div.in label.public.is-private { + background: #efeeef url("/static/images/private-icon-edit.png") 199px center no-repeat; +} +body.editing section.main div.inner section.snipts article.editing aside div.in label.public.is-public { + background: #F2DEDE; + border: 1px solid #EED3D7; +} +body.editing section.main div.inner section.snipts article.editing aside div.in label.public.is-public span { + color: #B94A48; } diff --git a/media/css/style.scss b/media/css/style.scss index b5211ce..b8bfd8d 100644 --- a/media/css/style.scss +++ b/media/css/style.scss @@ -1047,7 +1047,7 @@ body.editing { margin-left: 10px; } .save { - margin-right: 99px; + margin-right: 242px; } } } @@ -1101,11 +1101,57 @@ body.editing { margin-top: 0; width: 243px; - div.inner { + div.in { padding-left: 10px; label { - margin: 10px 0; + margin: 20px 0; + + & > span { + color: #32A8F6; + display: block; + font: bold 12px $Helvetica; + margin-bottom: 5px; + text-transform: uppercase; + } + } + & > label { + margin-top: 6px; + } + textarea { + height: 100px; + padding: 7px 9px; + width: 202px; + } + label.public { + background: #EFEEEF; + border: 1px solid #DDDDDD; + cursor: pointer; + margin-right: 11px; + padding: 3px 5px; + @include border-radius; + + input { + display: inline-block; + margin: 4px 4px 0 4px; + } + span { + color: #7B7B79; + display: inline-block; + text-transform: none; + vertical-align: -3px; + } + &.is-private { + background: #EFEEEF url('/static/images/private-icon-edit.png') 199px center no-repeat; + } + &.is-public { + background: #F2DEDE; + border: 1px solid #EED3D7; + + span { + color: #B94A48; + } + } } } } diff --git a/media/images/private-icon-edit.png b/media/images/private-icon-edit.png new file mode 100644 index 0000000..efa1cfc Binary files /dev/null and b/media/images/private-icon-edit.png differ diff --git a/media/js/src/modules/snipt.js b/media/js/src/modules/snipt.js index a335ff0..ca923c8 100644 --- a/media/js/src/modules/snipt.js +++ b/media/js/src/modules/snipt.js @@ -80,6 +80,19 @@ // Init chosen $('select#id_lexer', window.site.$main_edit).chosen(); + // Public / private + $('label.public input', window.site.$main_edit).on('change', function() { + var $checkbox = $(this); + var $label = $checkbox.parent(); + + if ($checkbox.attr('checked')) { + $label.removeClass('is-private').addClass('is-public'); + } else { + $label.addClass('is-private').removeClass('is-public'); + } + return false; + }).trigger('change'); + window.site.$main_edit.show(); // Ace editor diff --git a/snipts/templates/snipts/snipt-edit-js-template.html b/snipts/templates/snipts/snipt-edit-js-template.html index bf6bcc6..eac032e 100644 --- a/snipts/templates/snipts/snipt-edit-js-template.html +++ b/snipts/templates/snipts/snipt-edit-js-template.html @@ -28,9 +28,9 @@