From 734597b43f0376c8df1f64c54f9fec592ffea51f Mon Sep 17 00:00:00 2001 From: hakui Date: Sat, 18 Feb 2017 01:48:35 -0600 Subject: [PATCH] hello world --- src/App.scss | 37 +++++++++++++------ src/components/attachment/attachment.vue | 3 +- src/components/nav_panel/nav_panel.vue | 3 +- .../notifications/notifications.scss | 13 ++++--- .../post_status_form/post_status_form.vue | 10 ++++- src/components/settings/settings.vue | 2 +- src/components/status/status.vue | 7 ++-- src/components/user_profile/user_profile.vue | 8 ++++ 8 files changed, 57 insertions(+), 26 deletions(-) diff --git a/src/App.scss b/src/App.scss index 5c14c17b84..036b4cdf1f 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 311e36b85a..7f6622b4e5 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 2082f41ac9..d8604a7bc8 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 687a4f0fef..517afeaad8 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 a6aaf511a2..6caa8dae07 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 8bb0ffb151..57aafac8cd 100644 --- a/src/components/settings/settings.vue +++ b/src/components/settings/settings.vue @@ -17,6 +17,6 @@ diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 0c00493686..47e14d2828 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 fe9fd3a992..962318e4a8 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; } }