commit 9a6b57416db9cf855dd523055e62eae704b2b09d Author: Rafael dos Santos Silva Date: Wed Apr 12 13:57:38 2017 -0300 Import theme fro Meta topic diff --git a/LICENSE.txt b/LICENSE.txt new file mode 100644 index 0000000..a5f04c8 --- /dev/null +++ b/LICENSE.txt @@ -0,0 +1,22 @@ +Copyright (c) 2017: Discourse + +MIT License + +Permission is hereby granted, free of charge, to any person obtaining +a copy of this software and associated documentation files (the +"Software"), to deal in the Software without restriction, including +without limitation the rights to use, copy, modify, merge, publish, +distribute, sublicense, and/or sell copies of the Software, and to +permit persons to whom the Software is furnished to do so, subject to +the following conditions: + +The above copyright notice and this permission notice shall be +included in all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND +NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE +LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION +OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION +WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..6995060 --- /dev/null +++ b/README.md @@ -0,0 +1,4 @@ +## Material Design Stock Theme + +More info at: https://meta.discourse.org/t/material-design-stock-theme/47142?u=falco + diff --git a/about.json b/about.json new file mode 100644 index 0000000..d4eb01f --- /dev/null +++ b/about.json @@ -0,0 +1,5 @@ +{ + "name": "Material Design Theme", + "about_url": "https://meta.discourse.org/t/material-design-stock-theme/47142?u=falco", + "license_url": "https://github.com/discourse/material-design-stock-theme/blob/master/LICENSE.txt" +} diff --git a/common/common.scss b/common/common.scss new file mode 100644 index 0000000..0bb46fd --- /dev/null +++ b/common/common.scss @@ -0,0 +1,8 @@ +//use Roboto font +html { + font-family: "Roboto", sans-serif; + font-weight: 400; +} +body input, body button, body select, body textarea { + font-family: "Roboto", Helvetica, Arial, sans-serif; +} \ No newline at end of file diff --git a/common/head_tag.html b/common/head_tag.html new file mode 100644 index 0000000..7cfa3b7 --- /dev/null +++ b/common/head_tag.html @@ -0,0 +1 @@ + diff --git a/desktop/desktop.scss b/desktop/desktop.scss new file mode 100644 index 0000000..2b35820 --- /dev/null +++ b/desktop/desktop.scss @@ -0,0 +1,223 @@ +//add space between categories +.topic-list.categories{ + border-spacing: 0 1em; + border-collapse: separate; +} + +//change category background color to white +.topic-list.categories>tbody>tr{ + background-color: lighten($secondary, 10%); +} + +//padding for category title and description +.topic-list.categories th, .topic-list.categories td { + padding: 0 15px 0 15px; +} + +//Shadows for categories +.topic-list.categories>tbody>tr td.category, .topic-list.categories>tbody>tr td.stats, .topic-list.categories>tbody>tr td.latest{ + -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 0 0 0 rgba(0, 0, 0, 0.12); + -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 0 0 0 rgba(0, 0, 0, 0.12); + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 0 0 0 rgba(0, 0, 0, 0.12); +} + + +//underline navigation links +.nav-pills>li.active>a, .nav-pills>li>a.active { + color: $primary; + font-weight: 500; + background-color: $secondary; + border-bottom: 3px solid $tertiary; +} + +//remove highlighting navigation background on hover +.nav-pills > li > a:hover{ + background-color: $secondary; +} + +//add shadow behind the list of topics, but not categories +.topic-list:not(.categories){ + -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); + -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); + background-color: lighten($secondary, 10%); + border-collapse: collapse; +} + + +//create conversation cards +.topic-body{ + -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + -moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + background-color: lighten($secondary, 10%); + margin-top: 10px; + padding-left: 20px; + border-radius: 2px; + padding-right: 20px; +} + +//more space for avatars +.topic-avatar{ + border-top: 0; + padding-right: 10px; +} + +//improve format of embedded posts + +.embedded-posts .topic-avatar{ + padding-left: 0px; +} +.embedded-posts.top.topic-body { + -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0),0 2px 10px 0 rgba(0,0,0,0); + -moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0),0 2px 10px 0 rgba(0,0,0,0); + box-shadow: 0 2px 5px 0 rgba(0,0,0,0),0 2px 10px 0 rgba(0,0,0,0); + background-color: $secondary; +} + + +//raise and round buttons +.btn:not(.bulk-select) { + border-radius: 2px; + -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + -moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); +} + +//flatten editor buttons +.d-editor-button-bar .btn{ + border-radius: 0px; + -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0),0 2px 10px 0 rgba(0,0,0,0); + -moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0),0 2px 10px 0 rgba(0,0,0,0); + box-shadow: 0 2px 5px 0 rgba(0,0,0,0),0 2px 10px 0 rgba(0,0,0,0); +} + +//properly space buttons on login modal +button#login-link, button#new-account-link{ +padding-left:inherit; +} + +//darken color, remove shadow and border when pressed +.btn:active{ + background-color: rgba(0,0,0,.4); + -webkit-box-shadow: 0 0px 0px 0 rgba(0,0,0,0.16),0 0px 00px 0 rgba(0,0,0,0.12); + -moz-box-shadow: 0 0px 0px 0 rgba(0,0,0,0.16),0 0px 00px 0 rgba(0,0,0,0.12); + box-shadow: 0 0px 0px 0 rgba(0,0,0,0.16),0 0px 00px 0 rgba(0,0,0,0.12); + +} +.btn:focus{ + outline: -webkit-focus-ring-color auto 0px; +} + + +//New Topic Fab +#create-topic.btn-default { + border-radius: 40px; + position: fixed; + bottom: 30px; + right: 50px; + z-index: 999; + padding: 24px 20px 22px 5px; + background-color: $tertiary; + color: $tertiary; + white-space: nowrap; + text-indent: 10px; + -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28); + -moz-box-shadow: 0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28); + box-shadow: 0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28); + overflow: hidden; + width: 63px; + height: 63px; + -webkit-transition: right .5s, bottom .5s, border-radius .5s, text-indent .2s, visibility 1s, width .2s ease, height .5s ease .4s, color .5s, background-color 2s, -webkit-transform .5s; + transition: right .5s, bottom .5s, border-radius .5s, text-indent .2s, visibility 1s, width .2s ease, height .5s ease .4s, color .5s, background-color 2s, transform .5s; +} + +#create-topic.btn-default .fa-plus { + color: white; +} + +#create-topic.btn-default:hover { + text-indent: 8px; + width: 190px; + color: white; +} + + +//Reply Fab +.timeline-footer-controls { + position: relative; +} +.widget-button.btn.create { + border-radius: 40px; + position: absolute; + top: 50px; + left: -18px; + z-index: 999; + padding: 24px 20px 22px 5px; + background-color: $tertiary; + color: white; + text-indent: 10px; + -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28); + -moz-box-shadow: 0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28); + box-shadow: 0 0 4px rgba(0,0,0,0.14),0 4px 8px rgba(0,0,0,0.28); + overflow: hidden; + width: 63px; + height: 63px; + -webkit-transition: right .5s, bottom .5s, border-radius .5s, text-indent .2s, visibility 1s, width .2s ease, height .5s ease .4s, color .5s, background-color 2s, -webkit-transform .5s; + transition: right .5s, bottom .5s, border-radius .5s, text-indent .2s, visibility 1s, width .2s ease, height .5s ease .4s, color .5s, background-color 2s, transform .5s; +} + +//Center and increase size of reply icon +.widget-button.btn.create .fa-reply{ + color: white; + font-size: 20px; + margin-left: -8px; +} + + +//Proper spacing for iPad portrait +@media only screen +and (min-width : 768px) +and (max-width: 1250px) +{ + .timeline-container { + margin-left: 820px; + } + .topic-admin-popup-menu{ + left:-40% !important; + + } + +} + +//Properly space notifications button +.widget-button.btn.notifications-dropdown{ + right: 4px; + position: relative; + border-radius: 40px; + width: 30px; +} + + + +//cards for search results +.fps-result{ + -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + -moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + background-color: lighten($secondary, 10%); + margin-top: 10px; + padding: 20px; + border-radius: 2px; +} + + +@keyframes background-fade-highlight { + 0% { + background-color: $tertiary; + } + + 100% { + background-color: $secondary; + } +} \ No newline at end of file diff --git a/desktop/header.html b/desktop/header.html new file mode 100644 index 0000000..dcdd5ee --- /dev/null +++ b/desktop/header.html @@ -0,0 +1,83 @@ + + + + +