Merge pull request #2326 from overleaf/cmg-publish-modal-buttons

Stop publish modal buttons wrapping incorrectly at zoomed out levels

GitOrigin-RevId: 3298cf7734a2a033423c2f6f866f6db43cdc83fb
This commit is contained in:
Jessica Lawshe 2019-11-06 07:41:34 -06:00 committed by sharelatex
parent cce388bfab
commit 3f34098c03

View file

@ -1,132 +1,134 @@
.modal-body-publish { .modal-body-publish {
@label-column-width: 10em; @label-column-width: 10em;
@control-left-margin: 1.0em; @control-left-margin: 1em;
.form-control-box { .form-control-box {
margin-bottom: 1.5ex; margin-bottom: 1.5ex;
margin-left: @control-left-margin; margin-left: @control-left-margin;
label { label {
display: inline-block; display: inline-block;
width: @label-column-width; width: @label-column-width;
vertical-align: baseline; vertical-align: baseline;
}
label.checkbox-label {
width: auto;
}
.form-control {
display: inline-block;
width: 60%;
}
input[type="checkbox"] {
margin-right: 0.5em;
}
textarea {
vertical-align: baseline;
}
select {
padding-top: 1ex;
padding-bottom: 1ex;
padding-left: 1em;
padding-right: 1em;
}
option {
margin-left: -4px;
}
a.help {
margin-left: 0.6em;
}
} }
.no-label { label.checkbox-label {
margin-left: @label-column-width + @control-left-margin; width: auto;
} }
#search-input-container { .form-control {
overflow: hidden; display: inline-block;
margin: 5px 0 10px; width: 60%;
}
.table-content-name {
width: 100%;
margin-bottom: 10px;
font-weight: 300;
}
.table-content-category {
font-weight: 300;
text-align: right;
font-style: italic;
width: 30%;
float: right;
text-transform: capitalize
}
.table-content-category ~ .table-content-name {
width: 70%;
display: inline-block;
}
.wl-icon:before{
font-size: 14px;
}
.btn-wrapping{
white-space: normal;
}
.button-as-link{
color: green;
text-transform: none;
background: none;
padding: 0;
border: none;
border-radius: 0;
font-size: 14px;
@extend a;
&:hover,
&:active,
&:focus {
color: green;
background: none;
}
text-align: left;
}
.affix-content-title {
color: @gray-light;
font-size: 1.2em;
padding-left: 10px;
} }
input[type='checkbox'] {
margin-right: 0.5em;
}
textarea {
vertical-align: baseline;
}
select {
padding-top: 1ex;
padding-bottom: 1ex;
padding-left: 1em;
padding-right: 1em;
}
option {
margin-left: -4px;
}
a.help {
margin-left: 0.6em;
}
}
.no-label {
margin-left: @label-column-width + @control-left-margin;
}
#search-input-container {
overflow: hidden;
margin: 5px 0 10px;
}
.table-content-name {
width: 100%;
margin-bottom: 10px;
font-weight: 300;
}
.table-content-category {
font-weight: 300;
text-align: right;
font-style: italic;
width: 30%;
float: right;
text-transform: capitalize;
}
.table-content-category ~ .table-content-name {
width: 70%;
display: inline-block;
}
.wl-icon:before {
font-size: 14px;
}
.btn-wrapping {
min-width: 8em;
max-width: 25em;
white-space: normal;
}
.button-as-link {
color: green;
text-transform: none;
background: none;
padding: 0;
border: none;
border-radius: 0;
font-size: 14px;
@extend a;
&:hover,
&:active,
&:focus {
color: green;
background: none;
}
text-align: left;
}
.affix-content-title {
color: @gray-light;
font-size: 1.2em;
padding-left: 10px;
}
.affix-subcontent { .affix-subcontent {
margin: 5px 0 50px; margin: 5px 0 50px;
}
.overbox {
padding: @line-height-computed / 2;
background-color: white;
margin-top: @line-height-computed / 2;
border: 1px solid @gray-lighter;
border-radius: 9px;
}
.content-as-table {
.table-content,
.table-content > * {
display: table;
} }
.overbox { .table-content-icon {
padding: @line-height-computed / 2; float: left;
background-color: white; height: 100px;
margin-top: @line-height-computed / 2; width: 106px;
border: 1px solid @gray-lighter; display: flex;
border-radius: 9px; align-items: flex-start;
overflow: hidden;
* {
border: 1px solid @gray-lightest;
width: 100%;
}
} }
.content-as-table { .table-content-text {
.table-content, float: right;
.table-content > * { width: calc(~'100% - 106px');
display: table; vertical-align: top;
} padding-left: 15px;
.table-content-icon {
float: left;
height: 100px;
width: 106px;
display: flex;
align-items: flex-start;
overflow: hidden;
* {
border: 1px solid @gray-lightest;
width: 100%;
}
}
.table-content-text {
float: right;
width: calc(~'100% - 106px');
vertical-align: top;
padding-left: 15px;
}
.table-content-slogan {
height: 100px;
overflow: hidden;
}
.table-content-link {
padding-top: 10px;
}
} }
.table-content-slogan {
height: 100px;
overflow: hidden;
}
.table-content-link {
padding-top: 10px;
}
}
} }