third_party
/
gitea
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Remove fomantic image module (#21145)

Browse Source 
Remove this small, but unnecessary
[module](https://fomantic-ui.com/elements/image.html) and use `img`
selector over previous `.image`. Did a few tests, could not notice any
visual regression.

Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: Lauris BH <lauris@nix.lv>
tokarchuk/v1.18
silverwind 2 years ago committed by GitHub
parent fe73246cf9
commit afdab9d8d4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 32 additions and 382 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 6
      modules/templates/helper.go
  2. 2
      templates/base/head_navbar.tmpl
  3. 8
      templates/repo/issue/view_content/attachments.tmpl
  4. 2
      templates/repo/release/list.tmpl
  5. 4
      templates/repo/settings/tags.tmpl
  6. 2
      templates/status/404.tmpl
  7. 2
      templates/status/500.tmpl
  8. 2
      tests/e2e/example.test.e2e.js
  9. 4
      tests/e2e/utils_e2e.js
  10. 342
      web_src/fomantic/build/semantic.css
  11. 1
      web_src/fomantic/semantic.json
  12. 15
      web_src/less/_base.less
  13. 2
      web_src/less/_explore.less
  14. 14
      web_src/less/_repository.less
  15. 6
      web_src/less/_review.less
  16. 2
      web_src/less/features/gitgraph.less

6
modules/templates/helper.go
Unescape View File

@ -631,7 +631,7 @@ func SVG(icon string, others ...interface{}) template.HTML {
// Avatar renders user avatars. args: user, size (int), class (string) // Avatar renders user avatars. args: user, size (int), class (string)
func Avatar(item interface{}, others ...interface{}) template.HTML { func Avatar(item interface{}, others ...interface{}) template.HTML {
size, class := parseOthers(avatars.DefaultAvatarPixelSize, "ui avatar image vm", others...) size, class := parseOthers(avatars.DefaultAvatarPixelSize, "ui avatar vm", others...)
switch t := item.(type) { switch t := item.(type) {
case *user_model.User: case *user_model.User:
@ -662,7 +662,7 @@ func AvatarByAction(action *activities_model.Action, others ...interface{}) temp
// RepoAvatar renders repo avatars. args: repo, size(int), class (string) // RepoAvatar renders repo avatars. args: repo, size(int), class (string)
func RepoAvatar(repo *repo_model.Repository, others ...interface{}) template.HTML { func RepoAvatar(repo *repo_model.Repository, others ...interface{}) template.HTML {
size, class := parseOthers(avatars.DefaultAvatarPixelSize, "ui avatar image", others...) size, class := parseOthers(avatars.DefaultAvatarPixelSize, "ui avatar", others...)
src := repo.RelAvatarLink() src := repo.RelAvatarLink()
if src != "" { if src != "" {
@ -673,7 +673,7 @@ func RepoAvatar(repo *repo_model.Repository, others ...interface{}) template.HTM
// AvatarByEmail renders avatars by email address. args: email, name, size (int), class (string) // AvatarByEmail renders avatars by email address. args: email, name, size (int), class (string)
func AvatarByEmail(email, name string, others ...interface{}) template.HTML { func AvatarByEmail(email, name string, others ...interface{}) template.HTML {
size, class := parseOthers(avatars.DefaultAvatarPixelSize, "ui avatar image", others...) size, class := parseOthers(avatars.DefaultAvatarPixelSize, "ui avatar", others...)
src := avatars.GenerateEmailAvatarFastLink(email, size*setting.Avatar.RenderedSizeFactor) src := avatars.GenerateEmailAvatarFastLink(email, size*setting.Avatar.RenderedSizeFactor)
if src != "" { if src != "" {

2
templates/base/head_navbar.tmpl
Unescape View File

@ -5,7 +5,7 @@
{{end}} {{end}}
<div class="item brand" style="justify-content: space-between;"> <div class="item brand" style="justify-content: space-between;">
<a href="{{AppSubUrl}}/" aria-label="{{if .IsSigned}}{{.locale.Tr "dashboard"}}{{else}}{{.locale.Tr "home"}}{{end}}"> <a href="{{AppSubUrl}}/" aria-label="{{if .IsSigned}}{{.locale.Tr "dashboard"}}{{else}}{{.locale.Tr "home"}}{{end}}">
<img class="ui mini image" width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{.locale.Tr "logo"}}" aria-hidden="true"> <img width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{.locale.Tr "logo"}}" aria-hidden="true">
</a> </a>
{{if .IsSigned}} {{if .IsSigned}}
<a href="{{AppSubUrl}}/notifications" class="tooltip mobile-only" data-content='{{.locale.Tr "notifications"}}'> <a href="{{AppSubUrl}}/notifications" class="tooltip mobile-only" data-content='{{.locale.Tr "notifications"}}'>

8
templates/repo/issue/view_content/attachments.tmpl
Unescape View File

@ -11,9 +11,9 @@
{{if not (containGeneric $.Content .UUID)}} {{if not (containGeneric $.Content .UUID)}}
{{$hasThumbnails = true}} {{$hasThumbnails = true}}
{{end}} {{end}}
<span class="ui image">{{svg "octicon-file"}}</span> {{svg "octicon-file"}}
{{else}} {{else}}
<span class="ui image">{{svg "octicon-desktop-download"}}</span> {{svg "octicon-desktop-download"}}
{{end}} {{end}}
<span><strong>{{.Name}}</strong></span> <span><strong>{{.Name}}</strong></span>
</a> </a>
@ -26,12 +26,12 @@
{{if $hasThumbnails}} {{if $hasThumbnails}}
<div class="ui clearing divider"></div> <div class="ui clearing divider"></div>
<div class="ui small images thumbnails"> <div class="ui small thumbnails">
{{- range .Attachments -}} {{- range .Attachments -}}
{{if FilenameIsImage .Name}} {{if FilenameIsImage .Name}}
{{if not (containGeneric $.Content .UUID)}} {{if not (containGeneric $.Content .UUID)}}
<a target="_blank" rel="noopener noreferrer" href="{{.DownloadURL}}"> <a target="_blank" rel="noopener noreferrer" href="{{.DownloadURL}}">
<img class="ui image" src="{{.DownloadURL}}" title='{{$.ctx.locale.Tr "repo.issues.attachment.open_tab" .Name}}'> <img src="{{.DownloadURL}}" title='{{$.ctx.locale.Tr "repo.issues.attachment.open_tab" .Name}}'>
</a> </a>
{{end}} {{end}}
{{end}} {{end}}

2
templates/repo/release/list.tmpl
Unescape View File

@ -168,7 +168,7 @@
</span> </span>
</span> </span>
<a target="_blank" rel="noopener noreferrer" href="{{.DownloadURL}}"> <a target="_blank" rel="noopener noreferrer" href="{{.DownloadURL}}">
<strong><span class="ui image" title='{{.Name}}'>{{svg "octicon-package" 16 "mr-2"}}</span>{{.Name}}</strong> <strong>{{svg "octicon-package" 16 "mr-2"}}{{.Name}}</strong>
</a> </a>
</li> </li>
{{end}} {{end}}

4
templates/repo/settings/tags.tmpl
Unescape View File

@ -94,14 +94,14 @@
{{$userIDs := .AllowlistUserIDs}} {{$userIDs := .AllowlistUserIDs}}
{{range $.Users}} {{range $.Users}}
{{if contain $userIDs .ID}} {{if contain $userIDs .ID}}
<a class="ui basic image label" href="{{.HomeLink}}">{{avatar . 26}} {{.GetDisplayName}}</a> <a class="ui basic label" href="{{.HomeLink}}">{{avatar . 26}} {{.GetDisplayName}}</a>
{{end}} {{end}}
{{end}} {{end}}
{{if $.Owner.IsOrganization}} {{if $.Owner.IsOrganization}}
{{$teamIDs := .AllowlistTeamIDs}} {{$teamIDs := .AllowlistTeamIDs}}
{{range $.Teams}} {{range $.Teams}}
{{if contain $teamIDs .ID}} {{if contain $teamIDs .ID}}
<a class="ui basic image label" href="{{$.Owner.OrganisationLink}}/teams/{{PathEscape .LowerName}}">{{.Name}}</a> <a class="ui basic label" href="{{$.Owner.OrganisationLink}}/teams/{{PathEscape .LowerName}}">{{.Name}}</a>
{{end}} {{end}}
{{end}} {{end}}
{{end}} {{end}}

2
templates/status/404.tmpl
Unescape View File

@ -2,7 +2,7 @@
<div class="page-content ui container center full-screen-width {{if .IsRepo}}repository{{end}}"> <div class="page-content ui container center full-screen-width {{if .IsRepo}}repository{{end}}">
{{if .IsRepo}}{{template "repo/header" .}}{{end}} {{if .IsRepo}}{{template "repo/header" .}}{{end}}
<div class="ui container center"> <div class="ui container center">
<p style="margin-top: 100px"><img class="ui centered image" src="{{AssetUrlPrefix}}/img/404.png" alt="404"/></p> <p style="margin-top: 100px"><img src="{{AssetUrlPrefix}}/img/404.png" alt="404"/></p>
<div class="ui divider"></div> <div class="ui divider"></div>
<br> <br>
<p>{{.locale.Tr "error404" | Safe}} <p>{{.locale.Tr "error404" | Safe}}

2
templates/status/500.tmpl
Unescape View File

@ -1,6 +1,6 @@
{{template "base/head" .}} {{template "base/head" .}}
<div class="page-content ui container full-screen-width center"> <div class="page-content ui container full-screen-width center">
<p style="margin-top: 100px"><img class="ui centered image" src="{{AssetUrlPrefix}}/img/500.png" alt="500"/></p> <p style="margin-top: 100px"><img src="{{AssetUrlPrefix}}/img/500.png" alt="500"/></p>
<div class="ui divider"></div> <div class="ui divider"></div>
<br> <br>
{{if .ErrorMsg}} {{if .ErrorMsg}}

2
tests/e2e/example.test.e2e.js
Unescape View File

@ -23,7 +23,7 @@ test('Test Register Form', async ({page}, workerInfo) => {
await page.click('form button.ui.green.button:visible'); await page.click('form button.ui.green.button:visible');
// Make sure we routed to the home page. Else login failed. // Make sure we routed to the home page. Else login failed.
await expect(page.url()).toBe(`${workerInfo.project.use.baseURL}/`); await expect(page.url()).toBe(`${workerInfo.project.use.baseURL}/`);
await expect(page.locator('.dashboard-navbar span>img.ui.avatar.image')).toBeVisible(); await expect(page.locator('.dashboard-navbar span>img.ui.avatar')).toBeVisible();
await expect(page.locator('.ui.positive.message.flash-success')).toHaveText('Account was successfully created.'); await expect(page.locator('.ui.positive.message.flash-success')).toHaveText('Account was successfully created.');
save_visual(page); save_visual(page);

4
tests/e2e/utils_e2e.js
Unescape View File

@ -52,8 +52,8 @@ export async function save_visual(page) {
fullPage: true, fullPage: true,
timeout: 20000, timeout: 20000,
mask: [ mask: [
page.locator('.dashboard-navbar span>img.ui.avatar.image'), page.locator('.dashboard-navbar span>img.ui.avatar'),
page.locator('.ui.dropdown.jump.item.tooltip span>img.ui.avatar.image'), page.locator('.ui.dropdown.jump.item.tooltip span>img.ui.avatar'),
], ],
}); });
} }

342
web_src/fomantic/build/semantic.css generated
Unescape View File

@ -24344,348 +24344,6 @@ i.icon.youtube.play:before {
font-family: 'brand-icons'; font-family: 'brand-icons';
} }
/*******************************
Site Overrides
*******************************/
/*!
* # Fomantic-UI - Image
* http://github.com/fomantic/Fomantic-UI/
*
*
* Released under the MIT license
* http://opensource.org/licenses/MIT
*
*/
/*******************************
Image
*******************************/
.ui.image {
position: relative;
display: inline-block;
vertical-align: middle;
max-width: 100%;
background-color: transparent;
}
img.ui.image {
display: block;
}
.ui.image svg,
.ui.image img {
display: block;
max-width: 100%;
height: auto;
}
/*******************************
States
*******************************/
.ui.hidden.images,
.ui.ui.hidden.image {
display: none;
}
.ui.hidden.transition.images,
.ui.hidden.transition.image {
display: block;
visibility: hidden;
}
.ui.images > .hidden.transition {
display: inline-block;
visibility: hidden;
}
.ui.disabled.images,
.ui.disabled.image {
cursor: default;
opacity: var(--opacity-disabled);
}
/*******************************
Variations
*******************************/
/*--------------
Inline
---------------*/
.ui.inline.image,
.ui.inline.image svg,
.ui.inline.image img {
display: inline-block;
}
/*------------------
Vertical Aligned
-------------------*/
.ui.top.aligned.image,
.ui.top.aligned.image svg,
.ui.top.aligned.image img {
display: inline-block;
vertical-align: top;
}
.ui.middle.aligned.image,
.ui.middle.aligned.image svg,
.ui.middle.aligned.image img {
display: inline-block;
vertical-align: middle;
}
.ui.bottom.aligned.image,
.ui.bottom.aligned.image svg,
.ui.bottom.aligned.image img {
display: inline-block;
vertical-align: bottom;
}
.ui.top.aligned.images .image,
.ui.images .ui.top.aligned.image {
align-self: flex-start;
}
.ui.middle.aligned.images .image,
.ui.images .ui.middle.aligned.image {
align-self: center;
}
.ui.bottom.aligned.images .image,
.ui.images .ui.bottom.aligned.image {
align-self: flex-end;
}
/*--------------
Rounded
---------------*/
.ui.rounded.images .image,
.ui.rounded.image,
.ui.rounded.images .image > *,
.ui.rounded.image > * {
border-radius: 0.3125em;
}
/*--------------
Bordered
---------------*/
.ui.bordered.images .image,
.ui.bordered.images img,
.ui.bordered.images svg,
.ui.bordered.image img,
.ui.bordered.image svg,
img.ui.bordered.image {
border: 1px solid rgba(0, 0, 0, 0.1);
}
/*--------------
Circular
---------------*/
.ui.circular.images,
.ui.circular.image {
overflow: hidden;
}
.ui.circular.images .image,
.ui.circular.image,
.ui.circular.images .image > *,
.ui.circular.image > * {
border-radius: 500rem;
}
/*--------------
Fluid
---------------*/
.ui.fluid.images,
.ui.fluid.image,
.ui.fluid.images img,
.ui.fluid.images svg,
.ui.fluid.image svg,
.ui.fluid.image img {
display: block;
width: 100%;
height: auto;
}
/*--------------
Avatar
---------------*/
.ui.avatar.images .image,
.ui.avatar.images img,
.ui.avatar.images svg,
.ui.avatar.image img,
.ui.avatar.image svg,
.ui.avatar.image {
margin-right: 0.25em;
display: inline-block;
width: 2em;
height: 2em;
border-radius: 500rem;
}
/*-------------------
Spaced
--------------------*/
.ui.spaced.image {
display: inline-block !important;
margin-left: 0.5em;
margin-right: 0.5em;
}
.ui[class*="left spaced"].image {
margin-left: 0.5em;
margin-right: 0;
}
.ui[class*="right spaced"].image {
margin-left: 0;
margin-right: 0.5em;
}
/*-------------------
Floated
--------------------*/
.ui.floated.image,
.ui.floated.images {
float: left;
margin-right: 1em;
margin-bottom: 1em;
}
.ui.right.floated.images,
.ui.right.floated.image {
float: right;
margin-right: 0;
margin-bottom: 1em;
margin-left: 1em;
}
.ui.floated.images:last-child,
.ui.floated.image:last-child {
margin-bottom: 0;
}
.ui.centered.image {
display: block;
margin-left: auto;
margin-right: auto;
}
.ui.centered.images {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: stretch;
justify-content: center;
}
/*--------------
Sizes
---------------*/
.ui.medium.images .image,
.ui.medium.images img,
.ui.medium.images svg,
.ui.medium.image {
width: 300px;
height: auto;
font-size: 1rem;
}
.ui.mini.images .image,
.ui.mini.images img,
.ui.mini.images svg,
.ui.mini.image {
width: 35px;
height: auto;
font-size: 0.78571429rem;
}
.ui.tiny.images .image,
.ui.tiny.images img,
.ui.tiny.images svg,
.ui.tiny.image {
width: 80px;
height: auto;
font-size: 0.85714286rem;
}
.ui.small.images .image,
.ui.small.images img,
.ui.small.images svg,
.ui.small.image {
width: 150px;
height: auto;
font-size: 0.92857143rem;
}
.ui.large.images .image,
.ui.large.images img,
.ui.large.images svg,
.ui.large.image {
width: 450px;
height: auto;
font-size: 1.14285714rem;
}
.ui.big.images .image,
.ui.big.images img,
.ui.big.images svg,
.ui.big.image {
width: 600px;
height: auto;
font-size: 1.28571429rem;
}
.ui.huge.images .image,
.ui.huge.images img,
.ui.huge.images svg,
.ui.huge.image {
width: 800px;
height: auto;
font-size: 1.42857143rem;
}
.ui.massive.images .image,
.ui.massive.images img,
.ui.massive.images svg,
.ui.massive.image {
width: 960px;
height: auto;
font-size: 1.71428571rem;
}
/*******************************
Groups
*******************************/
.ui.images {
font-size: 0;
margin: 0 -0.25rem 0;
}
.ui.images .image,
.ui.images > img,
.ui.images > svg {
display: inline-block;
margin: 0 0.25rem 0.5rem;
}
/*******************************
Theme Overrides
*******************************/
/******************************* /*******************************
Site Overrides Site Overrides
*******************************/ *******************************/

1
web_src/fomantic/semantic.json
Unescape View File

@ -35,7 +35,6 @@
"grid", "grid",
"header", "header",
"icon", "icon",
"image",
"input", "input",
"item", "item",
"label", "label",

15
web_src/less/_base.less
Unescape View File

@ -692,12 +692,9 @@ a.ui.card:hover,
border-color: var(--color-secondary); border-color: var(--color-secondary);
} }
.ui.avatar.images .image, .ui.avatar img,
.ui.avatar.images img, .ui.avatar svg,
.ui.avatar.images svg, .ui.avatar.img,
.ui.avatar.image img,
.ui.avatar.image svg,
.ui.avatar.image,
.ui.cards > .card img.avatar, .ui.cards > .card img.avatar,
.ui.cards > .card .avatar img, .ui.cards > .card .avatar img,
.ui.card img.avatar, .ui.card img.avatar,
@ -758,10 +755,6 @@ a.ui.card:hover,
padding-left: 0; padding-left: 0;
} }
.brand .ui.mini.image {
width: 30px;
}
.top.menu a.item:hover, .top.menu a.item:hover,
.top.menu .dropdown.item:hover, .top.menu .dropdown.item:hover,
.top.menu .dropdown.item.active { .top.menu .dropdown.item.active {
@ -1686,7 +1679,7 @@ a.ui.label:hover {
} }
} }
.ui.avatar.image { .ui.avatar {
height: 18px; height: 18px;
width: 18px; width: 18px;
display: block; display: block;

2
web_src/less/_explore.less
Unescape View File

@ -75,7 +75,7 @@
padding-top: 25px; padding-top: 25px;
} }
.ui.avatar.image { img.ui.avatar {
width: 40px; width: 40px;
height: 40px; height: 40px;
} }

14
web_src/less/_repository.less
Unescape View File

@ -846,8 +846,8 @@
display: none; display: none;
} }
.avatar.image, img.avatar,
.avatar.image img { .avatar img {
width: 20px; width: 20px;
height: 20px; height: 20px;
margin: 0 .25rem; margin: 0 .25rem;
@ -908,8 +908,8 @@
line-height: 34px; /* this must be same as .badge height, to avoid overflow */ line-height: 34px; /* this must be same as .badge height, to avoid overflow */
clear: both; // reset the "float right shabox", in the future, use flexbox instead clear: both; // reset the "float right shabox", in the future, use flexbox instead
> .avatar.image, > img.avatar,
> .avatar.image img { > .avatar img {
position: relative; position: relative;
top: -2px; top: -2px;
} }
@ -1125,7 +1125,7 @@
margin-left: 36px; margin-left: 36px;
} }
.avatar.image { img.avatar {
width: 28px; width: 28px;
height: 28px; height: 28px;
} }
@ -2497,7 +2497,7 @@
#search-user-box { #search-user-box {
.results { .results {
.result { .result {
.image { img {
float: left; float: left;
margin-right: 8px; margin-right: 8px;
width: 2em; width: 2em;
@ -3305,7 +3305,7 @@ td.blob-excerpt {
display: flex; display: flex;
margin-bottom: auto; margin-bottom: auto;
img.avatar.image { img.avatar {
height: 24px; height: 24px;
width: 24px; width: 24px;
} }

6
web_src/less/_review.less
Unescape View File

@ -90,10 +90,10 @@
float: none; float: none;
margin: 0 .5rem 0 0; margin: 0 .5rem 0 0;
flex-shrink: 0; flex-shrink: 0;
}
&.image { img.avatar {
margin: 0 !important; margin: 0 !important;
}
} }
.comment-content { .comment-content {

2
web_src/less/features/gitgraph.less
Unescape View File

@ -134,7 +134,7 @@
padding-bottom: 1px; padding-bottom: 1px;
} }
.author .ui.avatar.image { .author img.ui.avatar {
width: auto; width: auto;
height: 18px; height: 18px;
max-width: none; max-width: none;

Write Preview
Loading…
Cancel
Save