{"action":"created","issue":{"url":"https://api.github.com/repos/octobercms/october/issues/3571","repository_url":"https://api.github.com/repos/octobercms/october","labels_url":"https://api.github.com/repos/octobercms/october/issues/3571/labels{/name}","comments_url":"https://api.github.com/repos/octobercms/october/issues/3571/comments","events_url":"https://api.github.com/repos/octobercms/october/issues/3571/events","html_url":"https://github.com/octobercms/october/issues/3571","id":328185942,"node_id":"MDU6SXNzdWUzMjgxODU5NDI=","number":3571,"title":"Minor Bug: Saving... Appears over buttons etc.","user":{"login":"ayumihamsaki","id":17784082,"node_id":"MDQ6VXNlcjE3Nzg0MDgy","avatar_url":"https://avatars2.githubusercontent.com/u/17784082?v=4","gravatar_id":"","url":"https://api.github.com/users/ayumihamsaki","html_url":"https://github.com/ayumihamsaki","followers_url":"https://api.github.com/users/ayumihamsaki/followers","following_url":"https://api.github.com/users/ayumihamsaki/following{/other_user}","gists_url":"https://api.github.com/users/ayumihamsaki/gists{/gist_id}","starred_url":"https://api.github.com/users/ayumihamsaki/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ayumihamsaki/subscriptions","organizations_url":"https://api.github.com/users/ayumihamsaki/orgs","repos_url":"https://api.github.com/users/ayumihamsaki/repos","events_url":"https://api.github.com/users/ayumihamsaki/events{/privacy}","received_events_url":"https://api.github.com/users/ayumihamsaki/received_events","type":"User","site_admin":false},"labels":[{"id":330615949,"node_id":"MDU6TGFiZWwzMzA2MTU5NDk=","url":"https://api.github.com/repos/octobercms/october/labels/Priority:%20Medium","name":"Priority: Medium","color":"fbca04","default":false},{"id":67885479,"node_id":"MDU6TGFiZWw2Nzg4NTQ3OQ==","url":"https://api.github.com/repos/octobercms/october/labels/Type:%20Bug","name":"Type: Bug","color":"e11d21","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":6,"created_at":"2018-05-31T15:26:14Z","updated_at":"2018-06-01T13:43:37Z","closed_at":null,"author_association":"NONE","body":"I am sure this is not correct.\r\n\r\nEverytime I click on the save button in the cms a grey text says \"Saving...\" \r\n\r\nSee below screenshot:\r\n\r\n![untitled](https://user-images.githubusercontent.com/17784082/40791335-2aece182-64ef-11e8-90cd-7f1877ca2218.png)\r\n\r\nIt's like an overkill and I suggest removing it. Having the spinning icon is more than enough! \r\n\r\nSo I suggest removing the word \"Saving...\" in grey that is very hard to read and just looks not very nice. Or at least don't have it overlapping the button. (Either remove it or place it under the buttons)\r\n\r\nI see this in both Latest Google Canary and Firefox nightly.\r\n\r\nWould it not be better to have it like this:\r\n\r\n![untitled](https://user-images.githubusercontent.com/17784082/40794692-d3458e76-64f7-11e8-926e-2856854a8c3b.png)\r\n\r\n~October seems to use very old CSS and no flexbox or css grids etc."},"comment":{"url":"https://api.github.com/repos/octobercms/october/issues/comments/393884802","html_url":"https://github.com/octobercms/october/issues/3571#issuecomment-393884802","issue_url":"https://api.github.com/repos/octobercms/october/issues/3571","id":393884802,"node_id":"MDEyOklzc3VlQ29tbWVudDM5Mzg4NDgwMg==","user":{"login":"ayumihamsaki","id":17784082,"node_id":"MDQ6VXNlcjE3Nzg0MDgy","avatar_url":"https://avatars2.githubusercontent.com/u/17784082?v=4","gravatar_id":"","url":"https://api.github.com/users/ayumihamsaki","html_url":"https://github.com/ayumihamsaki","followers_url":"https://api.github.com/users/ayumihamsaki/followers","following_url":"https://api.github.com/users/ayumihamsaki/following{/other_user}","gists_url":"https://api.github.com/users/ayumihamsaki/gists{/gist_id}","starred_url":"https://api.github.com/users/ayumihamsaki/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ayumihamsaki/subscriptions","organizations_url":"https://api.github.com/users/ayumihamsaki/orgs","repos_url":"https://api.github.com/users/ayumihamsaki/repos","events_url":"https://api.github.com/users/ayumihamsaki/events{/privacy}","received_events_url":"https://api.github.com/users/ayumihamsaki/received_events","type":"User","site_admin":false},"created_at":"2018-06-01T13:43:37Z","updated_at":"2018-06-01T13:43:37Z","author_association":"NONE","body":"@LukeTowers Done some testing and decided to use a CSS wrapper, as I only wanted to modify the form buttons the HTML code looks like this on most things:\r\n\r\n```\r\n<div class=\"form-buttons\">\r\n  <div class=\"loading-indicator-container\">\r\n    <div class=\"loading-indicator\"><div>Saving...</div><span></span></div>\r\n    <button type=\"submit\" data-request=\"onSave\" data-request-data=\"redirect:0\" data-hotkey=\"ctrl+s, cmd+s\" data-load-indicator=\"Saving...\" class=\"btn btn-primary\" data-disposable=\"\">Save </button>\r\n    <button type=\"button\" data-request=\"onSave\" data-request-data=\"close:1\" data-hotkey=\"ctrl+enter, cmd+enter\" data-load-indicator=\"Saving...\" class=\"btn btn-default\" data-disposable=\"\">Save and close </button>\r\n    <button type=\"button\" class=\"oc-icon-trash-o btn-icon danger pull-right\" data-request=\"onDelete\" data-load-indicator=\"Deleting...\" data-request-confirm=\"Delete record?\"></button>\r\n    <span class=\"btn-text\">or <a href=\"https://www.example.com/something\">Cancel</a></span>\r\n  </div>\r\n</div>\r\n```\r\n\r\nSo I used the CSS Wrapper of `class=\"form-buttons\"` then everything else in OctoberCMS won't get moved about and will pass the connected issue: #3394.\r\n\r\nThe code I came up with is as follows:\r\n\r\n```\r\n.form-buttons .loading-indicator-container .loading-indicator {\r\n    position: initial;\r\n    left: 0;\r\n    top: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    padding-top: 0;\r\n    display: block;\r\n    overflow: hidden;\r\n}\r\n.form-buttons .loading-indicator-container .loading-indicator > div {\r\n    position:initial;\r\n    top: 0;\r\n    margin-top: 0;\r\n}\r\n.form-buttons .loading-indicator > span {\r\n    background: transparent url(images/loader.gif) no-repeat 0 50%;\r\n    position: absolute;\r\n    width: 40px;\r\n    height: 40px;\r\n    top: 0;\r\n    margin-top: -30px;\r\n    left: 0;\r\n    display: block;\r\n}\r\n```\r\n\r\nI added it to the file: https://github.com/octobercms/october/blob/master/modules/system/assets/ui/storm.css\r\n\r\nIt seemed to work fine on many plugins inside OctoberCMS.\r\n\r\nPlease let me know if this is ok? Also, I am not sure what `.LESS` file to add the code? So let me know and I can create a PR for it.\r\n\r\np.s. Will save the Urgency spec. so will know in future."}}
{"actor":{"display_login":"ayumihamsaki"}}