Browse Source

Some polish to Zen Mode.

Rafał Pitoń 11 years ago
parent
commit
e0ed004128
2 changed files with 9 additions and 7 deletions
  1. 2 2
      static/cranefly/css/cranefly.css
  2. 7 5
      static/cranefly/css/cranefly/editor.less

+ 2 - 2
static/cranefly/css/cranefly.css

@@ -819,8 +819,8 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{color:#333;text-decoration:n
 .editor .editor-actions .editor-tools{margin:0;margin-right:10.5px}.editor .editor-actions .editor-tools li{float:left;margin-right:10.5px}.editor .editor-actions .editor-tools li .btn{display:block;padding-left:0;padding-right:0;width:28px;text-align:center}.editor .editor-actions .editor-tools li .btn i{margin:0}
 .editor .editor-actions .editor-tools{margin:0;margin-right:10.5px}.editor .editor-actions .editor-tools li{float:left;margin-right:10.5px}.editor .editor-actions .editor-tools li .btn{display:block;padding-left:0;padding-right:0;width:28px;text-align:center}.editor .editor-actions .editor-tools li .btn i{margin:0}
 .editor .editor-actions .editor-help{line-height:30.5px}
 .editor .editor-actions .editor-help{line-height:30.5px}
 .form-container .editor{border-color:#ccc}.form-container .editor .editor-actions{border-top-color:#ccc}
 .form-container .editor{border-color:#ccc}.form-container .editor .editor-actions{border-top-color:#ccc}
-.zen-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0}.zen-overlay>div{background:#fff;position:absolute;top:0;left:0;right:0;bottom:0;z-index:1035}.zen-overlay>div .container{height:100%;position:relative}.zen-overlay>div .container textarea{border:none;border-radius:0;box-shadow:none;display:block;margin:0 auto;margin-top:2%;padding:0 17.5px;width:90%;height:91%;color:#333;font-family:Monaco,Menlo,Consolas,"Courier New",monospace;font-size:28px;line-height:40px}
-.zen-overlay>div .container .overlay-options{background-color:#222;border-radius:6px;position:absolute;top:4%;right:7.5px}.zen-overlay>div .container .overlay-options ul{margin:0;padding:4px;list-style:none}.zen-overlay>div .container .overlay-options ul li{margin:4px;padding:0}.zen-overlay>div .container .overlay-options ul li a{border-radius:3px;display:block;padding:6px 0;width:32px;color:#999;font-size:17.5px;text-align:center}.zen-overlay>div .container .overlay-options ul li a:hover{color:#fff;text-decoration:none}
+.zen-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0}.zen-overlay>div{background:#f7f7f7;position:absolute;top:0;left:0;right:0;bottom:0;z-index:1035}.zen-overlay>div .container{height:100%;position:relative}.zen-overlay>div .container textarea{background:none;border:none;border-radius:0;box-shadow:none;display:block;margin:0 auto;margin-top:2%;padding:0 17.5px;resize:none;width:90%;height:91%;color:#555;font-family:Monaco,Menlo,Consolas,"Courier New",monospace;font-size:21px;line-height:30px}
+.zen-overlay>div .container .overlay-options{background-color:#222;border-radius:6px;position:absolute;top:4%;right:-8.5px}.zen-overlay>div .container .overlay-options ul{margin:0;padding:4px;list-style:none}.zen-overlay>div .container .overlay-options ul li{margin:4px;padding:0}.zen-overlay>div .container .overlay-options ul li a{border-radius:3px;display:block;padding:6px 0;width:32px;color:#999;font-size:17.5px;text-align:center}.zen-overlay>div .container .overlay-options ul li a:hover{color:#fff;text-decoration:none}
 .zen-overlay>div .container .overlay-options ul li a:active{background-color:#eee;color:#333}
 .zen-overlay>div .container .overlay-options ul li a:active{background-color:#eee;color:#333}
 .zen-overlay>div .container .overlay-options ul li hr{border-color:#333;border-bottom:none;margin:0}
 .zen-overlay>div .container .overlay-options ul li hr{border-color:#333;border-bottom:none;margin:0}
 .error-page{text-align:center}.error-page .error-color{color:#cf402e}
 .error-page{text-align:center}.error-page .error-color{color:#cf402e}

+ 7 - 5
static/cranefly/css/cranefly/editor.less

@@ -121,7 +121,7 @@
   bottom:0;
   bottom:0;
 
 
   &>div {
   &>div {
-    background: @white;
+    background: darken(@white, 3%);
     position:absolute;
     position:absolute;
     top:0;
     top:0;
     left:0;
     left:0;
@@ -134,6 +134,7 @@
       position: relative;
       position: relative;
 
 
       textarea {
       textarea {
+        background: none;
         border: none;
         border: none;
         border-radius: 0;
         border-radius: 0;
         box-shadow: none;
         box-shadow: none;
@@ -141,13 +142,14 @@
         margin: 0 auto;
         margin: 0 auto;
         margin-top: 2%;
         margin-top: 2%;
         padding: 0px @fontSizeLarge;
         padding: 0px @fontSizeLarge;
+        resize: none;
         width: 90%;
         width: 90%;
         height: 91%;
         height: 91%;
 
 
-        color: @textColor;
+        color: @gray;
         font-family: @monoFontFamily;
         font-family: @monoFontFamily;
-        font-size: @baseFontSize * 2;
-        line-height: @baseLineHeight * 2;
+        font-size: @baseFontSize * 1.5;
+        line-height: @baseLineHeight * 1.5;
       }
       }
 
 
       .overlay-options {
       .overlay-options {
@@ -155,7 +157,7 @@
         border-radius: 6px;
         border-radius: 6px;
         position: absolute;
         position: absolute;
         top: 4%;
         top: 4%;
-        right: @fontSizeLarge - 10px;
+        right: @fontSizeLarge - 26px;
 
 
         ul {
         ul {
           margin: 0px;
           margin: 0px;