Responsive design fixes (#4508)
* reset to master * build css * Fixed spacing
This commit is contained in:
parent
f847884d16
commit
8d1ad55598
7 changed files with 113 additions and 7 deletions
File diff suppressed because one or more lines are too long
|
@ -26,6 +26,13 @@
|
|||
top: 7px;
|
||||
left: 90%;
|
||||
width: 15%;
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
top: 10px;
|
||||
left: auto;
|
||||
width: auto;
|
||||
right: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -40,12 +47,16 @@
|
|||
right: 0!important;
|
||||
left: auto!important;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.right.stackable.menu > .item.active {
|
||||
color: #d9453d;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Accomodate for Semantic's 1px hacks on .attached elements */
|
||||
.dashboard-repos {
|
||||
margin: 0 1px;
|
||||
|
|
|
@ -102,7 +102,7 @@
|
|||
.user.reset.password,
|
||||
.user.signin,
|
||||
.user.signup {
|
||||
@input-padding: 200px!important;
|
||||
@input-padding: 200px;
|
||||
#create-page-form;
|
||||
form {
|
||||
width: 700px!important;
|
||||
|
@ -113,6 +113,12 @@
|
|||
.inline.field > label {
|
||||
width: @input-padding;
|
||||
}
|
||||
|
||||
.inline.field > label, input {
|
||||
@media only screen and (max-width: 768px) {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -137,19 +143,35 @@
|
|||
padding-left: 0 !important;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
label, input, .selection.dropdown {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.field button, .field a {
|
||||
margin-bottom: 1em;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.new.repo {
|
||||
.ui.form {
|
||||
.selection.dropdown:not(.owner) {
|
||||
width: 50%!important;
|
||||
}
|
||||
@media only screen and (min-width: 768px) {
|
||||
#auto-init {
|
||||
margin-left: @create-page-form-input-padding+15px;
|
||||
}
|
||||
}
|
||||
|
||||
.selection.dropdown:not(.owner) {
|
||||
width: 50%!important;
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -175,3 +197,16 @@
|
|||
font-family: monospace;
|
||||
}
|
||||
}
|
||||
|
||||
.new.org .ui.form {
|
||||
@media only screen and (max-width: 768px) {
|
||||
.field button, .field a{
|
||||
margin-bottom: 1em;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.field input {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -47,3 +47,16 @@
|
|||
padding-top: 15px;
|
||||
padding-bottom: @footer-margin * 2;
|
||||
}
|
||||
|
||||
footer {
|
||||
@media only screen and (max-width: 880px) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ui.container .left, .ui.container .right {
|
||||
@media only screen and (max-width: 880px) {
|
||||
display: inline;
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -172,9 +172,14 @@
|
|||
#clone-panel {
|
||||
width: 350px;
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
input {
|
||||
border-radius: 0;
|
||||
padding: 5px 10px;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.clone.button {
|
||||
|
@ -220,6 +225,12 @@
|
|||
padding: 8px 10px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.ui.tiny.blue.buttons {
|
||||
@media only screen and (max-width: 768px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#repo-files-table {
|
||||
|
@ -1229,6 +1240,20 @@
|
|||
.prerelease.field {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.field {
|
||||
button, input {
|
||||
@media only screen and (max-width: 438px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
@media only screen and (max-width: 768px) {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.forks {
|
||||
|
@ -1756,3 +1781,9 @@ tbody.commit-list {
|
|||
#repo-topic {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.new-dependency-drop-list {
|
||||
@media only screen and (max-width: 768px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -37,6 +37,22 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
#profile-avatar {
|
||||
@media only screen and (max-width: 768px) {
|
||||
height: 250px;
|
||||
overflow: hidden;
|
||||
|
||||
img {
|
||||
max-height: 768px;
|
||||
max-width: 768px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.ui.repository.list {
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
{{end}}
|
||||
</h2>
|
||||
{{template "base/alert" .}}
|
||||
<form class="ui form grid" action="{{.Link}}" method="post">
|
||||
<form class="ui form stackable grid" action="{{.Link}}" method="post">
|
||||
{{.CsrfTokenHtml}}
|
||||
<div class="ui seven wide column target">
|
||||
<div class="inline field {{if .Err_TagName}}error{{end}}">
|
||||
|
|
Reference in a new issue