search

petrosh / snippetrosh

Notes with Issues
MIT License
1 stars 3 forks source link

Atom #12

Open petrosh opened 9 years ago

petrosh commented 9 years ago
petrosh commented 7 years ago

Snippets

# Your snippets
#
# Atom snippets allow you to enter a simple prefix in the editor and hit tab to
# expand the prefix into a larger code block with templated values.
#
# You can create a new snippet in this file by typing "snip" and then hitting
# tab.
#
# An example CoffeeScript snippet to expand log to console.log:
#
# '.source.coffee':
#   'Console log':
#     'prefix': 'log'
#     'body': 'console.log $1'
#
'.source.sass, .source.css':
  'MarginPaddingZero':
    'prefix': 'mpz'
    'body': 'marign: 0px;\npadding: 0px;\n'

'.source.sass':
  'MarginPaddingZero':
    'prefix': 'mpz'
    'body': 'marign: 0px\npadding: 0px\n'

# HTML Boilerplate
# from https://github.github.io/fetch/
'.text.html':
  'htmlHeader':
    prefix: 'htmlHeader'
    body: """
    <!doctype html>
    <title>${1:title}</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="${2:style.css}">

    <header>
        <h1>$1</h1>
        <nav>$4</nav>
    </header>

    <main>$6</main>

    <footer>$5</footer>

    <script src="${3:script.js}"></script>
    $0
    """
    description: 'HTML with `header` from fetch'
    rightLabelHTML: '<span style="color:#ff0;">HTML <span style="font-style:italic;">header</span></span>'
    descriptionMoreURL: 'https://github.github.io/fetch/'

  'htmlSections':
    prefix: 'htmlSections'
    body: """
    <!doctype html>
    <title>${1:title}</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="${2:style.css}">

    <h1>$1</h1>
    <nav>$4</nav>

    <section id="$6">
        <h2>$6</h2>
    </section>

    <footer>$5</footer>

    <script src="${3:script.js}"></script>
    $0
    """
    description: 'HTML with `section` from fetch'
    rightLabelHTML: '<span style="color:#f90;">HTML <span style="font-style:italic;">sectioned</span></span>'
petrosh commented 7 years ago

Styles

/*
 * Your Stylesheet
 *
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed.
 *
 * If you are unfamiliar with LESS, you can read more about it here:
 * http://www.lesscss.org
 */

.tree-view {
  font-size: 18px;
}

atom-text-editor {
  //background-color: hsla(210, 6%, 6%, 1) !important; // was #1d1f21
}

.atom-text-editor .cursor {

}

.scrollbars-visible-always {
  /deep/ ::-webkit-scrollbar {
    &-thumb { background: rgba(179, 179, 179, .5) !important; }
  }
}

//Cursor Line

atom-text-editor::shadow {
  // The cursor line important to use rgba for opacity, also requires !important
  // to override any theme.
  .line.highlight-line {
    background: #373B41 !important;
  }
    .bracket-matcher {
        // border-bottom: 1px solid lime;
        position: absolute;
        // border: 1px solid rgba(0, 255, 0, 0.7);
        background-color: rgba(0, 255, 0, 0.3);
    }

  .selection .region {
    //background-color: rgba(48,52,57,.7);
  }

  // Replace 'solid', with 'dashed' or 'dotted' depending of what you have
  // set in the settings page.

  // This is for the bottom line (underline)
  .line.highlight-line-multi-line-solid-bottom {
    border-bottom-color: rgba(91, 94, 96, 0.2) !important;
  }

  // This is for the top line when you have the selection borders enabled.
  .line.highlight-line-multi-line-solid-top {
    border-top-color: red;
  }
}

atom-text-editor.is-focused::shadow {
  ruler-view.rulerz {
    border-left-color: rgba(91, 94, 96, 0.2);
  }
}

atom-text-editor::shadow .hard-tab {
  opacity: 0;
    text-decoration: line-through;
  background-color: none;
}

.editor{
  .cursor-line{
    border-bottom: 1px solid black;
  }
}
petrosh commented 6 years ago

2017

styles.less ```less /* * Your Stylesheet * * This stylesheet is loaded when Atom starts up and is reloaded automatically * when it is changed and saved. * * Add your own CSS or Less to fully customize Atom. * If you are unfamiliar with Less, you can read more about it here: * http://lesscss.org */ // variabiles @gutter-darker: #1d1f28; @almost-black: rgba(0,0,0,.4); @almost-white: rgba(255,255,255,.2); @dirty-white: rgba(255,255,255,.1); @more-black: rgba(0,0,0,.6); @black: rgba(0,0,0,.9); @status-modified: #ff9d79; @status-added: #50fa7b; @wrap-guide-color: #0a4d5e; /* * Examples * (To see them, uncomment and save) */ // TREE VIEW .tree-view { font-size: 115%; background-color: @almost-black; // status added .list-tree li.status-added, .list-tree li.list-nested-item.status-added > .list-item, .list-tree li.selected.status-added{ color: @status-added; } // status modified .list-tree li.status-modified, .list-tree li.list-nested-item.status-modified > .list-item, .list-tree li.selected.status-modified{ color: @status-modified; } } // style the background and foreground colors on the atom-text-editor-element itself atom-text-editor { background-color: @almost-black; // GUTTER line numbers .gutter{ border-right: 1px solid @dirty-white; background-color: @gutter-darker; } // Focused pane &.is-focused{ // GUTTER neon .gutter{ border-right: 1px solid #BD93F9; } // CURSOR .line.cursor-line{ // background: #24252f; background: linear-gradient(to top,#303241 0%,transparent 25%); } } } // style UI elements inside atom-text-editor atom-text-editor{ .cursor { // border-color: red; } .scroll-view{ padding: .1em .5em; } } // Settings view .settings-view .config-menu, .settings-view .panels{ background: @more-black; } // TAB BAR .vertical .tab-bar{ font-size: 115%; width: 10em; background: @almost-black; } // Hide wrap guide at 80 char .wrap-guide{ visibility: hidden; } // PANES atom-pane-container atom-pane{ border-bottom-color: @almost-white; } ```
config.cson ```cson "*": "atom-browser": viewShowBackground: true "browser-plus": currentFile: false homepage: "http://localhost:4000/" core: disabledPackages: [ "autocomplete-html" ] telemetryConsent: "limited" themes: [ "one-dark-ui" "dracula-syntax" ] editor: fontSize: 18 lineHeight: 1.43 "exception-reporting": userId: "42c64f09-4549-4992-a596-e947965e782a" welcome: showOnStartup: false ```
petrosh commented 6 years ago

2018