diff --git a/src/App.scss b/src/App.scss
index 5c14c17b..036b4cdf 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -29,6 +29,11 @@ a {
text-decoration: none;
}
+button{
+ border: none;
+ border-radius: 5px;
+}
+
.container {
display: flex;
flex-wrap: wrap;
@@ -63,7 +68,7 @@ nav {
padding-right: 20px;
display: flex;
align-items: center;
- flex-basis: 920px;
+ flex-basis: 970px;
margin: auto;
height: 50px;
background-repeat: no-repeat;
@@ -99,8 +104,7 @@ main-router {
.panel-heading {
border-radius: 0.5em 0.5em 0 0;
background-size: cover;
- padding-top: 0.3em;
- padding-bottom: 0.3em;
+ padding: 0.6em 0 0.5em;
text-align: center;
font-size: 1.3em;
}
@@ -110,6 +114,7 @@ main-router {
}
.panel-body > p {
+ line-height: 18px;
padding: 1em;
margin: 0;
}
@@ -117,7 +122,7 @@ main-router {
#content {
margin: auto;
- max-width: 920px;
+ max-width: 980px;
border-radius: 1em;
padding-bottom: 1em;
background-color: rgba(0,0,0,0.1);
@@ -125,7 +130,7 @@ main-router {
.media-body {
flex: 1;
- padding-left: 0.3em;
+ padding-left: 0.5em;
}
.container > * {
@@ -133,28 +138,37 @@ main-router {
}
.user-info {
+ color: white;
padding: 1em;
img {
- border: 3px solid;
+ border: 2px solid;
border-radius: 0.5em
}
-
+ text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
+ .user-name{
+ margin-top: 0.2em;
+ }
.user-screen-name {
+ margin-top: 0.3em;
font-weight: lighter;
+ padding-right: 0.1em;
}
}
.user-counts {
display: flex;
- padding: 1em 1em 0em 1em;
+ line-height:16px;
+ padding: 1em 1.5em 0em 1em;
+ text-align: center;
}
.user-count {
flex: 1;
h5 {
- font-weight: lighter;
- margin: 0;
+ font-size:1em;
+ font-weight: bolder;
+ margin: 0 0 0.25em;
}
}
@@ -196,7 +210,7 @@ status-text-container {
}
.retweet-info {
- padding: 0.3em;
+ padding: 0.7em 0 0 0.6em;
.media-left {
display: flex;
@@ -214,6 +228,7 @@ status-text-container {
small {
font-weight: lighter;
}
+ margin-bottom: 0.3em;
}
}
nav {
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index 311e36b8..7f6622b4 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -39,7 +39,7 @@
.attachment {
flex: 1 0 30%;
display: flex;
- margin: 0.2em;
+ margin: 0.5em 0.8em 0.6em 0.1em;
align-self: flex-start;
&.html {
@@ -79,6 +79,7 @@
img {
width: 100%;
}
+ margin-right: 15px;
}
.oembed {
diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue
index 2082f41a..d8604a7b 100644
--- a/src/components/nav_panel/nav_panel.vue
+++ b/src/components/nav_panel/nav_panel.vue
@@ -39,8 +39,7 @@
.nav-panel li {
border-bottom: 1px solid;
- padding: 0.5em;
- padding-left: 1em;
+ padding: 0.75em 0.85em 0.6em;
}
.nav-panel li:last-child {
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index 687a4f0f..517afeaa 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -1,13 +1,13 @@
@import '../../_variables.scss';
.notification {
- padding: 0.5em;
- padding-left: 1em;
+ padding: 0.4em 0 0 0.7em;
display: flex;
border-bottom: 1px solid silver;
.text {
min-width: 0px;
word-wrap: break-word;
+ line-height:18px;
.icon-retweet {
color: $green;
@@ -18,21 +18,22 @@
}
h1 {
- margin: 0;
+ margin: 0 0 0.3em;
padding: 0;
font-size: 1em;
+ line-height:20px;
}
- padding-left: 0.5em;
+ padding: 0.3em 0.8em 0.5em;
p {
margin: 0;
margin-top: 0;
- margin-bottom: 0.5em;
+ margin-bottom: 0.3em;
}
}
.avatar {
- padding-top: 3px;
+ padding-top: 0.3em;
width: 32px;
height: 32px;
border-radius: 50%;
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index a6aaf511..6caa8dae 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -57,13 +57,21 @@
form {
display: flex;
flex-direction: column;
- padding: 0.5em;
+ padding: 0.6em;
}
.form-group {
display: flex;
flex-direction: column;
+ padding: 0.3em 0.5em 0.6em;
+ line-height:24px;
+ }
+
+ form textarea {
+ border: none;
+ border-radius: 2px;
padding: 0.5em;
+ resize: vertical;
}
.btn {
diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue
index 8bb0ffb1..57aafac8 100644
--- a/src/components/settings/settings.vue
+++ b/src/components/settings/settings.vue
@@ -17,6 +17,6 @@
<style>
.setting-item {
- margin: 1em
+ margin: 1em 1em 1.4em;
}
</style>
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 0c004936..47e14d28 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -94,6 +94,7 @@
.user-content {
min-height: 52px;
+ padding-top: 1px;
}
.source_url {
@@ -110,8 +111,7 @@
}
.status-content {
- margin-top: 3px;
- margin-bottom: 3px;
+ margin: 3px 15px 4px 0;
}
p {
@@ -138,8 +138,7 @@
}
.status {
- padding: 0.5em;
- padding-right: 1em;
+ padding: 0.65em 0.7em 0.8em 0.8em;
border-bottom: 1px solid;
}
.muted button {
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index fe9fd3a9..962318e4 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -19,6 +19,14 @@
div {
flex: 1;
}
+ margin-top: 1em;
+ margin-bottom: -1.2em;
+ }
+ .muteinfo{
+ margin: 0.5em 0;
+ }
+ .user-screen-name {
+ margin-top: 0.4em;
}
}
</style>