Remove SASS spacing function

This commit is contained in:
Kris 2020-04-24 19:32:02 -04:00
parent 040b8c00a4
commit 67429335d5
10 changed files with 46 additions and 70 deletions

View File

@ -4,7 +4,6 @@
@import "common/foundation/base";
@import "common/foundation/mixins";
@import "common/foundation/variables";
@import "common/foundation/spacing";
@import "common/select-kit/*";
@import "common/components/*";
@import "common/input_tip";

View File

@ -723,8 +723,8 @@
.modal-tab {
list-style: none;
padding: s(1 2);
margin-right: s(1);
padding: 4px 8px;
margin-right: 4px;
cursor: pointer;
&.is-active {
@ -734,7 +734,7 @@
&.single-tab {
background: none;
color: $primary;
padding: s(1 0);
padding: 4px 0;
}
}
}

View File

@ -6,7 +6,7 @@
z-index: z("dropdown");
box-shadow: shadow("card");
background-color: $secondary;
padding: s(2 2 1 2);
padding: 8px 8px 4px 8px;
width: 300px;
display: none;
&.visible {
@ -17,7 +17,7 @@
}
.title {
margin-bottom: s(1);
margin-bottom: 4px;
align-items: center;
display: flex;
justify-content: space-between;
@ -46,7 +46,7 @@
}
}
.social-link {
margin-right: s(2);
margin-right: 8px;
font-size: $font-up-4;
.d-icon {
color: dark-light-choose($tertiary, white);
@ -69,7 +69,7 @@
.actions {
display: flex;
align-items: flex-end;
margin-top: s(2);
margin-top: 8px;
.sources {
display: flex;
@ -79,7 +79,7 @@
max-width: 45%;
.social-link {
margin-right: s(2);
margin-right: 8px;
}
}
@ -96,7 +96,7 @@
}
.new-topic {
margin-right: s(4);
margin-right: 16px;
}
}
}

View File

@ -7,7 +7,7 @@
display: grid;
grid-template-columns: 1fr 5fr;
grid-template-rows: auto auto 1fr auto;
grid-row-gap: s(5);
grid-row-gap: 20px;
.user-primary-navigation {
grid-column-start: 1;
grid-column-end: 3;
@ -46,10 +46,10 @@
.user-content {
.list-actions {
display: flex;
margin-bottom: s(3);
margin-bottom: 12px;
.btn {
margin-right: s(3);
margin-right: 12px;
}
}
@ -264,7 +264,7 @@
color: $secondary;
display: flex;
padding: 10px;
margin-bottom: s(4);
margin-bottom: 16px;
> div,
> div a {
display: flex;

View File

@ -25,7 +25,7 @@
.title {
font-size: $font-0;
font-weight: normal;
margin-bottom: s(2);
margin-bottom: 8px;
.post-date {
color: $primary-medium;
@ -45,7 +45,7 @@
}
.topic-share-url {
margin-bottom: s(2);
margin-bottom: 8px;
}
.sources {
@ -56,7 +56,7 @@
.social-link {
font-size: $font-up-6;
margin-right: s(2);
margin-right: 8px;
}
}
}
@ -65,18 +65,18 @@
.share-and-invite.modal .invite.modal-panel {
.error-message,
.success-message {
margin-bottom: s(2);
margin-bottom: 8px;
}
.body {
.invite-user-control,
.group-access-control,
.show-custom-message-control {
margin-bottom: s(4);
margin-bottom: 8px;
}
.instructions {
margin-bottom: s(2);
margin-bottom: 8px;
}
.email-or-username-input {
@ -96,7 +96,7 @@
align-items: center;
.btn-primary {
margin-right: s(2);
margin-right: 8px;
&:last-child {
margin-right: 0;

View File

@ -1,23 +0,0 @@
$base-space: 4px;
@function s(
$sizes: (
0
)
) {
$spaces: ();
@each $size in $sizes {
@if ($size == 0) {
// Strip units if 0
$size: $size * $base-space;
$size: $size / ($size * 0 + 1);
} @else if ($size == auto) {
$size: auto;
} @else {
$size: $size * $base-space;
}
$spaces: append($spaces, $size);
}
@return $spaces;
}

View File

@ -9,7 +9,7 @@
flex-direction: column;
align-items: stretch;
min-height: 75px;
padding: s(0 6);
padding: 0 24px;
order: 2;
button {
@ -39,7 +39,7 @@
#modal-alert {
max-width: 100%;
padding: s(2 4);
padding: 8px 16px;
}
.login-modal {
@ -68,7 +68,7 @@
#login-form {
box-sizing: border-box;
flex: 1 0 auto;
padding: s(0 6);
padding: 0 24px;
+ #login-buttons {
border-left: 1px solid $primary-low; // Only show border when login-form is present
}
@ -171,7 +171,7 @@
}
form {
box-sizing: border-box;
padding: s(4 6);
padding: 16px 24px;
margin-bottom: 0;
max-height: 475px;
@media screen and (max-height: 650px) {

View File

@ -50,8 +50,8 @@
}
.user-content {
padding-bottom: s(3);
margin-bottom: s(3);
padding-bottom: 12px;
margin-bottom: 12px;
background-color: $secondary;
box-sizing: border-box;
@ -118,7 +118,7 @@
.primary {
.primary-textual {
padding: s(0 1 1);
padding: 0 4px 4px;
a[href] {
text-decoration: underline;
}
@ -146,7 +146,7 @@
}
.secondary {
margin-top: s(4);
margin-top: 16px;
}
}
@ -183,7 +183,7 @@
display: inline-flex;
> li {
display: inline;
margin-left: s(3);
margin-left: 12px;
.d-button-label {
line-height: 1;
}
@ -246,7 +246,7 @@
.instructions {
display: inline-block;
margin-top: s(1);
margin-top: 4px;
}
}

View File

@ -43,18 +43,18 @@ span.badge-posts {
flex: 1 1 auto;
}
&.button-count {
padding: s(2 1 2 2);
padding: 8px 4px 8px 8px;
+ .toggle-like,
+ .create-flag {
padding: s(2 2 2 1);
padding: 8px 8px 8px 4px;
}
&.my-likes,
&.regular-likes {
display: flex;
max-width: unset;
padding: s(2);
padding: 8px;
.d-icon {
padding-left: s(2);
padding-left: 8px;
}
}
}

View File

@ -4,8 +4,8 @@
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto auto;
grid-row-gap: s(5);
grid-column-gap: s(4);
grid-row-gap: 20px;
grid-column-gap: 16px;
.user-primary-navigation {
grid-column-start: 1;
grid-row-start: 1;
@ -31,14 +31,14 @@
}
.user-main {
margin-top: s(3);
margin-top: 12px;
.user-content {
box-sizing: border-box;
background-color: $secondary;
table {
width: 100%;
margin-top: s(3);
margin-top: 12px;
}
}
@ -48,12 +48,12 @@
.secondary {
dl {
padding: s(2) 0;
padding: 8px 0;
}
}
.details {
margin-bottom: s(3);
margin-bottom: 12px;
h1 {
line-height: $line-height-small;
@ -69,7 +69,7 @@
}
display: block;
float: none;
margin: s(2 auto);
margin: 8px auto;
img.avatar {
float: none;
}
@ -117,7 +117,7 @@
color: $primary;
.avatar {
margin: 0 0 s(3);
margin: 0 0 12px;
}
.primary-textual {
@ -129,7 +129,7 @@
.bio {
color: $primary;
margin: 0 auto s(2);
margin: 0 auto 8px;
max-width: 700px;
text-align: center;
@ -155,7 +155,7 @@
height: 200px;
}
.user-profile-avatar {
margin-top: s(-15);
margin-top: -60px;
}
}
@ -267,11 +267,11 @@
padding-bottom: 2em;
.instructions {
margin-top: s(1);
margin-top: 4px;
}
.controls-dropdown {
margin-bottom: s(4);
margin-bottom: 16px;
}
.delete-account {