mirror of
https://github.com/primer/css.git
synced 2024-11-10 16:07:25 +03:00
Remove a ton of github/github-specific CSS
For components like our image uploader, previewable forms, and issue/PR composers
This commit is contained in:
Mark Otto
parent
ff8d28f914
commit
972477aca8
263
scss/_forms.scss
263
scss/_forms.scss
@ -378,236 +378,6 @@ dl.form {
|
||||
select { margin-top: 5px; }
|
||||
}
|
||||
|
||||
// IE 9
|
||||
html.no-dnd-uploads {
|
||||
.drag-and-drop {
|
||||
min-height: 32px;
|
||||
|
||||
.default {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.upload-enabled textarea {
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
}
|
||||
|
||||
.drag-and-drop {
|
||||
padding: 7px 10px;
|
||||
margin: 0;
|
||||
font-size: 13px;
|
||||
line-height: 16px;
|
||||
color: #aaa;
|
||||
background-color: #fafafa;
|
||||
border: 1px solid #ccc;
|
||||
border-top: 0;
|
||||
border-bottom-right-radius: 3px;
|
||||
border-bottom-left-radius: 3px;
|
||||
|
||||
.default,
|
||||
.loading,
|
||||
.error {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.error {
|
||||
color: $brand-red;
|
||||
}
|
||||
|
||||
// Spinner
|
||||
img {
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
|
||||
.is-default .drag-and-drop .default {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.is-uploading .drag-and-drop .loading {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.is-bad-file .drag-and-drop .bad-file {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.is-too-big .drag-and-drop .too-big {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.is-empty .drag-and-drop .empty {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.is-bad-browser .drag-and-drop .bad-browser {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.drag-and-drop-error-info {
|
||||
font-weight: normal;
|
||||
color: #aaa;
|
||||
|
||||
a {
|
||||
color: $brand-blue;
|
||||
}
|
||||
}
|
||||
|
||||
.is-failed .drag-and-drop .failed-request {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.manual-file-chooser {
|
||||
position: absolute;
|
||||
width: 240px;
|
||||
padding: 5px;
|
||||
margin-left: -80px;
|
||||
cursor: pointer;
|
||||
opacity: 0.0001;
|
||||
}
|
||||
|
||||
.manual-file-chooser:hover + .manual-file-chooser-text {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.btn {
|
||||
// align manual-file-chooser inside a button
|
||||
.manual-file-chooser {
|
||||
top: 0;
|
||||
padding: 0;
|
||||
line-height: 34px;
|
||||
}
|
||||
}
|
||||
|
||||
// Focused Textarea styles
|
||||
.upload-enabled textarea {
|
||||
display: block;
|
||||
border-bottom: 1px dashed #ddd;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.focused .drag-and-drop {
|
||||
@extend input[type="text"]:focus;
|
||||
box-shadow: rgba(#51a7e8, 0.5) 0 0 3px;
|
||||
}
|
||||
|
||||
// Dropping a file on top
|
||||
.dragover textarea,
|
||||
.dragover .drag-and-drop {
|
||||
box-shadow: rgba(#c9ff00, 1) 0 0 3px;
|
||||
}
|
||||
|
||||
|
||||
// Form style with a write and a preview tab
|
||||
.previewable-comment-form {
|
||||
position: relative;
|
||||
|
||||
.tabnav {
|
||||
position: relative;
|
||||
padding: 10px 10px 0;
|
||||
}
|
||||
|
||||
.comment {
|
||||
border: 1px solid #cacaca;
|
||||
}
|
||||
|
||||
.comment-header .comment-header-actions { display: none; }
|
||||
|
||||
.comment-form-error { margin-bottom: 10px; }
|
||||
|
||||
.write-content,
|
||||
.preview-content {
|
||||
display: none;
|
||||
padding: 0 10px 10px;
|
||||
}
|
||||
|
||||
&.write-selected .write-content,
|
||||
&.preview-selected .preview-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
textarea {
|
||||
display: block;
|
||||
width: 100%;
|
||||
min-height: 100px;
|
||||
max-height: 500px;
|
||||
padding: 10px;
|
||||
resize: vertical;
|
||||
|
||||
&.fullscreen-contents:focus {
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// A two column form, with a .main and a .sidebar column
|
||||
//
|
||||
// Override some `.timeline-comment-wrapper` defaults.
|
||||
// The `div` is needed to be more specific than the other class.
|
||||
div.composer {
|
||||
margin-top: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// Override the previewable comment form defaults
|
||||
.composer .comment-form-textarea {
|
||||
height: 200px;
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
.composer-infobar {
|
||||
height: 35px;
|
||||
padding: 0 10px;
|
||||
margin-bottom: 10px;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.composer .tabnav { margin: 0 0 10px; }
|
||||
|
||||
.infobar-widget {
|
||||
|
||||
&.milestone {
|
||||
position: relative; // requires so that the `right: 0;` below works
|
||||
float: right;
|
||||
|
||||
.select-menu-modal-holder { right: 0; }
|
||||
}
|
||||
|
||||
&.assignee {
|
||||
float: left;
|
||||
|
||||
.css-truncate-target {
|
||||
max-width: 110px;
|
||||
}
|
||||
}
|
||||
|
||||
.text,
|
||||
.avatar,
|
||||
.select-menu {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-top: 3px;
|
||||
|
||||
a {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
width: 200px;
|
||||
overflow: hidden; // round the corners if 100%
|
||||
line-height: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Hide the up/down buttons in <input type="number"> in the login form, the
|
||||
// input is used for two-factor auth codes, type="number" makes it more usable
|
||||
@ -672,39 +442,6 @@ input::-webkit-inner-spin-button {
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
h2.account {
|
||||
margin: 15px 0 0;
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
p.explain {
|
||||
position: relative;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
|
||||
strong {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.octicon {
|
||||
margin-right: 5px;
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.minibutton {
|
||||
top: -4px;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.options-content p.explain {
|
||||
padding: 10px 10px 0;
|
||||
margin-top: 0;
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.form-actions {
|
||||
@include clearfix;
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user