This repository has been archived on 2023-08-16. You can view files and clone it, but cannot push or open issues or pull requests.
Omphaloskepsis/plugins/jetpack/scss/pages/_connection-settings.scss
2018-03-21 18:19:20 +00:00

160 lines
No EOL
2.1 KiB
SCSS

// ==========================================================================
// Jetpack Connection Settings (located under 'My Jetpack')
//===========================================================================
.my-jetpack-actions {
margin: 0 0 40px 0;
.j-col {
padding: 0;
text-align: center;
}
#user-list {
height: 30px;
margin-top: -1px;
margin-left: -3px;
}
}
#jetpack-disconnect-content {
display: none;
text-align: center;
.cancel-disconnect {
display: block;
margin-top: 10px;
}
}
.connection-details {
border: 1px #ddd solid;
&.local-user {
margin-bottom: 10px;
}
.user-01,
.wpuser-02,
.action-btns {
padding: 10px;
.button, select {
margin-top: 5px;
}
}
.wpuser-02 {
margin-top: 10px;
}
h3 {
padding: 10px;
margin: 0;
background: #eee;
border-bottom: 1px #ddd solid;
font-size: 14px;
}
} // .connection-details
.jp-user {
img {
margin-right: 10px;
border-radius: 50%;
}
}
.jp-user,
.wp-user,
.wp-action {
div {
display: inline-block;
width: 100%;
}
}
.j-col.jp-user,
.j-col.wp-user,
.j-col.wp-action {
padding: 0;
}
.my-jetpack-actions select {
max-width: 150px;
}
.j-actions .button:nth-child(3) {
margin-right: 5px;
}
.j-row.disconnect {
text-align: center;
.button {
margin: 0 auto;
}
}
a.what-is-primary {
color: #b4b9be;
margin-left: 4px;
}
@include breakpoint(tablet){
.wp-action {
border-top: 1px #ddd solid;
h3 {
display: none;
}
}
};
@media screen and (max-width: 500px) {
.connection-details {
font-size: 11px;
h3 {
font-size: 12px;
padding: 5px;
}
.user-01,
.wpuser-02 {
padding: 6px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 200px;
}
.action-btns {
text-align: center;
}
} // .connection-details
}
@include breakpoint(large-phone){
.connection-details .wpuser-02 {
margin-top: 0;
padding: 12px;
}
};
@media screen and (max-width: 450px) {
.j-actions .button {
width: 100%;
margin-bottom: 5px;
text-align: center;
&.alignright {
float: none;
}
}
}
@media screen and (max-width: 350px) {
.user-01,
.wpuser-02 {
max-width: 100px;
}
}