errilaz/98se.css
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add help title-bar button (#72)

Browse source 
* newlines

* add now.json

* add newlines

* remove now.json

* re-add now.json with version field
This commit is contained in:
Jordan Scales 2020-04-28 12:17:40 -04:00 • committed by GitHub
parent 12af45910d
commit bfd5340a76
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 28 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

10
docs/index.html.ejs
View file

@ -496,6 +496,16 @@
<button aria-label="Close"></button> <button aria-label="Close"></button>
</div> </div>
</div> </div>
<br>
<div class="title-bar">
<div class="title-bar-text">A Helpful Bar</div>
<div class="title-bar-controls">
<button aria-label="Help"></button>
<button aria-label="Close"></button>
</div>
</div>
`) %> `) %>
</div> </div>
</section> </section>

8
icon/help.svg Normal file
View file

@ -0,0 +1,8 @@
<svg width="6" height="9" viewBox="0 0 6 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect y="1" width="2" height="2" fill="black"/>
<rect x="1" width="4" height="1" fill="black"/>
<rect x="4" y="1" width="2" height="2" fill="black"/>
<rect x="3" y="3" width="2" height="1" fill="black"/>
<rect x="2" y="4" width="2" height="2" fill="black"/>
<rect x="2" y="7" width="2" height="2" fill="black"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 411 B

4
now.json Normal file
View file

@ -0,0 +1,4 @@
{
"version": 2,
"public": true
}

6
style.css
View file

@ -219,6 +219,12 @@ button::-moz-focus-inner {
background-position: top 2px left 3px; background-position: top 2px left 3px;
} }
.title-bar-controls button[aria-label="Help"] {
background-image: svg-load("./icon/help.svg");
background-repeat: no-repeat;
background-position: top 2px left 5px;
}
.title-bar-controls button[aria-label="Close"] { .title-bar-controls button[aria-label="Close"] {
margin-left: 2px; margin-left: 2px;
background-image: svg-load("./icon/close.svg"); background-image: svg-load("./icon/close.svg");