diff options
| -rw-r--r-- | templates/repo/view_file.tmpl | 8 | ||||
| -rw-r--r-- | web_src/less/_base.less | 8 | ||||
| -rw-r--r-- | web_src/less/_repository.less | 18 | ||||
| -rw-r--r-- | web_src/less/misc.css | 5 | ||||
| -rw-r--r-- | webpack.config.js | 1 |
5 files changed, 27 insertions, 13 deletions
diff --git a/templates/repo/view_file.tmpl b/templates/repo/view_file.tmpl index 889cb5a691..d9c1e93eaf 100644 --- a/templates/repo/view_file.tmpl +++ b/templates/repo/view_file.tmpl @@ -33,9 +33,9 @@ {{if not .ReadmeInList}} <div class="file-header-right file-actions df ac"> {{if .HasSourceRenderedToggle}} - <div class="ui compact icon buttons"> - <a href="{{$.Link}}?display=source" class="ui tiny basic button poping up {{if .IsDisplayingSource}}active{{end}}" data-content="{{.i18n.Tr "repo.file_view_source"}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-code"}}</a> - <a href="{{$.Link}}" class="ui tiny basic button poping up {{if .IsDisplayingRendered}}active{{end}}" data-content="{{.i18n.Tr "repo.file_view_rendered"}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-file"}}</a> + <div class="ui compact icon buttons two-toggle-buttons"> + <a href="{{$.Link}}?display=source" class="ui mini basic button poping up {{if .IsDisplayingSource}}active{{end}}" data-content="{{.i18n.Tr "repo.file_view_source"}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-code" 15}}</a> + <a href="{{$.Link}}" class="ui mini basic button poping up {{if .IsDisplayingRendered}}active{{end}}" data-content="{{.i18n.Tr "repo.file_view_rendered"}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-file" 15}}</a> </div> {{end}} <div class="ui buttons mr-2"> @@ -50,7 +50,7 @@ </div> {{if .Repository.CanEnableEditor}} {{if .CanEditFile}} - <a href="{{.RepoLink}}/_edit/{{EscapePound .BranchName}}/{{EscapePound .TreePath}}"><span class="btn-octicon poping up" data-content="{{.EditFileTooltip}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-pencil"}}</span></a> + <a href="{{.RepoLink}}/_edit/{{EscapePound .BranchName}}/{{EscapePound .TreePath}}"><span class="btn-octicon poping up" data-content="{{.EditFileTooltip}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-pencil"}}</span></a> {{else}} <span class="btn-octicon poping up disabled" data-content="{{.EditFileTooltip}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-pencil"}}</span> {{end}} diff --git a/web_src/less/_base.less b/web_src/less/_base.less index 366ee073b4..bba378dde2 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -1594,6 +1594,14 @@ a.ui.label:hover { border-left: none; } +.two-toggle-buttons .button:not(.active):first-of-type { + border-right: none; +} + +.two-toggle-buttons .button.active:last-of-type { + border-left: 1px solid var(--color-light-border); +} + .ui.labeled.button.disabled > .button, .ui.basic.buttons .button, .ui.basic.button { diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index 7e6f398f3f..70ad8dd730 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -396,15 +396,10 @@ .file-actions { .btn-octicon { - display: inline-block; - padding: 5px; - margin-left: 5px; line-height: 1; - color: var(--color-text); + padding: 10px 8px; vertical-align: middle; - background: transparent; - border: 0; - outline: none; + color: var(--color-text); } .btn-octicon:hover { @@ -412,7 +407,7 @@ } .btn-octicon-danger:hover { - color: #bd2c00; + color: var(--color-red); } .btn-octicon.disabled { @@ -430,13 +425,18 @@ .view-raw { padding: 5px; - * { + > * { max-width: 100%; + border: 1px solid var(--color-secondary); } img { + margin: 1rem 0; border-radius: 0; + object-fit: contain; } + + /* also see misc.css for one more related rule */ } .plain-text { diff --git a/web_src/less/misc.css b/web_src/less/misc.css new file mode 100644 index 0000000000..02b849fd09 --- /dev/null +++ b/web_src/less/misc.css @@ -0,0 +1,5 @@ +/* can not have this selector in less because of https://github.com/less/less.js/issues/3027 */ +.view-raw img[src$='.svg' i] { + max-height: 600px !important; + max-width: 600px !important; +} diff --git a/webpack.config.js b/webpack.config.js index 1b668e75cc..cb5b6c1b6a 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -48,6 +48,7 @@ export default { resolve(__dirname, 'web_src/fomantic/build/semantic.js'), resolve(__dirname, 'web_src/js/index.js'), resolve(__dirname, 'web_src/fomantic/build/semantic.css'), + resolve(__dirname, 'web_src/less/misc.css'), resolve(__dirname, 'web_src/less/index.less'), ], swagger: [ |