gists: removed private/public gist buttons and replaced them with radio group

- ux wise having two main action buttons was bad and confusing
- radionselector makes it a single create gist action with optional type+explanation
- this is part of Gist ui changes
This commit is contained in:
Marcin Kuzminski 2019-11-15 12:47:10 +01:00
parent 2938d2aa6a
commit 44b53cd335
6 changed files with 125 additions and 11 deletions

View file

@ -159,7 +159,7 @@ class TestGistsController(TestController):
params={'lifetime': -1,
'content': 'gist test',
'filename': 'foo',
'public': 'public',
'gist_type': 'public',
'gist_acl_level': Gist.ACL_LEVEL_PUBLIC,
'csrf_token': self.csrf_token},
status=302)
@ -174,7 +174,7 @@ class TestGistsController(TestController):
params={'lifetime': -1,
'content': 'gist test',
'filename': '/home/foo',
'public': 'public',
'gist_type': 'public',
'gist_acl_level': Gist.ACL_LEVEL_PUBLIC,
'csrf_token': self.csrf_token},
status=200)
@ -197,7 +197,7 @@ class TestGistsController(TestController):
params={'lifetime': -1,
'content': 'private gist test',
'filename': 'private-foo',
'private': 'private',
'gist_type': 'private',
'gist_acl_level': Gist.ACL_LEVEL_PUBLIC,
'csrf_token': self.csrf_token},
status=302)
@ -216,7 +216,7 @@ class TestGistsController(TestController):
params={'lifetime': -1,
'content': 'private gist test',
'filename': 'private-foo',
'private': 'private',
'gist_type': 'private',
'gist_acl_level': Gist.ACL_LEVEL_PRIVATE,
'csrf_token': self.csrf_token},
status=302)
@ -236,7 +236,7 @@ class TestGistsController(TestController):
'content': 'gist test',
'filename': 'foo-desc',
'description': 'gist-desc',
'public': 'public',
'gist_type': 'public',
'gist_acl_level': Gist.ACL_LEVEL_PUBLIC,
'csrf_token': self.csrf_token},
status=302)
@ -252,7 +252,7 @@ class TestGistsController(TestController):
'content': 'gist test',
'filename': 'foo-desc',
'description': 'gist-desc',
'public': 'public',
'gist_type': 'public',
'gist_acl_level': Gist.ACL_LEVEL_PUBLIC,
'csrf_token': self.csrf_token
}

View file

@ -153,14 +153,19 @@ class GistView(BaseAppView):
data = dict(self.request.POST)
data['filename'] = data.get('filename') or Gist.DEFAULT_FILENAME
data['nodes'] = [{
'filename': data['filename'],
'content': data.get('content'),
'mimetype': data.get('mimetype') # None is autodetect
}]
gist_type = {
'public': Gist.GIST_PUBLIC,
'private': Gist.GIST_PRIVATE
}.get(data.get('gist_type')) or Gist.GIST_PRIVATE
data['gist_type'] = gist_type
data['gist_type'] = (
Gist.GIST_PUBLIC if data.get('public') else Gist.GIST_PRIVATE)
data['gist_acl_level'] = (
data.get('gist_acl_level') or Gist.ACL_LEVEL_PRIVATE)

View file

@ -429,6 +429,7 @@ div.codeblock {
line-height: inherit
}
}
.author {
clear: both;
vertical-align: middle;

View file

@ -273,6 +273,85 @@ form.rcform {
}
.rcform-element {
label { display: inline; border:none; padding:0; }
.label { display: none; }
label:not(#ie) {
cursor: pointer;
display: inline-block;
position: relative;
background: white;
border-radius: 4px;
box-shadow: none;
&:hover::after {
opacity: 0.5;
}
}
input[type="radio"],
input[type="checkbox"] {
padding: 0;
border: none;
}
input[type="radio"]:not(#ie),
input[type="checkbox"]:not(#ie) {
// Hide the input, but have it still be clickable
opacity: 0;
float: left;
height: 0;
width: 0;
margin: 0;
padding: 0;
}
input[type='radio'] + label:not(#ie),
input[type='checkbox'] + label:not(#ie) {
margin: 0;
clear: none;
}
input[type='radio'] + label:not(#ie) {
.circle (@form-radio-width,white);
float: left;
display: inline-block;
height: @form-radio-width;
width: @form-radio-width;
margin: 2px 2px 2px 0;
border: 1px solid @grey4;
background-color: white;
box-shadow: none;
text-indent: -9999px;
transition: none;
& + .label {
float: left;
margin-top: 7px
}
}
input[type='radio']:checked + label:not(#ie) {
margin: 0 0px 0 -2px;
padding: 3px;
border-style: double;
border-color: white;
border-width: thick;
background-color: @rcblue;
box-shadow: none;
}
fieldset {
.label:not(#ie) {
display: inline;
margin: 0 1em 0 .5em;
line-height: 1em;
}
}
}
.badged-field {
.user-badge {
line-height: 25px;

View file

@ -802,6 +802,16 @@ label {
}
}
.gist-type-fields {
line-height: 30px;
height: 30px;
.gist-type-fields-wrapper {
vertical-align: middle;
display: inline-block;
line-height: 25px;
}
}
// ADMIN SETTINGS

View file

@ -57,9 +57,28 @@
</div>
<div class="pull-right">
<i class="tooltip icon-info" title="${_('Secret gists are hidden from listing, but accessible to anyone who knows the url.')}"></i>
${h.submit('private',_('Create Private Gist'),class_="btn")}
${h.submit('public',_('Create Public Gist'),class_="btn")}
##<i class="tooltip icon-info" title="${_('Secret gists are hidden from listing, but accessible to anyone who knows the url.')}"></i>
<div class="pull-right">
${h.submit('create',_('Create Gist'),class_="btn")}
</div>
<div class="rcform-element pull-right">
<div class="fields gist-type-fields">
<fieldset>
<div class="gist-type-fields-wrapper">
<input type="radio" id="private_gist" checked="" name="gist_type" value="private">
<label for="private_gist">${_('Private Gist')}</label>
<span class="tooltip label" title="${_('Private Gists are not listed and only accessible through their secret url.')}">${_('Private Gist')}</span>
<input type="radio" id="public_gist" name="gist_type" value="public">
<label for="public_gist">${_('Public Gist')}</label>
<span class="tooltip label" title="${_('Public Gists are accessible to anyone and listed in Gists page.')}">${_('Public Gist')}</span>
</div>
</fieldset>
</div>
</div>
</div>
${h.end_form()}
</div>