src/extensions/default/JavaScriptCodeHints/styles/brackets-js-hints.css - master - githubmirror/brackets

src/extensions/default/JavaScriptCodeHints/styles/brackets-js-hints.css
340 строк7 KB
Swagatam Mitra
Dynamic hint menu height implementations to show only 8 lines of info at any font size
07 мар 2017, 15:47
07 мар 2017, 15:474dc3df0
/*
 * Copyright (c) 2013 - present Adobe Systems Incorporated. All rights reserved.
 *  
 * Permission is hereby granted, free of charge, to any person obtaining a
 * copy of this software and associated documentation files (the "Software"), 
 * to deal in the Software without restriction, including without limitation 
 * the rights to use, copy, modify, merge, publish, distribute, sublicense, 
 * and/or sell copies of the Software, and to permit persons to whom the 
 * Software is furnished to do so, subject to the following conditions:
 *  
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 *  
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 
 * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER 
 * DEALINGS IN THE SOFTWARE.
 * 
 */


span.brackets-js-hints-with-type-details {
    width: 300px;
    display: inline-block;
}

.brackets-js-hints.type-undetermined:before {
    color: cornflowerblue;
    content: '12';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    visibility: hidden;
    line-height: 1.2em;
}

.brackets-js-hints.type-number:before {
    color: cornflowerblue;
    content: '12';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    line-height: 1.2em;
}

.brackets-js-hints.type-string:before {
    color: cornflowerblue;
    content: 'ab';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    line-height: 1.2em;
}

.brackets-js-hints.type-function:before {
    color: cornflowerblue;
    content: 'fn( )';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    line-height: 1.2em;
}

.brackets-js-hints.type-array:before {
    color: cornflowerblue;
    content: '[  ]';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    line-height: 1.2em;
}

.brackets-js-hints.type-object:before {
    color: cornflowerblue;
    content: '{ :}';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    line-height: 1.2em;
}

.brackets-js-hints.type-num-array:before {
    color: cornflowerblue;
    content: '[12]';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    line-height: 1.2em;
}

.brackets-js-hints.type-string-array:before {
    color: cornflowerblue;
    content: '[ab]';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    line-height: 1.2em;
}

.brackets-js-hints.type-boolean:before {
    color: cornflowerblue;
    content: 'bool';
    border: 1px cornflowerblue solid;
    float:left;
    width:25px;
    text-align: center;
    margin-left:-5px;
    margin-right:5px;
    line-height: 1.2em;
}

.brackets-js-hints-type-details {
    color: #a3a3a3 !important;
    font-weight: 100;
    font-style: italic !important;
    margin-right: 5px;
    float:right;
}

.jshint-description {
    display: none;
    color: #d4d4d4;
    word-wrap: break-word;	
    white-space: normal;
    box-sizing: border-box;
}

.dark .jshint-description {
    color: #ccc;
}

.jshint-jsdoc {
    display: none;
    padding-right: 10px !important;
    color: grey;
    word-wrap: break-word;
    white-space: normal;
    box-sizing: border-box;
    float: left;
    clear: left;
    max-height: 2em;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1em;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.dark .jshint-jsdoc {
    color: #ccc;
}

.jshint-link {
    display:none;
    width:0px !important;
    height:1px !important;
    margin-left: 15px;
    float:right;
}

.jshint-link:before {
    position: relative;
    float: left;
    top:1px;
    content: "i" !important;
    width: 16px;
    height: 16px;
    margin-right:10px;
    font-size: 14px;
    font-weight: bold;
    font-style: italic;
    line-height: 15px;
    text-align: center;
    visibility: visible !important;
    font-weight: 900;
    color: #fff;
    background-color: #2ea56c;
    border-color: #177F42;
    border-radius: 16px;
    font-family: SourceSansPro-Semibold;
}

.dark .jshint-link:before {
    background-color: #146a41;
}

.highlight .jshint-link {
    display: inline-block !important;
}

.highlight .jshint-description {
    display: block;
    color: #6495ed !important;
}

.highlight .jshint-jsdoc {
    display: -webkit-box;
}

.dark .brackets-js-hints-type-details {
    color: #696969 !important;
} 

.highlight .brackets-js-hints-type-details {
    display:none;
}

.brackets-js-hints-keyword {
    font-weight: 100;
    font-style: italic !important;
    margin-right: 5px;
    float:right;
    color: #6495ed !important;
}


.brackets-js-hints.priority-high {
    color: #486c00; /* green */
}

.brackets-js-hints.priority-medium {
    color: #0c50af; /* blue */
}

.brackets-js-hints.priority-low {
    color: #6b24bd; /* violet */
}

.brackets-js-hints.priority-lowest {
    color: #444; /* dark grey */
}

.brackets-js-hints.variable-hint {
}

.brackets-js-hints.property-hint {
}

.brackets-js-hints.literal-hint {
    color: #444; /* dark grey */
    font-family: SourceCodePro;
}

.brackets-js-hints.keyword-hint {
    font-family: SourceCodePro; 
}

.brackets-js-hints.keyword-hint .matched-hint {
    font-family: SourceCodePro-Medium;
    font-weight: 500; 
}

.brackets-js-hints .matched-hint {
    font-weight: 500;
}

.brackets-js-hints.guess-hint {
    font-style: italic;
}

#function-hint-container {
    display: none;

    background: #fff;
    position: absolute;
    z-index: 15;
    left: 200px;
    top: 40px;
    pointer-events: none;

    padding: 1px 6px;
    text-align: center;

    border-radius: 3px;
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.24);
}

#function-hint-container .function-hint-content {
}

.brackets-js-hints .current-parameter {
    font-weight: 500;
}

/* Dark Styles */

.dark .brackets-js-hints.priority-high {
    color: #a1f200; /* green */
}

.dark .brackets-js-hints.priority-medium {
    color: #3ff8ff; /* blue */
}

.dark .brackets-js-hints.priority-low {
    color: #e6adff; /* violet */
}

.dark .brackets-js-hints.priority-lowest {
    color: #bbb; /* dark grey */
}

.dark .brackets-js-hints.literal-hint {
    color: #bbb; /* dark grey */
    font-family: SourceCodePro;
}

.dark #function-hint-container {
    background: #000;
    border: 1px solid rgba(255,255,255,0.15);
    color: #fff;
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.24);
}