Skip to content

Commit ac65602

Browse files
committed
feat: github stars and verified extensions
1 parent d362268 commit ac65602

12 files changed

Lines changed: 215 additions & 15 deletions

docs/Customize-Icons-For-File-And-Folder.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
The icons in the file tree can be customised. Even add icons for unsupported extensions!
22

3-
![file-Icon.png](generatedDocs/images/file-Icon.png)
3+
![file-Icon.png](https://phcode-dev.github.io/doc-images/phcode-sdk/file-Icon.png)
44

55
## How to add custom icons
66
In the Brackets preferences(`Debug Menu` > `Open preferences file`) file you'll need to add this to the bottom:
@@ -42,3 +42,4 @@ You can also add an extension that's not already supported the same way.
4242
## credits
4343
* Based on extension by https://github.com/ivogabe/Brackets-Icons
4444
* Ionicons (MIT license), Font Awesome (GPL license) and Devicons (MIT license) are included in Brackets-Icons.
45+
* Material icons are also licence compatible with brackets, but not directly integrated in source. Please download individual SVGs from https://fonts.google.com/icons as required.

docs/generatedApiDocs/features/QuickViewManager-API.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -200,9 +200,9 @@ unlocks the current QuickView locked by `lockQuickView` fucntion.
200200

201201
Type: [function][5]
202202

203-
[1]: generatedDocs/images/quick-view-image.png
203+
[1]: https://phcode-dev.github.io/doc-images/phcode-sdk/quick-view-image.png
204204

205-
[2]: generatedDocs/images/quick-view-youtube.png
205+
[2]: https://phcode-dev.github.io/doc-images/phcode-sdk/quick-view-youtube.png
206206

207207
[3]: https://github.com/phcode-dev/phoenix/wiki/SelectionViewManager-API
208208

docs/generatedApiDocs/features/SelectionViewManager-API.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -145,7 +145,7 @@ Returns **[boolean][6]**
145145

146146
[3]: https://github.com/phcode-dev/phoenix/wiki/QuickViewManager-API
147147

148-
[4]: generatedDocs/images/quick-view-youtube.png
148+
[4]: https://phcode-dev.github.io/doc-images/phcode-sdk/quick-view-youtube.png
149149

150150
[5]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
151151

docs/images/file-Icon.png

-23.1 KB
Binary file not shown.

docs/images/quick-view-image.png

-134 KB
Binary file not shown.

docs/images/quick-view-youtube.png

-62.4 KB
Binary file not shown.

src/features/QuickViewManager.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,8 @@
2626
/**
2727
* QuickViewManager provides support to add interactive preview popups on hover over the main editors.
2828
* Extensions can register to provide previews with `QuickViewManager.registerQuickViewProvider` API.
29-
* ![quick-view-image.png](generatedDocs/images/quick-view-image.png)
30-
* ![quick-view-youtube.png](generatedDocs/images/quick-view-youtube.png)
29+
* ![quick-view-image.png](https://phcode-dev.github.io/doc-images/phcode-sdk/quick-view-image.png)
30+
* ![quick-view-youtube.png](https://phcode-dev.github.io/doc-images/phcode-sdk/quick-view-youtube.png)
3131
*
3232
* ### See Related: SelectionViewManager
3333
* [features/SelectionViewManager](https://github.com/phcode-dev/phoenix/wiki/SelectionViewManager-API) is similar to

src/features/SelectionViewManager.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
* SelectionViewManager API.
3737
* * SelectionViews popup only once user selects a text by mouse or hover over a region with text selection.
3838
* * Quickviews popup on mouse hover.
39-
* ![quick-view-youtube.png](generatedDocs/images/quick-view-youtube.png)
39+
* ![quick-view-youtube.png](https://phcode-dev.github.io/doc-images/phcode-sdk/quick-view-youtube.png)
4040
*
4141
* ## Usage
4242
* Lets build a "hello world" extension that displays "hello world" above selected text in the editor.

src/htmlContent/extension-manager-view-item.html

Lines changed: 30 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,37 @@
22
<td class="ext-info">
33
<span class="ext-name">{{#metadata.title}}{{metadata.title}}{{/metadata.title}}{{^metadata.title}}{{metadata.name}}{{/metadata.title}}</span>
44
{{#authorInfo}}
5-
<span class="muted ext-author">{{{authorInfo}}}</span>
5+
<span class="muted ext-author">
6+
{{{authorInfo}}}
7+
{{#verified}}
8+
<img class="extn-verified" title="This publisher has verified ownership of {{verified}}" src="styles/images/verified.svg" style="width:1.5em;">
9+
{{/verified}}
10+
</span>
611
{{/authorInfo}}
7-
<span class="muted ext-version">{{metadata.version}}</span>
8-
{{#hasVersionInfo}}
9-
<span class="muted ext-date"> &mdash; {{lastVersionDate}}</span>
10-
{{/hasVersionInfo}}
11-
{{#downloadCount}}
12-
<p title="{{downloadCount}} {{Strings.EXTENSIONS_DOWNLOADS}}"><img src="styles/images/download-icon.svg"/> {{downloadCount}}</p>
13-
{{/downloadCount}}
12+
<div style="display: flex; flex-direction: row; justify-content: space-between; width: 280px;">
13+
<div>
14+
<span class="muted ext-version">{{metadata.version}}</span>
15+
{{#hasVersionInfo}}
16+
<span class="muted ext-date"> &mdash; {{lastVersionDate}}</span>
17+
{{/hasVersionInfo}}
18+
</div>
19+
<div>
20+
{{#downloadCount}}
21+
<p class="extn-download-count" title="{{downloadCount}} {{Strings.EXTENSIONS_DOWNLOADS}}"><img src="styles/images/download-icon.svg"/> {{downloadCount}}</p>
22+
{{/downloadCount}}
23+
</div>
24+
<div class="{{^githubStarCount}} forced-inVisible {{/githubStarCount}}">
25+
<div class="github-stars-button">
26+
<div class="parent">
27+
<span class="starContainer">
28+
<i class="fa-regular fa-star star"></i>
29+
<span>Star</span>
30+
</span>
31+
<span class="count"> {{githubStarCount}} </span>
32+
</div>
33+
</div>
34+
</div>
35+
</div>
1436
</td>
1537
<td class="ext-desc">
1638
{{#showInstallButton}}

src/styles/brackets.less

Lines changed: 172 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -207,6 +207,10 @@ a, img {
207207
display: none !important;
208208
}
209209

210+
.forced-inVisible {
211+
visibility: hidden !important;
212+
}
213+
210214
.busyCursor {
211215
cursor: wait !important;
212216
}
@@ -2728,3 +2732,171 @@ label input {
27282732
.notification-dialog-content a {
27292733
color: #00ccff;
27302734
}
2735+
2736+
.github-stars-button {
2737+
.starContainer {
2738+
--fa-style-family-brands: "Font Awesome 6 Brands";
2739+
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
2740+
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
2741+
--fa-style-family-classic: "Font Awesome 6 Free";
2742+
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
2743+
font-family: -apple-system, BlinkMacSystemFont, Segoe UI,
2744+
Helvetica, Arial, sans-serif;
2745+
display: inline-flex;
2746+
height: 14px;
2747+
padding: 2px 5px;
2748+
font-size: 11px;
2749+
font-weight: 600;
2750+
line-height: 14px;
2751+
vertical-align: bottom;
2752+
cursor: pointer;
2753+
user-select: none;
2754+
background-repeat: repeat-x;
2755+
background-position: -1px -1px;
2756+
background-size: 110% 110%;
2757+
color: #24292f;
2758+
background-color: #ebf0f4;
2759+
border: 1px solid rgba(27, 31, 36, .15);
2760+
background-image: linear-gradient(180deg, #e5e9e9, #e5e9e9 90%);
2761+
border-radius: 0.25em 0 0 0.25em;
2762+
}
2763+
.starContainer:hover{
2764+
color: darkgoldenrod;
2765+
}
2766+
.star{
2767+
margin-right: 4px;
2768+
margin-top: 1px;
2769+
}
2770+
.count {
2771+
--fa-style-family-brands: "Font Awesome 6 Brands";
2772+
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
2773+
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
2774+
--fa-style-family-classic: "Font Awesome 6 Free";
2775+
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
2776+
font-family: -apple-system, BlinkMacSystemFont, Segoe UI,
2777+
Helvetica, Arial, sans-serif;
2778+
display: inline-flex;
2779+
height: 14px;
2780+
padding: 2px 5px;
2781+
font-size: 11px;
2782+
font-weight: 600;
2783+
line-height: 14px;
2784+
vertical-align: bottom;
2785+
cursor: pointer;
2786+
user-select: none;
2787+
background-repeat: repeat-x;
2788+
background-position: -1px -1px;
2789+
background-size: 110% 110%;
2790+
border-radius: 0 0.25em 0.44em 0;
2791+
color: #24292f;
2792+
background-color: #e5e9e9;
2793+
border: 1px solid rgba(27, 31, 36, .15);
2794+
border-left-width: 0;
2795+
}
2796+
.count:hover{
2797+
color: darkgoldenrod;
2798+
}
2799+
.parent {
2800+
--fa-style-family-brands: "Font Awesome 6 Brands";
2801+
--fa-font-brands: normal 400 -2em/1 "Font Awesome 6 Brands";
2802+
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
2803+
--fa-style-family-classic: "Font Awesome 6 Free";
2804+
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
2805+
display: inline-block;
2806+
overflow: hidden;
2807+
font-family: -apple-system, BlinkMacSystemFont, Segoe UI,
2808+
Helvetica, Arial, sans-serif;
2809+
font-size: 0;
2810+
line-height: 0;
2811+
white-space: nowrap;
2812+
}
2813+
2814+
.dark & {
2815+
.starContainer {
2816+
--fa-style-family-brands: "Font Awesome 6 Brands";
2817+
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
2818+
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
2819+
--fa-style-family-classic: "Font Awesome 6 Free";
2820+
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
2821+
font-family: -apple-system, BlinkMacSystemFont, Segoe UI,
2822+
Helvetica, Arial, sans-serif;
2823+
white-space: nowrap;
2824+
text-decoration: none;
2825+
outline: 0;
2826+
position: relative;
2827+
display: inline-flex;
2828+
height: 14px;
2829+
padding: 2px 5px;
2830+
font-size: 11px;
2831+
font-weight: 600;
2832+
line-height: 14px;
2833+
vertical-align: bottom;
2834+
cursor: pointer;
2835+
user-select: none;
2836+
background-repeat: repeat-x;
2837+
background-position: -1px -1px;
2838+
background-size: 110% 110%;
2839+
border: 1px solid;
2840+
color: #c9d1d9;
2841+
background-color: #0d1117;
2842+
border-color: rgba(240, 246, 252, 0.1);
2843+
background-image: linear-gradient(180deg, #333, #333 90%);
2844+
border-radius: 0.25em 0 0 0.25em;
2845+
}
2846+
.starContainer:hover{
2847+
color: darkgoldenrod;
2848+
}
2849+
.star{
2850+
margin-right: 4px;
2851+
margin-top: 1px;
2852+
}
2853+
.count {
2854+
--fa-style-family-brands: "Font Awesome 6 Brands";
2855+
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
2856+
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
2857+
--fa-style-family-classic: "Font Awesome 6 Free";
2858+
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
2859+
font-family: -apple-system, BlinkMacSystemFont, Segoe UI,
2860+
Helvetica, Arial, sans-serif;
2861+
white-space: nowrap;
2862+
text-decoration: none;
2863+
outline: 0;
2864+
position: relative;
2865+
display: inline-flex;
2866+
height: 14px;
2867+
padding: 2px 5px;
2868+
font-size: 11px;
2869+
font-weight: 600;
2870+
line-height: 14px;
2871+
vertical-align: bottom;
2872+
cursor: pointer;
2873+
user-select: none;
2874+
background-repeat: repeat-x;
2875+
background-position: -1px -1px;
2876+
background-size: 110% 110%;
2877+
border: 1px solid;
2878+
border-left: 0;
2879+
border-radius: 0 0.25em 0.44em 0;
2880+
color: #c9d1d9;
2881+
background-color: #333;
2882+
border-color: rgba(240, 246, 252, 0.1);
2883+
}
2884+
.count:hover{
2885+
color: darkgoldenrod;
2886+
}
2887+
.parent {
2888+
--fa-style-family-brands: "Font Awesome 6 Brands";
2889+
--fa-font-brands: normal 400 -2em/1 "Font Awesome 6 Brands";
2890+
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
2891+
--fa-style-family-classic: "Font Awesome 6 Free";
2892+
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
2893+
display: inline-block;
2894+
overflow: hidden;
2895+
font-family: -apple-system, BlinkMacSystemFont, Segoe UI,
2896+
Helvetica, Arial, sans-serif;
2897+
font-size: 0;
2898+
line-height: 0;
2899+
white-space: nowrap;
2900+
}
2901+
}
2902+
}

0 commit comments

Comments
 (0)