maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Remove loading-ellipsis.svg and related code (#19569)

Browse source
This commit is contained in:
Ben Halpern 2023-06-01 10:41:53 -04:00 • committed by GitHub
parent d162fee7f0
commit 4ffe7b0fab
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 2 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
app/assets/config/manifest.js
View file

@ -5,4 +5,3 @@
//= link s3_direct_upload.js
//= link katex.css
//= link icon.png
//= link loading-ellipsis.svg

22
app/assets/images/loading-ellipsis.svg
View file

@ -1,22 +0,0 @@
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="lds-ellipsis" style="background:0 0">
<circle cx="84" cy="50" r="0" fill="#ecf8fe">
<animate attributeName="r" values="10;0;0;0;0" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="0s"/>
<animate attributeName="cx" values="84;84;84;84;84" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="0s"/>
</circle>
<circle cx="50" cy="50" r="10" fill="#f1f1f1">
<animate attributeName="r" values="0;10;10;10;0" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="-0.5s"/>
<animate attributeName="cx" values="16;16;50;84;84" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="-0.5s"/>
</circle>
<circle cx="16" cy="50" r="10" fill="#d4f9df">
<animate attributeName="r" values="0;10;10;10;0" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="-0.25s"/>
<animate attributeName="cx" values="16;16;50;84;84" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="-0.25s"/>
</circle>
<circle cx="84" cy="50" r="0" fill="#f7e2e4">
<animate attributeName="r" values="0;10;10;10;0" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="0s"/>
<animate attributeName="cx" values="16;16;50;84;84" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="0s"/>
</circle>
<circle cx="84" cy="50" r="10" fill="#ecf8fe">
<animate attributeName="r" values="0;0;10;10;10" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="0s"/>
<animate attributeName="cx" values="16;16;16;50;84" keyTimes="0;0.25;0.5;0.75;1" keySplines="0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1" calcMode="spline" dur="1s" repeatCount="indefinite" begin="0s"/>
</circle>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 2.6 KiB

1
app/assets/javascripts/utilities/buildCommentFormHTML.js.erb
View file

@ -25,7 +25,6 @@ function buildCommentFormHTML(commentableId, commentableType, parentId) {
<button type="button" class="personal-template-button active" data-target-type="personal" data-form-id="new_comment">Personal</button>
<button type="button" class="moderator-template-button hidden" data-target-type="moderator" data-form-id="new_comment">Trusted User</button>
</header>
<img class="loading-img hidden" src="<%= asset_path("loading-ellipsis.svg") %>" alt="loading">
<div class="personal-responses-container"></div>
<div class="moderator-responses-container hidden"></div>
<a target="_blank" rel="noopener nofollow" href="/settings/response-templates">Create template</a>

15
app/assets/stylesheets/_functions.scss
View file

@ -1,15 +0,0 @@
/**
*
* Generates an image path. The mixin is required
* so that webpack for Storybook and the application can both
* generate the image path correctly.
*
* $image: the image file name, e.g. 'loading-ellipsis.svg'
*/
@function image-src($image) {
@if variable-exists(environment) and $environment == 'storybook' {
@return '../images/' + $image;
} @else {
@return image_path('loading-ellipsis.svg');
}
}

7
app/assets/stylesheets/settings.scss
View file

@ -1,6 +1,5 @@
@import 'variables';
@import 'mixins';
@import 'functions';
.github-repos {
max-height: 400px;
@ -8,8 +7,7 @@
background: var(--card-bg);
&.loading-repos {
height: 400px;
background: white url(image-src('loading-ellipsis.svg')) no-repeat center
center;
background: white;
background-size: 50px;
}
&.github-repos-errored {
@ -32,8 +30,7 @@
button {
&:disabled {
padding: var(--su-2);
background: var(--accent-brand) url(image-src('loading-ellipsis.svg'))
no-repeat center center;
background: var(--accent-brand);
background-size: contain;
height: 40px;
width: 80px;

2
app/javascript/responseTemplates/responseTemplates.js
View file

@ -169,7 +169,6 @@ function fetchResponseTemplates(formId, onTemplateSelected) {
})
.then((response) => response.json())
.then((response) => {
form.querySelector('img.loading-img').classList.toggle('hidden');
let revealed;
const topLevelData = document.getElementById('response-templates-data');
@ -225,7 +224,6 @@ function copyData(responsesContainer) {
}
function loadData(form, onTemplateSelected) {
form.querySelector('img.loading-img').classList.toggle('hidden');
fetchResponseTemplates(form.id, onTemplateSelected);
}

2
app/views/comments/_form.html.erb
View file

@ -52,8 +52,6 @@
<button type="button" class="crayons-btn moderator-template-button hidden" data-target-type="moderator" data-form-id="new_comment"><%= t("views.comments.write.template.moderator") %></button>
</header>
<img class="loading-img hidden" src="<%= asset_path("loading-ellipsis.svg") %>" alt="loading" loading="lazy" />
<div class="personal-responses-container">
<%# filled by JS %>
</div>