mirror of
https://github.com/seejohnrun/haste-server
synced 2025-08-21 09:53:10 -07:00
Add new style
This commit is contained in:
Kenox
parent
b8760b552d
commit
4720ba5cab
7 changed files with 87 additions and 86 deletions
|
|
@ -24,7 +24,7 @@ textarea {
|
|||
/* the line numbers */
|
||||
|
||||
#linenos {
|
||||
color: #7d7d7d;
|
||||
color: #3D3F41;
|
||||
z-index: -1000;
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
|
|
@ -68,52 +68,10 @@ textarea {
|
|||
background: #2B2D30;
|
||||
}
|
||||
|
||||
#box2 {
|
||||
background: #2B2D30;
|
||||
font-size: 0px;
|
||||
padding: 0px 5px;
|
||||
}
|
||||
|
||||
#box1 a.logo, #box1 a.logo:visited {
|
||||
display: inline-block;
|
||||
background: url(logo.png);
|
||||
width: 126px;
|
||||
height: 42px;
|
||||
}
|
||||
|
||||
#box1 a.logo:hover {
|
||||
background-position: 0 bottom;
|
||||
}
|
||||
|
||||
#box2 .function {
|
||||
background: url(function-icons.png);
|
||||
width: 32px;
|
||||
height: 37px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#box2 .link embed {
|
||||
vertical-align: bottom; /* fix for zeroClipboard style */
|
||||
}
|
||||
|
||||
#box2 .function.enabled:hover {
|
||||
cursor: hand;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#pointer {
|
||||
display: block;
|
||||
height: 5px;
|
||||
width: 10px;
|
||||
background: url(hover-dropdown-tip.png);
|
||||
bottom: 0px;
|
||||
position: absolute;
|
||||
margin: auto;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
#box3, #messages li {
|
||||
background: #3D3F41;
|
||||
font-family: Helvetica, sans-serif;
|
||||
|
|
@ -123,37 +81,6 @@ textarea {
|
|||
user-select: none;
|
||||
}
|
||||
|
||||
#box3 .label, #messages li {
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#box3 .shortcut {
|
||||
color: #fff;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#box2 .function.save { background-position: -5px top; }
|
||||
#box2 .function.enabled.save { background-position: -5px center; }
|
||||
#box2 .function.enabled.save:hover { background-position: -5px bottom; }
|
||||
|
||||
#box2 .function.new { background-position: -42px top; }
|
||||
#box2 .function.enabled.new { background-position: -42px center; }
|
||||
#box2 .function.enabled.new:hover { background-position: -42px bottom; }
|
||||
|
||||
#box2 .function.duplicate { background-position: -79px top; }
|
||||
#box2 .function.enabled.duplicate { background-position: -79px center; }
|
||||
#box2 .function.enabled.duplicate:hover { background-position: -79px bottom; }
|
||||
|
||||
#box2 .function.raw { background-position: -116px top; }
|
||||
#box2 .function.enabled.raw { background-position: -116px center; }
|
||||
#box2 .function.enabled.raw:hover { background-position: -116px bottom; }
|
||||
|
||||
#box2 .function.twitter { background-position: -153px top; }
|
||||
#box2 .function.enabled.twitter { background-position: -153px center; }
|
||||
#box2 .function.enabled.twitter:hover { background-position: -153px bottom; }
|
||||
#box2 .button-picture{ border-width: 0; font-size: inherit; }
|
||||
|
||||
#messages {
|
||||
position:fixed;
|
||||
top:0px;
|
||||
|
|
@ -173,3 +100,59 @@ textarea {
|
|||
background:rgba(102,8,0,0.8);
|
||||
}
|
||||
|
||||
.menu {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background: #002B36;
|
||||
}
|
||||
|
||||
.menu-actions {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
button {
|
||||
font-size: 14px;
|
||||
color: #3D3F41;
|
||||
background: transparent;
|
||||
outline: none;
|
||||
border: none;
|
||||
padding: 4px 10px;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
button.enabled {
|
||||
color: #78797A;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.button-wrap .label {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 36px;
|
||||
left: 50%;
|
||||
margin-left: -46px;
|
||||
text-align: center;
|
||||
font-family: monospace;
|
||||
background: #3D3F41;
|
||||
color: #fff;
|
||||
padding: 8px;
|
||||
border-radius: 3px;
|
||||
font-size: 8px;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.button-wrap .label.label--small {
|
||||
margin-left: -30px;
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.button-wrap:hover .label {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.logo a:hover svg path {
|
||||
fill: #fff;
|
||||
}
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 203 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.8 KiB |
|
|
@ -43,18 +43,36 @@
|
|||
|
||||
<div id="key">
|
||||
<div id="pointer" style="display:none;"></div>
|
||||
<div id="box1">
|
||||
<a class="logo"></a>
|
||||
<div class="logo" style="margin-top: 5px; flex: auto; display: flex; align-items: center; justify-content: center">
|
||||
<div class="button-wrap" style="position: relative;">
|
||||
<span class="label label--small">About</span>
|
||||
<a href="https://github.com/Kenuux/knxbin" target="_blank" rel="noopener noreferrer" style="display: flex">
|
||||
<svg width="55" height="50" viewBox="0 0 78.906 37.524" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="svgGroup" stroke-linecap="round" fill-rule="evenodd" font-size="9pt" stroke="#000" stroke-width="0" fill="#4168cf" style="stroke:#000;stroke-width:0;fill:#4168cf">
|
||||
<path d="M 16.309 37.524 L 10.547 27.686 L 8.228 30.005 L 8.228 37.524 L 0 37.524 L 0 0 L 8.228 0 L 8.228 19.922 L 9.058 18.823 L 15.259 11.108 L 25.122 11.108 L 15.869 21.973 L 25.732 37.524 L 16.309 37.524 Z M 27.124 11.108 L 34.839 11.108 L 35.107 14.209 A 8.764 8.764 0 0 1 41.481 10.676 A 11.922 11.922 0 0 1 42.651 10.62 A 10.969 10.969 0 0 1 45.026 10.861 Q 46.575 11.204 47.709 12.038 A 6.191 6.191 0 0 1 48.816 13.086 Q 50.854 15.552 50.928 20.508 L 50.928 37.524 L 42.676 37.524 L 42.676 20.85 A 7.926 7.926 0 0 0 42.612 19.808 Q 42.455 18.627 41.911 17.957 A 2.375 2.375 0 0 0 41.87 17.908 A 2.251 2.251 0 0 0 41.04 17.317 Q 40.315 17.003 39.193 16.971 A 9.069 9.069 0 0 0 38.94 16.968 A 4.825 4.825 0 0 0 37.426 17.193 A 3.774 3.774 0 0 0 35.352 18.872 L 35.352 37.524 L 27.124 37.524 L 27.124 11.108 Z M 62.476 11.108 L 66.187 18.384 L 70.02 11.108 L 78.564 11.108 L 71.606 23.975 L 78.906 37.524 L 70.313 37.524 L 66.162 29.712 L 62.085 37.524 L 53.442 37.524 L 60.767 23.975 L 53.833 11.108 L 62.476 11.108 Z" vector-effect="non-scaling-stroke"/>
|
||||
</g>
|
||||
</svg>
|
||||
<svg width="30" height="40" viewBox="0 0 62.695 37.989" xmlns="http://www.w3.org/2000/svg"><g id="svgGroup" stroke-linecap="round" fill-rule="evenodd" font-size="9pt" stroke="#000" stroke-width="0" fill="#8295d4" style="stroke:#000;stroke-width:0;fill:#8295d4"><path d="M 40.845 11.084 L 46.436 11.084 L 46.606 14.136 Q 49.536 10.596 54.297 10.596 Q 62.549 10.596 62.695 20.044 L 62.695 37.5 L 56.763 37.5 L 56.763 20.386 A 9.244 9.244 0 0 0 56.669 19.024 Q 56.566 18.33 56.347 17.774 A 3.636 3.636 0 0 0 55.676 16.663 A 3.251 3.251 0 0 0 54.382 15.805 Q 53.845 15.602 53.174 15.517 A 8.306 8.306 0 0 0 52.124 15.454 Q 48.951 15.454 47.209 17.992 A 7.892 7.892 0 0 0 46.777 18.701 L 46.777 37.5 L 40.845 37.5 L 40.845 11.084 Z M 23.193 24.219 L 23.193 24.561 A 22.396 22.396 0 0 1 22.869 28.493 Q 22.472 30.716 21.59 32.495 A 11.699 11.699 0 0 1 20.447 34.351 Q 17.7 37.988 12.891 37.988 A 10.302 10.302 0 0 1 9.7 37.518 A 8.219 8.219 0 0 1 5.664 34.644 L 5.371 37.5 L 0 37.5 L 0 0 L 5.933 0 L 5.933 13.623 A 8.398 8.398 0 0 1 11.977 10.627 A 11.739 11.739 0 0 1 12.842 10.596 Q 17.676 10.596 20.435 14.185 A 12.128 12.128 0 0 1 22.392 18.1 Q 22.893 19.753 23.081 21.73 A 26.33 26.33 0 0 1 23.193 24.219 Z M 34.473 11.084 L 34.473 37.5 L 28.54 37.5 L 28.54 11.084 L 34.473 11.084 Z M 17.261 24.805 L 17.261 24.048 Q 17.261 19.921 15.864 17.776 A 5.697 5.697 0 0 0 15.747 17.603 A 4.878 4.878 0 0 0 12.178 15.501 A 6.976 6.976 0 0 0 11.353 15.454 Q 7.761 15.454 6.159 18.374 A 7.446 7.446 0 0 0 5.933 18.823 L 5.933 29.712 A 6.296 6.296 0 0 0 7.313 31.689 Q 8.553 32.857 10.413 33.094 A 7.815 7.815 0 0 0 11.401 33.154 A 5.943 5.943 0 0 0 13.31 32.862 A 4.811 4.811 0 0 0 15.698 31.079 A 6.798 6.798 0 0 0 16.628 29.224 Q 17.23 27.429 17.261 24.805 Z M 28.35 3.084 A 3.54 3.54 0 0 0 28.174 4.224 A 4.003 4.003 0 0 0 28.179 4.431 A 3.032 3.032 0 0 0 29.041 6.458 Q 29.907 7.349 31.519 7.349 A 5.621 5.621 0 0 0 31.687 7.346 Q 33.176 7.301 34.009 6.458 Q 34.888 5.566 34.888 4.224 A 4.06 4.06 0 0 0 34.88 3.971 A 3.07 3.07 0 0 0 34.009 1.953 A 2.704 2.704 0 0 0 33.676 1.663 Q 33.184 1.3 32.519 1.152 A 4.608 4.608 0 0 0 31.519 1.05 A 5.558 5.558 0 0 0 31.363 1.052 Q 30.823 1.067 30.371 1.188 A 2.807 2.807 0 0 0 29.041 1.953 A 3.007 3.007 0 0 0 28.35 3.084 Z" vector-effect="non-scaling-stroke"/></g></svg>
|
||||
</a>
|
||||
</div>
|
||||
<div id="box2">
|
||||
<button class="save function button-picture">Save</button>
|
||||
<button class="new function button-picture">New</button>
|
||||
<button class="duplicate function button-picture">Duplicate & Edit</button>
|
||||
<button class="raw function button-picture">Just Text</button>
|
||||
</div>
|
||||
<div id="box3" style="display:none;">
|
||||
<div class="label"></div>
|
||||
<div class="shortcut"></div>
|
||||
<div id="box2" class="menu-actions">
|
||||
<div class="button-wrap" style="position: relative;">
|
||||
<span class="label label--small">ctrl + s</span>
|
||||
<button class="save button-picture function">Save</button>
|
||||
</div>
|
||||
<div class="button-wrap" style="position: relative;">
|
||||
<span class="label label--small">ctrl + n</span>
|
||||
<button class="new button-picture function">New</button>
|
||||
</div>
|
||||
<div class="button-wrap" style="position: relative;">
|
||||
<span class="label label--small">ctrl + d</span>
|
||||
<button class="duplicate button-picture function">Duplicate & Edit</button>
|
||||
</div>
|
||||
<div class="button-wrap" style="position: relative; margin-right: 20px">
|
||||
<span class="label">ctrl + shift + r</span>
|
||||
<button class="raw button-picture function">Raw Text</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
BIN
static/logo.png
BIN
static/logo.png
Binary file not shown.
|
Before Width: | Height: | Size: 4.6 KiB |
|
|
@ -9,7 +9,7 @@ Orginal Style from ethanschoonover.com/solarized (c) Jeremy Hull <sourdrums@gmai
|
|||
overflow-x: auto;
|
||||
padding: 0.5em;
|
||||
background: #1E1F22;
|
||||
color: #839496;
|
||||
color: #78797A;
|
||||
}
|
||||
|
||||
.hljs-comment,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue