Responsive design fixes (#4508)

* reset to master

* build css

* Fixed spacing
This commit is contained in:
kolaente 2018-07-26 17:25:41 +02:00 committed by Lauris BH
parent f847884d16
commit 8d1ad55598
7 changed files with 113 additions and 7 deletions

File diff suppressed because one or more lines are too long

View File

@ -26,6 +26,13 @@
top: 7px; top: 7px;
left: 90%; left: 90%;
width: 15%; width: 15%;
@media only screen and (max-width: 768px) {
top: 10px;
left: auto;
width: auto;
right: 13px;
}
} }
} }
@ -40,6 +47,10 @@
right: 0!important; right: 0!important;
left: auto!important; left: auto!important;
} }
@media only screen and (max-width: 768px) {
width: 100%;
}
} }
.right.stackable.menu > .item.active { .right.stackable.menu > .item.active {
color: #d9453d; color: #d9453d;

View File

@ -102,7 +102,7 @@
.user.reset.password, .user.reset.password,
.user.signin, .user.signin,
.user.signup { .user.signup {
@input-padding: 200px!important; @input-padding: 200px;
#create-page-form; #create-page-form;
form { form {
width: 700px!important; width: 700px!important;
@ -113,6 +113,12 @@
.inline.field > label { .inline.field > label {
width: @input-padding; 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; padding-left: 0 !important;
text-align: center; 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 { &.new.repo {
.ui.form { .ui.form {
.selection.dropdown:not(.owner) {
width: 50%!important;
}
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
#auto-init { #auto-init {
margin-left: @create-page-form-input-padding+15px; 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; 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;
}
}
}

View File

@ -47,3 +47,16 @@
padding-top: 15px; padding-top: 15px;
padding-bottom: @footer-margin * 2; 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;
}
}
}

View File

@ -172,9 +172,14 @@
#clone-panel { #clone-panel {
width: 350px; width: 350px;
@media only screen and (max-width: 768px) {
width: 100%;
}
input { input {
border-radius: 0; border-radius: 0;
padding: 5px 10px; padding: 5px 10px;
width: 50%;
} }
.clone.button { .clone.button {
@ -220,6 +225,12 @@
padding: 8px 10px; padding: 8px 10px;
font-weight: normal; font-weight: normal;
} }
.ui.tiny.blue.buttons {
@media only screen and (max-width: 768px) {
width: 100%;
}
}
} }
#repo-files-table { #repo-files-table {
@ -1229,6 +1240,20 @@
.prerelease.field { .prerelease.field {
margin-bottom: 0; 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 { &.forks {
@ -1756,3 +1781,9 @@ tbody.commit-list {
#repo-topic { #repo-topic {
margin-top: 5px; margin-top: 5px;
} }
.new-dependency-drop-list {
@media only screen and (max-width: 768px) {
width: 100%;
}
}

View File

@ -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 { .ui.repository.list {

View File

@ -12,7 +12,7 @@
{{end}} {{end}}
</h2> </h2>
{{template "base/alert" .}} {{template "base/alert" .}}
<form class="ui form grid" action="{{.Link}}" method="post"> <form class="ui form stackable grid" action="{{.Link}}" method="post">
{{.CsrfTokenHtml}} {{.CsrfTokenHtml}}
<div class="ui seven wide column target"> <div class="ui seven wide column target">
<div class="inline field {{if .Err_TagName}}error{{end}}"> <div class="inline field {{if .Err_TagName}}error{{end}}">