Skip to content

Refine styles to better match current dartlang.org #1916

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 16 commits into from
Jan 31, 2019
Merged

Refine styles to better match current dartlang.org #1916

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
f827171
Link to source now works, minus icons
jcollins-g Jan 28, 2019
d2e95f6
Merge branch 'master' into link-to-source
jcollins-g Jan 28, 2019
12d9f33
Add material icons
jcollins-g Jan 29, 2019
d02577b
Refactor dartdoc_test to avoid asynchronous delete collisions
jcollins-g Jan 29, 2019
1795f69
dartfmt
jcollins-g Jan 29, 2019
3acd727
Fix windows
jcollins-g Jan 29, 2019
cf15e98
dartfmt
jcollins-g Jan 29, 2019
74e0cf7
Tweak padding and change icon to description
jcollins-g Jan 29, 2019
c7f5ba3
Fix styles to match dartlang site
jcollins-g Jan 31, 2019
102090e
Review comments
jcollins-g Jan 31, 2019
ff8c3cc
Add example and use it in the dartdoc package.
jcollins-g Jan 31, 2019
f0d6c7e
dartfmt
jcollins-g Jan 31, 2019
9fe1a81
Merge branch 'link-to-source' into link-to-source+hoverlinks
jcollins-g Jan 31, 2019
e1e1bb8
Merge branch 'master' into link-to-source
jcollins-g Jan 31, 2019
caa58a7
Merge branch 'link-to-source' into link-to-source+hoverlinks
jcollins-g Jan 31, 2019
3baf68b
Review comment
jcollins-g Jan 31, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
63 changes: 39 additions & 24 deletions lib/resources/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,13 @@ body {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
overflow: hidden;
box-sizing: border-box;
}

*, *:before, *:after {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This seems somewhat drastic to change every element to box sizing. From very brief googling (https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/) this does seem like a thing that people do.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes. Doing this seemed to make correcting some alignment problems for mobile a lot easier.

box-sizing: inherit;
}

body {
Expand All @@ -25,7 +32,7 @@ body {
}

header {
flex: 0 0 56px;
flex: 0 0 50px;
display: flex;
flex-direction: row;
align-items: center;
Expand Down Expand Up @@ -64,44 +71,44 @@ main {
flex: 1;
display: flex;
flex-direction: row;
padding: 20px;
}

.sidebar-offcanvas-left {
flex: 0 1 195px;
flex: 0 1 230px;
overflow-y: scroll;
padding: 20px 0 15px 30px;
margin: 5px 20px 0 0;
}

::-webkit-scrollbar-button{ display: none; height: 13px; border-radius: 0px; background-color: #AAA; }
::-webkit-scrollbar-button:hover{ background-color: #AAA; }
::-webkit-scrollbar-thumb{ background-color: #CCC; }
::-webkit-scrollbar-thumb:hover{ background-color: #CCC; }
::-webkit-scrollbar{ width: 4px; }
::-webkit-overflow-scrolling: touch;

.main-content::-webkit-scrollbar{ width: 8px; }

.main-content {
flex: 1;
overflow-y: auto;
padding: 20px 15px 0 30px;
}

.sidebar,
.main-content {
margin: 20px 0;
overflow-y: scroll;
padding: 10px 20px 0 20px;
}

.sidebar-offcanvas-right {
flex: 0 1 12em;
overflow-y: auto;
overflow-y: scroll;
padding: 20px 15px 15px 15px;
margin-top: 5px;
margin-right: 20px;
}
/* end for layout */

body {
-webkit-text-size-adjust: 100%;
overflow-x: hidden;
font-family: "Source Sans Pro", sans-serif;
font-family: Roboto, sans-serif;
font-size: 16px;
line-height: 1.42857143;
color: #111111;
Expand Down Expand Up @@ -185,7 +192,7 @@ h3,
h4,
h5,
h6 {
font-family: "Source Sans Pro", sans-serif;
font-family: Roboto, sans-serif;
font-weight: 400;
margin-top: 1.5em;
color: #111111;
Expand Down Expand Up @@ -226,8 +233,12 @@ p {
margin-top: 0;
}

a, a:hover {
color: #1155cc;
a {
color: #0175C2;
}

a:hover {
color: #13B9FD;
}

pre.prettyprint {
Expand Down Expand Up @@ -294,10 +305,13 @@ header h1 {
}

header a,
header a:hover,
header p,
header li {
color: #111;
color: #111111;
}

header a:hover {
color: #0175C2;
}

header h1 .kind {
Expand Down Expand Up @@ -439,10 +453,13 @@ h1 .category {

.source-link {
padding: 18px 4px;
font-size: 12px;
vertical-align: middle;
}

.source-link .material-icons {
font-size: 18px;
}

@media (max-width: 768px) {
.source-link {
padding: 7px 2px;
Expand Down Expand Up @@ -695,10 +712,6 @@ ul.subnav li:last-of-type {
padding-top: 0;
}

.sidebar ol li.section-title a {
color: inherit;
}

.sidebar ol li.section-title {
font-size: 18px;
font-weight: normal;
Expand Down Expand Up @@ -768,10 +781,12 @@ button {
z-index: 2000;
top: 0;
width: 280px; /* works all the way down to an iphone 4 */
height: 100%;
height: 90%;
background-color: white;
overflow-y: auto; /* TODO: how to hide scroll bars? */
overflow-y: scroll; /* TODO: how to hide scroll bars? */
padding: 10px;
margin: 10px 10px;
box-shadow: 5px 5px 5px 5px #444444;
}

ol#sidebar-nav {
Expand Down Expand Up @@ -852,7 +867,7 @@ button {
left: inherit !important;
width: 422px;
max-height: 250px;
overflow-y: auto;
overflow-y: scroll;
}

.tt-menu {
Expand Down
2 changes: 1 addition & 1 deletion lib/templates/_head.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, user-scalable=no">
{{#includeVersion}}
<meta name="generator" content="made with love by dartdoc {{version}}">
{{/includeVersion}}
Expand Down